From 0a77c0b5412a63f8359c19918b4588ecbd083c55 Mon Sep 17 00:00:00 2001
From: gene9831 <pacify.98@gmail.com>
Date: Thu, 27 Jun 2024 01:29:27 -0700
Subject: [PATCH 1/2] refactor: meta components migration phase II

---
 packages/common/component/ConfigItem.vue      |   5 +-
 packages/common/component/MetaInput.vue       |  72 ------
 packages/common/component/MetaSelect.vue      | 122 ----------
 .../common/component/MultiTypeSelector.vue    |   6 +-
 packages/common/index.js                      | 113 +--------
 packages/common/package.json                  |   1 -
 packages/configurator/package.json            |   3 +-
 .../ArrayItemConfigurator.vue}                |  35 ++-
 .../code-configurator/CodeConfigurator.vue    |   2 +-
 .../CodeListConfigurator.vue                  |   2 +-
 .../configurator/src/components/BindI18n.vue  | 227 ------------------
 .../configurator/src/components/SvgButton.vue |  68 ------
 .../configurator/src/components/VueMonaco.vue | 196 ---------------
 packages/configurator/src/components/index.js |   4 -
 .../ContainerConfigurator.vue}                |   2 +-
 .../form-configurator/FormConfigurator.vue    |  82 -------
 .../GroupItemConfigurator.vue}                |   4 +-
 .../i18n-configurator/I18nConfigurator.vue    |   2 +-
 packages/configurator/src/index.js            | 123 ++++++++--
 .../LayoutGridConfigurator.vue}               |   9 +-
 .../RelatedColumnsConfigurator.vue}           |   8 +-
 .../RelatedEditorConfigurator.vue}            |   3 +-
 .../TableColumnsConfigurator.vue}             |   4 +-
 .../VariableConfigurator.vue                  |   2 +-
 .../design-core/src/registerConfigurators.js  |   3 -
 .../src/components/ArrayConfigItemForm.vue    |  11 +-
 .../design/src/components/widgets/index.js    |   8 -
 .../events/src/components/AdvanceConfig.vue   |  22 +-
 .../settings/props/src/components/index.js    |   4 +-
 .../styles/src/components/layout/FlexBox.vue  |   8 +-
 .../styles/src/components/layout/GridBox.vue  |  17 +-
 .../src/components/layout/LayoutGroup.vue     |   6 +-
 .../src/components/position/PositionGroup.vue |  29 ++-
 .../styles/src/components/size/SizeGroup.vue  |  11 +-
 34 files changed, 212 insertions(+), 1002 deletions(-)
 delete mode 100644 packages/common/component/MetaInput.vue
 delete mode 100644 packages/common/component/MetaSelect.vue
 rename packages/{common/component/MetaArrayItem.vue => configurator/src/array-item-configurator/ArrayItemConfigurator.vue} (95%)
 delete mode 100644 packages/configurator/src/components/BindI18n.vue
 delete mode 100644 packages/configurator/src/components/SvgButton.vue
 delete mode 100644 packages/configurator/src/components/VueMonaco.vue
 delete mode 100644 packages/configurator/src/components/index.js
 rename packages/{common/component/MetaContainer.vue => configurator/src/container-configurator/ContainerConfigurator.vue} (97%)
 delete mode 100644 packages/configurator/src/form-configurator/FormConfigurator.vue
 rename packages/{common/component/MetaGroupItem.vue => configurator/src/group-item-configurator/GroupItemConfigurator.vue} (92%)
 rename packages/{common/component/MetaLayoutGrid.vue => configurator/src/layout-grid-configurator/LayoutGridConfigurator.vue} (97%)
 rename packages/{common/component/MetaRelatedColumns.vue => configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue} (90%)
 rename packages/{common/component/MetaRelatedEditor.vue => configurator/src/related-editor-configurator/RelatedEditorConfigurator.vue} (95%)
 rename packages/{common/component/MetaTableColumns.vue => configurator/src/table-columns-configurator/TableColumnsConfigurator.vue} (80%)

diff --git a/packages/common/component/ConfigItem.vue b/packages/common/component/ConfigItem.vue
index c3dded76e3..84b0eef04a 100644
--- a/packages/common/component/ConfigItem.vue
+++ b/packages/common/component/ConfigItem.vue
@@ -104,7 +104,6 @@ import { Popover, Tooltip } from '@opentiny/vue'
 import { IconWriting, IconHelpCircle, IconPlusCircle } from '@opentiny/vue-icon'
 import { typeOf } from '@opentiny/vue-renderless/common/type'
 import i18n from '@opentiny/tiny-engine-controller/js/i18n'
-import { CodeConfigurator, VariableConfigurator } from '@opentiny/tiny-engine-configurator'
 import MultiTypeSelector from './MultiTypeSelector.vue'
 import { useHistory, useProperties, useResource, useLayout, useCanvas } from '@opentiny/tiny-engine-controller'
 import { SCHEMA_DATA_TYPE, PAGE_STATUS, TYPES } from '@opentiny/tiny-engine-controller/js/constants'
