jky-component-lib 0.0.129 → 0.0.131

package/dist/lib/form/FormItem.vue.js

@@ -54,14 +54,39 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 const vue = require("vue");
 const iconsVue = require("@element-plus/icons-vue");
 const ElementPlus = require("element-plus");
-const index = require("../add-input/index.js");
-const index$2 = require("../code-mirror-editor/index.js");
-const index$1 = require("../rich-editor/index.js");
-const AMapPickerItem_vue_vue_type_script_setup_true_lang = require("./AMapPickerItem.vue.js");
-;/* empty css                     */
-const LinkedSelect_vue_vue_type_script_setup_true_lang = require("./LinkedSelect.vue.js");
-const SelectTable_vue_vue_type_script_setup_true_lang = require("./SelectTable.vue.js");
-;/* empty css                  */
+const FormItemWrapper_vue_vue_type_script_setup_true_lang = require("./FormItemWrapper.vue.js");
+;/* empty css                      */
+const AddInputItem_vue_vue_type_script_setup_true_lang = require("./items/AddInputItem.vue.js");
+const AMapPickerItem_vue_vue_type_script_setup_true_lang = require("./items/AMapPickerItem.vue.js");
+const AutocompleteItem_vue_vue_type_script_setup_true_lang = require("./items/AutocompleteItem.vue.js");
+const CascaderItem_vue_vue_type_script_setup_true_lang = require("./items/CascaderItem.vue.js");
+const CheckboxGroupItem_vue_vue_type_script_setup_true_lang = require("./items/CheckboxGroupItem.vue.js");
+const CodeMirrorEditorItem_vue_vue_type_script_setup_true_lang = require("./items/CodeMirrorEditorItem.vue.js");
+const ColorPickerItem_vue_vue_type_script_setup_true_lang = require("./items/ColorPickerItem.vue.js");
+const ColorPickerPanelItem_vue_vue_type_script_setup_true_lang = require("./items/ColorPickerPanelItem.vue.js");
+const CustomItem_vue_vue_type_script_setup_true_lang = require("./items/CustomItem.vue.js");
+const DatePickerItem_vue_vue_type_script_setup_true_lang = require("./items/DatePickerItem.vue.js");
+const DividerItem_vue_vue_type_script_setup_true_lang = require("./items/DividerItem.vue.js");
+const FileUploadItem_vue_vue_type_script_setup_true_lang = require("./items/FileUploadItem.vue.js");
+const ImageUploadItem_vue_vue_type_script_setup_true_lang = require("./items/ImageUploadItem.vue.js");
+const InputItem_vue_vue_type_script_setup_true_lang = require("./items/InputItem.vue.js");
+const InputNumberItem_vue_vue_type_script_setup_true_lang = require("./items/InputNumberItem.vue.js");
+const InputTagItem_vue_vue_type_script_setup_true_lang = require("./items/InputTagItem.vue.js");
+const LinkedSelectItem_vue_vue_type_script_setup_true_lang = require("./items/LinkedSelectItem.vue.js");
+const MentionItem_vue_vue_type_script_setup_true_lang = require("./items/MentionItem.vue.js");
+const RadioGroupItem_vue_vue_type_script_setup_true_lang = require("./items/RadioGroupItem.vue.js");
+const RateItem_vue_vue_type_script_setup_true_lang = require("./items/RateItem.vue.js");
+const RichEditorItem_vue_vue_type_script_setup_true_lang = require("./items/RichEditorItem.vue.js");
+const SelectItem_vue_vue_type_script_setup_true_lang = require("./items/SelectItem.vue.js");
+const SelectTableItem_vue_vue_type_script_setup_true_lang = require("./items/SelectTableItem.vue.js");
+const SelectV2Item_vue_vue_type_script_setup_true_lang = require("./items/SelectV2Item.vue.js");
+const SliderItem_vue_vue_type_script_setup_true_lang = require("./items/SliderItem.vue.js");
+const SwitchItem_vue_vue_type_script_setup_true_lang = require("./items/SwitchItem.vue.js");
+const TextareaItem_vue_vue_type_script_setup_true_lang = require("./items/TextareaItem.vue.js");
+const TimePickerItem_vue_vue_type_script_setup_true_lang = require("./items/TimePickerItem.vue.js");
+const TimeSelectItem_vue_vue_type_script_setup_true_lang = require("./items/TimeSelectItem.vue.js");
+const TransferItem_vue_vue_type_script_setup_true_lang = require("./items/TransferItem.vue.js");
+const TreeSelectItem_vue_vue_type_script_setup_true_lang = require("./items/TreeSelectItem.vue.js");
 const _hoisted_1 = {
   key: 0,
   style: { "display": "none" }
@@ -108,17 +133,32 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
   setup(__props) {
     const props = __props;
     const loading = vue.ref(false);
+    const propsLoadStatus = vue.ref("idle");
+    const loadError = vue.ref(null);
     const componentProps = vue.ref({});
-    const rules = vue.ref(null);
+    const rulesData = vue.ref(null);
+    const rules = vue.computed(() => {
+      const r = rulesData.value;
+      if (!r)
+        return void 0;
+      if (Array.isArray(r))
+        return r;
+      if (typeof r === "object")
+        return r;
+      return void 0;
+    });
     function loadComponentProps() {
       return __async(this, null, function* () {
         const configProps = props.config.componentProps;
         if (!configProps) {
           componentProps.value = {};
+          propsLoadStatus.value = "ready";
           return;
         }
         if (typeof configProps === "function") {
           loading.value = true;
+          propsLoadStatus.value = "loading";
+          loadError.value = null;
           try {
             const result = yield configProps({
               model: props.model,
@@ -126,22 +166,26 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
               $form: props.model
             });
             componentProps.value = result || {};
+            propsLoadStatus.value = "ready";
           } catch (error) {
             console.error("Failed to load component props:", error);
             componentProps.value = {};
+            loadError.value = error;
+            propsLoadStatus.value = "error";
           } finally {
             loading.value = false;
           }
           return;
         }
         componentProps.value = configProps;
+        propsLoadStatus.value = "ready";
       });
     }
     function loadRules() {
       return __async(this, null, function* () {
         const configRules = props.config.rules;
         if (!configRules) {
-          rules.value = null;
+          rulesData.value = null;
           return;
         }
         if (typeof configRules === "function") {
@@ -152,29 +196,37 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
               field: props.field,
               $form: props.model
             });
-            rules.value = result || null;
+            rulesData.value = result && typeof result !== "function" ? result : null;
           } catch (error) {
             console.error("Failed to load rules:", error);
-            rules.value = null;
+            rulesData.value = null;
           } finally {
             loading.value = false;
           }
           return;
         }
-        rules.value = configRules;
+        rulesData.value = typeof configRules !== "function" ? configRules : null;
+      });
+    }
+    function reloadComponentProps() {
+      return __async(this, null, function* () {
+        yield loadComponentProps();
       });
     }
