ele-admin-plus 1.2.2-beta.5 → 1.3.0-beta.3

package/es/ele-pro-form-builder/components/build-core.js

@@ -0,0 +1,195 @@
+import { uuid, findTree } from "../../utils/core";
+import { isContainerType, mergeValue } from "../../ele-pro-form/util";
+import { defaultItemTypeData } from "../../ele-pro-form/components/item-type-data";
+const fixedChildTypes = [
+  { type: "tabs", childType: "tabPane" },
+  { type: "collapse", childType: "collapseItem" },
+  { type: "row", childType: "col" },
+  { type: "carousel", childType: "carouselItem" },
+  { type: "descriptions", childType: "descriptionsItem" },
+  { type: "table", childType: "tableRow" },
+  { type: "tableRow", childType: "tableCell" }
+];
+function generateItemKey() {
+  return `f${uuid(15, 36).toLowerCase()}`;
+}
+function generateUniqueItemKey(items, keys) {
+  let itemKey = generateItemKey();
+  while (true) {
+    if (!findTree(items, (d) => d.key === itemKey) && (!keys || !keys.includes(itemKey))) {
+      break;
+    }
+    itemKey = generateItemKey();
+  }
+  return itemKey;
+}
+function getComponentItemByType(type, componentData) {
+  if (!type || !componentData) {
+    return;
+  }
+  return componentData.map((groupItem) => groupItem.items).flat().find((item) => item.type === type);
+}
+function generateChildFormItem(parentType, childNo, childKey, componentData) {
+  var _a, _b;
+  let child;
+  if (parentType) {
+    const fc = fixedChildTypes.find((d) => d.type === parentType);
+    if (fc) {
+      child = { prop: "", type: fc.childType };
+    }
+  }
+  if (!child) {
+    child = { prop: "", type: "div" };
+  }
+  if (childKey) {
+    child.key = childKey;
+    child.prop = childKey;
+  }
+  const componentItem = getComponentItemByType(child.type, componentData);
+  const initialProps = (componentItem == null ? void 0 : componentItem.initialProps) ? JSON.parse(JSON.stringify(componentItem.initialProps)) : void 0;
+  if (initialProps) {
+    child.props = initialProps;
+  }
+  if (childNo && child.type) {
+    if (child.type === "collapseItem") {
+      if ((_a = child.props) == null ? void 0 : _a.title) {
+        child.props.title = child.props.title + childNo;
+      }
+    } else if (["descriptionsItem", "tabPane"].includes(child.type)) {
+      if ((_b = child.props) == null ? void 0 : _b.label) {
+        child.props.label = child.props.label + childNo;
+      }
+    } else if (child.label) {
+      child.label = child.label + childNo;
+    }
+  }
+  return child;
+}
+function generateBuildFormItem(type, formItems, componentData, itemTypeData) {
+  const componentItem = getComponentItemByType(type, componentData);
+  if (!componentItem) {
+    return;
+  }
+  const itemKey = generateUniqueItemKey(formItems);
+  const addedKeys = [itemKey];
+  const item = {
+    key: itemKey,
+    prop: itemKey,
+    label: componentItem.name,
+    type: componentItem.type,
+    required: false,
+    props: componentItem.initialProps ? JSON.parse(JSON.stringify(componentItem.initialProps)) : void 0
+  };
+  const typeData = item.type ? [...itemTypeData || [], ...defaultItemTypeData].find(
+    (d) => d.type === item.type
+  ) : void 0;
+  if (!item.type || item.type === "div" || isContainerType(item, itemTypeData) && !(typeData == null ? void 0 : typeData.renderLabelText)) {
+    item.label = "";
+  }
+  if (item.type === "table") {
+    item.label = "";
+    item.children = Array.from({ length: 2 }).map(() => {
+      const trKey = generateUniqueItemKey(formItems, addedKeys);
+      addedKeys.push(trKey);
+      const childItem = generateChildFormItem(
+        item.type,
+        void 0,
+        trKey,
+        componentData
+      );
+      const children = Array.from({ length: 3 }).map(() => {
+        const tdKey = generateUniqueItemKey(formItems, addedKeys);
+        addedKeys.push(tdKey);
+        return generateChildFormItem(
+          childItem.type,
+          void 0,
+          tdKey,
+          componentData
+        );
+      });
+      childItem.children = children;
+      return childItem;
+    });
+  } else if (item.type === "steps") {
+    item.label = "";
+    if (!item.props) {
+      item.props = {};
+    }
+    item.props.items = Array.from({ length: 3 }).map((_, i) => {
+      const childNo = String(i + 1).padStart(2, "0");
+      return {
+        title: `步骤${childNo}`,
+        description: `步骤${childNo}的描述内容`
+      };
+    });
+  } else if (item.type && fixedChildTypes.some((d) => d.type === item.type)) {
+    item.label = "";
+    item.children = Array.from({
+      length: item.type === "carousel" ? 3 : 2
+    }).map((_, i) => {
+      const childKey = generateUniqueItemKey(formItems, addedKeys);
+      addedKeys.push(childKey);
+      const childNo = String(i + 1).padStart(2, "0");
+      return generateChildFormItem(item.type, childNo, childKey, componentData);
+    });
+  }
+  return item;
+}
+function getFormDataAndItems(item, componentData) {
+  const data = item ? JSON.parse(JSON.stringify(item)) : item;
+  if (!data) {
+    return { data: {}, items: [] };
+  }
+  const componentItem = getComponentItemByType(data.type, componentData);
+  return {
+    data: mergeValue(
+      {},
+      { props: (componentItem == null ? void 0 : componentItem.presetProps) || {} },
+      { props: (componentItem == null ? void 0 : componentItem.defaultProps) || {} },
+      data
+    ),
+    items: (componentItem == null ? void 0 : componentItem.configForm) || []
+  };
+}
+function getPropertyPath(data, excludeKeys, prefix) {
+  const keys = [];
+  if (data != null) {
+    if (Array.isArray(data)) {
+      data.forEach((v, i) => {
+        const path = prefix ? `${prefix}[${i}]` : String(i);
+        if (v != null && typeof v === "object") {
+          getPropertyPath(v, excludeKeys, path).forEach((k) => {
+            keys.push(k);
+          });
+        } else {
+          keys.push(path);
+        }
+      });
+    } else if (typeof data === "object") {
+      Object.keys(data).forEach((key) => {
+        if (!excludeKeys || !excludeKeys.includes(key)) {
+          const path = prefix ? `${prefix}.${key}` : key;
+          const v = data[key];
+          if (v != null && typeof v === "object") {
+            getPropertyPath(v, excludeKeys, path).forEach((k) => {
+              keys.push(k);
+            });
+          } else {
+            keys.push(path);
+          }
+        }
+      });
+    }
+  }
+  return keys;
+}
+export {
+  fixedChildTypes,
+  generateBuildFormItem,
+  generateChildFormItem,
+  generateItemKey,
+  generateUniqueItemKey,
+  getComponentItemByType,
+  getFormDataAndItems,
+  getPropertyPath
+};