@@ -123,8 +122,8 @@ const hasRule = (required, rules) => {
 export default {
   components: {
     MultiTypeSelector,
-    CodeConfigurator,
-    VariableConfigurator,
+    CodeConfigurator: getConfigurator('CodeConfigurator'),
+    VariableConfigurator: getConfigurator('VariableConfigurator'),
     TinyPopover: Popover,
     TinyTooltip: Tooltip,
     IconWriting: IconWriting(),
diff --git a/packages/common/component/MetaInput.vue b/packages/common/component/MetaInput.vue
deleted file mode 100644
index f44e0bc9fa..0000000000
--- a/packages/common/component/MetaInput.vue
+++ /dev/null
@@ -1,72 +0,0 @@
-<template>
-  <tiny-input v-model="value" :type="type" :placeholder="placeholder" :rows="rows" @update:modelValue="change">
-    <template #suffix>
-      <div v-for="item in suffixIcons" :key="item.icon">
-        <svg-icon v-if="item.icon" :name="item.icon" class="tiny-svg-size" @click="item.onClick.action"></svg-icon>
-      </div>
-    </template>
-  </tiny-input>
-</template>
-
-<script>
-import { ref, watchEffect } from 'vue'
-import { Input } from '@opentiny/vue'
-import { useProperties } from '@opentiny/tiny-engine-controller'
-
-export default {
-  name: 'MetaInput',
-  components: {
-    TinyInput: Input
-  },
-  props: {
-    modelValue: {
-      type: String
-    },
-    type: {
-      type: String
-    },
-    placeholder: {
-      type: String
-    },
-    suffixIcons: {
-      type: Array,
-      default: () => []
-    },
-    dataType: {
-      type: String
-    },
-    rows: {
-      type: Number,
-      default: 10
-    }
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit }) {
-    const value = ref(props.modelValue)
-
-    const change = (val) => {
-      emit('update:modelValue', props.dataType === 'Array' ? val.split(',') : val)
-    }
-
-    watchEffect(() => {
-      value.value = useProperties().translateProp(props.modelValue)
-    })
-
-    return {
-      value,
-      change
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.tiny-svg-size {
-  margin-left: 10px;
-  font-size: 16px;
-  &:hover {
-    cursor: pointer;
-    color: var(--ti-lowcode-dialog-font-color);
-  }
-}
-</style>
diff --git a/packages/common/component/MetaSelect.vue b/packages/common/component/MetaSelect.vue
deleted file mode 100644
index d9a59b8f97..0000000000
--- a/packages/common/component/MetaSelect.vue
+++ /dev/null
@@ -1,122 +0,0 @@
-<template>
-  <tiny-select
-    v-model="state.selected"
-    :multiple="multi"
-    :is-drop-inherit-width="true"
-    :show-alloption="false"
-    :clearable="true"
-    @change="handleChange"
-  >
-    <template v-if="groups?.length">
-      <tiny-option-group
-        v-for="group in state.groupOptions"
-        :key="group.label"
-        :label="group.label?.[locale] ?? group.label"
-        :disabled="group.disabled"
-      >
-        <tiny-option
-          v-for="item in group.content"
-          :key="item.value ?? item"
-          :label="item.label?.[locale] ?? item.label ?? item"
-          :value="item.value ?? item"
-          :title="item.label?.[locale] ?? item.label ?? item"
-        >
-          <component :is="item.icon"></component>
-          <span>{{ item.label?.[locale] ?? item.label ?? item }}</span>
-        </tiny-option>
-      </tiny-option-group>
-    </template>
-    <template v-else>
-      <tiny-option
-        v-for="item in options"
-        :key="item.value ?? item"
-        :label="item.label?.[locale] ?? item.label ?? item"
-        :value="item.value ?? item"
-        :disabled="item?.disabled"
-        :title="item.label?.[locale] ?? item.label ?? item"
-      >
-        <component :is="item.icon"></component>
-        <span>{{ item.label?.[locale] ?? item.label ?? item }}</span>
-      </tiny-option>
-    </template>
-  </tiny-select>
-</template>
-
-<script>
-import { computed, reactive, watchEffect } from 'vue'
-import { Select, Option, OptionGroup, Tooltip } from '@opentiny/vue'
-import i18n from '@opentiny/tiny-engine-controller/js/i18n'
-
-export default {
-  components: {
-    TinySelect: Select,
-    TinyOption: Option,
-    TinyTooltip: Tooltip,
-    TinyOptionGroup: OptionGroup
-  },
-  props: {
-    modelValue: {
-      type: [String, Array],
-      default: () => ''
-    },
-    multi: {
-      type: Boolean,
-      default: false
-    },
-    groups: {
-      type: Array,
-      default: () => []
-    },
-    options: {
-      type: Array,
-      default: () => []
-    }
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit }) {
-    const { locale } = i18n.global
-    const state = reactive({
-      selected: props.modelValue ?? '',
-      groupOptions: computed(() => {
-        if (props.groups && props.groups.length > 0) {
-          const map = {}
-          props.options.forEach((item) => {
-            map[item.value] = item
-          })
-
-          return props.groups.map(({ label, content, disabled }) => {
-            return { label, content: content.map((value) => map[value]), disabled }
-          })
-        } else {
-          return []
-        }
-      })
-    })
-
-    const handleChange = () => {
-      emit('update:modelValue', state.selected)
-    }
-
-    watchEffect(() => {
-      state.selected = props.modelValue ?? ''
-    })
-
-    return {
-      state,
-      locale,
-      handleChange
-    }
-  }
-}
-</script>
-<style scoped>
-.tiny-select-dropdown__item {
-  padding: 0 4px;
-  width: 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  display: inline-block;
-  line-height: 30px;
-}
-</style>
diff --git a/packages/common/component/MultiTypeSelector.vue b/packages/common/component/MultiTypeSelector.vue
index 2e3649a80a..3f836e8907 100644
--- a/packages/common/component/MultiTypeSelector.vue
+++ b/packages/common/component/MultiTypeSelector.vue
@@ -12,7 +12,7 @@
           <slot name="prefix"></slot>
           <div class="component-wrap">
             <component
-              :is="MetaComponents[meta.widget.component?.[index]]"
+              :is="getConfigurator(meta.widget.component?.[index])"
               v-bind="meta.widget.props"
               v-model="state.typesValue[index].modelValue"
               :meta="meta"
@@ -29,7 +29,7 @@
 <script>
 import { reactive } from 'vue'
 import { Tooltip, Popover, Radio, RadioGroup } from '@opentiny/vue'
-import { MetaComponents } from '../index'
+import { getConfigurator } from '@opentiny/tiny-engine-entry'
 
 export default {
   name: 'MultiTypeSelector',
@@ -113,7 +113,7 @@ export default {
       TYPE_MAP,
       change,
       handleChange,
-      MetaComponents
+      getConfigurator
     }
   }
 }
diff --git a/packages/common/index.js b/packages/common/index.js
index cf545e02df..5f979a2e51 100644
--- a/packages/common/index.js
+++ b/packages/common/index.js
@@ -10,34 +10,6 @@
  *
  */
 
-import {
-  ButtonGroupConfigurator,
-  CascaderConfigurator,
-  CheckBoxConfigurator,
-  CheckboxGroupConfigurator,
-  CodeConfigurator,
-  CodeListConfigurator,
-  CollectionConfigurator,
-  ColorConfigurator,
-  DatePickerConfigurator,
-  FormConfigurator,
-  HtmlAttributesConfigurator,
-  HtmlTextConfigurator,
-  I18nConfigurator,
-  InputConfigurator,
-  IpSectionConfigurator,
-  JsSlotConfigurator,
-  NumberConfigurator,
-  RadioConfigurator,
-  RadioGroupConfigurator,
-  SelectConfigurator,
-  SelectIconConfigurator,
-  SliderConfigurator,
-  SlotConfigurator,
-  SwitchConfigurator,
-  VariableConfigurator
-} from '@opentiny/tiny-engine-configurator'
-
 import PluginSetting from './component/PluginSetting.vue'
 import PluginPanel from './component/PluginPanel.vue'
 import SvgButton from './component/SvgButton.vue'
@@ -48,17 +20,15 @@ import ConfigGroup from './component/ConfigGroup.vue'
 import ConfigItem from './component/ConfigItem.vue'
 import ConfigRender from './component/ConfigRender.vue'
 
-import MetaArrayItem from './component/MetaArrayItem.vue'
+import MetaForm from './component/MetaForm.vue'
 import MetaListActions from './component/MetaListActions.vue'
-import MetaGroupItem from './component/MetaGroupItem.vue'
-import MetaLayoutGrid from './component/MetaLayoutGrid.vue'
 import MetaListTitle from './component/MetaListTitle.vue'
 import MetaListItems from './component/MetaListItems.vue'
 import MetaListItem from './component/MetaListItem.vue'
 import MetaModal, { useModal } from './component/MetaModal.vue'
+import MetaModalItem from './component/MetaModalItem.vue'
 import MetaPopover from './component/MetaPopover.vue'
 import VideoGuide from './component/VideoGuide.vue'
-import MetaContainer from './component/MetaContainer.vue'
 import MonacoEditor from './component/MonacoEditor.vue'
 import BlockHistoryList from './component/BlockHistoryList.vue'
 import BlockHistoryTemplate from './component/BlockHistoryTemplate.vue'
@@ -75,14 +45,14 @@ import VueMonaco, { setGlobalMonacoEditorTheme } from './component/VueMonaco.vue
 import PublicIcon from './component/PublicIcon.vue'
 import SaveNewBlock from './component/SaveNewBlock.vue'
 import BindI18n from './component/BindI18n.vue'
-import MetaRelatedEditor from './component/MetaRelatedEditor.vue'
-import MetaRelatedColumns from './component/MetaRelatedColumns.vue'
 import BlockDeployDialog from './component/BlockDeployDialog.vue'
 import ProgressBar from './component/ProgressBar.vue'
-import MetaTableColumns from './component/MetaTableColumns.vue'
 import SearchEmpty from './component/SearchEmpty.vue'
 import MetaDescription from './component/MetaDescription.vue'
 import MetaList from './component/MetaList.vue'
+import MetaChildItem from './component/MetaChildItem.vue'
+import SplitPanes from './component/SplitPanes.vue'
+import Pane from './component/Pane.vue'
 
 import i18n, { i18nKeyMaps } from '@opentiny/tiny-engine-controller/js/i18n'
 
@@ -108,77 +78,18 @@ export const injectGlobalComponents = {
   }
 }
 
-// TODO: 后面由各自所需代码各自引入，然后删除
-export const MetaComponents = {
-  MetaArrayItem,
-  MetaBindI18n: I18nConfigurator,
-  MetaBindVariable: VariableConfigurator,
-  MetaButtonGroup: ButtonGroupConfigurator,
-  MetaCheckBox: CheckBoxConfigurator,
-  MetaCascader: CascaderConfigurator,
-  MetaCodeEditor: CodeConfigurator,
-  MetaCodeEditorList: CodeListConfigurator,
-  MetaColor: ColorConfigurator,
-  MetaDatePicker: DatePickerConfigurator,
-  MetaGroupItem,
-  MetaInput: InputConfigurator,
-  MetaLayoutGrid,
-  MetaList,
-  MetaModal,
-  MetaNumber: NumberConfigurator,
-  MetaNumeric: NumberConfigurator,
-  MetaPopover,
-  MetaRadio: RadioConfigurator,
-  MetaSelect: SelectConfigurator,
-  MetaSelectIcon: SelectIconConfigurator,
-  MetaSlider: SliderConfigurator,
-  MetaSwitch: SwitchConfigurator,
-  MetaListTitle,
-  MetaListActions,
-  MetaListItems,
-  MetaListItem,
-  MetaForm: FormConfigurator,
-  MetaCollection: CollectionConfigurator,
-  MetaContainer,
-  MetaJsSlot: JsSlotConfigurator,
-  MetaSlot: SlotConfigurator,
-  MetaHtmlText: HtmlTextConfigurator,
-  MetaHtmlAttributes: HtmlAttributesConfigurator,
-  MetaRadioGroup: RadioGroupConfigurator,
-  MetaCheckboxGroup: CheckboxGroupConfigurator,
-  MetaIpSection: IpSectionConfigurator,
-  MetaRelatedEditor,
-  MetaRelatedColumns,
-  MetaTableColumns
-}
-
 export {
-  I18nConfigurator as MetaBindI18n,
-  VariableConfigurator as MetaBindVariable,
-  CheckBoxConfigurator as MetaCheckBox,
-  CodeConfigurator as MetaCodeEditor,
-  CodeListConfigurator as MetaCodeEditorList,
-  ColorConfigurator as MetaColor,
-  DatePickerConfigurator as MetaDatePicker,
   MetaDescription,
-  InputConfigurator as MetaInput,
   MetaList,
   MetaModal,
-  NumberConfigurator as MetaNumber,
+  MetaModalItem,
   MetaPopover,
-  RadioConfigurator as MetaRadio,
-  SelectConfigurator as MetaSelect,
-  SelectIconConfigurator as MetaSelectIcon,
-  SliderConfigurator as MetaSlider,
-  SwitchConfigurator as MetaSwitch,
   MetaListTitle,
   MetaListActions,
   MetaListItems,
   MetaListItem,
-  JsSlotConfigurator as MetaJsSlot,
-  SlotConfigurator as MetaSlot,
-  HtmlTextConfigurator as MetaHtmlText,
-  FormConfigurator as MetaForm,
+  MetaChildItem,
+  MetaForm,
   ConfigCollapse,
   ConfigGroup,
   ConfigItem,
@@ -195,15 +106,12 @@ export {
   BlockLinkEvent,
   BlockDescription,
   PluginBlockList,
-  CollectionConfigurator as MetaCollection,
   ButtonGroup,
   CloseIcon,
   LifeCycles,
   EmptyTip,
-  MetaContainer,
   MonacoEditor,
   MaskModal,
-  HtmlAttributesConfigurator as MetaHtmlAttributes,
   VueMonaco,
   setGlobalMonacoEditorTheme,
   PublicIcon,
@@ -211,8 +119,9 @@ export {
   BindI18n,
   BlockDeployDialog,
   ProgressBar,
-  MetaTableColumns,
-  SearchEmpty
+  SearchEmpty,
+  SplitPanes,
+  Pane
 }
 
 export { default as Modal } from './component/Modal'
diff --git a/packages/common/package.json b/packages/common/package.json
index 75118b0691..884f4a15fd 100644
--- a/packages/common/package.json
+++ b/packages/common/package.json
@@ -27,7 +27,6 @@
   "license": "MIT",
   "homepage": "https://opentiny.design/tiny-engine",
   "dependencies": {
-    "@opentiny/tiny-engine-configurator": "workspace:*",
     "@opentiny/tiny-engine-controller": "workspace:*",
     "@opentiny/tiny-engine-entry": "workspace:*",
     "@opentiny/tiny-engine-http": "workspace:*",
diff --git a/packages/configurator/package.json b/packages/configurator/package.json
index 85adcdd569..854384b88a 100644
--- a/packages/configurator/package.json
+++ b/packages/configurator/package.json
@@ -29,7 +29,8 @@
     "@opentiny/tiny-engine-http": "workspace:*",
     "@opentiny/tiny-engine-utils": "workspace:*",
     "@vue/shared": "^3.3.4",
-    "monaco-editor": "0.33.0"
+    "monaco-editor": "0.33.0",
+    "vue-draggable-next": "2.1.0"
   },
   "publishConfig": {
     "access": "public"
diff --git a/packages/common/component/MetaArrayItem.vue b/packages/configurator/src/array-item-configurator/ArrayItemConfigurator.vue
similarity index 95%
rename from packages/common/component/MetaArrayItem.vue
rename to packages/configurator/src/array-item-configurator/ArrayItemConfigurator.vue
index b6ea09ba00..d7efd83f49 100644
--- a/packages/common/component/MetaArrayItem.vue
+++ b/packages/configurator/src/array-item-configurator/ArrayItemConfigurator.vue
@@ -48,15 +48,12 @@
 <script>
 import { computed, reactive } from 'vue'
 import { IconDel, IconEdit, IconPlus } from '@opentiny/vue-icon'
-import MetaList from './MetaList.vue'
-import MetaListActions from './MetaListActions.vue'
-import MetaListItem from './MetaListItem.vue'
-import MetaChildItem from './MetaChildItem.vue'
+import { MetaList, MetaListActions, MetaListItem, MetaChildItem } from '@opentiny/tiny-engine-common'
 import { useTranslate } from '@opentiny/tiny-engine-controller'
 import { VueDraggableNext } from 'vue-draggable-next'
 
 export default {
-  name: 'MetaArrayItem',
+  name: 'ArrayItemConfigurator',
   components: {
     MetaList,
     MetaListItem,
@@ -116,16 +113,6 @@ export default {
       draggable: true
     }))
 
-    const actionEvents = (item) => {
-      switch (item.type) {
-        case 'add':
-          addItem()
-          break
-        default:
-          break
-      }
-    }
-
     const state = reactive({
       currentIndex: -1
     })
@@ -134,6 +121,10 @@ export default {
       state.currentIndex = data.index
     }
 
+    const updatedColumns = () => {
+      emit('update:modelValue', [...columnsList.value])
+    }
+
     const addItem = () => {
       const defaultValue = props.meta.defaultValue?.[0] || null
       const newOption = ['string', 'boolean', 'number'].includes(props.meta.widget.props.type)
@@ -155,10 +146,6 @@ export default {
       updatedColumns()
     }
 
-    const updatedColumns = () => {
-      emit('update:modelValue', [...columnsList.value])
-    }
-
     const onValueChange = (index, { propertyKey, propertyValue }) => {
       if (propertyValue === '' || propertyValue === undefined || propertyValue === null) {
         delete columnsList.value[index][propertyKey]
@@ -172,6 +159,16 @@ export default {
       updatedColumns()
     }
 
+    const actionEvents = (item) => {
+      switch (item.type) {
+        case 'add':
+          addItem()
+          break
+        default:
+          break
+      }
+    }
+
     return {
       state,
       actionsOptions,
diff --git a/packages/configurator/src/code-configurator/CodeConfigurator.vue b/packages/configurator/src/code-configurator/CodeConfigurator.vue
index 7fa9f55b4f..d643724e5d 100644
--- a/packages/configurator/src/code-configurator/CodeConfigurator.vue
+++ b/packages/configurator/src/code-configurator/CodeConfigurator.vue
@@ -66,7 +66,7 @@
 </template>
 
 <script>
-import { VueMonaco } from '../components' // TODO 等 common 包移除了 configurator 依赖后再更换成 @opentiny/tiny-engine-common
+import { VueMonaco } from '@opentiny/tiny-engine-common'
 import { formatString } from '@opentiny/tiny-engine-controller/js/ast'
 import i18n from '@opentiny/tiny-engine-controller/js/i18n'
 import { Button, DialogBox } from '@opentiny/vue'
diff --git a/packages/configurator/src/code-list-configurator/CodeListConfigurator.vue b/packages/configurator/src/code-list-configurator/CodeListConfigurator.vue
index f6b4157313..77648be5a2 100644
--- a/packages/configurator/src/code-list-configurator/CodeListConfigurator.vue
+++ b/packages/configurator/src/code-list-configurator/CodeListConfigurator.vue
@@ -43,7 +43,7 @@
 import { getCurrentInstance, reactive, ref, watchEffect } from 'vue'
 import { Button, Tabs, TabItem, Input, ButtonGroup, Switch, Select } from '@opentiny/vue'
 import { IconClose } from '@opentiny/vue-icon'
-import { VueMonaco } from '../components'
+import { VueMonaco } from '@opentiny/tiny-engine-common'
 
 export default {
   components: {
diff --git a/packages/configurator/src/components/BindI18n.vue b/packages/configurator/src/components/BindI18n.vue
deleted file mode 100644
index bfe416ffd7..0000000000
--- a/packages/configurator/src/components/BindI18n.vue
+++ /dev/null
@@ -1,227 +0,0 @@
-<template>
-  <div ref="languageContent" class="languageContent">
-    <div v-show="!showEditItem">
-      <tiny-select
-        ref="selectRef"
-        v-model="selectValue"
-        placeholder="请根据显示值搜索"
-        filterable
-        :filter-method="filterMethod"
-        @change="selectI18n"
-      >
-        <tiny-option v-for="item in langData" :key="item.key" :label="item[currentLang]" :value="item.key">
-          <div style="display: flex">
-            <span style="flex: 1">{{ item.key }}</span>
-            <span style="flex: 1">{{ item[currentLang] }}</span>
-          </div>
-        </tiny-option>
-      </tiny-select>
-      <div v-if="paramsForm.length" class="params-form">
-        <label>国际化参数配置</label>
-        <div v-for="param in paramsForm" :key="param.name" class="params-item">
-          <label>{{ param.name }}</label>
-          <tiny-input v-model="param.value" @update:modelValue="paramsChange"></tiny-input>
-        </div>
-      </div>
-      <slot name="suffix">
-        <tiny-button type="info" @click="openCreateForm">
-          <icon-plus class="icon-plus"></icon-plus>
-          <span>创建新的多语言文案</span>
-        </tiny-button>
-        <tiny-button v-if="isBind" type="info" @click="unbindI18n"> 解除关联 </tiny-button>
-      </slot>
-    </div>
-    <div v-show="showEditItem" class="addNewLanguage">
-      <div>
-        <div class="tiny-input">
-          <label>唯一键</label>
-          <input v-model="editForm.key" class="tiny-input__inner" />
-        </div>
-
-        <div v-for="locale in locales" :key="locale.lang" class="tiny-input">
-          <label>{{ locale.label }}</label>
-          <input v-model="editForm[locale.lang]" class="tiny-input__inner" />
-        </div>
-      </div>
-      <div class="add-btns">
-        <tiny-button type="info" @click="activeI18n">国际化管理 </tiny-button>
-        <tiny-button type="info" @click="addBindI18n">添加并关联 </tiny-button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { reactive, ref, watchEffect } from 'vue'
-import { useLayout, useTranslate } from '@opentiny/tiny-engine-controller'
-import { PROP_DATA_TYPE } from '@opentiny/tiny-engine-controller/js/constants'
-import { utils } from '@opentiny/tiny-engine-utils'
-import { Select, Option, Button, Input } from '@opentiny/vue'
-import { iconPlus } from '@opentiny/vue-icon'
-
-export default {
-  components: {
-    TinySelect: Select,
-    TinyOption: Option,
-    TinyButton: Button,
-    TinyInput: Input,
-    IconPlus: iconPlus()
-  },
-  inheritAttrs: false,
-  props: {
-    currentLang: String,
-    isBind: Boolean,
-    langData: {
-      type: [Array, Object],
-      default: () => []
-    },
-    modelValue: {
-      type: String,
-      default: ''
-    },
-    data: [Object, String],
-    locales: Array
-  },
-  setup(props, { emit }) {
-    const selectValue = ref(props.modelValue)
-    const showEditItem = ref(false)
-    const selectRef = ref(null)
-    const editForm = reactive({})
-    const paramsForm = ref([])
-
-    watchEffect(() => {
-      selectValue.value = props.modelValue
-      if (props.modelValue && props.langData[props.modelValue]) {
-        const curValue = props.langData[props.modelValue][props.currentLang] || ''
-        const params = []
-        const data = props?.data?.params || {}
-
-        curValue.replace(/\{(.+?)\}/g, (substr, key) => {
-          key && params.push({ name: key, value: data[key] || '' })
-        })
-        paramsForm.value = params
-      }
-    })
-
-    const filterMethod = (value) => {
-      const options = selectRef.value.state.cachedOptions
-
-      options.forEach((item) => {
-        item.state.visible = value ? item.label.indexOf(value) > -1 : true
-      })
-    }
-
-    const selectI18n = (key) => {
-      const data = props.langData[key] || {}
-
-      emit('bind', { ...data, key })
-    }
-
-    const { PLUGIN_NAME, activePlugin } = useLayout()
-    const activeI18n = () => activePlugin(PLUGIN_NAME.I18n)
-
-    const addBindI18n = () => {
-      useTranslate().ensureI18n(editForm, true)
-      emit('bind', { ...editForm })
-      showEditItem.value = false
-    }
-
-    const unbindI18n = () => {
-      const i18nObj = props.langData[props.modelValue]
-
-      emit('bind', i18nObj[props.currentLang])
-      showEditItem.value = false
-    }
-
-    const paramsChange = () => {
-      const params = {}
-
-      paramsForm.value.forEach(({ name, value }) => {
-        params[name] = value
-      })
-      emit('bind', { type: PROP_DATA_TYPE.I18N, key: selectValue.value, params })
-    }
-
-    const openCreateForm = () => {
-      Object.keys(editForm).forEach((key) => delete editForm[key])
-      editForm.key = 'lowcode.' + utils.guid()
-      editForm.type = PROP_DATA_TYPE.I18N
-      showEditItem.value = true
-    }
-
-    return {
-      selectRef,
-      showEditItem,
-      filterMethod,
-      selectI18n,
-      selectValue,
-      activeI18n,
-      addBindI18n,
-      unbindI18n,
-      paramsForm,
-      paramsChange,
-      editForm,
-      openCreateForm
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.languageContent {
-  width: 254px;
-  border-radius: 5px;
-  text-align: center;
-  z-index: 99;
-  margin-top: 5px;
-
-  .tiny-svg {
-    margin-right: 10px;
-    font-size: 16px;
-    &:hover {
-      cursor: pointer;
-      color: #ccc;
-    }
-  }
-  .tiny-button {
-    margin-top: 10px;
-    max-width: initial;
-    padding: 0 12px;
-    background-color: var(--ti-lowcode-tabs-border-color);
-    border-color: var(--ti-lowcode-tootip-input-border-color);
-    color: var(--ti-lowcode-toolbar-icon-color);
-    &:hover {
-      background-color: var(--ti-lowcode-canvas-wrap-bg);
-      border-color: var(--ti-lowcode-tabs-border-color);
-    }
-  }
-  .addNewLanguage {
-    padding: 0px 5px 5px;
-    .tiny-input {
-      display: flex;
-      margin-bottom: 10px;
-      align-items: center;
-      label {
-        width: 80px;
-      }
-      display: flex;
-    }
-    .add-btns {
-      text-align: right;
-    }
-  }
-}
-.params-form {
-  & > label {
-    line-height: 30px;
-  }
-  .params-item {
-    display: flex;
-    align-items: center;
-    label {
-      width: 80px;
-    }
-    margin-bottom: 10px;
-  }
-}
-</style>
diff --git a/packages/configurator/src/components/SvgButton.vue b/packages/configurator/src/components/SvgButton.vue
deleted file mode 100644
index e46650d35a..0000000000
--- a/packages/configurator/src/components/SvgButton.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-<template>
-  <span class="svg-button" @click="$emit('click', $event)">
-    <tiny-tooltip effect="dark" :content="tips" :placement="placement">
-      <component :is="name" v-if="isTinyIcon" />
-      <svg-icon v-else :name="name"></svg-icon>
-    </tiny-tooltip>
-  </span>
-</template>
-
-<script>
-import { computed } from 'vue'
-import { Tooltip } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyTooltip: Tooltip
-  },
-  props: {
-    tips: {
-      type: String,
-      default: ''
-    },
-    placement: {
-      type: String,
-      default: 'bottom'
-    },
-    name: {
-      type: String,
-      default: 'add'
-    }
-  },
-  emits: ['click'],
-  setup(props) {
-    const isTinyIcon = computed(() => props.name.toLowerCase().indexOf('icon') === 0)
-
-    return {
-      isTinyIcon
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.svg-button {
-  width: 24px;
-  height: 24px;
-  font-size: 16px;
-  color: var(--ti-lowcode-component-svg-button-color);
-  border: 1px solid transparent;
-  border-radius: 4px;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  &:hover {
-    color: var(--ti-lowcode-component-svg-button-hover-color);
-    background-color: var(--ti-lowcode-component-svg-button-hover-bg-color);
-  }
-  &.active {
-    color: var(--ti-lowcode-component-svg-button-active-color);
-    background-color: var(--ti-lowcode-component-svg-button-active-bg-color);
-  }
-
-  & + .svg-button {
-    margin-left: 8px;
-  }
-}
-</style>
diff --git a/packages/configurator/src/components/VueMonaco.vue b/packages/configurator/src/components/VueMonaco.vue
deleted file mode 100644
index d102449425..0000000000
--- a/packages/configurator/src/components/VueMonaco.vue
+++ /dev/null
@@ -1,196 +0,0 @@
-<template>
-  <div ref="monacoRef"></div>
-</template>
-<script>
-import * as monacoEditor from 'monaco-editor'
-import { watch, onMounted, nextTick, onBeforeUnmount, ref } from 'vue'
-import { formatString } from '@opentiny/tiny-engine-controller/js/ast'
-
-export default {
-  name: 'MonacoEditor',
-  model: {
-    event: 'change'
-  },
-  props: {
-    original: {
-      type: String
-    },
-    value: {
-      type: String,
-      required: true
-    },
-    theme: {
-      type: String,
-      default: 'vs'
-    },
-    language: {
-      type: String
-    },
-    options: {
-      type: Object
-    },
-    amdRequire: {
-      type: Function
-    },
-    diffEditor: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ['change', 'editorWillMount', 'editorDidMount'],
-  setup(props, { emit }) {
-    const vueMonaco = {
-      editor: null,
-      monaco: null
-    }
-    const monacoRef = ref(null)
-
-    const focus = () => vueMonaco.editor && vueMonaco.editor.focus()
-
-    const getMonaco = () => vueMonaco.monaco
-
-    const getEditor = () => vueMonaco.editor
-
-    const getModifiedEditor = () => (props.diffEditor ? vueMonaco.editor.getModifiedEditor() : vueMonaco.editor)
-
-    const getOriginalEditor = () => (props.diffEditor ? vueMonaco.editor.getOriginalEditor() : vueMonaco.editor)
-
-    const getModelMarkers = () => vueMonaco.monaco.editor.getModelMarkers()
-
-    const initMonaco = (monaco) => {
-      emit('editorWillMount', vueMonaco.monaco)
-
-      const options = { value: props.value, theme: props.theme, language: props.language, ...props.options }
-
-      if (props.diffEditor) {
-        vueMonaco.editor = monaco.editor.createDiffEditor(monacoRef.value, options)
-        const originalModel = monaco.editor.createModel(props.original, props.language)
-        const modifiedModel = monaco.editor.createModel(props.value, props.language)
-
-        vueMonaco.editor.setModel({
-          original: originalModel,
-          modified: modifiedModel
-        })
-      } else {
-        vueMonaco.editor = monaco.editor.create(monacoRef.value, options)
-      }
-
-      const editor2 = getModifiedEditor()
-
-      editor2.onDidChangeModelContent((event) => {
-        const value = editor2.getValue()
-
-        if (props.value !== value) {
-          emit('change', value, event)
-        }
-      })
-
-      emit('editorDidMount', vueMonaco.editor)
-    }
-
-    onMounted(() => {
-      if (props.amdRequire) {
-        props.amdRequire(['vs/editor/editor.main'], () => {
-          vueMonaco.monaco = window.monaco
-          nextTick(() => {
-            initMonaco(window.monaco)
-          })
-        })
-      } else {
-        vueMonaco.monaco = monacoEditor
-        nextTick(() => {
-          initMonaco(vueMonaco.monaco)
-          vueMonaco.editor.addAction({
-            id: 'prettier',
-            label: 'Prettier',
-            precondition: null,
-            contextMenuGroupId: 'navigation',
-            run(editor) {
-              const currentValue = editor.getValue()
-              const newValue = formatString(currentValue, props.options.language)
-
-              if (newValue !== currentValue) {
-                editor.setValue(newValue)
-              }
-            }
-          })
-        })
-      }
-    })
-
-    onBeforeUnmount(() => {
-      vueMonaco.editor && vueMonaco.editor.dispose()
-    })
-
-    watch(
-      () => props.options,
-      (options) => {
-        if (vueMonaco.editor) {
-          const editor2 = getModifiedEditor()
-
-          editor2.updateOptions(options)
-        }
-      },
-      {
-        deep: true
-      }
-    )
-
-    watch(
-      () => props.value,
-      (newValue) => {
-        if (vueMonaco.editor) {
-          const editor = getModifiedEditor()
-
-          if (newValue !== editor.getValue()) {
-            editor.setValue(newValue)
-          }
-        }
-      }
-    )
-
-    watch(
-      () => props.original,
-      (newValue) => {
-        if (vueMonaco.editor && props.diffEditor) {
-          const editor = getOriginalEditor()
-
-          if (newValue !== editor.getValue()) {
-            editor.setValue(newValue)
-          }
-        }
-      }
-    )
-
-    watch(
-      () => props.language,
-      (newVal) => {
-        if (vueMonaco.editor) {
-          const editor = getModifiedEditor()
-          vueMonaco.monaco.editor.setModelLanguage(editor.getModel(), newVal)
-        }
-      }
-    )
-
-    watch(
-      () => props.theme,
-      (newVal) => {
-        if (vueMonaco.editor) {
-          vueMonaco.monaco.editor.setTheme(newVal)
-        }
-      }
-    )
-
-    return {
-      getMonaco,
-      getEditor,
-      getModifiedEditor,
-      getOriginalEditor,
-      initMonaco,
-      focus,
-      monacoRef,
-      getModelMarkers
-    }
-  }
-}
-</script>
diff --git a/packages/configurator/src/components/index.js b/packages/configurator/src/components/index.js
deleted file mode 100644
index 2b0dbafb93..0000000000
--- a/packages/configurator/src/components/index.js
+++ /dev/null
@@ -1,4 +0,0 @@
-// TODO components 文件夹下的组件是从 @opentiny/tiny-engine-common 复制过来的临时文件，防止循环依赖
-export { default as BindI18n } from './BindI18n.vue'
-export { default as SvgButton } from './SvgButton.vue'
-export { default as VueMonaco } from './VueMonaco.vue'
diff --git a/packages/common/component/MetaContainer.vue b/packages/configurator/src/container-configurator/ContainerConfigurator.vue
similarity index 97%
rename from packages/common/component/MetaContainer.vue
rename to packages/configurator/src/container-configurator/ContainerConfigurator.vue
index be0e300b4f..2f0d787569 100644
--- a/packages/common/component/MetaContainer.vue
+++ b/packages/configurator/src/container-configurator/ContainerConfigurator.vue
@@ -21,7 +21,7 @@
 </template>
 <script>
 import { ref } from 'vue'
-import MetaListItems from './MetaListItems.vue'
+import { MetaListItems } from '@opentiny/tiny-engine-common'
 import { useProperties, useResource, useHistory } from '@opentiny/tiny-engine-controller'
 import { utils } from '@opentiny/tiny-engine-utils'
 import { iconDel } from '@opentiny/vue-icon'
diff --git a/packages/configurator/src/form-configurator/FormConfigurator.vue b/packages/configurator/src/form-configurator/FormConfigurator.vue
deleted file mode 100644
index a2999ecc4a..0000000000
--- a/packages/configurator/src/form-configurator/FormConfigurator.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<template>
-  <div class="demo-form">
-    <tiny-form label-position="left" label-width="53px">
-      <template v-for="label in labelList" :key="label">
-        <tiny-form-item v-if="labelTranslations[label]" :label="labelTranslations[label] || label">
-          <tiny-input v-model="formData[label]"></tiny-input>
-        </tiny-form-item>
-      </template>
-      <tiny-form-item :class="{ footerbtnHide: footerbtnHide }">
-        <tiny-button @click="cancel">取消</tiny-button>
-        <tiny-button @click="confirm">确定</tiny-button>
-      </tiny-form-item>
-    </tiny-form>
-  </div>
-</template>
-
-<script>
-import { reactive } from 'vue'
-import { Form, FormItem, Input, Button } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyForm: Form,
-    TinyFormItem: FormItem,
-    TinyInput: Input,
-    TinyButton: Button
-  },
-  props: {
-    option: {
-      type: Object,
-      default: () => ({})
-    },
-    footerbtnHide: {
-      type: Boolean,
-      default: false
-    }
-  },
-  setup(props, { emit }) {
-    const labelList = Object.keys(props.option)
-    const formData = reactive({ ...props.option })
-
-    const labelTranslations = {
-      label: '显示值',
-      text: '展示值',
-      zh_CN: '中文',
-      en_US: '英文',
-      field: 'field',
-      title: 'title',
-      description: '描述',
-      defaultValue: '缺省值'
-    }
-
-    const cancel = () => {
-      emit('cancel')
-    }
-
-    const confirm = () => {
-      emit('confirm', formData)
-    }
-
-    return {
-      labelList,
-      formData,
-      labelTranslations,
-      cancel,
-      confirm
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.demo-form {
-  .tiny-button {
-    min-width: 50px;
-    padding: 0 8px;
-  }
-  .footerbtnHide {
-    display: none;
-  }
-}
-</style>
diff --git a/packages/common/component/MetaGroupItem.vue b/packages/configurator/src/group-item-configurator/GroupItemConfigurator.vue
similarity index 92%
rename from packages/common/component/MetaGroupItem.vue
rename to packages/configurator/src/group-item-configurator/GroupItemConfigurator.vue
index 6833289dd1..1f866c3cc3 100644
--- a/packages/common/component/MetaGroupItem.vue
+++ b/packages/configurator/src/group-item-configurator/GroupItemConfigurator.vue
@@ -8,10 +8,10 @@
 </template>
 
 <script>
-import MetaChildItem from './MetaChildItem.vue'
+import { MetaChildItem } from '@opentiny/tiny-engine-common'
 
 export default {
-  name: 'MetaGroupItem',
+  name: 'GroupItemConfigurator',
   components: {
     MetaChildItem
   },
diff --git a/packages/configurator/src/i18n-configurator/I18nConfigurator.vue b/packages/configurator/src/i18n-configurator/I18nConfigurator.vue
index 82b602504e..58d1e298bd 100644
--- a/packages/configurator/src/i18n-configurator/I18nConfigurator.vue
+++ b/packages/configurator/src/i18n-configurator/I18nConfigurator.vue
@@ -34,7 +34,7 @@
 </template>
 
 <script>
-import { BindI18n } from '../components' // TODO 等 common 包移除了 configurator 依赖后再更换成 @opentiny/tiny-engine-common
+import { BindI18n } from '@opentiny/tiny-engine-common'
 import { useTranslate } from '@opentiny/tiny-engine-controller'
 import { Input, Popover } from '@opentiny/vue'
 import { IconClose, IconLanguage } from '@opentiny/vue-icon'
diff --git a/packages/configurator/src/index.js b/packages/configurator/src/index.js
index a8e2cbef1a..8296402477 100644
--- a/packages/configurator/src/index.js
+++ b/packages/configurator/src/index.js
@@ -1,25 +1,98 @@
-export { default as ButtonGroupConfigurator } from './button-group-configurator/ButtonGroupConfigurator.vue'
-export { default as CascaderConfigurator } from './cascader-configurator/CascaderConfigurator.vue'
-export { default as CheckBoxConfigurator } from './checkbox-configurator/CheckBoxConfigurator.vue'
-export { default as CheckboxGroupConfigurator } from './checkbox-group-configurator/CheckboxGroupConfigurator.vue'
-export { default as CodeConfigurator } from './code-configurator/CodeConfigurator.vue'
-export { default as CodeListConfigurator } from './code-list-configurator/CodeListConfigurator.vue'
-export { default as CollectionConfigurator } from './collection-configurator/CollectionConfigurator.vue'
-export { default as ColorConfigurator } from './color-configurator/ColorConfigurator.vue'
-export { default as DatePickerConfigurator } from './date-picker-configurator/DatePickerConfigurator.vue'
-export { default as FormConfigurator } from './form-configurator/FormConfigurator.vue'
-export { default as HtmlAttributesConfigurator } from './html-attributes-configurator/HtmlAttributesConfigurator.vue'
-export { default as HtmlTextConfigurator } from './html-text-configurator/HtmlTextConfigurator.vue'
-export { default as I18nConfigurator } from './i18n-configurator/I18nConfigurator.vue'
-export { default as InputConfigurator } from './input-configurator/InputConfigurator.vue'
-export { default as IpSectionConfigurator } from './ip-section-configurator/IpSectionConfigurator.vue'
-export { default as JsSlotConfigurator } from './js-slot-configurator/JsSlotConfigurator.vue'
-export { default as NumberConfigurator } from './number-configurator/NumberConfigurator.vue'
-export { default as RadioConfigurator } from './radio-configurator/RadioConfigurator.vue'
-export { default as RadioGroupConfigurator } from './radio-group-configurator/RadioGroupConfigurator.vue'
-export { default as SelectConfigurator } from './select-configurator/SelectConfigurator.vue'
-export { default as SelectIconConfigurator } from './select-icon-configurator/SelectIconConfigurator.vue'
-export { default as SliderConfigurator } from './slider-configurator/SliderConfigurator.vue'
-export { default as SlotConfigurator } from './slot-configurator/SlotConfigurator.vue'
-export { default as SwitchConfigurator } from './switch-configurator/SwitchConfigurator.vue'
-export { default as VariableConfigurator } from './variable-configurator/VariableConfigurator.vue'
+import ArrayItemConfigurator from './array-item-configurator/ArrayItemConfigurator.vue'
+import ButtonGroupConfigurator from './button-group-configurator/ButtonGroupConfigurator.vue'
+import CascaderConfigurator from './cascader-configurator/CascaderConfigurator.vue'
+import CheckBoxConfigurator from './checkbox-configurator/CheckBoxConfigurator.vue'
+import CheckboxGroupConfigurator from './checkbox-group-configurator/CheckboxGroupConfigurator.vue'
+import CodeConfigurator from './code-configurator/CodeConfigurator.vue'
+import CodeListConfigurator from './code-list-configurator/CodeListConfigurator.vue'
+import CollectionConfigurator from './collection-configurator/CollectionConfigurator.vue'
+import ColorConfigurator from './color-configurator/ColorConfigurator.vue'
+import ContainerConfigurator from './container-configurator/ContainerConfigurator.vue'
+import DatePickerConfigurator from './date-picker-configurator/DatePickerConfigurator.vue'
+import GroupItemConfigurator from './group-item-configurator/GroupItemConfigurator.vue'
+import HtmlAttributesConfigurator from './html-attributes-configurator/HtmlAttributesConfigurator.vue'
+import HtmlTextConfigurator from './html-text-configurator/HtmlTextConfigurator.vue'
+import I18nConfigurator from './i18n-configurator/I18nConfigurator.vue'
+import InputConfigurator from './input-configurator/InputConfigurator.vue'
+import IpSectionConfigurator from './ip-section-configurator/IpSectionConfigurator.vue'
+import JsSlotConfigurator from './js-slot-configurator/JsSlotConfigurator.vue'
+import LayoutGridConfigurator from './layout-grid-configurator/LayoutGridConfigurator.vue'
+import NumberConfigurator from './number-configurator/NumberConfigurator.vue'
+import RadioConfigurator from './radio-configurator/RadioConfigurator.vue'
+import RadioGroupConfigurator from './radio-group-configurator/RadioGroupConfigurator.vue'
+import RelatedColumnsConfigurator from './related-columns-configurator/RelatedColumnsConfigurator.vue'
+import RelatedEditorConfigurator from './related-editor-configurator/RelatedEditorConfigurator.vue'
+import SelectConfigurator from './select-configurator/SelectConfigurator.vue'
+import SelectIconConfigurator from './select-icon-configurator/SelectIconConfigurator.vue'
+import SliderConfigurator from './slider-configurator/SliderConfigurator.vue'
+import SlotConfigurator from './slot-configurator/SlotConfigurator.vue'
+import SwitchConfigurator from './switch-configurator/SwitchConfigurator.vue'
+import TableColumnsConfigurator from './table-columns-configurator/TableColumnsConfigurator.vue'
+import VariableConfigurator from './variable-configurator/VariableConfigurator.vue'
+
+export {
+  ArrayItemConfigurator,
+  ButtonGroupConfigurator,
+  CascaderConfigurator,
+  CheckBoxConfigurator,
+  CheckboxGroupConfigurator,
+  CodeConfigurator,
+  CodeListConfigurator,
+  CollectionConfigurator,
+  ColorConfigurator,
+  ContainerConfigurator,
+  DatePickerConfigurator,
+  GroupItemConfigurator,
+  HtmlAttributesConfigurator,
+  HtmlTextConfigurator,
+  I18nConfigurator,
+  InputConfigurator,
+  IpSectionConfigurator,
+  JsSlotConfigurator,
+  LayoutGridConfigurator,
+  NumberConfigurator,
+  RadioConfigurator,
+  RadioGroupConfigurator,
+  RelatedColumnsConfigurator,
+  RelatedEditorConfigurator,
+  SelectConfigurator,
+  SelectIconConfigurator,
+  SliderConfigurator,
+  SlotConfigurator,
+  SwitchConfigurator,
+  TableColumnsConfigurator,
+  VariableConfigurator,
+  // TODO Meta别名，后续删除
+  ArrayItemConfigurator as MetaArrayItem,
+  I18nConfigurator as MetaBindI18n,
+  VariableConfigurator as MetaBindVariable,
+  ButtonGroupConfigurator as MetaButtonGroup,
+  CheckBoxConfigurator as MetaCheckBox,
+  CascaderConfigurator as MetaCascader,
+  CodeConfigurator as MetaCodeEditor,
+  CodeListConfigurator as MetaCodeEditorList,
+  ColorConfigurator as MetaColor,
+  DatePickerConfigurator as MetaDatePicker,
+  GroupItemConfigurator as MetaGroupItem,
+  InputConfigurator as MetaInput,
+  LayoutGridConfigurator as MetaLayoutGrid,
+  NumberConfigurator as MetaNumber,
+  NumberConfigurator as MetaNumeric,
+  RadioConfigurator as MetaRadio,
+  SelectConfigurator as MetaSelect,
+  SelectIconConfigurator as MetaSelectIcon,
+  SliderConfigurator as MetaSlider,
+  SwitchConfigurator as MetaSwitch,
+  CollectionConfigurator as MetaCollection,
+  ContainerConfigurator as MetaContainer,
+  JsSlotConfigurator as MetaJsSlot,
+  SlotConfigurator as MetaSlot,
+  HtmlTextConfigurator as MetaHtmlText,
+  HtmlAttributesConfigurator as MetaHtmlAttributes,
+  RadioGroupConfigurator as MetaRadioGroup,
+  CheckboxGroupConfigurator as MetaCheckboxGroup,
+  IpSectionConfigurator as MetaIpSection,
+  RelatedEditorConfigurator as MetaRelatedEditor,
+  RelatedColumnsConfigurator as MetaRelatedColumns,
+  TableColumnsConfigurator as MetaTableColumns
+}
diff --git a/packages/common/component/MetaLayoutGrid.vue b/packages/configurator/src/layout-grid-configurator/LayoutGridConfigurator.vue
similarity index 97%
rename from packages/common/component/MetaLayoutGrid.vue
rename to packages/configurator/src/layout-grid-configurator/LayoutGridConfigurator.vue
index c8734f8d72..71bad95932 100644
--- a/packages/common/component/MetaLayoutGrid.vue
+++ b/packages/configurator/src/layout-grid-configurator/LayoutGridConfigurator.vue
@@ -18,7 +18,7 @@
         Customize:
         <span v-if="customizeShow" style="color: #de504e">*</span>
       </div>
-      <splitpanes class="default-theme" style="height: 28px" @resize="resize">
+      <split-panes class="default-theme" style="height: 28px" @resize="resize">
         <pane
           v-for="i in setting.len"
           :key="i"
@@ -28,20 +28,19 @@
         >
           <span>{{ setting.modeArray[i - 1] }}</span>
         </pane>
-      </splitpanes>
+      </split-panes>
     </div>
   </div>
 </template>
 
 <script>
 import { reactive, ref, computed } from 'vue'
-import Splitpanes from './SplitPanes.vue'
-import Pane from './Pane.vue'
+import { SplitPanes, Pane } from '@opentiny/tiny-engine-common'
 import { useProperties } from '@opentiny/tiny-engine-controller'
 
 export default {
   components: {
-    Splitpanes,
+    SplitPanes,
     Pane
   },
   inheritAttrs: false,
diff --git a/packages/common/component/MetaRelatedColumns.vue b/packages/configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue
similarity index 90%
rename from packages/common/component/MetaRelatedColumns.vue
rename to packages/configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue
index 38154ef974..1c0165004f 100644
--- a/packages/common/component/MetaRelatedColumns.vue
+++ b/packages/configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue
@@ -1,20 +1,20 @@
 <template>
-  <meta-array-item
+  <array-item-configurator
     :meta="meta"
     :expand="expand"
     :disableDrag="disableDrag"
     @update:modelValue="saveValue"
-  ></meta-array-item>
+  ></array-item-configurator>
 </template>
 
 <script>
 import { onMounted, onUnmounted } from 'vue'
 import { useMessage, useCanvas } from '@opentiny/tiny-engine-controller'
-import MetaArrayItem from './MetaArrayItem.vue'
+import ArrayItemConfigurator from '../array-item-configurator/ArrayItemConfigurator.vue'
 
 export default {
   components: {
-    MetaArrayItem
+    ArrayItemConfigurator
   },
   props: {
     meta: {
diff --git a/packages/common/component/MetaRelatedEditor.vue b/packages/configurator/src/related-editor-configurator/RelatedEditorConfigurator.vue
similarity index 95%
rename from packages/common/component/MetaRelatedEditor.vue
rename to packages/configurator/src/related-editor-configurator/RelatedEditorConfigurator.vue
index 98146cf92a..4ad0bbade9 100644
--- a/packages/common/component/MetaRelatedEditor.vue
+++ b/packages/configurator/src/related-editor-configurator/RelatedEditorConfigurator.vue
@@ -22,7 +22,8 @@
 <script>
 import { onMounted, ref, watchEffect } from 'vue'
 import { useMessage, useCanvas } from '@opentiny/tiny-engine-controller'
-import { CodeConfigurator, VariableConfigurator } from '@opentiny/tiny-engine-configurator'
+import CodeConfigurator from '../code-configurator/CodeConfigurator.vue'
+import VariableConfigurator from '../variable-configurator/VariableConfigurator.vue'
 
 export default {
   components: {
diff --git a/packages/common/component/MetaTableColumns.vue b/packages/configurator/src/table-columns-configurator/TableColumnsConfigurator.vue
similarity index 80%
rename from packages/common/component/MetaTableColumns.vue
rename to packages/configurator/src/table-columns-configurator/TableColumnsConfigurator.vue
index 417e141651..b1a9176b4e 100644
--- a/packages/common/component/MetaTableColumns.vue
+++ b/packages/configurator/src/table-columns-configurator/TableColumnsConfigurator.vue
@@ -1,11 +1,11 @@
 <template>
-  <MetaArrayItem v-bind="$attrs" @update:modelValue="updateColumns"></MetaArrayItem>
+  <ArrayItemConfigurator v-bind="$attrs" @update:modelValue="updateColumns"></ArrayItemConfigurator>
 </template>
 
 <script setup>
 import { nextTick } from 'vue'
 import { useProperties, useResource, useCanvas } from '@opentiny/tiny-engine-controller'
-import MetaArrayItem from './MetaArrayItem.vue'
+import ArrayItemConfigurator from '../array-item-configurator/ArrayItemConfigurator.vue'
 
 const { children: schemaChildren, componentName, props } = useProperties().getSchema()
 const configureMap = useResource().getConfigureMap()
diff --git a/packages/configurator/src/variable-configurator/VariableConfigurator.vue b/packages/configurator/src/variable-configurator/VariableConfigurator.vue
index 6e05120b34..889c52122d 100644
--- a/packages/configurator/src/variable-configurator/VariableConfigurator.vue
+++ b/packages/configurator/src/variable-configurator/VariableConfigurator.vue
@@ -120,7 +120,7 @@
 </template>
 
 <script>
-import { VueMonaco as MonacoEditor, SvgButton } from '../components' // TODO 等 common 包移除了 configurator 依赖后再更换成 @opentiny/tiny-engine-common
+import { VueMonaco as MonacoEditor, SvgButton } from '@opentiny/tiny-engine-common'
 import { useApp, useCanvas, useLayout, useProperties, useResource } from '@opentiny/tiny-engine-controller'
 import { getCommentByKey } from '@opentiny/tiny-engine-controller/js/comment'
 import { formatString, generate, parse, traverse } from '@opentiny/tiny-engine-controller/js/ast'
diff --git a/packages/design-core/src/registerConfigurators.js b/packages/design-core/src/registerConfigurators.js
index 3ce63f8548..328c74213a 100644
--- a/packages/design-core/src/registerConfigurators.js
+++ b/packages/design-core/src/registerConfigurators.js
@@ -1,13 +1,10 @@
 import * as allConfigurator from '@opentiny/tiny-engine-configurator'
-// TODO: 抽空 common package 中的 metaComponent
-import { MetaComponents } from '@opentiny/tiny-engine-common'
 import { addConfigurator } from '@opentiny/tiny-engine-entry'
 
 /**
  * 注册用户指定的 configurators
  */
 export const registerConfigurators = (configurators) => {
-  addConfigurator(Object.entries(MetaComponents).map(([name, component]) => ({ name, component })))
   addConfigurator(Object.entries(allConfigurator).map(([name, component]) => ({ name, component })))
   addConfigurator(Object.entries(configurators).map(([name, component]) => ({ name, component })))
 }
diff --git a/packages/settings/design/src/components/ArrayConfigItemForm.vue b/packages/settings/design/src/components/ArrayConfigItemForm.vue
index 6cd22dc486..f62b7e0314 100644
--- a/packages/settings/design/src/components/ArrayConfigItemForm.vue
+++ b/packages/settings/design/src/components/ArrayConfigItemForm.vue
@@ -52,8 +52,13 @@
 <script>
 import { computed } from 'vue'
 import { Input as TinyInput, Form as TinyForm, FormItem as TinyFormItem, Select as TinySelect } from '@opentiny/vue'
-import { ConfigItem, MetaNumber } from '@opentiny/tiny-engine-common'
-import { CodeConfigurator, SwitchConfigurator, InputConfigurator } from '@opentiny/tiny-engine-configurator'
+import { ConfigItem } from '@opentiny/tiny-engine-common'
+import {
+  CodeConfigurator,
+  SwitchConfigurator,
+  InputConfigurator,
+  NumberConfigurator
+} from '@opentiny/tiny-engine-configurator'
 import { useNotify } from '@opentiny/tiny-engine-controller'
 import { iconChevronLeft } from '@opentiny/vue-icon'
 import store, { META_TYPES_ENUM, META_TYPES_OPTIONS } from '../store'
@@ -150,7 +155,7 @@ export default {
       }
 
       if (type === 'number') {
-        return MetaNumber
+        return NumberConfigurator
       }
 
       if (type === 'boolean') {
diff --git a/packages/settings/design/src/components/widgets/index.js b/packages/settings/design/src/components/widgets/index.js
index 31ee686c3b..7035e45988 100644
--- a/packages/settings/design/src/components/widgets/index.js
+++ b/packages/settings/design/src/components/widgets/index.js
@@ -10,18 +10,10 @@
  *
  */
 
-import { MetaComponents } from '@opentiny/tiny-engine-common'
 import * as configurator from '@opentiny/tiny-engine-configurator'
-
 const widgets = {}
 const widgetNames = []
 
-Object.keys(MetaComponents).forEach((name) => {
-  if (/meta/i.test(name)) {
-    widgets[name] = MetaComponents[name]
-    widgetNames.push({ label: name, value: name })
-  }
-})
 Object.keys(configurator).forEach((name) => {
   widgets[name] = configurator[name]
   widgetNames.push({ label: name, value: name })
diff --git a/packages/settings/events/src/components/AdvanceConfig.vue b/packages/settings/events/src/components/AdvanceConfig.vue
index f36eeb57d9..9106482630 100644
--- a/packages/settings/events/src/components/AdvanceConfig.vue
+++ b/packages/settings/events/src/components/AdvanceConfig.vue
@@ -39,32 +39,32 @@
     <div class="advnce-config">
       <label class="text-ellipsis-multiple">迭代变量名</label>
       <div class="advanced-config-form-item">
-        <meta-input
+        <input-configurator
           v-model="state.loopItem"
           :placeholder="`默认值为：${DEFAULT_LOOP_NAME.ITEM}`"
           @update:modelValue="setLoopItem"
-        ></meta-input>
+        ></input-configurator>
       </div>
     </div>
     <div class="advnce-config">
       <label class="text-ellipsis-multiple">索引变量名</label>
       <div class="advanced-config-form-item">
-        <meta-input
+        <input-configurator
           v-model="state.loopIndex"
           :placeholder="`默认值为：${DEFAULT_LOOP_NAME.INDEX}`"
           @update:modelValue="setLoopIndex"
-        ></meta-input>
+        ></input-configurator>
       </div>
     </div>
     <div class="advnce-config">
       <label class="text-ellipsis-multiple">key</label>
       <div class="advanced-config-form-item">
         <tiny-tooltip content="建议填写循环项中的唯一值（如item.id），如果填写为数字将不保存">
-          <meta-input
+          <input-configurator
             v-model="state.loopKey"
             :placeholder="`默认为索引名：${getIndexName()}`"
             @update:modelValue="setLoopKey"
-          ></meta-input>
+          ></input-configurator>
         </tiny-tooltip>
       </div>
     </div>
@@ -73,8 +73,12 @@
 
 <script>
 import { ref, computed, reactive, watch } from 'vue'
-import { MetaInput } from '@opentiny/tiny-engine-common'
-import { CodeConfigurator, SwitchConfigurator, VariableConfigurator } from '@opentiny/tiny-engine-configurator'
+import {
+  CodeConfigurator,
+  InputConfigurator,
+  SwitchConfigurator,
+  VariableConfigurator
+} from '@opentiny/tiny-engine-configurator'
 import { useProperties, useCanvas } from '@opentiny/tiny-engine-controller'
 import { PROP_DATA_TYPE } from '@opentiny/tiny-engine-controller/js/constants'
 import { constants, utils } from '@opentiny/tiny-engine-utils'
@@ -88,7 +92,7 @@ export default {
     SwitchConfigurator,
     TinyTooltip: Tooltip,
     VariableConfigurator,
-    MetaInput,
+    InputConfigurator,
     CodeConfigurator
   },
   inheritAttrs: false,
diff --git a/packages/settings/props/src/components/index.js b/packages/settings/props/src/components/index.js
index 346ff6026f..a93444e1df 100644
--- a/packages/settings/props/src/components/index.js
+++ b/packages/settings/props/src/components/index.js
@@ -17,7 +17,7 @@ import LifeCycle from './groups/LifeCycle.vue'
 import DraggableOptions from './inputs/DraggableOptions.vue'
 import TableColumn from './groups/TableColumn.vue'
 import TablePager from './groups/TablePager.vue'
-import { MetaComponents } from '@opentiny/tiny-engine-common'
+import * as configurators from '@opentiny/tiny-engine-configurator'
 
 export default {
   CheckValue,
@@ -27,5 +27,5 @@ export default {
   TablePager,
   LifeCycle,
   DraggableOptions,
-  ...MetaComponents
+  ...configurators
 }
diff --git a/packages/settings/styles/src/components/layout/FlexBox.vue b/packages/settings/styles/src/components/layout/FlexBox.vue
index 2b32c2dadd..1d8bdef595 100644
--- a/packages/settings/styles/src/components/layout/FlexBox.vue
+++ b/packages/settings/styles/src/components/layout/FlexBox.vue
@@ -7,11 +7,11 @@
         >{{ item.title }}</span
       >
       <div>
-        <meta-radio
+        <radio-configurator
           :options="item.btnList"
           :value="item.picked"
           @pickedChange="(args) => select(args, item)"
-        ></meta-radio>
+        ></radio-configurator>
       </div>
     </div>
   </div>
@@ -22,7 +22,7 @@
 
 <script>
 import { ref, watchEffect } from 'vue'
-import { MetaRadio } from '@opentiny/tiny-engine-common'
+import { RadioConfigurator } from '@opentiny/tiny-engine-configurator'
 import { utils } from '@opentiny/tiny-engine-utils'
 import ModalMask, { useModal } from '../inputs/ModalMask.vue'
 import ResetButton from '../inputs/ResetButton.vue'
@@ -33,7 +33,7 @@ const { hyphenate } = utils
 
 export default {
   components: {
-    MetaRadio,
+    RadioConfigurator,
     ModalMask,
     ResetButton
   },
diff --git a/packages/settings/styles/src/components/layout/GridBox.vue b/packages/settings/styles/src/components/layout/GridBox.vue
index 5f07cefcf8..9a2e0a497c 100644
--- a/packages/settings/styles/src/components/layout/GridBox.vue
+++ b/packages/settings/styles/src/components/layout/GridBox.vue
@@ -47,12 +47,12 @@
               @click="openSetting(GRID_PROPERTY.GridAutoFlow, $event)"
               >方向</span
             >
-            <meta-radio
+            <radio-configurator
               :options="state.direction"
               :value="state.picked"
               :disabled="true"
               @pickedChange="select"
-            ></meta-radio>
+            ></radio-configurator>
           </div>
           <div class="dense">
             <input
@@ -106,16 +106,16 @@
           >{{ item.title }}</span
         >
         <div class="radio-wrap">
-          <meta-radio
+          <radio-configurator
             :options="item.align.list"
             :value="item.align.picked"
             @pickedChange="(args) => select(args, item.align)"
-          ></meta-radio>
-          <meta-radio
+          ></radio-configurator>
+          <radio-configurator
             :options="item.justify.list"
             :value="item.justify.picked"
             @pickedChange="(args) => select(args, item.justify)"
-          ></meta-radio>
+          ></radio-configurator>
         </div>
       </div>
     </div>
@@ -129,7 +129,8 @@
 <script>
 import { reactive, watchEffect } from 'vue'
 import { Popover, Tooltip } from '@opentiny/vue'
-import { MetaRadio, MetaListItems, MaskModal } from '@opentiny/tiny-engine-common'
+import { MetaListItems, MaskModal } from '@opentiny/tiny-engine-common'
+import { RadioConfigurator } from '@opentiny/tiny-engine-configurator'
 import { iconHelpSolid, iconCopy, iconDel } from '@opentiny/vue-icon'
 import { remove } from '@opentiny/vue-renderless/common/array'
 import ModalMask, { useModal } from '../inputs/ModalMask.vue'
@@ -140,7 +141,7 @@ import { GRID_PROPERTY } from '../../js/styleProperty'
 
 export default {
   components: {
-    MetaRadio,
+    RadioConfigurator,
     ModalMask,
     ResetButton,
     MetaListItems,
diff --git a/packages/settings/styles/src/components/layout/LayoutGroup.vue b/packages/settings/styles/src/components/layout/LayoutGroup.vue
index 7b74316505..c3736e97cd 100644
--- a/packages/settings/styles/src/components/layout/LayoutGroup.vue
+++ b/packages/settings/styles/src/components/layout/LayoutGroup.vue
@@ -2,7 +2,7 @@
   <div class="display-row">
     <div :class="['display-label', { selected: display }]" @click="openDisplayModal($event)">排布</div>
     <div class="display-content">
-      <meta-radio :options="layoutOpts" :value="picked" @pickedChange="select"></meta-radio>
+      <radio-configurator :options="layoutOpts" :value="picked" @pickedChange="select"></radio-configurator>
     </div>
   </div>
 
@@ -14,14 +14,14 @@
 <script>
 import { ref, watch } from 'vue'
 import { DISPLAY_TYPE } from '../../js/cssType'
-import { MetaRadio } from '@opentiny/tiny-engine-common'
+import { RadioConfigurator } from '@opentiny/tiny-engine-configurator'
 import useEvent from '../../js/useEvent'
 import ResetButton from '../inputs/ResetButton.vue'
 import ModalMask, { useModal } from '../inputs/ModalMask.vue'
 
 export default {
   components: {
-    MetaRadio,
+    RadioConfigurator,
     ModalMask,
     ResetButton
   },
diff --git a/packages/settings/styles/src/components/position/PositionGroup.vue b/packages/settings/styles/src/components/position/PositionGroup.vue
index f103ff021e..3767870466 100644
--- a/packages/settings/styles/src/components/position/PositionGroup.vue
+++ b/packages/settings/styles/src/components/position/PositionGroup.vue
@@ -8,11 +8,11 @@
       定位
     </div>
     <div class="position-select">
-      <meta-select
+      <select-configurator
         :modelValue="state.selectValue"
         :options="selectOptions"
         @update:modelValue="selectPosition"
-      ></meta-select>
+      ></select-configurator>
     </div>
     <div v-if="state.showSetting" class="position-dropdown">
       <div v-if="state.showSettingIcon" class="tooltip-wrap">
@@ -220,7 +220,7 @@
 <script>
 import { reactive, watchEffect } from 'vue'
 import { Tooltip } from '@opentiny/vue'
-import { MetaSelect } from '@opentiny/tiny-engine-common'
+import { SelectConfigurator } from '@opentiny/tiny-engine-configurator'
 import { push } from '@opentiny/vue-renderless/common/array'
 import ModalMask, { useModal } from '../inputs/ModalMask.vue'
 import SpacingSetting from '../spacing/SpacingSetting.vue'
@@ -233,7 +233,7 @@ export default {
   components: {
     ModalMask,
     ResetButton,
-    MetaSelect,
+    SelectConfigurator,
     NumericSelect,
     SpacingSetting,
     TinyTooltip: Tooltip
@@ -400,18 +400,7 @@ export default {
       }
     }
 
-    const getDirectionText = (name) => state.directionText[name] || getPropertyText(name) || 'auto'
-
-    const clickDirection = (styleName, event) => {
-      state.activeArr = push(state.activeArr, styleName)
-      state.className = styleName
-      state.show = true
-      setPosition(event)
-      openDirectionSetting(POSITION_PROPERTY.Position, styleName)
-    }
-
     const openDirectionSetting = (type, styleName) => {
-
       state.property = {
         type,
         name: styleName,
@@ -421,6 +410,16 @@ export default {
       state.showDirectionModal = true
     }
 
+    const getDirectionText = (name) => state.directionText[name] || getPropertyText(name) || 'auto'
+
+    const clickDirection = (styleName, event) => {
+      state.activeArr = push(state.activeArr, styleName)
+      state.className = styleName
+      state.show = true
+      setPosition(event)
+      openDirectionSetting(POSITION_PROPERTY.Position, styleName)
+    }
+
     const closeDirectionModal = () => {
       state.show = false
       state.showDirectionModal = false
diff --git a/packages/settings/styles/src/components/size/SizeGroup.vue b/packages/settings/styles/src/components/size/SizeGroup.vue
index 84165a5b15..6a0b8cfd72 100644
--- a/packages/settings/styles/src/components/size/SizeGroup.vue
+++ b/packages/settings/styles/src/components/size/SizeGroup.vue
@@ -138,7 +138,11 @@
       适应
     </div>
     <div class="fit-select">
-      <meta-select :modelValue="state.value" :options="selectOptions" @update:modelValue="selectFit"></meta-select>
+      <select-configurator
+        :modelValue="state.value"
+        :options="selectOptions"
+        @update:modelValue="selectFit"
+      ></select-configurator>
     </div>
     <tiny-tooltip :effect="effect" :disabled="state.disabled" :placement="placement" content="Object position 设置">
       <tiny-popover
@@ -209,7 +213,8 @@
 <script>
 import { reactive, ref } from 'vue'
 import { Tooltip, Popover, Input } from '@opentiny/vue'
-import { MetaSelect, MaskModal } from '@opentiny/tiny-engine-common'
+import { MaskModal } from '@opentiny/tiny-engine-common'
+import { SelectConfigurator } from '@opentiny/tiny-engine-configurator'
 import { iconEllipsis } from '@opentiny/vue-icon'
 import ModalMask, { useModal } from '../inputs/ModalMask.vue'
 import ResetButton from '../inputs/ResetButton.vue'
@@ -224,7 +229,7 @@ export default {
     ModalMask,
     ResetButton,
     NumericSelect,
-    MetaSelect,
+    SelectConfigurator,
     MaskModal,
     TinyPopover: Popover,
     TinyInput: Input,

From dd4ceb7c53bf05878ab6b033f3c4c3bae0faa4b3 Mon Sep 17 00:00:00 2001
From: gene9831 <pacify.98@gmail.com>
Date: Thu, 27 Jun 2024 05:02:57 -0700
Subject: [PATCH 2/2] refactor: rename meta components

---
 designer-demo/public/mock/bundle.json         | 112 +++++-----
 mockServer/assets/json/bundle.json            |  72 +++----
 mockServer/src/services/appinfo.json          | 196 +++++++++---------
 packages/canvas/test/jsslot.json              |   6 +-
 packages/common/component/ConfigItem.vue      |  11 +-
 packages/common/component/MetaChildItem.vue   |   3 +-
 packages/common/component/MetaModalItem.vue   |   1 -
 packages/common/component/MetaPopover.vue     |   5 +-
 packages/configurator/src/index.js            |   2 +-
 .../number-configurator/NumberConfigurator.md |   2 +-
 .../RelatedColumnsConfigurator.vue            |   2 +-
 .../template/designer/public/mock/bundle.json |  10 +-
 .../plugins/block/src/BlockPropertyForm.vue   |  12 +-
 .../plugins/block/src/js/blockPropertyForm.js |   8 +-
 .../plugins/block/src/js/blockSetting.jsx     |  52 ++---
 .../src/assets/materials/ng-bundle.json       |   4 +-
 .../assets/materials/ng-components/table.json |   2 +-
 .../design/src/components/SettingPanel.vue    |   4 +-
 .../settings/design/src/convertToSchema.js    |  10 +-
 .../settings/design/src/schemas/button.json   |   4 +-
 .../design/src/schemas/checkboxgroup.json     |   4 +-
 .../settings/design/src/schemas/form.json     |   6 +-
 .../settings/design/src/schemas/grid.json     |  28 +--
 .../design/src/schemas/gridcolumn.json        |   8 +-
 .../settings/design/src/schemas/input.json    |   2 +-
 .../settings/design/src/schemas/pager.json    |   2 +-
 .../design/src/schemas/popeditor.json         |   6 +-
 .../settings/design/src/schemas/popover.json  |   4 +-
 .../settings/design/src/schemas/select.json   |   2 +-
 .../settings/design/src/schemas/tabs.json     |   2 +-
 .../design/src/schemas/time-line.json         |   2 +-
 .../settings/design/src/schemas/tooltip.json  |   2 +-
 .../settings/design/src/schemas/tree.json     |   8 +-
 packages/settings/design/src/store/index.js   |  40 ++--
 .../props/src/composable/useProperties.js     |   8 +-
 .../case1_normal/input/blocks.schema.json     |   4 +-
 .../testcases/sfc/case01/blocks.schema.json   |   4 +-
 37 files changed, 325 insertions(+), 325 deletions(-)

diff --git a/designer-demo/public/mock/bundle.json b/designer-demo/public/mock/bundle.json
index da15069b43..6cd511432d 100644
--- a/designer-demo/public/mock/bundle.json
+++ b/designer-demo/public/mock/bundle.json
@@ -158,7 +158,7 @@
                     "labelPosition": "top",
                     "type": "string",
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "device": []
@@ -680,7 +680,7 @@
                     "labelPosition": "top",
                     "type": "object",
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -703,7 +703,7 @@
                     "labelPosition": "top",
                     "type": "object",
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -1221,7 +1221,7 @@
                     "labelPosition": "top",
                     "type": "object",
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -1487,7 +1487,7 @@
                     "labelPosition": "top",
                     "type": "array",
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -1559,7 +1559,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {}
                             }
                           },
@@ -1722,7 +1722,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {}
                             }
                           },
@@ -1741,7 +1741,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -1762,7 +1762,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -1804,7 +1804,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "dataType": "JSFunction"
                               }
@@ -1956,7 +1956,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {}
                             }
                           },
@@ -1996,7 +1996,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -2057,7 +2057,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {}
                             }
                           },
@@ -2077,7 +2077,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -2087,7 +2087,7 @@
                       }
                     ],
                     "widget": {
-                      "component": "MetaTableColumns",
+                      "component": "TableColumnsConfigurator",
                       "props": {
                         "type": "object",
                         "textField": "label",
@@ -2352,7 +2352,7 @@
                     "cols": 12,
                     "labelPosition": "top",
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "device": []
@@ -2955,7 +2955,7 @@
                     "cols": 12,
                     "bindState": false,
                     "widget": {
-                      "component": "MetaContainer",
+                      "component": "ContainerConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -4635,7 +4635,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -4790,7 +4790,7 @@
                     },
                     "cols": 12,
                     "widget": {
-                      "component": "MetaLayoutGrid",
+                      "component": "LayoutGridConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -5082,7 +5082,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -5102,7 +5102,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -5716,7 +5716,7 @@
                     "readOnly": false,
                     "disabled": false,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -6053,7 +6053,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -6117,7 +6117,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -6806,7 +6806,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -8095,7 +8095,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8559,7 +8559,7 @@
                     "cols": 12,
                     "bindState": false,
                     "widget": {
-                      "component": "MetaContainer",
+                      "component": "ContainerConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8955,7 +8955,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -9413,7 +9413,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -9450,7 +9450,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaBindI18n",
+                              "component": "I18nConfigurator",
                               "props": {}
                             }
                           },
@@ -9559,7 +9559,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "dataType": "JSFunction"
                               }
@@ -9634,7 +9634,7 @@
                             "disabled": false,
                             "cols": 12,
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -9656,7 +9656,7 @@
                             "disabled": false,
                             "cols": 12,
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -9705,7 +9705,7 @@
                       }
                     ],
                     "widget": {
-                      "component": "MetaArrayItem",
+                      "component": "ArrayItemConfigurator",
                       "props": {
                         "type": "object",
                         "textField": "title",
@@ -9733,7 +9733,7 @@
                     "onChange": "this.delProp('data')",
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "name": "fetchData",
                         "dataType": "JSExpression"
@@ -9760,7 +9760,7 @@
                       }
                     },
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "name": "pager",
                         "dataType": "JSExpression"
@@ -9824,7 +9824,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "dataType": "JSExpression"
                       }
@@ -9846,7 +9846,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -9866,7 +9866,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -9885,7 +9885,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -10041,7 +10041,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -10081,7 +10081,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -10375,7 +10375,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -10679,7 +10679,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -10699,7 +10699,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -10719,7 +10719,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -10968,7 +10968,7 @@
                     ],
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -11049,7 +11049,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -11069,7 +11069,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -11117,7 +11117,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -11366,7 +11366,7 @@
                     ],
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -12008,7 +12008,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -12193,7 +12193,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -12251,7 +12251,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -12608,7 +12608,7 @@
                     "readOnly": false,
                     "disabled": false,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -12628,7 +12628,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
diff --git a/mockServer/assets/json/bundle.json b/mockServer/assets/json/bundle.json
index ee85b4c810..bd886eaba6 100644
--- a/mockServer/assets/json/bundle.json
+++ b/mockServer/assets/json/bundle.json
@@ -241,7 +241,7 @@
                     "cols": 12,
                     "bindState": false,
                     "widget": {
-                      "component": "MetaContainer",
+                      "component": "ContainerConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -1914,7 +1914,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -2067,7 +2067,7 @@
                     },
                     "cols": 12,
                     "widget": {
-                      "component": "MetaLayoutGrid",
+                      "component": "LayoutGridConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -2359,7 +2359,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -2379,7 +2379,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -2993,7 +2993,7 @@
                     "readOnly": false,
                     "disabled": false,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -3330,7 +3330,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -3394,7 +3394,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -4083,7 +4083,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -5372,7 +5372,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -5836,7 +5836,7 @@
                     "cols": 12,
                     "bindState": false,
                     "widget": {
-                      "component": "MetaContainer",
+                      "component": "ContainerConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -6232,7 +6232,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -6688,7 +6688,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "language": "json"
                       }
@@ -6725,7 +6725,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaBindI18n",
+                              "component": "I18nConfigurator",
                               "props": {}
                             }
                           },
@@ -6834,7 +6834,7 @@
                               }
                             },
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "dataType": "JSFunction"
                               }
@@ -6909,7 +6909,7 @@
                             "disabled": false,
                             "cols": 12,
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -6931,7 +6931,7 @@
                             "disabled": false,
                             "cols": 12,
                             "widget": {
-                              "component": "MetaCodeEditor",
+                              "component": "CodeConfigurator",
                               "props": {
                                 "language": "json"
                               }
@@ -6980,7 +6980,7 @@
                       }
                     ],
                     "widget": {
-                      "component": "MetaArrayItem",
+                      "component": "ArrayItemConfigurator",
                       "props": {
                         "type": "object",
                         "textField": "title",
@@ -7008,7 +7008,7 @@
                     "onChange": "this.delProp('data')",
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "name": "fetchData",
                         "dataType": "JSExpression"
@@ -7035,7 +7035,7 @@
                       }
                     },
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "name": "pager",
                         "dataType": "JSExpression"
@@ -7099,7 +7099,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {
                         "dataType": "JSExpression"
                       }
@@ -7121,7 +7121,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7141,7 +7141,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7160,7 +7160,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7316,7 +7316,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7356,7 +7356,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7650,7 +7650,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7954,7 +7954,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7974,7 +7974,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -7994,7 +7994,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8243,7 +8243,7 @@
                     ],
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8302,7 +8302,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8322,7 +8322,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8370,7 +8370,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8619,7 +8619,7 @@
                     ],
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -9237,7 +9237,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
diff --git a/mockServer/src/services/appinfo.json b/mockServer/src/services/appinfo.json
index a288c43d4e..72f1bf0687 100644
--- a/mockServer/src/services/appinfo.json
+++ b/mockServer/src/services/appinfo.json
@@ -4534,7 +4534,7 @@
                         ],
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -4593,7 +4593,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -4613,7 +4613,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -4661,7 +4661,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -5183,7 +5183,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -6223,7 +6223,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -6865,7 +6865,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -7630,7 +7630,7 @@
                         },
                         "cols": 12,
                         "widget": {
-                          "component": "MetaLayoutGrid",
+                          "component": "LayoutGridConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -8591,7 +8591,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaBindI18n",
+                          "component": "I18nConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -8663,7 +8663,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaBindI18n",
+                          "component": "I18nConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -10683,7 +10683,7 @@
                         ],
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -11584,7 +11584,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -11604,7 +11604,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -11910,7 +11910,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {
                             "language": "json"
                           }
@@ -11947,7 +11947,7 @@
                                   }
                                 },
                                 "widget": {
-                                  "component": "MetaBindI18n",
+                                  "component": "I18nConfigurator",
                                   "props": {}
                                 }
                               },
@@ -12056,7 +12056,7 @@
                                   }
                                 },
                                 "widget": {
-                                  "component": "MetaCodeEditor",
+                                  "component": "CodeConfigurator",
                                   "props": {
                                     "dataType": "JSFunction"
                                   }
@@ -12131,7 +12131,7 @@
                                 "disabled": false,
                                 "cols": 12,
                                 "widget": {
-                                  "component": "MetaCodeEditor",
+                                  "component": "CodeConfigurator",
                                   "props": {
                                     "language": "json"
                                   }
@@ -12153,7 +12153,7 @@
                                 "disabled": false,
                                 "cols": 12,
                                 "widget": {
-                                  "component": "MetaCodeEditor",
+                                  "component": "CodeConfigurator",
                                   "props": {}
                                 },
                                 "description": {
@@ -12200,7 +12200,7 @@
                           }
                         ],
                         "widget": {
-                          "component": "MetaArrayItem",
+                          "component": "ArrayItemConfigurator",
                           "props": {
                             "type": "object",
                             "textField": "title",
@@ -12228,7 +12228,7 @@
                         "onChange": "this.delProp('data')",
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {
                             "name": "fetchData"
                           }
@@ -12254,7 +12254,7 @@
                           }
                         },
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {
                             "name": "pager"
                           }
@@ -12317,7 +12317,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {
                             "dataType": "JSExpression"
                           }
@@ -12339,7 +12339,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -12359,7 +12359,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -12378,7 +12378,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -12530,7 +12530,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -12570,7 +12570,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -13503,7 +13503,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -13855,7 +13855,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {
                             "language": "json"
                           }
@@ -14253,7 +14253,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -15006,7 +15006,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -15026,7 +15026,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -15046,7 +15046,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -15330,7 +15330,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -15519,7 +15519,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -15686,7 +15686,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -15820,7 +15820,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -16069,7 +16069,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -16513,7 +16513,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -16532,7 +16532,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -16551,7 +16551,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -16608,7 +16608,7 @@
                         "disabled": false,
                         "cols": 12,
                         "widget": {
-                          "component": "MetaCodeEditor",
+                          "component": "CodeConfigurator",
                           "props": {}
                         },
                         "description": {
@@ -16838,7 +16838,7 @@
                   "labelPosition": "top",
                   "type": "string",
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "device": []
@@ -17360,7 +17360,7 @@
                   "labelPosition": "top",
                   "type": "object",
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -17383,7 +17383,7 @@
                   "labelPosition": "top",
                   "type": "object",
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -17901,7 +17901,7 @@
                   "labelPosition": "top",
                   "type": "object",
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -18167,7 +18167,7 @@
                   "labelPosition": "top",
                   "type": "array",
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -18239,7 +18239,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {}
                           }
                         },
@@ -18402,7 +18402,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {}
                           }
                         },
@@ -18421,7 +18421,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {
                               "language": "json"
                             }
@@ -18442,7 +18442,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {
                               "language": "json"
                             }
@@ -18484,7 +18484,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {}
                           }
                         },
@@ -18634,7 +18634,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {}
                           }
                         },
@@ -18674,7 +18674,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {
                               "language": "json"
                             }
@@ -18735,7 +18735,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {}
                           }
                         },