+    const watchFields = vue.computed(() => {
+      const config = props.config;
+      return config.watchFields || [];
+    });
     function setupWatchFields() {
-      const watchFields = props.config.watchFields;
-      if (!watchFields || watchFields.length === 0) {
+      if (watchFields.value.length === 0)
         return;
-      }
       vue.watch(
-        () => watchFields.map((field) => props.model[field]),
+        () => watchFields.value.map((field) => props.model[field]),
         () => {
           loadComponentProps();
           loadRules();
-        }
+        },
+        { deep: true }
       );
     }
     loadComponentProps();
@@ -203,7 +255,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
         type,
         title,
         placeholder,
-        componentProps: componentProps2,
+        componentProps: _componentProps,
+        rules: _rules,
         hidden,
         customStyle,
         children,
@@ -219,13 +272,17 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
         formatValue,
         formatModel,
         noLabelMargin,
-        titleRender
+        titleRender,
+        watchFields: _watchFields,
+        help: _help,
+        useDefaultBorderClass: _useDefaultBorderClass
       } = _a, rest = __objRest(_a, [
         "field",
         "type",
         "title",
         "placeholder",
         "componentProps",
+        "rules",
         "hidden",
         "customStyle",
         "children",
@@ -241,293 +298,59 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
         "formatValue",
         "formatModel",
         "noLabelMargin",
-        "titleRender"
+        "titleRender",
+        "watchFields",
+        "help",
+        "useDefaultBorderClass"
       ]);
       return rest;
     });