package/es/ele-pro-form-builder/components/build-util.d.ts

@@ -0,0 +1,28 @@
+import { ProFormItemKey, ProFormItemProps } from '../../ele-pro-form/types';
+import { ComponentGroup, UpdateItemsResult, AddChildrenItemAction } from '../types';
+
+/**
+ * 添加子级时生成需要的数据
+ * @param triggerItem 触发添加的表单项
+ * @param triggerParent 触发添加的表单项父级
+ * @param triggerItemIndex 触发添加的表单项在父级中的位置
+ * @param actionType 添加类型
+ * @param formItems 当前的全部表单项数据
+ * @param position 触发位置的上方(左侧)或下方(右侧)添加, 默认下方(左侧)
+ * @param componentData 组件库数据
+ */
+export declare function generateAddChildData(triggerItem: ProFormItemProps, triggerParent: ProFormItemProps | undefined, triggerItemIndex: number | undefined, actionType: AddChildrenItemAction | undefined, formItems?: ProFormItemProps[], position?: -1, componentData?: ComponentGroup[]): UpdateItemsResult;
+/**
+ * 表单项数据生成新的 id
+ * @param items 表单项数据
+ * @param formItems 当前的全部表单项数据
+ * @param overwriteProp prop 是否也重新生成
+ * @param generateTypeName 是否生成类型名称到数据
+ */
+export declare function itemsGenerateNewKey(items?: ProFormItemProps[] | ProFormItemProps, formItems?: ProFormItemProps[], overwriteProp?: boolean): void;
+/**
+ * 复制表单项时生成需要的数据
+ * @param formItemId 表单项 id
+ * @param formItems 当前的全部表单项数据
+ */
+export declare function generateCopyItemData(formItemId: ProFormItemKey, formItems?: ProFormItemProps[]): UpdateItemsResult;