@@ -18755,7 +18755,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {
                               "language": "json"
                             }
@@ -18765,7 +18765,7 @@
                     }
                   ],
                   "widget": {
-                    "component": "MetaTableColumns",
+                    "component": "TableColumnsConfigurator",
                     "props": {
                       "type": "object",
                       "textField": "title",
@@ -19030,7 +19030,7 @@
                   "cols": 12,
                   "labelPosition": "top",
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "device": []
@@ -19633,7 +19633,7 @@
                   "cols": 12,
                   "bindState": false,
                   "widget": {
-                    "component": "MetaContainer",
+                    "component": "ContainerConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -21306,7 +21306,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -21461,7 +21461,7 @@
                   },
                   "cols": 12,
                   "widget": {
-                    "component": "MetaLayoutGrid",
+                    "component": "LayoutGridConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -21753,7 +21753,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -21773,7 +21773,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -22387,7 +22387,7 @@
                   "readOnly": false,
                   "disabled": false,
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -22724,7 +22724,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -22788,7 +22788,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -23477,7 +23477,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -24766,7 +24766,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -25230,7 +25230,7 @@
                   "cols": 12,
                   "bindState": false,
                   "widget": {
-                    "component": "MetaContainer",
+                    "component": "ContainerConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -25626,7 +25626,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -26082,7 +26082,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -26119,7 +26119,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaBindI18n",
+                            "component": "I18nConfigurator",
                             "props": {}
                           }
                         },
@@ -26228,7 +26228,7 @@
                             }
                           },
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {
                               "dataType": "JSFunction"
                             }