-    function renderComponent(type) {
-      var _a, _b;
-      if (type === "divider") {
-        const dividerProps = __spreadValues({}, componentProps.value);
-        return vue.h(ElementPlus.ElDivider, dividerProps, {
-          default: () => props.config.children || null
-        });
-      }
-      const commonProps = __spreadProps(__spreadValues({
-        // use `undefined` to fix placeholder issue
-        "modelValue": modelValue.value || void 0,
-        "onUpdate:modelValue": (val) => {
-          props.model[props.field] = val || void 0;
-        },
-        "placeholder": props.config.placeholder || void 0,
-        "disabled": props.disabled,
-        "clearable": props.config.clearable
-      }, componentProps.value), {
-        "class": ["w-full min-w-25", componentProps.value.class]
-      });
+    const componentSlotsObj = vue.computed(() => {
       const { slots: componentSlots } = componentProps.value;
-      const _componentSlotsObj = typeof componentSlots === "function" ? componentSlots({
+      return typeof componentSlots === "function" ? componentSlots({
         model: props.model,
         field: props.field,
         $form: props.model
       }) : componentSlots;
-      switch (type) {
-        case "input":
-          return vue.h(
-            ElementPlus.ElInput,
-            __spreadProps(__spreadValues({}, commonProps), {
-              placeholder: commonProps.placeholder || "请输入",
-              prefixIcon: props.config.prefixIcon,
-              suffixIcon: props.config.suffixIcon
-            }),
-            _componentSlotsObj
-          );
-        case "textarea":
-          return vue.h(
-            ElementPlus.ElInput,
-            __spreadProps(__spreadValues({}, commonProps), {
-              placeholder: commonProps.placeholder || "请输入",
-              type: "textarea",
-              rows: 4
-            }),
-            _componentSlotsObj
-          );
-        case "select": {
-          const selectProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            placeholder: commonProps.placeholder || "请选择"
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElSelect, selectProps, _componentSlotsObj);
-        }
-        case "autocomplete": {
-          const autocompleteProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            placeholder: commonProps.placeholder || "请输入"
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElAutocomplete, autocompleteProps, _componentSlotsObj);
-        }
-        case "datepicker":
-          return vue.h(ElementPlus.ElDatePicker, __spreadValues(__spreadValues({
-            startPlaceholder: "开始日期",
-            endPlaceholder: "结束日期"
-          }, commonProps), componentProps.value), _componentSlotsObj);
-        case "datetime-picker":
-          return vue.h(ElementPlus.ElDatePicker, __spreadValues(__spreadValues({
-            startPlaceholder: "开始日期",
-            endPlaceholder: "结束日期"
-          }, commonProps), componentProps.value), _componentSlotsObj);
-        case "time-picker":
-          return vue.h(ElementPlus.ElTimePicker, __spreadValues(__spreadValues({
-            startPlaceholder: "开始时间",
-            endPlaceholder: "结束时间"
-          }, commonProps), componentProps.value), _componentSlotsObj);
-        case "time-select":
-          return vue.h(ElementPlus.ElTimeSelect, __spreadValues(__spreadValues({}, commonProps), componentProps.value), _componentSlotsObj);
-        case "radio-group": {
-          const radioGroupProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
-          return vue.h(
-            ElementPlus.ElRadioGroup,
-            radioGroupProps,
-            __spreadValues({
-              default: () => {
-                const options = componentProps.value.options || props.config.options || [];
-                return options.map(
-                  (option) => vue.h(radioGroupProps.button ? ElementPlus.ElRadioButton : ElementPlus.ElRadio, {
-                    key: option.value,
-                    value: option.value,
-                    disabled: option.disabled
-                  }, {
-                    default: () => option.label
-                  })
-                );
-              }
-            }, _componentSlotsObj)
-          );
-        }
-        case "checkbox-group": {
-          const arrayModelValue = Array.isArray(modelValue.value) ? modelValue.value : [];
-          const checkboxGroupProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            modelValue: arrayModelValue
-          }), componentProps.value);
-          return vue.h(
-            ElementPlus.ElCheckboxGroup,
-            checkboxGroupProps,
-            __spreadValues({
-              default: () => {
-                const options = componentProps.value.options || props.config.options || [];
-                return options.map(
-                  (option) => vue.h(ElementPlus.ElCheckbox, {
-                    key: option.value,
-                    value: option.value,
-                    disabled: option.disabled
-                  }, {
-                    default: () => option.label
-                  })
-                );
-              }
-            }, _componentSlotsObj)
-          );
-        }
-        case "switch":
-          return vue.h(ElementPlus.ElSwitch, __spreadValues(__spreadValues({}, commonProps), componentProps.value), _componentSlotsObj);
-        case "slider":
-          return vue.h(ElementPlus.ElSlider, __spreadValues(__spreadValues({}, commonProps), componentProps.value), _componentSlotsObj);
-        case "cascader": {
-          const cascaderProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            placeholder: commonProps.placeholder || "请选择"
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElCascader, cascaderProps, _componentSlotsObj);
-        }
-        case "tree-select": {
-          const treeSelectProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            placeholder: commonProps.placeholder || "请选择"
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElTreeSelect, treeSelectProps, _componentSlotsObj);
-        }
-        case "color-picker":
-          return vue.h(ElementPlus.ElColorPicker, __spreadValues(__spreadValues({}, commonProps), componentProps.value), _componentSlotsObj);
-        // 颜色选择器面板
-        case "color-picker-panel":
-          return vue.h(ElementPlus.ElColorPickerPanel, __spreadValues(__spreadValues({}, commonProps), componentProps.value), _componentSlotsObj);
-        // 标签输入框
-        case "input-tag": {
-          const inputTagProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            "modelValue": modelValue.value || [],
-            "onUpdate:modelValue": (val) => {
-              props.model[props.field] = val;
-            }
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElInputTag, inputTagProps, _componentSlotsObj);
-        }
-        // 提及组件
-        case "mention": {
-          const mentionProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            "modelValue": modelValue.value || "",
-            "onUpdate:modelValue": (val) => {
-              props.model[props.field] = val;
-            }
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElMention, mentionProps, _componentSlotsObj);
-        }
-        // 虚拟化选择器
-        case "select-v2": {
-          const selectV2Props = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            "modelValue": modelValue.value,
-            "onUpdate:modelValue": (val) => {
-              props.model[props.field] = val;
-            },
-            "options": componentProps.value.options || []
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElSelectV2, selectV2Props, _componentSlotsObj);
-        }
-        // 穿梭框
-        case "transfer": {
-          const transferProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            "modelValue": modelValue.value || [],
-            "onUpdate:modelValue": (val) => {
-              props.model[props.field] = val;
-            },
-            "data": componentProps.value.data || []
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElTransfer, transferProps, _componentSlotsObj);
-        }
-        // 表格选择器
-        case "select-table":
-          return vue.h(SelectTable_vue_vue_type_script_setup_true_lang.default, __spreadProps(__spreadValues(__spreadValues({}, commonProps), componentProps.value), {
-            labelWidth: formItemProps.value.labelWidth
-          }), _componentSlotsObj);
-        case "rate":
-          return vue.h(ElementPlus.ElRate, __spreadValues(__spreadValues({}, commonProps), componentProps.value), _componentSlotsObj);
-        case "input-number": {
-          const numberModelValue = modelValue.value === "" || modelValue.value === null || modelValue.value === void 0 ? null : Number(modelValue.value);
-          const inputNumberProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            "placeholder": commonProps.placeholder || "请输入",
-            "modelValue": numberModelValue,
-            "onUpdate:modelValue": (val) => {
-              props.model[props.field] = val;
-            }
-          }), componentProps.value);
-          return vue.h(ElementPlus.ElInputNumber, inputNumberProps, _componentSlotsObj);
-        }
-        // 图片上传
-        case "image-upload": {
-          const uploadProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            "action": componentProps.value.action || "#",
-            "file-list": componentProps.value.fileList || [],
-            "list-type": componentProps.value.listType || "picture-card",
-            "onPreview": componentProps.value.onPreview,
-            "onRemove": componentProps.value.onRemove
-          }), componentProps.value);
-          if (uploadProps["list-type"] === "picture-card") {
-            return vue.h(ElementPlus.ElUpload, uploadProps, __spreadValues({
-              default: () => vue.h("div", { class: "el-upload__picture-card-wrapper" }, [
-                vue.h(ElementPlus.ElIcon, { size: 24 }, { default: () => vue.h(iconsVue.Plus) })
-              ])
-            }, _componentSlotsObj));
-          }
-          if (uploadProps["list-type"] === "picture") {
-            return vue.h(ElementPlus.ElUpload, uploadProps, __spreadValues({
-              default: () => vue.h(ElementPlus.ElButton, { type: "primary" }, { default: () => "点击上传" })
-            }, _componentSlotsObj));
-          }
-          return vue.h(ElementPlus.ElUpload, uploadProps, _componentSlotsObj);
-        }
-        // 文件上传
-        case "file-upload": {
-          const uploadProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
-            "action": componentProps.value.action || "#",
-            "file-list": componentProps.value.fileList || [],
-            "list-type": componentProps.value.listType || "text",
-            "onPreview": componentProps.value.onPreview,
-            "onRemove": componentProps.value.onRemove
-          }), componentProps.value);
-          if (uploadProps["list-type"] === "text") {
-            return vue.h(ElementPlus.ElUpload, uploadProps, __spreadValues({
-              default: () => vue.h(ElementPlus.ElButton, { type: "primary" }, { default: () => "点击上传" })
-            }, _componentSlotsObj));
-          }
-          return vue.h(ElementPlus.ElUpload, uploadProps, _componentSlotsObj);
-        }
-        // CodeMirror 编辑器
-        case "code-mirror-editor": {
-          const codeMirrorProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
-          return vue.h(index$2.JkyCodeMirrorEditor, codeMirrorProps, _componentSlotsObj);
-        }
-        // RichEditor 富文本编辑器
-        case "rich-editor": {
-          const richEditorProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
-          return vue.h(index$1.JkyRichEditor, richEditorProps, _componentSlotsObj);
-        }
-        // AddInput 动态键值对输入框
-        case "add-input": {
-          const addInputProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
-          return vue.h(index.JkyAddInput, addInputProps, _componentSlotsObj);
-        }
-        // 联动下拉框
-        case "linked-select":
-          return vue.h(LinkedSelect_vue_vue_type_script_setup_true_lang.default, {
-            "config": props.config.config,
-            "modelValue": modelValue.value,
-            "disabled": props.disabled,
-            "componentProps": componentProps.value,
-            "onUpdate:modelValue": (val) => {
-              props.model[props.field] = val;
-            }
-          }, _componentSlotsObj);
-        // 高德地图坐标拾取器
-        case "amap-picker":
-          return vue.h(AMapPickerItem_vue_vue_type_script_setup_true_lang.default, __spreadProps(__spreadValues({
-            "modelValue": modelValue.value,
-            "disabled": props.disabled
-          }, props.config.componentProps), {
-            "onUpdate:modelValue": (val) => {
-              props.model[props.field] = val;
-            }
-          }), _componentSlotsObj);
-        case "custom":
-          return (_b = (_a = props.config).render) == null ? void 0 : _b.call(_a, commonProps);
-        default:
-          return vue.h(ElementPlus.ElInput, commonProps);
-      }
-    }
+    });
+    const componentMap = {
+      "input": InputItem_vue_vue_type_script_setup_true_lang.default,
+      "textarea": TextareaItem_vue_vue_type_script_setup_true_lang.default,
+      "select": SelectItem_vue_vue_type_script_setup_true_lang.default,
+      "autocomplete": AutocompleteItem_vue_vue_type_script_setup_true_lang.default,
+      "date-picker": DatePickerItem_vue_vue_type_script_setup_true_lang.default,
+      "datetime-picker": DatePickerItem_vue_vue_type_script_setup_true_lang.default,
+      "time-picker": TimePickerItem_vue_vue_type_script_setup_true_lang.default,
+      "time-select": TimeSelectItem_vue_vue_type_script_setup_true_lang.default,
+      "radio-group": RadioGroupItem_vue_vue_type_script_setup_true_lang.default,
+      "checkbox-group": CheckboxGroupItem_vue_vue_type_script_setup_true_lang.default,
+      "switch": SwitchItem_vue_vue_type_script_setup_true_lang.default,
+      "slider": SliderItem_vue_vue_type_script_setup_true_lang.default,
+      "cascader": CascaderItem_vue_vue_type_script_setup_true_lang.default,
+      "tree-select": TreeSelectItem_vue_vue_type_script_setup_true_lang.default,
+      "color-picker": ColorPickerItem_vue_vue_type_script_setup_true_lang.default,
+      "color-picker-panel": ColorPickerPanelItem_vue_vue_type_script_setup_true_lang.default,
+      "input-tag": InputTagItem_vue_vue_type_script_setup_true_lang.default,
+      "mention": MentionItem_vue_vue_type_script_setup_true_lang.default,
+      "select-v2": SelectV2Item_vue_vue_type_script_setup_true_lang.default,
+      "transfer": TransferItem_vue_vue_type_script_setup_true_lang.default,
+      "select-table": SelectTableItem_vue_vue_type_script_setup_true_lang.default,
+      "rate": RateItem_vue_vue_type_script_setup_true_lang.default,
+      "input-number": InputNumberItem_vue_vue_type_script_setup_true_lang.default,
+      "image-upload": ImageUploadItem_vue_vue_type_script_setup_true_lang.default,
+      "file-upload": FileUploadItem_vue_vue_type_script_setup_true_lang.default,
+      "code-mirror-editor": CodeMirrorEditorItem_vue_vue_type_script_setup_true_lang.default,
+      "rich-editor": RichEditorItem_vue_vue_type_script_setup_true_lang.default,
+      "add-input": AddInputItem_vue_vue_type_script_setup_true_lang.default,
+      "linked-select": LinkedSelectItem_vue_vue_type_script_setup_true_lang.default,
+      "amap-picker": AMapPickerItem_vue_vue_type_script_setup_true_lang.default,
+      "divider": DividerItem_vue_vue_type_script_setup_true_lang.default,
+      "custom": CustomItem_vue_vue_type_script_setup_true_lang.default
+    };
+    const currentComponent = vue.computed(() => {
+      const type = props.config.type || "input";
+      return componentMap[type] || InputItem_vue_vue_type_script_setup_true_lang.default;
+    });
     function renderHelpTooltip() {
       if (!props.config.help)
         return null;
@@ -592,10 +415,38 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
             ], 64)),
             __props.config.help && __props.config.help.tooltip ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(renderHelpTooltip()), { key: 2 })) : vue.createCommentVNode("", true)
           ]),
