cnhis-design-vue 3.1.13-beta.0 → 3.1.13-beta.11

package/es/packages/form-render/src/components/renderer/cascader.js

@@ -21,6 +21,9 @@ const script = defineComponent({
     urlConfig: {
       type: Object
     },
+    onFocus: {
+      type: Function
+    },
     onChange: {},
     value: {}
   },
@@ -30,15 +33,12 @@ const script = defineComponent({
     emit
   }) {
     const _options = ref(null);
-    const {
-      title
-    } = useFormField();
     const asyncQueue = inject(InjectAsyncQueue);
     const {
-      field
+      field,
+      title
     } = useFormField();
     async function fetchData(option) {
-      var _a;
       if (!option && _options.value)
         return;
       const config = props.urlConfig;
@@ -48,56 +48,63 @@ const script = defineComponent({
         formRenderLog(`invalid urlConfig (${config}) in CASCADER => ${title.value}`, "warn");
         return;
       }
-      if ((option == null ? void 0 : option.depth) + 1 >= props.deep)
+      if (deepFor(option) + 1 >= props.deep)
         return;
-      const parentDepth = (_a = option == null ? void 0 : option.depth) != null ? _a : -1;
-      const params = {
-        lvlnr: parentDepth + 1 + ""
-      };
-      if (option) {
-        if (!config.dependKey) {
-          formRenderLog(`invalid urlConfig.dependKey ${config.dependKey} in CASCADER => ${title.value}`, "warn");
-          return;
-        }
-        arrayed(config.dependKey).forEach((key) => {
-          if (isString(key)) {
-            params[key] = option[valueKey.value];
-          } else if (isObject(key)) {
-            params[key.paramName] = option[key.paramValue];
-          }
-        });
-      }
       let data = await asyncQueue.addAsync({
-        ...config,
-        key: title.value,
-        params
+        ...createRequestParams(deepFor(option), config, option),
+        key: title.value
       });
       if (!Array.isArray(data)) {
         data = [];
       }
       if (!data.length && isObject(option)) {
         option.isLeaf = true;
-        let currentOption = option;
-        const result2 = [option];
+        updateValue(null, null, getOptionChain(option));
+        show.value = false;
+        return;
+      }
+      const result = data.map((item) => optionNormalize(item, deepFor(option)));
+      option ? option.children = result : _options.value = result;
+      function deepFor(option2) {
+        var _a;
+        return (_a = option2 == null ? void 0 : option2.depth) != null ? _a : -1;
+      }
+      function createRequestParams(deep, config2, option2) {
+        const params = {
+          lvlnr: deep + 1 + ""
+        };
+        if (option2 && config2.dependKey) {
+          arrayed(config2.dependKey).forEach((key) => {
+            if (isString(key)) {
+              params[key] = option2[valueKey.value];
+            } else if (isObject(key)) {
+              params[key.paramName] = option2[key.paramValue];
+            }
+          });
+        }
+        return {
+          params,
+          ...config2
+        };
+      }
+      function getOptionChain(option2) {
+        let currentOption = option2;
+        const result2 = [option2];
         while (currentOption.parent) {
           result2.unshift(currentOption.parent);
           currentOption = currentOption.parent;
         }
-        updateValue(null, null, result2);
-        show.value = false;
-        return;
+        return result2;
       }
-      const result = data.reduce((res, d) => {
-        res.push({
-          [labelKey.value]: d[labelKey.value],
-          [valueKey.value]: d[valueKey.value],
-          depth: parentDepth + 1,
+      function optionNormalize(data2, deep) {
+        return {
+          [labelKey.value]: data2[labelKey.value],
+          [valueKey.value]: data2[valueKey.value],
+          depth: deep + 1,
           parent: option,
-          isLeaf: parentDepth + 2 >= props.deep
-        });
-        return res;
-      }, []);
-      option ? option.children = result : _options.value = result;
+          isLeaf: deep + 2 >= props.deep
+        };
+      }
     }
     const renderOptions = computed(() => {
       return _options.value || props.options || [];
@@ -134,23 +141,28 @@ const script = defineComponent({
       }
     });
     function updateValue(_, __, options) {
-      const payload = Array.isArray(options) ? options.map((option) => ({
-        ...option,
-        label: option[labelKey.value],
-        children: void 0,
-        parent: void 0
-      })) : options;
-      emit("update:value", payload);
+      emit("update:value", options.map(optionSimplify));
+      function optionSimplify(option) {
+        return {
+          ...option,
+          label: option[labelKey.value],
+          children: void 0,
+          parent: void 0
+        };
+      }
     }
     const show = ref(false);
     function updateShow(v) {
       show.value = !!v;
       v && fetchData();
     }
-    function onFocus() {
-      if (isField(field.value)) {
-        field.value.visited = true;
-      }
+    function focusDecorator(onFocus) {
+      return (...args) => {
+        if (isField(field.value)) {
+          field.value.visited = true;
+        }
+        onFocus == null ? void 0 : onFocus(...args);
+      };
     }
     return () => {
       return createVNode(NCascader, {
@@ -163,7 +175,7 @@ const script = defineComponent({
         "options": renderOptions.value,
         "checkStrategy": "child",
         "onLoad": fetchData,
-        "onFocus": onFocus,
+        "onFocus": focusDecorator(props.onFocus),
         "onUpdate:show": updateShow
       }, slots);
     };

package/es/packages/form-render/src/components/renderer/formItem.d.ts

@@ -1,294 +1,9 @@
 export declare const FORM_ITEM: import("vue").DefineComponent<{
-    readonly label: StringConstructor;
-    readonly labelWidth: import("vue").PropType<string | number>;
-    readonly labelStyle: import("vue").PropType<string | import("vue").CSSProperties>;
-    readonly labelAlign: import("vue").PropType<import("naive-ui/es/form/src/interface").LabelAlign>;
-    readonly labelPlacement: import("vue").PropType<import("naive-ui/es/form/src/interface").LabelPlacement>;
-    readonly path: StringConstructor;
-    readonly first: BooleanConstructor;
-    readonly rulePath: StringConstructor;
-    readonly required: BooleanConstructor;
-    readonly showRequireMark: {
-        readonly type: import("vue").PropType<boolean | undefined>;
-        readonly default: undefined;
-    };
-    readonly requireMarkPlacement: import("vue").PropType<"left" | "right" | "right-hanging">;
-    readonly showFeedback: {
-        readonly type: import("vue").PropType<boolean | undefined>;
-        readonly default: undefined;
-    };
-    readonly rule: import("vue").PropType<import("naive-ui").FormItemRule | import("naive-ui").FormItemRule[]>;
-    readonly size: import("vue").PropType<"small" | "medium" | "large">;
-    readonly ignorePathChange: BooleanConstructor;
-    readonly validationStatus: import("vue").PropType<"success" | "warning" | "error">;
-    readonly feedback: StringConstructor;
-    readonly showLabel: {
-        readonly type: import("vue").PropType<boolean | undefined>;
-        readonly default: undefined;
-    };
-    readonly labelProps: import("vue").PropType<import("vue").LabelHTMLAttributes>;
-    readonly theme: import("vue").PropType<import("naive-ui/es/_mixins").Theme<"Form", {
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
-        lineHeight: string;
-        labelTextColor: string;
-        asteriskColor: string;
-        feedbackTextColorError: string;
-        feedbackTextColorWarning: string;
-        feedbackTextColor: string;
-        feedbackPadding: string;
-        feedbackHeightSmall: string;
-        feedbackHeightMedium: string;
-        feedbackHeightLarge: string;
-        feedbackFontSizeSmall: string;
-        feedbackFontSizeMedium: string;
-        feedbackFontSizeLarge: string;
-        labelFontSizeLeftSmall: string;
-        labelFontSizeLeftMedium: string;
-        labelFontSizeLeftLarge: string;
-        labelFontSizeTopSmall: string;
-        labelFontSizeTopMedium: string;
-        labelFontSizeTopLarge: string;
-        labelHeightSmall: string;
-        labelHeightMedium: string;
-        labelHeightLarge: string;
-        labelPaddingVertical: string;
-        labelPaddingHorizontal: string;
-        labelTextAlignVertical: string;
-        labelTextAlignHorizontal: string;
-    }, any>>;
-    readonly themeOverrides: import("vue").PropType<import("naive-ui/es/_mixins/use-theme").ExtractThemeOverrides<import("naive-ui/es/_mixins").Theme<"Form", {
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
-        lineHeight: string;
-        labelTextColor: string;
-        asteriskColor: string;
-        feedbackTextColorError: string;
-        feedbackTextColorWarning: string;
-        feedbackTextColor: string;
-        feedbackPadding: string;
-        feedbackHeightSmall: string;
-        feedbackHeightMedium: string;
-        feedbackHeightLarge: string;
-        feedbackFontSizeSmall: string;
-        feedbackFontSizeMedium: string;
-        feedbackFontSizeLarge: string;
-        labelFontSizeLeftSmall: string;
-        labelFontSizeLeftMedium: string;
-        labelFontSizeLeftLarge: string;
-        labelFontSizeTopSmall: string;
-        labelFontSizeTopMedium: string;
-        labelFontSizeTopLarge: string;
-        labelHeightSmall: string;
-        labelHeightMedium: string;
-        labelHeightLarge: string;
-        labelPaddingVertical: string;
-        labelPaddingHorizontal: string;
-        labelTextAlignVertical: string;
-        labelTextAlignHorizontal: string;
-    }, any>>>;
-    readonly builtinThemeOverrides: import("vue").PropType<import("naive-ui/es/_mixins/use-theme").ExtractThemeOverrides<import("naive-ui/es/_mixins").Theme<"Form", {
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
-        lineHeight: string;
-        labelTextColor: string;
-        asteriskColor: string;
-        feedbackTextColorError: string;
-        feedbackTextColorWarning: string;
-        feedbackTextColor: string;
-        feedbackPadding: string;
-        feedbackHeightSmall: string;
-        feedbackHeightMedium: string;
-        feedbackHeightLarge: string;
-        feedbackFontSizeSmall: string;
-        feedbackFontSizeMedium: string;
-        feedbackFontSizeLarge: string;
-        labelFontSizeLeftSmall: string;
-        labelFontSizeLeftMedium: string;
-        labelFontSizeLeftLarge: string;
-        labelFontSizeTopSmall: string;
-        labelFontSizeTopMedium: string;
-        labelFontSizeTopLarge: string;
-        labelHeightSmall: string;
-        labelHeightMedium: string;
-        labelHeightLarge: string;
-        labelPaddingVertical: string;
-        labelPaddingHorizontal: string;
-        labelTextAlignVertical: string;
-        labelTextAlignHorizontal: string;
-    }, any>>>;
-}, {
-    cssVars: import("vue").ComputedRef<{
-        '--n-bezier': string;
-        '--n-line-height': string;
-        '--n-blank-height': string;
-        '--n-label-font-size': string;
-        '--n-label-text-align': string;
-        '--n-label-height': string;
-        '--n-label-padding': string;
-        '--n-asterisk-color': string;
-        '--n-label-text-color': string;
-        '--n-feedback-padding': string;
-        '--n-feedback-font-size': string;
-        '--n-feedback-height': string;
-        '--n-feedback-text-color': string;
-        '--n-feedback-text-color-warning': string;
-        '--n-feedback-text-color-error': string;
-    }> | undefined;
-    themeClass: import("vue").Ref<string>;
-    onRender: () => void;
-    validate: import("naive-ui/es/form/src/interface").FormItemValidate;
-    restoreValidation: () => void;
-    path?: string | undefined;
-    internalValidate: import("naive-ui/es/form/src/interface").FormItemInternalValidate;
-    mergedSize: import("vue").ComputedRef<import("naive-ui/es/form/src/interface").Size>;
-    validationErrored: import("vue").Ref<boolean>;
-    mergedLabelStyle: import("vue").ComputedRef<(import("vue").StyleValue | undefined)[]>;
-    mergedLabelPlacement: import("vue").ComputedRef<import("naive-ui/es/form/src/interface").LabelPlacement>;
-    mergedLabelAlign: import("vue").ComputedRef<import("naive-ui/es/form/src/interface").LabelAlign | undefined>;
-    mergedShowRequireMark: import("vue").ComputedRef<boolean | undefined>;
-    mergedRequireMarkPlacement: import("vue").ComputedRef<"left" | "right" | "right-hanging">;
-    mergedValidationStatus: import("vue").ComputedRef<"success" | "warning" | "error" | undefined>;
-    mergedShowFeedback: import("vue").ComputedRef<boolean>;
-    mergedShowLabel: import("vue").ComputedRef<boolean>;
-    labelElementRef: import("vue").Ref<HTMLLabelElement | null>;
-    mergedClsPrefix: import("vue").ComputedRef<string>;
-    mergedRequired: import("vue").ComputedRef<boolean>;
-    feedbackId: import("vue").Ref<string>;
-    renderExplains: import("vue").Ref<{
-        key: string;
-        render: () => import("vue").VNodeChild;
-    }[]>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    readonly label: StringConstructor;
-    readonly labelWidth: import("vue").PropType<string | number>;
-    readonly labelStyle: import("vue").PropType<string | import("vue").CSSProperties>;
-    readonly labelAlign: import("vue").PropType<import("naive-ui/es/form/src/interface").LabelAlign>;
-    readonly labelPlacement: import("vue").PropType<import("naive-ui/es/form/src/interface").LabelPlacement>;
-    readonly path: StringConstructor;
-    readonly first: BooleanConstructor;
-    readonly rulePath: StringConstructor;
-    readonly required: BooleanConstructor;
-    readonly showRequireMark: {
-        readonly type: import("vue").PropType<boolean | undefined>;
-        readonly default: undefined;
-    };
-    readonly requireMarkPlacement: import("vue").PropType<"left" | "right" | "right-hanging">;
-    readonly showFeedback: {
-        readonly type: import("vue").PropType<boolean | undefined>;
-        readonly default: undefined;
-    };
-    readonly rule: import("vue").PropType<import("naive-ui").FormItemRule | import("naive-ui").FormItemRule[]>;
-    readonly size: import("vue").PropType<"small" | "medium" | "large">;
-    readonly ignorePathChange: BooleanConstructor;
-    readonly validationStatus: import("vue").PropType<"success" | "warning" | "error">;
-    readonly feedback: StringConstructor;
-    readonly showLabel: {
-        readonly type: import("vue").PropType<boolean | undefined>;
-        readonly default: undefined;
-    };
-    readonly labelProps: import("vue").PropType<import("vue").LabelHTMLAttributes>;
-    readonly theme: import("vue").PropType<import("naive-ui/es/_mixins").Theme<"Form", {
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
-        lineHeight: string;
-        labelTextColor: string;
-        asteriskColor: string;
-        feedbackTextColorError: string;
-        feedbackTextColorWarning: string;
-        feedbackTextColor: string;
-        feedbackPadding: string;
-        feedbackHeightSmall: string;
-        feedbackHeightMedium: string;
-        feedbackHeightLarge: string;
-        feedbackFontSizeSmall: string;
-        feedbackFontSizeMedium: string;
-        feedbackFontSizeLarge: string;
-        labelFontSizeLeftSmall: string;
-        labelFontSizeLeftMedium: string;
-        labelFontSizeLeftLarge: string;
-        labelFontSizeTopSmall: string;
-        labelFontSizeTopMedium: string;
-        labelFontSizeTopLarge: string;
-        labelHeightSmall: string;
-        labelHeightMedium: string;
-        labelHeightLarge: string;
-        labelPaddingVertical: string;
-        labelPaddingHorizontal: string;
-        labelTextAlignVertical: string;
-        labelTextAlignHorizontal: string;
-    }, any>>;
-    readonly themeOverrides: import("vue").PropType<import("naive-ui/es/_mixins/use-theme").ExtractThemeOverrides<import("naive-ui/es/_mixins").Theme<"Form", {
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
-        lineHeight: string;
-        labelTextColor: string;
-        asteriskColor: string;
-        feedbackTextColorError: string;
-        feedbackTextColorWarning: string;
-        feedbackTextColor: string;
-        feedbackPadding: string;
-        feedbackHeightSmall: string;
-        feedbackHeightMedium: string;
-        feedbackHeightLarge: string;
-        feedbackFontSizeSmall: string;
-        feedbackFontSizeMedium: string;
-        feedbackFontSizeLarge: string;
-        labelFontSizeLeftSmall: string;
-        labelFontSizeLeftMedium: string;
-        labelFontSizeLeftLarge: string;
-        labelFontSizeTopSmall: string;
-        labelFontSizeTopMedium: string;
-        labelFontSizeTopLarge: string;
-        labelHeightSmall: string;
-        labelHeightMedium: string;
-        labelHeightLarge: string;
-        labelPaddingVertical: string;
-        labelPaddingHorizontal: string;
-        labelTextAlignVertical: string;
-        labelTextAlignHorizontal: string;
-    }, any>>>;
-    readonly builtinThemeOverrides: import("vue").PropType<import("naive-ui/es/_mixins/use-theme").ExtractThemeOverrides<import("naive-ui/es/_mixins").Theme<"Form", {
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
-        lineHeight: string;
-        labelTextColor: string;
-        asteriskColor: string;
-        feedbackTextColorError: string;
-        feedbackTextColorWarning: string;
-        feedbackTextColor: string;
-        feedbackPadding: string;
-        feedbackHeightSmall: string;
-        feedbackHeightMedium: string;
-        feedbackHeightLarge: string;
-        feedbackFontSizeSmall: string;
-        feedbackFontSizeMedium: string;
-        feedbackFontSizeLarge: string;
-        labelFontSizeLeftSmall: string;
-        labelFontSizeLeftMedium: string;
-        labelFontSizeLeftLarge: string;
-        labelFontSizeTopSmall: string;
-        labelFontSizeTopMedium: string;
-        labelFontSizeTopLarge: string;
-        labelHeightSmall: string;
-        labelHeightMedium: string;
-        labelHeightLarge: string;
-        labelPaddingVertical: string;
-        labelPaddingHorizontal: string;
-        labelTextAlignVertical: string;
-        labelTextAlignHorizontal: string;
-    }, any>>>;
-}>>, {
-    readonly required: boolean;
-    readonly first: boolean;
-    readonly showRequireMark: boolean | undefined;
-    readonly showFeedback: boolean | undefined;
-    readonly showLabel: boolean | undefined;
-    readonly ignorePathChange: boolean;
-}>;
+    label: StringConstructor;
+    propertyKey: StringConstructor;
+    annotation: {};
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    label: StringConstructor;
+    propertyKey: StringConstructor;
+    annotation: {};
+}>>, {}>;

package/es/packages/form-render/src/components/renderer/formItem.js

@@ -1,8 +1,143 @@
+import { defineComponent, inject, computed, ref, createVNode } from 'vue';
 import { isVoidField } from '@formily/core';
 import { connect, mapProps } from '@formily/vue';
-import { NFormItem } from 'naive-ui';
+import { FileTrayFull, FileTray } from '@vicons/ionicons5';
+import { isBoolean } from 'lodash-es';
+import { NFormItem, NPopover, NIcon, NInput } from 'naive-ui';
+import { InjectionAnnotation } from '../../../../../packages/form-render/src/constants';
 
-const FORM_ITEM = connect(NFormItem, mapProps({
+const script = defineComponent({
+  props: {
+    label: String,
+    propertyKey: String,
+    annotation: {}
+  },
+  setup(props, {
+    slots
+  }) {
+    const annotation = inject(InjectionAnnotation);
+    const annotationContent = computed({
+      get() {
+        return annotation.value[props.propertyKey];
+      },
+      set(value) {
+        annotation.value = {
+          property: props.propertyKey,
+          value
+        };
+      }
+    });
+    function renderTextarea() {
+      return createVNode(NInput, {
+        "type": "textarea",
+        "value": annotationContent.value,
+        "onUpdate:value": ($event) => annotationContent.value = $event
+      }, null);
+    }
+    const __showPopper = ref(false);
+    const showPopper = computed({
+      get() {
+        return __showPopper.value;
+      },
+      async set(value) {
+        __showPopper.value = value;
+        if (!value && isEdit.value) {
+          await new Promise((resolve) => setTimeout(resolve, 200));
+          isEdit.value = false;
+        }
+      }
+    });
+    const isEdit = ref(false);
+    let clickTimer;
+    function iconClick() {
+      clearTimeout(clickTimer);
+      if (showPopper.value && isEdit.value) {
+        showPopper.value = false;
+        return;
+      }
+      clickTimer = setTimeout(() => {
+        if (!annotationContent.value) {
+          isEdit.value = showPopper.value = true;
+        }
+      }, 200);
+    }
+    function iconDbClick() {
+      clearTimeout(clickTimer);
+      if (!annotationContent.value)
+        return;
+      showPopper.value = true;
+      isEdit.value = true;
+    }
+    function iconMouseenter() {
+      if (!annotationContent.value)
+        return;
+      showPopper.value = true;
+    }
+    function iconMouseleave() {
+      if (!annotationContent.value || isEdit.value)
+        return;
+      showPopper.value = false;
+    }
+    function renderAnnotation() {
+      return createVNode("section", {
+        "class": ["form-render__formItemLabel--annotation", {
+          "is-active": !!annotationContent.value
+        }],
+        "style": {
+          "--icon-right": "-5"
+        },
+        "form-item-hover-show": !annotationContent.value && !isEdit.value
+      }, [createVNode(NPopover, {
+        "style": {
+          maxWidth: "200px",
+          wordBreak: "break-all"
+        },
+        "show": showPopper.value,
+        "onUpdate:show": ($event) => showPopper.value = $event,
+        "trigger": "manual",
+        "duration": 100
+      }, {
+        default: renderDefault,
+        trigger: renderTrigger
+      })]);
+      function renderText() {
+        return createVNode("span", null, [annotationContent.value]);
+      }
+      function renderDefault() {
+        return createVNode("div", null, [isEdit.value ? renderTextarea() : renderText()]);
+      }
+      function renderTrigger() {
+        return createVNode("div", {
+          "class": "form-render__formItemLabel--icon",
+          "onMouseleave": iconMouseleave,
+          "onMouseenter": iconMouseenter,
+          "onDblclick": iconDbClick,
+          "onClick": iconClick
+        }, [createVNode(NIcon, {
+          "component": annotationContent.value ? FileTrayFull : FileTray
+        }, null)]);
+      }
+    }
+    const showAnnotation = computed(() => {
+      return annotation.value && (!isBoolean(props.annotation) || props.annotation);
+    });
+    const showLabel = computed(() => props.label && props.label !== " ");
+    function renderLabel() {
+      return showLabel.value ? createVNode("section", {
+        "class": "form-render__formItemLabel"
+      }, [createVNode("span", {
+        "class": ["form-render__formItemLabel--text", {
+          "has-annotation": showAnnotation.value
+        }]
+      }, [props.label]), showAnnotation.value ? renderAnnotation() : null]) : null;
+    }
+    return () => createVNode(NFormItem, null, {
+      ...slots,
+      label: renderLabel
+    });
+  }
+});
+const FORM_ITEM = connect(script, mapProps({
   title: "label"
 }, (props, field) => {
   var _a;

package/es/packages/form-render/src/components/renderer/input.js

@@ -1,5 +1,5 @@
 import { defineComponent, computed, createVNode, Fragment } from 'vue';
-import { assignUpdateValue } from '../../utils/index.js';
+import { createSlot, assignUpdateValue } from '../../utils/index.js';
 import { connect, mapProps } from '@formily/vue';
 import { NInput } from 'naive-ui';
 
@@ -19,10 +19,10 @@ const script = defineComponent({
     const _slots = computed(() => {
       const res = {};
       if (props.prefix) {
-        res.prefix = () => createVNode(Fragment, null, [props.prefix]);
+        res.prefix = () => createVNode(Fragment, null, [createSlot(props.prefix, props).default()]);
       }
       if (props.suffix) {
-        res.suffix = () => createVNode(Fragment, null, [props.suffix]);
+        res.suffix = () => createVNode(Fragment, null, [createSlot(props.suffix, props).default()]);
       }
       return res;
     });

package/es/packages/form-render/src/components/renderer/select.d.ts

@@ -1,4 +1,4 @@
-import { AnyObject } from '../../../../../../es/src/types';
+import { AnyObject, Func } from '../../../../../../es/src/types';
 import { FormRequestType } from '../../types';
 import { PropType } from 'vue';
 declare type UrlConfig = {
@@ -20,9 +20,10 @@ export declare const SELECT: import("vue").DefineComponent<{
     urlConfig: {
         type: PropType<UrlConfig>;
     };
-    onChange: {
-        type: FunctionConstructor;
+    onFocus: {
+        type: PropType<Func<any[], any>>;
     };
+    onChange: {};
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:value"[], "update:value", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     value: {
         type: StringConstructor;
@@ -34,9 +35,10 @@ export declare const SELECT: import("vue").DefineComponent<{
     urlConfig: {
         type: PropType<UrlConfig>;
     };
-    onChange: {
-        type: FunctionConstructor;
+    onFocus: {
+        type: PropType<Func<any[], any>>;
     };
+    onChange: {};
 }>> & {
     "onUpdate:value"?: ((...args: any[]) => any) | undefined;
 }, {