@@ -26303,7 +26303,7 @@
                           "disabled": false,
                           "cols": 12,
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {
                               "language": "json"
                             }
@@ -26325,7 +26325,7 @@
                           "disabled": false,
                           "cols": 12,
                           "widget": {
-                            "component": "MetaCodeEditor",
+                            "component": "CodeConfigurator",
                             "props": {
                               "language": "json"
                             }
@@ -26374,7 +26374,7 @@
                     }
                   ],
                   "widget": {
-                    "component": "MetaArrayItem",
+                    "component": "ArrayItemConfigurator",
                     "props": {
                       "type": "object",
                       "textField": "title",
@@ -26402,7 +26402,7 @@
                   "onChange": "this.delProp('data')",
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "name": "fetchData",
                       "dataType": "JSExpression"
@@ -26429,7 +26429,7 @@
                     }
                   },
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "name": "pager",
                       "dataType": "JSExpression"
@@ -26493,7 +26493,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "dataType": "JSExpression"
                     }
@@ -26515,7 +26515,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -26535,7 +26535,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -26554,7 +26554,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -26710,7 +26710,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -26750,7 +26750,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27044,7 +27044,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27348,7 +27348,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27368,7 +27368,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27388,7 +27388,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27637,7 +27637,7 @@
                   ],
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27696,7 +27696,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27716,7 +27716,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -27764,7 +27764,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -28013,7 +28013,7 @@
                   ],
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {
                       "language": "json"
                     }