-          (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(renderComponent(__props.config.type || "input")))),
+          vue.createVNode(FormItemWrapper_vue_vue_type_script_setup_true_lang.default, {
+            status: propsLoadStatus.value,
+            error: loadError.value,
+            onRetry: reloadComponentProps
+          }, {
+            loading: vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "loading", { field: __props.field })
+            ]),
+            default: vue.withCtx(() => [
+              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(currentComponent.value), {
+                "model-value": modelValue.value,
+                config: __props.config,
+                "component-props": componentProps.value,
+                "component-slots": componentSlotsObj.value,
+                disabled: __props.disabled,
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = (val) => __props.model[__props.field] = val)
+              }, vue.createSlots({ _: 2 }, [
+                vue.renderList(Object.keys(_ctx.$slots), (name, index) => {
+                  return {
+                    name,
+                    fn: vue.withCtx((slotData) => [
+                      vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(slotData || {})))
+                    ])
+                  };
+                })
+              ]), 1032, ["model-value", "config", "component-props", "component-slots", "disabled"]))
+            ]),
+            _: 3
+          }, 8, ["status", "error"]),
           __props.config.help && !__props.config.help.tooltip ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(renderHelpText()), { key: 0 })) : vue.createCommentVNode("", true)
         ]),
-        _: 1
+        _: 3
       }, 16, ["prop", "rules", "class", "style"])) : (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElFormItem), vue.mergeProps({
         key: 2,
         label: __props.config.label,
@@ -607,9 +458,66 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValu
         default: vue.withCtx(() => [
           __props.config.prepend || __props.config.append ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
             __props.config.prepend ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5, vue.toDisplayString(__props.config.prepend), 1)) : vue.createCommentVNode("", true),
-            (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(renderComponent(__props.config.type || "input")))),
+            vue.createVNode(FormItemWrapper_vue_vue_type_script_setup_true_lang.default, {
+              status: propsLoadStatus.value,
+              error: loadError.value,
+              onRetry: reloadComponentProps
+            }, {
+              loading: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "loading", { field: __props.field })
+              ]),
+              default: vue.withCtx(() => [
+                (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(currentComponent.value), {
+                  "model-value": modelValue.value,
+                  config: __props.config,
+                  "component-props": componentProps.value,
+                  "component-slots": componentSlotsObj.value,
+                  disabled: __props.disabled,
+                  "onUpdate:modelValue": _cache[1] || (_cache[1] = (val) => __props.model[__props.field] = val)
+                }, vue.createSlots({ _: 2 }, [
+                  vue.renderList(Object.keys(_ctx.$slots), (name, index) => {
+                    return {
+                      name,
+                      fn: vue.withCtx((slotData) => [
+                        vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(slotData || {})))
+                      ])
+                    };
+                  })
+                ]), 1032, ["model-value", "config", "component-props", "component-slots", "disabled"]))
+              ]),
+              _: 3
+            }, 8, ["status", "error"]),
             __props.config.append ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_6, vue.toDisplayString(__props.config.append), 1)) : vue.createCommentVNode("", true)