package/es/ele-pro-form-builder/components/build-util.js

@@ -0,0 +1,107 @@
+import { eachTree } from "../../utils/core";
+import { generateChildFormItem, generateUniqueItemKey } from "./build-core";
+import { generateAddTableColData, generateAddTableRowData } from "./table-util";
+function generateAddChildData(triggerItem, triggerParent, triggerItemIndex, actionType, formItems, position, componentData) {
+  if (!triggerItem.type) {
+    return { addItems: [], updateItems: [], deleteItemIds: [] };
+  }
+  const parentItemId = triggerParent == null ? void 0 : triggerParent.key;
+  const afterIndex = triggerItemIndex == null ? void 0 : triggerItemIndex + 1;
+  if ([
+    "tabPane",
+    "collapseItem",
+    "col",
+    "carouselItem",
+    "descriptionsItem"
+  ].includes(triggerItem.type)) {
+    const item = generateChildFormItem(
+      {
+        tabPane: "tabs",
+        collapseItem: "collapse",
+        col: "row",
+        carouselItem: "carousel",
+        descriptionsItem: "descriptions"
+      }[triggerItem.type],
+      void 0,
+      void 0,
+      componentData
+    );
+    itemsGenerateNewKey(item, formItems, true);
+    return {
+      addItems: [{ item, parentItemId, index: afterIndex }],
+      updateItems: [],
+      deleteItemIds: []
+    };
+  }
+  if (triggerItem.type === "tableCell") {
+    const result = {
+      addItems: [],
+      updateItems: [],
+      deleteItemIds: []
+    };
+    eachTree(formItems, (trItem, _trIndex, tableItem) => {
+      if (triggerParent && trItem.key === triggerParent.key && tableItem) {
+        const { addItems, updateItems, deleteItemIds } = (actionType === "addTableCol" ? generateAddTableColData : generateAddTableRowData)(tableItem, formItems, triggerItem, position, componentData);
+        result.addItems = addItems;
+        result.updateItems = updateItems;
+        result.deleteItemIds = deleteItemIds;
+        return false;
+      }
+    });
+    return result;
+  }
+  if (triggerItem.type === "table") {
+    return (actionType === "addTableCol" ? generateAddTableColData : generateAddTableRowData)(triggerItem, formItems, void 0, void 0, componentData);
+  }
+  const child = generateChildFormItem(
+    triggerItem.type,
+    void 0,
+    void 0,
+    componentData
+  );
+  itemsGenerateNewKey(child, formItems, true);
+  return {
+    addItems: [{ item: child, parentItemId: triggerItem.key }],
+    updateItems: [],
+    deleteItemIds: []
+  };
+}
+function itemsGenerateNewKey(items, formItems, overwriteProp) {
+  if (!items) {
+    return;
+  }
+  const addedKeys = [];
+  eachTree(Array.isArray(items) ? items : [items], (item) => {
+    const itemKey = generateUniqueItemKey(formItems, addedKeys);
+    addedKeys.push(itemKey);
+    item.key = itemKey;
+    if (overwriteProp) {
+      item.prop = itemKey;
+    }
+  });
+}
+function generateCopyItemData(formItemId, formItems) {
+  const result = {
+    addItems: [],
+    updateItems: [],
+    deleteItemIds: []
+  };
+  eachTree(formItems, (item, index, parent) => {
+    if (item.key === formItemId) {
+      const newItem = JSON.parse(JSON.stringify(item));
+      itemsGenerateNewKey(newItem, formItems, true);
+      result.addItems.push({
+        item: newItem,
+        parentItemId: parent == null ? void 0 : parent.key,
+        index: index + 1
+      });
+      return false;
+    }
+  });
+  return result;
+}
+export {
+  generateAddChildData,
+  generateCopyItemData,
+  itemsGenerateNewKey
+};