@@ -28633,7 +28633,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaCodeEditor",
+                    "component": "CodeConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -28818,7 +28818,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -28876,7 +28876,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -29233,7 +29233,7 @@
                   "readOnly": false,
                   "disabled": false,
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "description": {
@@ -29253,7 +29253,7 @@
                   "disabled": false,
                   "cols": 12,
                   "widget": {
-                    "component": "MetaBindI18n",
+                    "component": "I18nConfigurator",
                     "props": {}
                   },
                   "description": {
diff --git a/packages/canvas/test/jsslot.json b/packages/canvas/test/jsslot.json
index 8a6cf5b668..12a57b3ee5 100644
--- a/packages/canvas/test/jsslot.json
+++ b/packages/canvas/test/jsslot.json
@@ -30,7 +30,7 @@
               "zh_CN": "是否编辑配置项"
             },
             "widget": {
-              "component": "MetaCodeEditor"
+              "component": "CodeConfigurator"
             },
             "cols": 12,
             "rules": [],
@@ -55,7 +55,7 @@
               "zh_CN": "表格数据配置项"
             },
             "widget": {
-              "component": "MetaCodeEditor"
+              "component": "CodeConfigurator"
             },
             "cols": 12,
             "rules": [],
@@ -79,7 +79,7 @@
               "zh_CN": "下拉框数据配置项"
             },
             "widget": {
-              "component": "MetaCodeEditor"
+              "component": "CodeConfigurator"
             },
             "cols": 12,
             "rules": [],