-          ])) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(renderComponent(__props.config.type || "input")), { key: 1 })),
+          ])) : (vue.openBlock(), vue.createBlock(FormItemWrapper_vue_vue_type_script_setup_true_lang.default, {
+            key: 1,
+            status: propsLoadStatus.value,
+            error: loadError.value,
+            onRetry: reloadComponentProps
+          }, {
+            loading: vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "loading", { field: __props.field })
+            ]),
+            default: vue.withCtx(() => [
+              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(currentComponent.value), {
+                "model-value": modelValue.value,
+                config: __props.config,
+                "component-props": componentProps.value,
+                "component-slots": componentSlotsObj.value,
+                disabled: __props.disabled,
+                "onUpdate:modelValue": _cache[2] || (_cache[2] = (val) => __props.model[__props.field] = val)
+              }, vue.createSlots({ _: 2 }, [
+                vue.renderList(Object.keys(_ctx.$slots), (name, index) => {
+                  return {
+                    name,
+                    fn: vue.withCtx((slotData) => [
+                      vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(slotData || {})))
+                    ])
+                  };
+                })
+              ]), 1032, ["model-value", "config", "component-props", "component-slots", "disabled"]))
+            ]),
+            _: 3
+          }, 8, ["status", "error"])),
           __props.config.help && !__props.config.help.tooltip ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(renderHelpText()), { key: 2 })) : vue.createCommentVNode("", true)
         ]),
         _: 2

package/dist/lib/form/{FormItem.vue3.js → FormItem.vue2.js}

@@ -1,5 +1,4 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const FormItem_vue_vue_type_script_setup_true_lang = require("./FormItem.vue.js");
-;/* empty css               */
 exports.default = FormItem_vue_vue_type_script_setup_true_lang.default;