package/es/ele-pro-form-builder/components/builder-tools.d.ts

@@ -0,0 +1,31 @@
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<{
+    /** 对应的表单项类型 */
+    itemType?: string;
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    delete: (event: MouseEvent) => void;
+    copy: (event: MouseEvent) => void;
+    add: (event: MouseEvent) => void;
+    addTableRow: (event: MouseEvent) => void;
+    addTableCol: (event: MouseEvent) => void;
+    openTableTool: (event: MouseEvent) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    /** 对应的表单项类型 */
+    itemType?: string;
+}>>> & {
+    onCopy?: ((event: MouseEvent) => any) | undefined;
+    onDelete?: ((event: MouseEvent) => any) | undefined;
+    onAdd?: ((event: MouseEvent) => any) | undefined;
+    onAddTableRow?: ((event: MouseEvent) => any) | undefined;
+    onAddTableCol?: ((event: MouseEvent) => any) | undefined;
+    onOpenTableTool?: ((event: MouseEvent) => any) | undefined;
+}, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/es/ele-pro-form-builder/components/builder-tools.js

@@ -0,0 +1,121 @@
+import { defineComponent, openBlock, createElementBlock, Fragment, createBlock, unref, createCommentVNode } from "vue";
+import { InsertRowOutlined, InsertColumnOutlined, PlusSquareDashOutlined, CopyOutlined, DeleteOutlined, AppstoreAddOutlined } from "../../icons";
+import ToolButton from "./tool-button";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "builder-tools",
+  props: {
+    itemType: {}
+  },
+  emits: ["delete", "copy", "add", "addTableRow", "addTableCol", "openTableTool"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const handleDelete = (e) => {
+      emit("delete", e);
+    };
+    const handleCopy = (e) => {
+      emit("copy", e);
+    };
+    const handleAdd = (e) => {
+      emit("add", e);
+    };
+    const handleAddTableRow = (e) => {
+      emit("addTableRow", e);
+    };
+    const handleAddTableCol = (e) => {
+      emit("addTableCol", e);
+    };
+    const handleOpenTableTool = (e) => {
+      emit("openTableTool", e);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        _ctx.itemType && ["table", "tableCell"].includes(_ctx.itemType) ? (openBlock(), createBlock(ToolButton, {
+          key: 0,
+          buttonProps: {
+            size: "small",
+            type: "primary",
+            icon: unref(InsertRowOutlined)
+          },
+          tooltip: _ctx.itemType === "tableCell" ? "插入行" : "新增行",
+          onClick: handleAddTableRow
+        }, null, 8, ["buttonProps", "tooltip"])) : createCommentVNode("", true),
+        _ctx.itemType && ["table", "tableCell"].includes(_ctx.itemType) ? (openBlock(), createBlock(ToolButton, {
+          key: 1,
+          buttonProps: {
+            size: "small",
+            type: "primary",
+            icon: unref(InsertColumnOutlined)
+          },
+          tooltip: _ctx.itemType === "tableCell" ? "插入列" : "新增列",
+          onClick: handleAddTableCol
+        }, null, 8, ["buttonProps", "tooltip"])) : createCommentVNode("", true),
+        _ctx.itemType && [
+          "tabs",
+          "tabPane",
+          "collapse",
+          "collapseItem",
+          "row",
+          "col",
+          "carousel",
+          "carouselItem",
+          "descriptions",
+          "descriptionsItem"
+        ].includes(_ctx.itemType) ? (openBlock(), createBlock(ToolButton, {
+          key: 2,
+          buttonProps: {
+            size: "small",
+            type: "primary",
+            icon: unref(PlusSquareDashOutlined)
+          },
+          tooltip: {
+            tabs: "添加选项卡",
+            tabPane: "插入选项卡",
+            collapse: "添加折叠面板",
+            collapseItem: "插入折叠面板",
+            row: "添加栅格列",
+            col: "插入栅格列",
+            carousel: "添加走马灯",
+            carouselItem: "插入走马灯",
+            descriptions: "添加描述列表",
+            descriptionsItem: "插入描述列表"
+          }[_ctx.itemType] || "添加",
+          onClick: handleAdd
+        }, null, 8, ["buttonProps", "tooltip"])) : createCommentVNode("", true),
+        _ctx.itemType !== "tableCell" ? (openBlock(), createBlock(ToolButton, {
+          key: 3,
+          buttonProps: {
+            size: "small",
+            type: "primary",
+            icon: unref(CopyOutlined)
+          },
+          tooltip: "复制",
+          onClick: handleCopy
+        }, null, 8, ["buttonProps"])) : createCommentVNode("", true),
+        _ctx.itemType !== "tableCell" ? (openBlock(), createBlock(ToolButton, {
+          key: 4,
+          buttonProps: {
+            size: "small",
+            type: "danger",
+            icon: unref(DeleteOutlined)
+          },
+          tooltip: "删除",
+          onClick: handleDelete
+        }, null, 8, ["buttonProps"])) : createCommentVNode("", true),
+        _ctx.itemType === "tableCell" ? (openBlock(), createBlock(ToolButton, {
+          key: 5,
+          buttonProps: {
+            size: "small",
+            type: "primary",
+            icon: unref(AppstoreAddOutlined),
+            style: { fontSize: "14px" }
+          },
+          tooltip: "更多",
+          onClick: handleOpenTableTool
+        }, null, 8, ["buttonProps"])) : createCommentVNode("", true)
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/ele-pro-form-builder/components/children-edit.d.ts

@@ -0,0 +1,40 @@
+import { ProFormItemProps } from '../../ele-pro-form/types';
+import { ComponentGroup } from '../types';
+
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<{
+    /** 添加按钮文本 */
+    addBtnText?: string;
+    /** 表单项数据 */
+    formItem: ProFormItemProps;
+    /** 组件库数据 */
+    componentData: ComponentGroup[];
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:currentFormItemId": (formItemId?: string | undefined) => void;
+    updateChildLabel: (label: string, child: ProFormItemProps, field: string) => void;
+    sortChildren: (children: ProFormItemProps[]) => void;
+    deleteChildren: (child: ProFormItemProps) => void;
+    addChildren: (parent: ProFormItemProps) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    /** 添加按钮文本 */
+    addBtnText?: string;
+    /** 表单项数据 */
+    formItem: ProFormItemProps;
+    /** 组件库数据 */
+    componentData: ComponentGroup[];
+}>>> & {
+    "onUpdate:currentFormItemId"?: ((formItemId?: string | undefined) => any) | undefined;
+    onUpdateChildLabel?: ((label: string, child: ProFormItemProps, field: string) => any) | undefined;
+    onSortChildren?: ((children: ProFormItemProps[]) => any) | undefined;
+    onDeleteChildren?: ((child: ProFormItemProps) => any) | undefined;
+    onAddChildren?: ((parent: ProFormItemProps) => any) | undefined;
+}, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/es/ele-pro-form-builder/components/children-edit.js

@@ -0,0 +1,124 @@
+import { defineComponent, openBlock, createElementBlock, Fragment, createBlock, unref, withCtx, createElementVNode, createVNode, withModifiers, toDisplayString, createCommentVNode, createSlots, createTextVNode } from "vue";
+import VueDraggable from "vuedraggable";
+import { ElIcon, ElInput, ElButton } from "element-plus";
+import { DragOutlined, DeleteOutlined, PlusOutlined } from "../../icons";
+import ComponentName from "./component-name";
+const _hoisted_1 = { class: "ele-pro-form-builder-children-edit-item" };
+const _hoisted_2 = {
+  key: 0,
+  class: "ele-pro-form-builder-children-edit-item-body"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "ele-pro-form-builder-children-edit-item-body"
+};
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = { class: "ele-pro-form-builder-children-edit-item-text" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "children-edit",
+  props: {
+    addBtnText: {},
+    formItem: {},
+    componentData: {}
+  },
+  emits: ["update:currentFormItemId", "updateChildLabel", "sortChildren", "deleteChildren", "addChildren"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const handleUpdateLabel = (value, item, field) => {
+      emit("updateChildLabel", value, item, field);
+    };
+    const handleUpdateChildren = (children) => {
+      emit("sortChildren", children);
+    };
+    const handleDelete = (item) => {
+      emit("deleteChildren", item);
+    };
+    const handleClick = (item) => {
+      emit("update:currentFormItemId", item.key);
+    };
+    const handleAdd = () => {
+      emit("addChildren", props.formItem);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        _ctx.formItem.children ? (openBlock(), createBlock(unref(VueDraggable), {
+          key: 0,
+          itemKey: "key",
+          animation: 150,
+          setData: () => void 0,
+          modelValue: _ctx.formItem.children,
+          handle: ".ele-pro-form-builder-children-edit-item-handle",
+          class: "ele-pro-form-builder-children-edit-list",
+          "onUpdate:modelValue": handleUpdateChildren
+        }, {
+          item: withCtx(({ element }) => {
+            var _a, _b;
+            return [
+              createElementVNode("div", _hoisted_1, [
+                createVNode(unref(ElIcon), { class: "ele-pro-form-builder-children-edit-item-handle" }, {
+                  default: withCtx(() => [
+                    createVNode(unref(DragOutlined))
+                  ]),
+                  _: 1
+                }),
+                _ctx.formItem.type && _ctx.formItem.type === "tabs" ? (openBlock(), createElementBlock("div", _hoisted_2, [
+                  createVNode(unref(ElInput), {
+                    size: "small",
+                    modelValue: (_a = element.props) == null ? void 0 : _a.label,
+                    "onUpdate:modelValue": (value) => handleUpdateLabel(value, element, "props.label")
+                  }, null, 8, ["modelValue", "onUpdate:modelValue"])
+                ])) : _ctx.formItem.type && _ctx.formItem.type === "collapse" ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                  createVNode(unref(ElInput), {
+                    size: "small",
+                    modelValue: (_b = element.props) == null ? void 0 : _b.title,
+                    "onUpdate:modelValue": (value) => handleUpdateLabel(value, element, "props.title")
+                  }, null, 8, ["modelValue", "onUpdate:modelValue"])
+                ])) : (openBlock(), createElementBlock("div", {
+                  key: 2,
+                  class: "ele-pro-form-builder-children-edit-item-body is-clickable",
+                  onClick: withModifiers(($event) => handleClick(element), ["stop"])
+                }, [
+                  createVNode(ComponentName, {
+                    itemType: element.type,
+                    componentData: _ctx.componentData,
+                    class: "ele-pro-form-builder-outline-item-type-tag"
+                  }, null, 8, ["itemType", "componentData"]),
+                  createElementVNode("div", _hoisted_5, toDisplayString(element.label || element.prop), 1)
+                ], 8, _hoisted_4)),
+                createVNode(unref(ElIcon), {
+                  class: "ele-pro-form-builder-children-edit-item-del-btn",
+                  title: "删除",
+                  onClick: withModifiers(($event) => handleDelete(element), ["stop"])
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(DeleteOutlined))
+                  ]),
+                  _: 2
+                }, 1032, ["onClick"])
+              ])
+            ];
+          }),
+          _: 1
+        }, 8, ["modelValue"])) : createCommentVNode("", true),
+        createVNode(unref(ElButton), {
+          size: "small",
+          icon: unref(PlusOutlined),
+          style: { width: "100%" },
+          onClick: handleAdd
+        }, createSlots({ _: 2 }, [
+          _ctx.addBtnText ? {
+            name: "default",
+            fn: withCtx(() => [
+              createTextVNode(toDisplayString(_ctx.addBtnText), 1)
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["icon"])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/ele-pro-form-builder/components/code-editer.d.ts

@@ -0,0 +1,21 @@
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<{
+    /** 绑定值 */
+    modelValue?: string;
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value?: string | undefined) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    /** 绑定值 */
+    modelValue?: string;
+}>>> & {
+    "onUpdate:modelValue"?: ((value?: string | undefined) => any) | undefined;
+}, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};