diff --git a/packages/common/component/ConfigItem.vue b/packages/common/component/ConfigItem.vue
index 84b0eef04a..be0127ba15 100644
--- a/packages/common/component/ConfigItem.vue
+++ b/packages/common/component/ConfigItem.vue
@@ -192,7 +192,9 @@ export default {
         !props.onlyEdit &&
         propLabel.value &&
         (isBindingState.value ||
-          !['MetaGroupItem', 'MetaArrayItem', 'MetaRelatedColumns'].includes(widget.value.component)) &&
+          !['GroupItemConfigurator', 'ArrayItemConfigurator', 'RelatedColumnsConfigurator'].includes(
+            widget.value.component
+          )) &&
         !multiType.value
     )
     const propDescription = computed(
@@ -237,7 +239,7 @@ export default {
         return props.property.labelPosition
       }
 
-      if (['MetaSwitch', 'SwitchConfigurator'].includes(props.property.widget?.component)) {
+      if (['SwitchConfigurator', 'SwitchConfigurator'].includes(props.property.widget?.component)) {
         return 'left'
       }
 
@@ -275,7 +277,7 @@ export default {
 
         if (
           property !== 'name' &&
-          ['SelectIconConfigurator', 'MetaSelectIcon'].includes(props.property.widget.component)
+          ['SelectIconConfigurator', 'SelectIconConfigurator'].includes(props.property.widget.component)
         ) {
           // icon以组件形式传入，实现类似:icon="IconPlus"的图标配置（排除Icon组件本身）
           value = {
@@ -451,7 +453,8 @@ export default {
       }
     }
 
-    const isRelatedComponents = (component) => ['MetaRelatedEditor', 'MetaRelatedColumns'].includes(component)
+    const isRelatedComponents = (component) =>
+      ['RelatedEditorConfigurator', 'RelatedColumnsConfigurator'].includes(component)
 
     const showBindState = computed(
       () => !props.onlyEdit && (isBindingState.value || isLinked.value) && !isRelatedComponents(widget.value.component)
diff --git a/packages/common/component/MetaChildItem.vue b/packages/common/component/MetaChildItem.vue
index 3c8a6a82e2..1278de0e24 100644
--- a/packages/common/component/MetaChildItem.vue
+++ b/packages/common/component/MetaChildItem.vue
@@ -20,7 +20,6 @@ import { computed } from 'vue'
 import ConfigItem from './ConfigItem.vue'
 
 export default {
-  name: 'MetaChildItem',
   components: {
     ConfigItem
   },
@@ -41,7 +40,7 @@ export default {
   },
   setup(props, { emit }) {
     const properties = computed(() => {
-      const result = [...props.meta?.properties?.[0]?.content]
+      const result = [...(props.meta?.properties?.[0]?.content || [])]
       const propsModelValue = props.meta.widget.props?.modelValue
 
       if (result.length && propsModelValue) {
diff --git a/packages/common/component/MetaModalItem.vue b/packages/common/component/MetaModalItem.vue
index e7343bb635..9347f06e27 100644
--- a/packages/common/component/MetaModalItem.vue
+++ b/packages/common/component/MetaModalItem.vue
@@ -32,7 +32,6 @@ import { reactive, computed } from 'vue'
 import MetaChildItem from './MetaChildItem.vue'
 
 export default {
-  name: 'MetaModalItem',
   components: {
     MetaChildItem,
     TinyButton: Button,
diff --git a/packages/common/component/MetaPopover.vue b/packages/common/component/MetaPopover.vue
index d396c2f928..fca51a973f 100644
--- a/packages/common/component/MetaPopover.vue
+++ b/packages/common/component/MetaPopover.vue
@@ -17,7 +17,6 @@ import { Popover, Button } from '@opentiny/vue'
 import MetaChildItem from './MetaChildItem.vue'
 
 export default {
-  name: 'MetaPopover',
   components: {
     MetaChildItem,
     TinyPopover: Popover,
@@ -27,10 +26,10 @@ export default {
   props: {
     meta: {
       type: Object,
-      default: {}
+      default: () => ({})
     }
   },
-  setup(props, { attrs, emit }) {
+  setup(props, { emit }) {
     const title = computed(() => `编辑${props.meta.label?.text?.zh_CN || props.meta.property || '属性'}`)
     const onValueChange = ({ propertyKey, propertyValue }) => {
       const newPropertyValue = { ...props.meta.widget?.props?.modelValue, [propertyKey]: propertyValue }
diff --git a/packages/configurator/src/index.js b/packages/configurator/src/index.js
index 8296402477..77f5787bcd 100644
--- a/packages/configurator/src/index.js
+++ b/packages/configurator/src/index.js
@@ -62,7 +62,7 @@ export {
   SwitchConfigurator,
   TableColumnsConfigurator,
   VariableConfigurator,
-  // TODO Meta别名，后续删除
+  // 暂时保留Meta开头的旧组件名
   ArrayItemConfigurator as MetaArrayItem,
   I18nConfigurator as MetaBindI18n,
   VariableConfigurator as MetaBindVariable,
diff --git a/packages/configurator/src/number-configurator/NumberConfigurator.md b/packages/configurator/src/number-configurator/NumberConfigurator.md
index 4826bcdf76..3b627ff79c 100644
--- a/packages/configurator/src/number-configurator/NumberConfigurator.md
+++ b/packages/configurator/src/number-configurator/NumberConfigurator.md
@@ -1,4 +1,4 @@
-# MetaNumber
+# NumberConfigurator
 
 ## 属性
 
diff --git a/packages/configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue b/packages/configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue
index 1c0165004f..3159c06f99 100644
--- a/packages/configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue
+++ b/packages/configurator/src/related-columns-configurator/RelatedColumnsConfigurator.vue
@@ -36,7 +36,7 @@ export default {
 
     const CONSTANTS = {
       FIELD: 'field',
-      COMPONENT: 'MetaSelect'
+      COMPONENT: 'SelectConfigurator'
     }
 
     const saveValue = (value) => emit('update:modelValue', value)
diff --git a/packages/engine-cli/template/designer/public/mock/bundle.json b/packages/engine-cli/template/designer/public/mock/bundle.json
index e082730a0f..6cd511432d 100644
--- a/packages/engine-cli/template/designer/public/mock/bundle.json
+++ b/packages/engine-cli/template/designer/public/mock/bundle.json
@@ -2087,7 +2087,7 @@
                       }
                     ],
                     "widget": {
-                      "component": "MetaTableColumns",
+                      "component": "TableColumnsConfigurator",
                       "props": {
                         "type": "object",
                         "textField": "label",
@@ -2955,7 +2955,7 @@
                     "cols": 12,
                     "bindState": false,
                     "widget": {
-                      "component": "MetaContainer",
+                      "component": "ContainerConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -4790,7 +4790,7 @@
                     },
                     "cols": 12,
                     "widget": {
-                      "component": "MetaLayoutGrid",
+                      "component": "LayoutGridConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -8559,7 +8559,7 @@
                     "cols": 12,
                     "bindState": false,
                     "widget": {
-                      "component": "MetaContainer",
+                      "component": "ContainerConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -9705,7 +9705,7 @@
                       }
                     ],
                     "widget": {
-                      "component": "MetaArrayItem",
+                      "component": "ArrayItemConfigurator",
                       "props": {
                         "type": "object",
                         "textField": "title",
diff --git a/packages/plugins/block/src/BlockPropertyForm.vue b/packages/plugins/block/src/BlockPropertyForm.vue
index 8556474635..56c02f7c0d 100644
--- a/packages/plugins/block/src/BlockPropertyForm.vue
+++ b/packages/plugins/block/src/BlockPropertyForm.vue
@@ -18,7 +18,7 @@
           @change="handleChangeWidgetComponent"
         ></tiny-select>
         <div class="global-desc-info">
-          区块发布后使用当前区块时，会在属性面板中使用当前选择的组件（例如MetaSelect），来配置该属性
+          区块发布后使用当前区块时，会在属性面板中使用当前选择的组件（例如SelectConfigurator），来配置该属性
         </div>
       </tiny-form-item>
       <tiny-form-item label="属性面板组件属性">
@@ -172,15 +172,15 @@ export default {
           ...property.value.widget.props
         },
         component:
-          property.value.widget.component === META_COMPONENTS_ENUM.MetaArrayItem
-            ? META_COMPONENTS_ENUM.MetaCodeEditor
+          property.value.widget.component === META_COMPONENTS_ENUM.ArrayItemConfigurator
+            ? META_COMPONENTS_ENUM.CodeConfigurator
             : property.value.widget.component
       }
     })
 
     const componentPropsTips = ref({
       title: '该选项用于配置，当前选择的属性面板组件，其对应的props参数',
-      demo: '例如MetaSelect的props参数可以是 { options: [{ "label": "xx", "value": "xx"}, ...] }'
+      demo: '例如SelectConfigurator的props参数可以是 { options: [{ "label": "xx", "value": "xx"}, ...] }'
     })
     watch(
       () => getEditProperty(),
@@ -203,7 +203,9 @@ export default {
               modelValue: defaultValue
             },
             component:
-              component === META_COMPONENTS_ENUM.MetaArrayItem ? META_COMPONENTS_ENUM.MetaCodeEditor : component
+              component === META_COMPONENTS_ENUM.ArrayItemConfigurator
+                ? META_COMPONENTS_ENUM.CodeConfigurator
+                : component
           }
         }
 
diff --git a/packages/plugins/block/src/js/blockPropertyForm.js b/packages/plugins/block/src/js/blockPropertyForm.js
index 09e3b268fb..5e1ea5c905 100644
--- a/packages/plugins/block/src/js/blockPropertyForm.js
+++ b/packages/plugins/block/src/js/blockPropertyForm.js
@@ -88,13 +88,13 @@ export const type = computed({
 export const widgetComponent = computed({
   get() {
     const property = getEditProperty()
-    return property?.widget?.component || 'MetaInput'
+    return property?.widget?.component || 'InputConfigurator'
   },
   set(value) {
     const property = getEditProperty()
     property.widget = property.widget || {}
     property.widget.component = value
-    showArrayItemConfig.value = type.value === META_TYPES.array && value === META_COMPONENTS_ENUM.MetaArrayItem
+    showArrayItemConfig.value = type.value === META_TYPES.array && value === META_COMPONENTS_ENUM.ArrayItemConfigurator
 
     initSubProperties()
   }
@@ -192,7 +192,7 @@ export const handleAddItem = () => {
   arrayConfig.value.push({
     property: 'customProperty',
     type: 'string',
-    component: 'MetaInput',
+    component: 'InputConfigurator',
     props: {},
     defaultValue: '',
     description: ''
@@ -289,7 +289,7 @@ watch(
     }))
 
     showArrayItemConfig.value =
-      type.value === META_TYPES.array && widgetComponent.value === META_COMPONENTS_ENUM.MetaArrayItem
+      type.value === META_TYPES.array && widgetComponent.value === META_COMPONENTS_ENUM.ArrayItemConfigurator
 
     if (property) {
       widgetComponent.value = property.widget.component
diff --git a/packages/plugins/block/src/js/blockSetting.jsx b/packages/plugins/block/src/js/blockSetting.jsx
index 256f4015b4..e58188525a 100644
--- a/packages/plugins/block/src/js/blockSetting.jsx
+++ b/packages/plugins/block/src/js/blockSetting.jsx
@@ -94,24 +94,24 @@ export const META_TYPES_OPTIONS = Object.entries(META_TYPES).map(([key, value])
 
 // 组件的枚举
 export const META_COMPONENTS_ENUM = {
-  MetaCodeEditor: 'MetaCodeEditor',
-  MetaArrayItem: 'MetaArrayItem',
-  MetaInput: 'MetaInput',
-  MetaSelect: 'MetaSelect',
-  MetaBindI18n: 'MetaBindI18n',
-  MetaNumber: 'MetaNumber',
-  MetaJsSlot: 'MetaJsSlot',
+  CodeConfigurator: 'CodeConfigurator',
+  ArrayItemConfigurator: 'ArrayItemConfigurator',
+  InputConfigurator: 'InputConfigurator',
+  SelectConfigurator: 'SelectConfigurator',
+  I18nConfigurator: 'I18nConfigurator',
+  NumberConfigurator: 'NumberConfigurator',
+  JsSlotConfigurator: 'JsSlotConfigurator',
   SwitchConfigurator: 'SwitchConfigurator'
 }
 
 // 每个值类型可选的编辑器类型
 export const META_COMPONENT_LIST = {
-  [META_TYPES.array]: ['MetaCodeEditor', 'MetaArrayItem', 'MetaRelatedColumns', 'MetaRelatedEditor'],
-  [META_TYPES.string]: ['MetaInput', 'MetaSelect', 'MetaBindI18n'],
-  [META_TYPES.number]: ['MetaNumber'],
-  [META_TYPES.object]: ['MetaCodeEditor', 'MetaJsSlot'],
+  [META_TYPES.array]: ['CodeConfigurator', 'ArrayItemConfigurator', 'RelatedColumnsConfigurator', 'RelatedEditorConfigurator'],
+  [META_TYPES.string]: ['InputConfigurator', 'SelectConfigurator', 'I18nConfigurator'],
+  [META_TYPES.number]: ['NumberConfigurator'],
+  [META_TYPES.object]: ['CodeConfigurator', 'JsSlotConfigurator'],
   [META_TYPES.boolean]: ['SwitchConfigurator'],
-  [META_TYPES.function]: ['MetaCodeEditor']
+  [META_TYPES.function]: ['CodeConfigurator']
 }
 
 // 数组类型 item 的配置
@@ -127,7 +127,7 @@ export const DEFAULT_ARRAY_CONFIG = [
     },
     labelPosition: 'top',
     widget: {
-      component: 'MetaInput',
+      component: 'InputConfigurator',
       props: {
         modelValue: ''
       }
@@ -144,7 +144,7 @@ export const DEFAULT_ARRAY_CONFIG = [
     },
     labelPosition: 'top',
     widget: {
-      component: 'MetaSelect',
+      component: 'SelectConfigurator',
       props: {
         options: META_TYPES_OPTIONS,
         modelValue: ''
@@ -154,7 +154,7 @@ export const DEFAULT_ARRAY_CONFIG = [
   {
     property: 'component',
     type: META_TYPES.string,
-    defaultValue: 'MetaInput',
+    defaultValue: 'InputConfigurator',
     label: {
       text: {
         zh_CN: '设计器'
@@ -162,10 +162,10 @@ export const DEFAULT_ARRAY_CONFIG = [
     },
     labelPosition: 'top',
     widget: {
-      component: 'MetaSelect',
+      component: 'SelectConfigurator',
       props: {
         options: META_COMPONENT_LIST[META_TYPES.string],
-        modelValue: 'MetaInput'
+        modelValue: 'InputConfigurator'
       }
     }
   },
@@ -180,7 +180,7 @@ export const DEFAULT_ARRAY_CONFIG = [
     },
     labelPosition: 'top',
     widget: {
-      component: 'MetaCodeEditor',
+      component: 'CodeConfigurator',
       props: {
         modelValue: '{}',
         language: 'json'
@@ -198,7 +198,7 @@ export const DEFAULT_ARRAY_CONFIG = [
     },
     labelPosition: 'top',
     widget: {
-      component: 'MetaCodeEditor',
+      component: 'CodeConfigurator',
       props: {
         modelValue: ''
       }
@@ -215,7 +215,7 @@ export const DEFAULT_ARRAY_CONFIG = [
     },
     labelPosition: 'top',
     widget: {
-      component: 'MetaInput',
+      component: 'InputConfigurator',
       props: {
         modelValue: ''
       }
@@ -235,12 +235,12 @@ export const META_DEFAULT_VALUE = {
 
 // 区块暴露属性和事件各类型对应的默认编辑器
 export const META_COMPONENTS = {
-  [META_TYPES.array]: 'MetaCodeEditor',
-  [META_TYPES.string]: 'MetaInput',
-  [META_TYPES.number]: 'MetaNumber',
-  [META_TYPES.object]: 'MetaCodeEditor',
+  [META_TYPES.array]: 'CodeConfigurator',
+  [META_TYPES.string]: 'InputConfigurator',
+  [META_TYPES.number]: 'NumberConfigurator',
+  [META_TYPES.object]: 'CodeConfigurator',
   [META_TYPES.boolean]: 'SwitchConfigurator',
-  [META_TYPES.function]: 'MetaCodeEditor'
+  [META_TYPES.function]: 'CodeConfigurator'
 }
 
 // 区块默认的属性schema
@@ -322,7 +322,7 @@ export const setEditProperty = (property) => {
   state.property = property
 
   state.arrayConfig = (property?.properties?.[0]?.content || []).map(
-    ({ property, type, defaultValue, label, widget: { props = {}, component = 'MetaInput' } = {} }) => ({
+    ({ property, type, defaultValue, label, widget: { props = {}, component = 'InputConfigurator' } = {} }) => ({
       property,
       type,
       defaultValue,
diff --git a/packages/settings/design/src/assets/materials/ng-bundle.json b/packages/settings/design/src/assets/materials/ng-bundle.json
index 11c099e2d9..5e891093c4 100644
--- a/packages/settings/design/src/assets/materials/ng-bundle.json
+++ b/packages/settings/design/src/assets/materials/ng-bundle.json
@@ -641,7 +641,7 @@
                     "readOnly": false,
                     "disabled": false,
                     "widget": {
-                      "component": "MetaSelect",
+                      "component": "SelectConfigurator",
                       "props": {
                         "options": ["", "danger", "primary"]
                       }
@@ -663,7 +663,7 @@
                     "readOnly": false,
                     "disabled": false,
                     "widget": {
-                      "component": "MetaSelect",
+                      "component": "SelectConfigurator",
                       "props": {
                         "options": ["large", "middle", "small", "xs"]
                       }
diff --git a/packages/settings/design/src/assets/materials/ng-components/table.json b/packages/settings/design/src/assets/materials/ng-components/table.json
index 88d84330e3..74042cc90b 100644
--- a/packages/settings/design/src/assets/materials/ng-components/table.json
+++ b/packages/settings/design/src/assets/materials/ng-components/table.json
@@ -78,7 +78,7 @@
             "readOnly": false,
             "disabled": false,
             "widget": {
-              "component": "MetaCodeEditorList",
+              "component": "CodeListConfigurator",
               "props": {
                 "language": "json",
                 "buttonText": "编辑列配置",
diff --git a/packages/settings/design/src/components/SettingPanel.vue b/packages/settings/design/src/components/SettingPanel.vue
index 7a3a1fc0a1..c0786b7888 100644
--- a/packages/settings/design/src/components/SettingPanel.vue
+++ b/packages/settings/design/src/components/SettingPanel.vue
@@ -173,7 +173,7 @@ export default {
     const handleTypeChange = () => {
       const shouldShowArrayItem =
         store.currentProperty.type === META_TYPES_ENUM.array &&
-        store.currentProperty.widget.component === META_COMPONENTS.MetaArrayItem
+        store.currentProperty.widget.component === META_COMPONENTS.ArrayItemConfigurator
 
       showArrayItem.value = shouldShowArrayItem
 
@@ -198,7 +198,7 @@ export default {
           }
         },
         widget: {
-          component: 'MetaInput',
+          component: 'InputConfigurator',
           props: {}
         }
       })
diff --git a/packages/settings/design/src/convertToSchema.js b/packages/settings/design/src/convertToSchema.js
index 344e8e0e83..edbdda8dd8 100644
--- a/packages/settings/design/src/convertToSchema.js
+++ b/packages/settings/design/src/convertToSchema.js
@@ -41,11 +41,11 @@ const results = {
 }
 
 const widgetMap = {
-  object: 'MetaCodeEditor',
-  array: 'MetaCodeEditor',
-  enum: 'MetaSelect',
-  string: 'MetaInput',
-  number: 'MetaNumeric',
+  object: 'CodeConfigurator',
+  array: 'CodeConfigurator',
+  enum: 'SelectConfigurator',
+  string: 'InputConfigurator',
+  number: 'NumberConfigurator',
   boolean: 'SwitchConfigurator'
 }
 
diff --git a/packages/settings/design/src/schemas/button.json b/packages/settings/design/src/schemas/button.json
index 9944a92828..18f09b101a 100644
--- a/packages/settings/design/src/schemas/button.json
+++ b/packages/settings/design/src/schemas/button.json
@@ -36,7 +36,7 @@
             "readOnly": false,
             "disabled": false,
             "widget": {
-              "component": "MetaBindI18n",
+              "component": "I18nConfigurator",
               "props": {}
             },
             "description": {
@@ -105,7 +105,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
diff --git a/packages/settings/design/src/schemas/checkboxgroup.json b/packages/settings/design/src/schemas/checkboxgroup.json
index 8d098c3798..daf1a0da9c 100644
--- a/packages/settings/design/src/schemas/checkboxgroup.json
+++ b/packages/settings/design/src/schemas/checkboxgroup.json
@@ -71,7 +71,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -90,7 +90,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
diff --git a/packages/settings/design/src/schemas/form.json b/packages/settings/design/src/schemas/form.json
index 79bcfcf960..ddf0425c2f 100644
--- a/packages/settings/design/src/schemas/form.json
+++ b/packages/settings/design/src/schemas/form.json
@@ -129,7 +129,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
@@ -171,7 +171,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -191,7 +191,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
diff --git a/packages/settings/design/src/schemas/grid.json b/packages/settings/design/src/schemas/grid.json
index 52ab8512d5..a882068cfc 100644
--- a/packages/settings/design/src/schemas/grid.json
+++ b/packages/settings/design/src/schemas/grid.json
@@ -32,7 +32,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCollection",
+              "component": "CollectionConfigurator",
               "props": {}
             },
             "description": {
@@ -66,7 +66,7 @@
                       }
                     },
                     "widget": {
-                      "component": "MetaBindI18n",
+                      "component": "I18nConfigurator",
                       "props": {}
                     }
                   },
@@ -136,7 +136,7 @@
                       }
                     },
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     }
                   },
@@ -152,7 +152,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaSelect",
+                      "component": "SelectConfigurator",
                       "props": {
                         "options": [
                           {
@@ -191,7 +191,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -211,7 +211,7 @@
                     "disabled": false,
                     "cols": 12,
                     "widget": {
-                      "component": "MetaCodeEditor",
+                      "component": "CodeConfigurator",
                       "props": {}
                     },
                     "description": {
@@ -222,7 +222,7 @@
               }
             ],
             "widget": {
-              "component": "MetaArrayItem",
+              "component": "ArrayItemConfigurator",
               "props": {
                 "type": "object",
                 "textField": "title",
@@ -248,7 +248,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -267,7 +267,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -306,7 +306,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -326,7 +326,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -345,7 +345,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -481,7 +481,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -521,7 +521,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
diff --git a/packages/settings/design/src/schemas/gridcolumn.json b/packages/settings/design/src/schemas/gridcolumn.json
index 5d39e202d4..c1455089a7 100644
--- a/packages/settings/design/src/schemas/gridcolumn.json
+++ b/packages/settings/design/src/schemas/gridcolumn.json
@@ -91,7 +91,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
@@ -150,7 +150,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -170,7 +170,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -229,7 +229,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
diff --git a/packages/settings/design/src/schemas/input.json b/packages/settings/design/src/schemas/input.json
index a14f9b10f6..ed73665cb0 100644
--- a/packages/settings/design/src/schemas/input.json
+++ b/packages/settings/design/src/schemas/input.json
@@ -111,7 +111,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
diff --git a/packages/settings/design/src/schemas/pager.json b/packages/settings/design/src/schemas/pager.json
index aa9bce455e..0d9e5c23b5 100644
--- a/packages/settings/design/src/schemas/pager.json
+++ b/packages/settings/design/src/schemas/pager.json
@@ -72,7 +72,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
diff --git a/packages/settings/design/src/schemas/popeditor.json b/packages/settings/design/src/schemas/popeditor.json
index d030636904..3624926c55 100644
--- a/packages/settings/design/src/schemas/popeditor.json
+++ b/packages/settings/design/src/schemas/popeditor.json
@@ -139,7 +139,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -159,7 +159,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -179,7 +179,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
diff --git a/packages/settings/design/src/schemas/popover.json b/packages/settings/design/src/schemas/popover.json
index 4c6b0d5500..5e09149fa6 100644
--- a/packages/settings/design/src/schemas/popover.json
+++ b/packages/settings/design/src/schemas/popover.json
@@ -52,7 +52,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
@@ -123,7 +123,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
diff --git a/packages/settings/design/src/schemas/select.json b/packages/settings/design/src/schemas/select.json
index 57833c3a5c..ab62650065 100644
--- a/packages/settings/design/src/schemas/select.json
+++ b/packages/settings/design/src/schemas/select.json
@@ -111,7 +111,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCollection",
+              "component": "CollectionConfigurator",
               "props": {}
             },
             "description": {
diff --git a/packages/settings/design/src/schemas/tabs.json b/packages/settings/design/src/schemas/tabs.json
index 603b2f1484..dac09280eb 100644
--- a/packages/settings/design/src/schemas/tabs.json
+++ b/packages/settings/design/src/schemas/tabs.json
@@ -131,7 +131,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
diff --git a/packages/settings/design/src/schemas/time-line.json b/packages/settings/design/src/schemas/time-line.json
index bff9994753..553cc50897 100644
--- a/packages/settings/design/src/schemas/time-line.json
+++ b/packages/settings/design/src/schemas/time-line.json
@@ -80,7 +80,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCollection",
+              "component": "CollectionConfigurator",
               "props": {}
             },
             "description": {
diff --git a/packages/settings/design/src/schemas/tooltip.json b/packages/settings/design/src/schemas/tooltip.json
index 7541b2ee3d..55e6fb1fb6 100644
--- a/packages/settings/design/src/schemas/tooltip.json
+++ b/packages/settings/design/src/schemas/tooltip.json
@@ -32,7 +32,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaSelect",
+              "component": "SelectConfigurator",
               "props": {
                 "options": [
                   {
diff --git a/packages/settings/design/src/schemas/tree.json b/packages/settings/design/src/schemas/tree.json
index c7f5d78592..5eeae316d2 100644
--- a/packages/settings/design/src/schemas/tree.json
+++ b/packages/settings/design/src/schemas/tree.json
@@ -52,7 +52,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -111,7 +111,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -131,7 +131,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
@@ -179,7 +179,7 @@
             "disabled": false,
             "cols": 12,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             },
             "description": {
diff --git a/packages/settings/design/src/store/index.js b/packages/settings/design/src/store/index.js
index e80b0c52f0..682d5c99ac 100644
--- a/packages/settings/design/src/store/index.js
+++ b/packages/settings/design/src/store/index.js
@@ -63,7 +63,7 @@ const store = reactive({
   childrenSchema: [],
   currentProperties: {},
   currentProperty: {
-    widget: 'MetaInput',
+    widget: 'InputConfigurator',
     device: []
   },
   currentGroup: null,
@@ -77,20 +77,18 @@ const store = reactive({
 })
 
 export const META_COMPONENTS = {
-  MetaCodeEditor: 'MetaCodeEditor',
-  MetaArrayItem: 'MetaArrayItem',
-  MetaInput: 'MetaInput',
-  MetaSelect: 'MetaSelect',
-  MetaBindI18n: 'MetaBindI18n',
+  CodeConfigurator: 'CodeConfigurator',
+  ArrayItemConfigurator: 'ArrayItemConfigurator',
+  InputConfigurator: 'InputConfigurator',
+  SelectConfigurator: 'SelectConfigurator',
+  I18nConfigurator: 'I18nConfigurator',
   CheckBoxConfigurator: 'CheckBoxConfigurator',
-  MetaColor: 'MetaColor',
+  ColorConfigurator: 'ColorConfigurator',
   DatePickerConfigurator: 'DatePickerConfigurator',
-  MetaRadio: 'MetaRadio',
-  MetaRadioGroup: 'MetaRadioGroup',
-  MetaNumber: 'MetaNumber',
-  MetaJsSlot: 'MetaJsSlot',
+  RadioConfigurator: 'RadioConfigurator',
+  RadioConfiguratorGroup: 'RadioGroupConfigurator',
+  NumberConfigurator: 'NumberConfigurator',
   JsSlotConfigurator: 'JsSlotConfigurator',
-  MetaSwitch: 'MetaSwitch',
   SwitchConfigurator: 'SwitchConfigurator'
 }
 
@@ -107,12 +105,12 @@ export const META_TYPES_OPTIONS = Object.entries(META_TYPES_ENUM).map(([key, val
 
 // 数据类型对应的默认 meta component
 export const META_DEFAULT_COMPONENT = {
-  [META_TYPES_ENUM.array]: META_COMPONENTS.MetaCodeEditor,
-  [META_TYPES_ENUM.string]: META_COMPONENTS.MetaInput,
-  [META_TYPES_ENUM.number]: META_COMPONENTS.MetaNumber,
-  [META_TYPES_ENUM.object]: META_COMPONENTS.MetaCodeEditor,
+  [META_TYPES_ENUM.array]: META_COMPONENTS.CodeConfigurator,
+  [META_TYPES_ENUM.string]: META_COMPONENTS.InputConfigurator,
+  [META_TYPES_ENUM.number]: META_COMPONENTS.NumberConfigurator,
+  [META_TYPES_ENUM.object]: META_COMPONENTS.CodeConfigurator,
   [META_TYPES_ENUM.boolean]: META_COMPONENTS.SwitchConfigurator,
-  [META_TYPES_ENUM.function]: META_COMPONENTS.MetaCodeEditor
+  [META_TYPES_ENUM.function]: META_COMPONENTS.CodeConfigurator
 }
 
 export const META_DEFAULT_VALUE = {
@@ -189,11 +187,11 @@ export const addGroup = (index) => {
 
 export const addProperty = (group, prop, index = 0) => {
   const typeMap = {
-    string: 'MetaInput',
+    string: 'InputConfigurator',
     boolean: 'SwitchConfigurator',
-    number: 'MetaNumeric',
-    array: 'MetaInput',
-    object: 'MetaInput'
+    number: 'NumberConfigurator',
+    array: 'InputConfigurator',
+    object: 'InputConfigurator'
   }
   const meta = store?.currentProperties[prop]
   const newProperty = {
diff --git a/packages/settings/props/src/composable/useProperties.js b/packages/settings/props/src/composable/useProperties.js
index 49a1f2da9c..5d6250bc31 100644
--- a/packages/settings/props/src/composable/useProperties.js
+++ b/packages/settings/props/src/composable/useProperties.js
@@ -30,7 +30,7 @@ const otherBaseKey = {
     cols: 12,
     rules: [],
     widget: {
-      component: 'MetaInput',
+      component: 'InputConfigurator',
       props: {}
     }
   },
@@ -46,7 +46,7 @@ const otherBaseKey = {
     cols: 12,
     rules: [],
     widget: {
-      component: 'MetaInput',
+      component: 'InputConfigurator',
       props: {}
     }
   },
@@ -62,7 +62,7 @@ const otherBaseKey = {
     cols: 12,
     rules: [],
     widget: {
-      component: 'MetaInput',
+      component: 'InputConfigurator',
       props: {}
     }
   }
@@ -92,7 +92,7 @@ const getSlotSwitch = (properties, slots = {}) => {
           labelPosition: 'none',
           bindState: false,
           widget: {
-            component: 'MetaSlot',
+            component: 'SlotConfigurator',
             props: {
               slots
             }
diff --git a/packages/vue-generator/test/testcases/full/case1_normal/input/blocks.schema.json b/packages/vue-generator/test/testcases/full/case1_normal/input/blocks.schema.json
index 461899d4a7..6ba91c783f 100644
--- a/packages/vue-generator/test/testcases/full/case1_normal/input/blocks.schema.json
+++ b/packages/vue-generator/test/testcases/full/case1_normal/input/blocks.schema.json
@@ -89,7 +89,7 @@
                 "readOnly": false,
                 "disabled": false,
                 "widget": {
-                  "component": "MetaCodeEditor",
+                  "component": "CodeConfigurator",
                   "props": {}
                 }
               },
@@ -109,7 +109,7 @@
                 "readOnly": false,
                 "disabled": false,
                 "widget": {
-                  "component": "MetaCodeEditor",
+                  "component": "CodeConfigurator",
                   "props": {
                     "modelValue": []
                   }
diff --git a/packages/vue-generator/test/testcases/sfc/case01/blocks.schema.json b/packages/vue-generator/test/testcases/sfc/case01/blocks.schema.json
index 4d6abe80a2..6874581b8d 100644
--- a/packages/vue-generator/test/testcases/sfc/case01/blocks.schema.json
+++ b/packages/vue-generator/test/testcases/sfc/case01/blocks.schema.json
@@ -86,7 +86,7 @@
             "readOnly": false,
             "disabled": false,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {}
             }
           },
@@ -106,7 +106,7 @@
             "readOnly": false,
             "disabled": false,
             "widget": {
-              "component": "MetaCodeEditor",
+              "component": "CodeConfigurator",
               "props": {
                 "modelValue": []
               }