vue-devui 1.0.0-beta.17 → 1.0.0-beta.18

package/vue-devui.es.js

@@ -33,7 +33,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { createVNode, getCurrentInstance, defineComponent, toRefs, inject, computed, Fragment, mergeProps, resolveComponent, createTextVNode, provide, onMounted, watch, ref, Transition, withDirectives, vShow, nextTick, h, render, resolveDirective, Teleport, renderSlot, isVNode, onUnmounted, reactive, toRef, isRef, onBeforeUnmount, Comment as Comment$1, onUpdated, onBeforeMount, readonly, unref, createApp, useSlots, shallowRef } from "vue";
+import { createVNode, getCurrentInstance, defineComponent, toRefs, inject, computed, Fragment, mergeProps, resolveComponent, createTextVNode, provide, onMounted, watch, ref, Transition, withDirectives, vShow, nextTick, h, render, resolveDirective, Teleport, renderSlot, isVNode, onUnmounted, reactive, toRef, isRef, onBeforeUnmount, Comment as Comment$1, onUpdated, onBeforeMount, readonly, unref, createApp, withModifiers, useSlots, shallowRef } from "vue";
 const accordionProps = {
   data: {
     type: Array,
@@ -2752,49 +2752,59 @@ var IconInstall = {
   }
 };
 const buttonProps = {
-  type: {
-    type: String,
-    default: "button"
-  },
   variant: {
     type: String,
-    default: "primary"
+    default: "outline"
   },
   size: {
     type: String,
     default: "md"
   },
-  position: {
-    type: String,
-    default: "default"
-  },
-  bordered: {
-    type: Boolean,
-    default: false
+  color: {
+    type: String
   },
   icon: {
     type: String,
     default: ""
   },
-  showLoading: {
+  loading: {
     type: Boolean,
     default: false
   },
-  width: {
-    type: String
-  },
   disabled: {
     type: Boolean,
     default: false
-  },
-  autofocus: {
-    type: Boolean,
-    default: false
-  },
-  onClick: {
-    type: Function
   }
 };
+function useButton(props, ctx2) {
+  const hasContent = computed(() => ctx2.slots.default);
+  const colorMap = {
+    solid: "primary",
+    outline: "secondary",
+    text: "secondary"
+  };
+  const defaultColor = colorMap[props.variant];
+  const classes = computed(() => ({
+    "devui-btn": true,
+    [`devui-btn-${props.variant}`]: true,
+    [`devui-btn-${props.variant}-${props.color || defaultColor}`]: true,
+    [`devui-btn-${props.size}`]: true,
+    "devui-btn-icon-wrap": props.icon,
+    "devui-btn-icon": props.icon && !hasContent.value && props.variant !== "solid"
+  }));
+  const iconClass = computed(() => {
+    if (!props.icon) {
+      return;
+    }
+    const origin = "devui-icon-fix icon";
+    if (hasContent.value) {
+      return `${origin} clear-right-5`;
+    } else {
+      return origin;
+    }
+  });
+  return { classes, iconClass };
+}
 var button = "";
 var DButton = defineComponent({
   name: "DButton",
@@ -2802,115 +2812,45 @@ var DButton = defineComponent({
     devLoading: loadingDirective
   },
   props: buttonProps,
+  emits: ["click"],
   setup(props, ctx2) {
-    const buttonContent = ref(null);
+    const {
+      icon,
+      disabled,
+      loading: loading2
+    } = toRefs(props);
+    const {
+      classes,
+      iconClass
+    } = useButton(props, ctx2);
     const onClick = (e) => {
-      var _a;
-      if (props.showLoading) {
+      if (loading2.value) {
         return;
       }
-      (_a = props.onClick) == null ? void 0 : _a.call(props, e);
+      ctx2.emit("click", e);
     };
-    const hasContent = computed(() => ctx2.slots.default);
-    const btnClass = computed(() => {
-      const {
-        variant,
-        size,
-        position,
-        bordered,
-        icon
-      } = props;
-      const origin = `devui-btn devui-btn-${variant} devui-btn-${size} devui-btn-${position}`;
-      const borderedClass = bordered ? "bordered" : "";
-      const btnIcon = !!icon && !hasContent.value && variant !== "primary" ? "d-btn-icon" : "";
-      const btnIconWrap = !!icon ? "d-btn-icon-wrap" : "";
-      return `${origin} ${borderedClass} ${btnIcon} ${btnIconWrap}`;
-    });
-    const iconClass = computed(() => {
-      if (!props.icon) {
-        return;
-      }
-      const origin = "devui-icon-fix icon";
-      if (hasContent.value) {
-        return `${origin} clear-right-5`;
-      } else {
-        return origin;
-      }
-    });
     return () => {
       var _a, _b;
-      const {
-        icon,
-        type: type4,
-        disabled,
-        showLoading,
-        width
-      } = props;
-      return createVNode("div", mergeProps({
-        "class": "devui-btn-host"
-      }, ctx2.attrs), [withDirectives(createVNode("button", {
-        "class": btnClass.value,
-        "type": type4,
-        "disabled": disabled,
-        "style": {
-          width
-        },
+      return withDirectives(createVNode("button", {
+        "class": classes.value,
+        "disabled": disabled.value,
         "onClick": onClick
-      }, [!!icon ? createVNode(Icon, {
-        "name": icon,
+      }, [icon.value && createVNode(Icon, {
+        "name": icon.value,
+        "size": "12px",
         "class": iconClass.value
-      }, null) : null, createVNode("span", {
-        "class": "button-content",
-        "ref": buttonContent
-      }, [(_b = (_a = ctx2.slots).default) == null ? void 0 : _b.call(_a)])]), [[resolveDirective("devLoading"), showLoading]])]);
+      }, null), createVNode("span", {
+        "class": "button-content"
+      }, [(_b = (_a = ctx2.slots).default) == null ? void 0 : _b.call(_a)])]), [[resolveDirective("dLoading"), loading2.value]]);
     };
   }
 });
-const loadingConstructor = defineComponent(Loading);
-const cacheTarget = /* @__PURE__ */ new WeakMap();
-const loading = {
-  open(options = {}) {
-    const parent = options.target || document.body;
-    if (cacheTarget.has(parent)) {
-      return cacheTarget.get(parent);
-    }
-    parent.style.position = options.positionType;
-    const isFull = document.body === parent;
-    options = __spreadValues(__spreadValues({}, new LoadingProps()), options);
-    const instance = createComponent$1(loadingConstructor, __spreadProps(__spreadValues({}, options), {
-      isFull
-    }), options.loadingTemplateRef ? () => options.loadingTemplateRef : null);
-    cacheTarget.set(parent, instance);
-    instance.proxy.open();
-    parent.appendChild(instance.proxy.$el);
-    const close = instance.proxy.close;
-    instance.loadingInstance = instance.proxy;
-    instance.loadingInstance.close = (...args) => {
-      cacheTarget.delete(parent);
-      close(...args);
-    };
-    return instance;
-  }
-};
-var LoadingInstall = {
-  title: "Loading \u52A0\u8F7D\u63D0\u793A",
-  category: "\u53CD\u9988",
-  status: "100%",
-  install(app) {
-    app.directive("dLoading", loadingDirective);
-    app.config.globalProperties.$loadingService = loading;
-  }
-};
-DButton.install = function(app) {
-  app.directive("dLoading", loadingDirective);
-  app.component(DButton.name, DButton);
-};
 var ButtonInstall = {
   title: "Button \u6309\u94AE",
   category: "\u901A\u7528",
   status: "100%",
   install(app) {
-    app.use(DButton);
+    app.component(DButton.name, DButton);
   }
 };
 var card = "";
@@ -13888,14 +13828,18 @@ const drawerProps = {
     type: Boolean,
     default: false
   },
+  showAnimation: {
+    type: Boolean,
+    default: true
+  },
   beforeHidden: {
     type: [Promise, Function]
   },
   content: {
-    type: [Object, Function]
+    type: Object
   },
   header: {
-    type: [Object, Function]
+    type: Object
   }
 };
 var drawerHeader = "";
@@ -13934,12 +13878,8 @@ var DrawerHeader = defineComponent({
     if (destroyOnHide.value && !visible) {
       return null;
     }
-    const visibleVal = visible ? "visible" : "hidden";
     return createVNode("div", {
-      "class": "devui-drawer-header",
-      "style": {
-        visibility: visibleVal
-      }
+      "class": "devui-drawer-header"
     }, [createVNode("div", {
       "class": "devui-drawer-header-item"
     }, [createVNode("span", {
@@ -13975,12 +13915,7 @@ var DrawerContainer = defineComponent({
     if (destroyOnHide.value && !visible) {
       return null;
     }
-    const visibleVal = this.visible ? "visible" : "hidden";
-    return createVNode("div", {
-      "style": {
-        visibility: visibleVal
-      }
-    }, [createTextVNode("\u5185\u5BB9\u533A\u57DF")]);
+    return createVNode("div", null, [createTextVNode("\u5185\u5BB9\u533A\u57DF")]);
   }
 });
 var drawerBody = "";
@@ -13998,6 +13933,7 @@ var DrawerBody = defineComponent({
     const visible = inject("visible");
     const backdropCloseable = inject("backdropCloseable");
     const destroyOnHide = inject("destroyOnHide");
+    const showAnimation = inject("showAnimation");
     const navRight = computed(() => position.value === "right" ? {
       "right": 0
     } : {
@@ -14019,6 +13955,8 @@ var DrawerBody = defineComponent({
       navRight,
       navWidth,
       visible,
+      position,
+      showAnimation,
       clickContent,
       handleDrawerClose,
       destroyOnHide
@@ -14031,36 +13969,42 @@ var DrawerBody = defineComponent({
       isCover,
       navRight,
       navWidth,
+      showAnimation,
       visible,
       handleDrawerClose,
-      destroyOnHide
+      destroyOnHide,
+      position
     } = this;
     if (destroyOnHide.value && !visible) {
       return null;
     }
-    const visibleVal = visible ? "visible" : "hidden";
+    const transitionName = showAnimation ? position : "none";
     return createVNode("div", {
       "class": "devui-drawer",
       "style": {
-        zIndex: zindex,
-        visibility: visibleVal
+        zIndex: zindex
       },
       "onClick": handleDrawerClose
     }, [isCover ? createVNode("div", {
       "class": "devui-overlay-backdrop"
-    }, null) : null, createVNode("div", {
-      "class": "devui-overlay-wrapper"
-    }, [createVNode("div", {
-      "class": "devui-drawer-nav",
-      "style": __spreadValues({
-        "width": navWidth
-      }, navRight)
-    }, [createVNode("div", {
-      "class": "devui-drawer-content",
-      "onClick": this.clickContent
-    }, [slots.default ? slots.default() : null])])])]);
+    }, null) : null, createVNode(Transition, {
+      "name": "devui-drawer-" + transitionName
+    }, {
+      default: () => [withDirectives(createVNode("div", {
+        "class": "devui-overlay-wrapper"
+      }, [createVNode("div", {
+        "class": "devui-drawer-nav",
+        "style": __spreadValues({
+          "width": navWidth
+        }, navRight)
+      }, [createVNode("div", {
+        "class": "devui-drawer-content",
+        "onClick": this.clickContent
+      }, [slots.default ? slots.default() : null])])]), [[vShow, visible]])]
+    })]);
   }
 });
+var drawer = "";
 var Drawer$1 = defineComponent({
   name: "DDrawer",
   props: drawerProps,
@@ -14077,7 +14021,8 @@ var Drawer$1 = defineComponent({
       escKeyCloseable,
       position,
       backdropCloseable,
-      destroyOnHide
+      destroyOnHide,
+      showAnimation
     } = toRefs(props);
     const isFullScreen = ref(false);
     const fullscreen2 = () => {
@@ -14122,6 +14067,7 @@ var Drawer$1 = defineComponent({
     provide("isFullScreen", isFullScreen);
     provide("backdropCloseable", backdropCloseable);
     provide("destroyOnHide", destroyOnHide);
+    provide("showAnimation", showAnimation);
     onUnmounted(() => {
       document.removeEventListener("keyup", escCloseDrawer);
     });
@@ -14143,15 +14089,10 @@ var Drawer$1 = defineComponent({
     if (destroyOnHide.value && !visible) {
       return null;
     }
-    const visibleVal = visible ? "visible" : "hidden";
     return createVNode(Teleport, {
       "to": "body"
     }, {
-      default: () => [createVNode(DrawerBody, {
-        "style": {
-          visibility: visibleVal
-        }
-      }, {
+      default: () => [withDirectives(createVNode(DrawerBody, null, {
         default: () => [this.slots.header ? this.slots.header({
           fullscreen: fullscreen2,
           closeDrawer
@@ -14159,18 +14100,19 @@ var Drawer$1 = defineComponent({
           "onToggleFullScreen": fullscreen2,
           "onClose": closeDrawer
         }, null), this.slots.content ? this.slots.content() : createVNode(DrawerContainer, null, null)]
-      })]
+      }), [[vShow, visible]])]
     });
   }
 });
-function createDrawerApp(props, drawer, el) {
-  if (drawer) {
-    return drawer;
+function createDrawerApp(props, drawer2, el) {
+  if (drawer2) {
+    return drawer2;
   }
-  const res = createApp(createVNode(Drawer$1, {
+  const restProps = lodash.exports.omit(props, ["header", "content", "visible"]);
+  const res = createApp(createVNode(Drawer$1, mergeProps({
     "visible": props.visible,
     "onUpdate:visible": ($event) => props.visible = $event
-  }, {
+  }, restProps), {
     header: props.header,
     content: props.content
   }));
@@ -14178,11 +14120,11 @@ function createDrawerApp(props, drawer, el) {
   return res;
 }
 class DrawerService {
-  static create(props, drawer) {
-    if (!drawer) {
-      drawer = new Drawer(props);
+  static create(props, drawer2) {
+    if (!drawer2) {
+      drawer2 = new Drawer(props);
     }
-    return drawer;
+    return drawer2;
   }
 }
 class Drawer {
@@ -14468,60 +14410,42 @@ var DropdownInstall = {
 };
 const editableSelectProps = {
   appendToBody: {
-    type: Boolean,
-    default: false
-  },
-  modelValue: {
-    type: [String, Number]
+    type: Boolean
   },
   options: {
     type: Array,
     default: () => []
   },
-  width: {
-    type: Number,
-    default: 450
-  },
-  maxHeight: {
-    type: Number
-  },
   disabled: {
-    type: Boolean,
-    default: false
-  },
-  disabledKey: {
-    type: String
-  },
-  remote: {
-    type: Boolean,
-    default: false
+    type: Boolean
   },
   loading: {
     type: Boolean
   },
-  enableLazyLoad: {
-    type: Boolean,
-    default: false
+  optionDisabledKey: {
+    type: String,
+    default: ""
   },
-  remoteMethod: {
-    type: Function
+  placeholder: {
+    type: String,
+    default: "Search"
   },
-  filterMethod: {
-    type: Function
+  modelValue: {
+    type: String
   },
-  searchFn: {
-    type: Function
+  width: {
+    type: Number
+  },
+  maxHeight: {
+    type: Number
+  },
+  filterOption: {
+    type: [Function, Boolean]
   },
   loadMore: {
     type: Function
   }
 };
-const selectDropdownProps = {
-  options: {
-    type: Array,
-    default: () => []
-  }
-};
 function className$2(classStr, classOpt) {
   let classname = classStr;
   if (typeof classOpt === "object") {
@@ -14531,71 +14455,56 @@ function className$2(classStr, classOpt) {
   }
   return classname;
 }
-var SelectDropdown = defineComponent({
-  name: "DSelectDropdown",
-  props: selectDropdownProps,
-  setup(props) {
-    const select2 = inject("InjectionKey");
-    const {
-      props: selectProps2,
-      dropdownRef,
-      visible,
-      selectOptionClick,
-      renderDefaultSlots,
-      renderEmptySlots,
-      selectedIndex,
-      hoverIndex,
-      loadMore
-    } = select2;
-    const {
-      maxHeight
-    } = selectProps2;
-    return () => {
-      const getLiCls = (item2, index2) => {
-        const {
-          disabledKey
-        } = selectProps2;
-        return className$2("devui-dropdown-item", {
-          disabled: disabledKey ? !!item2[disabledKey] : false,
-          selected: selectedIndex.value === index2,
-          "devui-dropdown-bg": hoverIndex.value === index2
-        });
-      };
-      return withDirectives(createVNode("div", {
-        "class": "devui-dropdown-menu"
-      }, [createVNode("ul", {
-        "ref": dropdownRef,
-        "class": "devui-list-unstyled scroll-height",
-        "style": {
-          maxHeight: maxHeight + "px"
-        },
-        "onScroll": loadMore
-      }, [props.options.map((o, index2) => {
-        return createVNode("li", {
-          "class": getLiCls(o, index2),
-          "onClick": ($evnet) => selectOptionClick($evnet, o)
-        }, [renderDefaultSlots(o)]);
-      }), withDirectives(createVNode("li", {
-        "class": "devui-no-result-template"
-      }, [createVNode("div", {
-        "class": "devui-no-data-tip"
-      }, [renderEmptySlots()])]), [[vShow, props.options.length === 0]])])]), [[vShow, visible]]);
-    };
+var editableSelect = "";
+const getFilterFunc = () => (val, option2) => option2.label.toLocaleLowerCase().indexOf(val.toLocaleLowerCase()) > -1;
+const userFilterOptions = (normalizeOptions, inputValue, filterOption) => computed(() => {
+  const filteredOptions = [];
+  if (!inputValue.value || filterOption === false) {
+    return normalizeOptions.value;
   }
+  const filterFunc = typeof filterOption === "function" ? filterOption : getFilterFunc();
+  normalizeOptions.value.forEach((option2) => {
+    if (filterFunc(inputValue.value, option2)) {
+      filteredOptions.push(option2);
+    }
+  });
+  return filteredOptions;
 });
-var editableSelect = "";
-function keyboardSelect(dropdownRef, visible, hoverIndex, selectedIndex, filteredOptions, toggleMenu, selectOptionClick) {
-  const updateHoverIndex = (index2) => {
+const useInput = (inputValue, ctx2) => {
+  const onInputChange = (value) => {
+    ctx2.emit("search", value);
+  };
+  const handleInput = (event) => {
+    const value = event.target.value;
+    inputValue.value = value;
+    onInputChange(value);
+  };
+  return {
+    handleInput
+  };
+};
+const useLazyLoad = (dropdownRef, inputValue, filterOtion, load) => {
+  const loadMore = () => {
+    if (filterOtion !== false)
+      return;
+    if (dropdownRef.value.clientHeight + dropdownRef.value.scrollTop >= dropdownRef.value.scrollHeight) {
+      load(inputValue.value);
+    }
+  };
+  return { loadMore };
+};
+const useKeyboardSelect = (dropdownRef, disabled, visible, hoverIndex, selectedIndex, options, toggleMenu, closeMenu, handleClick) => {
+  const updateHoveringIndex = (index2) => {
     hoverIndex.value = index2;
   };
-  const scrollToActive = (index2) => {
-    const dropdownVal = dropdownRef.value;
-    const li = dropdownVal.children[index2];
+  const scrollToItem = (index2) => {
+    const ul = dropdownRef.value;
+    const li = ul.children[index2];
     nextTick(() => {
       if (li.scrollIntoViewIfNeeded) {
         li.scrollIntoViewIfNeeded(false);
       } else {
-        const containerInfo = dropdownVal.getBoundingClientRect();
+        const containerInfo = ul.getBoundingClientRect();
         const elementInfo = li.getBoundingClientRect();
         if (elementInfo.bottom > containerInfo.bottom || elementInfo.top < containerInfo.top) {
           li.scrollIntoView(false);
@@ -14603,227 +14512,238 @@ function keyboardSelect(dropdownRef, visible, hoverIndex, selectedIndex, filtere
       }
     });
   };
-  const onKeyboardSelect = (e) => {
-    const option2 = filteredOptions.value[hoverIndex.value];
-    selectOptionClick(e, option2);
-    hoverIndex.value = selectedIndex.value;
-  };
-  const handleKeydown = (e) => {
-    const keyCode = e.key || e.code;
-    let index2 = 0;
-    if (!visible.value) {
-      toggleMenu();
+  const onKeyboardNavigation = (direction, newIndex) => {
+    if (!newIndex) {
+      newIndex = hoverIndex.value;
     }
-    if (keyCode === "Backspace") {
+    if (!["ArrowDown", "ArrowUp"].includes(direction))
       return;
-    }
-    if (keyCode === "ArrowUp") {
-      index2 = hoverIndex.value - 1;
-      if (index2 < 0) {
-        index2 = filteredOptions.value.length - 1;
+    if (direction === "ArrowUp") {
+      if (newIndex === 0) {
+        newIndex = options.value.length - 1;
+        scrollToItem(newIndex);
+        updateHoveringIndex(newIndex);
+        return;
       }
-    } else if (keyCode === "ArrowDown") {
-      index2 = hoverIndex.value + 1;
-      if (index2 > filteredOptions.value.length - 1) {
-        index2 = 0;
+      newIndex = newIndex - 1;
+    } else if (direction === "ArrowDown") {
+      if (newIndex === options.value.length - 1) {
+        newIndex = 0;
+        scrollToItem(newIndex);
+        updateHoveringIndex(newIndex);
+        return;
       }
+      newIndex = newIndex + 1;
     }
-    if (keyCode === "Enter") {
-      return onKeyboardSelect(e);
+    const option2 = options.value[newIndex];
+    if (option2[disabled]) {
+      return onKeyboardNavigation(direction, newIndex);
+    }
+    scrollToItem(newIndex);
+    updateHoveringIndex(newIndex);
+  };
+  const handleKeydown = (event) => {
+    const keyCode = event.key || event.code;
+    if (options.value.length === 0)
+      return;
+    if (!visible.value) {
+      return toggleMenu();
+    }
+    const onKeydownEnter = () => {
+      handleClick(options.value[hoverIndex.value]);
+      closeMenu();
+    };
+    const onKeydownEsc = () => {
+      closeMenu();
+    };
+    switch (keyCode) {
+      case "Enter":
+        onKeydownEnter();
+        break;
+      case "Escape":
+        onKeydownEsc();
+        break;
+      default:
+        onKeyboardNavigation(keyCode);
     }
-    updateHoverIndex(index2);
-    scrollToActive(index2);
   };
   return {
     handleKeydown
   };
-}
+};
 var EditableSelect = defineComponent({
   name: "DEditableSelect",
   directives: {
-    ClickOutside: clickoutsideDirective
+    clickOutside: clickoutsideDirective
   },
   props: editableSelectProps,
-  emits: ["update:modelValue"],
+  emits: ["update:modelValue", "search", "loadMore"],
   setup(props, ctx2) {
-    const renderDropdown = (condition, type4) => {
-      if (!condition && type4 === 0) {
-        return createVNode(Transition, {
-          "name": "fade"
-        }, {
-          default: () => [createVNode(SelectDropdown, {
-            "options": filteredOptions.value
-          }, null)]
-        });
-      } else if (condition && type4 === 1) {
+    const getItemCls = (option2, index2) => {
+      const {
+        optionDisabledKey: disabledKey
+      } = props;
+      return className$2("devui-dropdown-item", {
+        disabled: disabledKey ? !!option2[disabledKey] : false,
+        selected: index2 === selectIndex.value,
+        "devui-dropdown-bg": index2 === hoverIndex.value
+      });
+    };
+    const renderDropdown = () => {
+      if (props.appendToBody) {
         return createVNode(resolveComponent("d-flexible-overlay"), {
-          "hasBackdrop": false,
           "origin": origin,
-          "position": position,
           "visible": visible.value,
-          "onUpdate:visible": ($event) => visible.value = $event
+          "onUpdate:visible": ($event) => visible.value = $event,
+          "position": position,
+          "hasBackdrop": false
         }, {
           default: () => [createVNode("div", {
-            "class": "devui-dropdown",
+            "class": "devui-editable-select-dropdown",
             "style": {
               width: props.width + "px"
             }
-          }, [createVNode(SelectDropdown, {
-            "options": filteredOptions.value
-          }, null)])]
+          }, [withDirectives(createVNode("div", {
+            "class": "devui-dropdown-menu"
+          }, [createVNode("ul", {
+            "ref": dopdownRef,
+            "class": "devui-list-unstyled scroll-height",
+            "style": {
+              maxHeight: props.maxHeight + "px"
+            },
+            "onScroll": loadMore
+          }, [filteredOptions.value.map((option2, index2) => {
+            return createVNode("li", {
+              "class": getItemCls(option2, index2),
+              "onClick": (e) => {
+                e.stopPropagation();
+                handleClick(option2);
+              }
+            }, [ctx2.slots.itemTemplate ? ctx2.slots.itemTemplate(option2) : option2.label]);
+          }), withDirectives(createVNode("li", {
+            "class": "devui-no-result-template"
+          }, [createVNode("div", {
+            "class": "devui-no-data-tip"
+          }, [emptyText.value])]), [[vShow, !filteredOptions.value.length]])])]), [[resolveDirective("dLoading"), props.loading], [vShow, visible.value]])])]
+        });
+      } else {
+        return createVNode(Transition, {
+          "name": "fade"
+        }, {
+          default: () => [withDirectives(createVNode("div", {
+            "class": "devui-dropdown-menu"
+          }, [createVNode("ul", {
+            "ref": dopdownRef,
+            "class": "devui-list-unstyled scroll-height",
+            "style": {
+              maxHeight: props.maxHeight + "px"
+            },
+            "onScroll": loadMore
+          }, [filteredOptions.value.map((option2, index2) => {
+            return createVNode("li", {
+              "class": getItemCls(option2, index2),
+              "onClick": (e) => {
+                e.stopPropagation();
+                handleClick(option2);
+              }
+            }, [ctx2.slots.itemTemplate ? ctx2.slots.itemTemplate(option2) : option2.label]);
+          }), withDirectives(createVNode("li", {
+            "class": "devui-no-result-template"
+          }, [createVNode("div", {
+            "class": "devui-no-data-tip"
+          }, [emptyText.value])]), [[vShow, !filteredOptions.value.length]])])]), [[vShow, visible.value]])]
         });
       }
     };
-    const renderDefaultSlots = (item2) => {
-      return ctx2.slots.default ? renderSlot(ctx2.slots, "default", {
-        item: item2
-      }) : item2.name;
-    };
-    const renderEmptySlots = () => {
-      return ctx2.slots.empty ? renderSlot(ctx2.slots, "empty") : emptyText.value;
-    };
+    const dopdownRef = ref();
     const origin = ref();
-    const dropdownRef = ref();
-    const visible = ref(false);
-    const inputValue = ref("");
-    const selectedIndex = ref(0);
-    const hoverIndex = ref(0);
-    const query = ref(props.modelValue);
     const position = reactive({
       originX: "left",
       originY: "bottom",
       overlayX: "left",
       overlayY: "top"
     });
-    const wait = computed(() => props.remote ? 300 : 0);
-    const emptyText = computed(() => {
-      const options = filteredOptions.value;
-      if (!props.remote && options.length === 0) {
-        return "\u6CA1\u6709\u76F8\u5173\u8BB0\u5F55";
-      }
-      if (options.length === 0) {
-        return "\u6CA1\u6709\u6570\u636E";
-      }
-      return null;
-    });
+    const visible = ref(false);
+    const inputValue = ref(props.modelValue);
+    const hoverIndex = ref(0);
+    const selectIndex = ref(0);
     const normalizeOptions = computed(() => {
-      let options;
-      return props.options.map((item2) => {
-        if (typeof item2 !== "object") {
-          options = {
-            name: item2
-          };
-          return options;
+      return props.options.map((option2) => {
+        if (typeof option2 === "object") {
+          return __spreadValues({
+            label: option2.label ? option2.label : option2.value,
+            value: option2.value
+          }, option2);
         }
-        return item2;
+        return {
+          label: option2 + "",
+          value: option2
+        };
       });
     });
-    const filteredOptions = computed(() => {
-      const isValidOption = (o) => {
-        const query2 = inputValue.value;
-        const containsQueryString = query2 ? o.name.toLocaleLowerCase().indexOf(query2.toLocaleLowerCase()) >= 0 : true;
-        return containsQueryString;
-      };
-      return normalizeOptions.value.map((item2) => {
-        if (props.remote || isValidOption(item2)) {
-          return item2;
-        }
-        return null;
-      }).filter((item2) => item2 !== null);
+    const filteredOptions = userFilterOptions(normalizeOptions, inputValue, props.filterOption);
+    const emptyText = computed(() => {
+      let text;
+      if (props.filterOption !== false && !filteredOptions.value.length) {
+        text = "\u627E\u4E0D\u5230\u76F8\u5173\u8BB0\u5F55";
+      } else if (props.filterOption === false && !filteredOptions.value.length) {
+        text = "\u6CA1\u6709\u6570\u636E";
+      }
+      return ctx2.slots.noResultItemTemplate ? ctx2.slots.noResultItemTemplate() : text;
     });
-    const findIndex = (o) => {
-      return normalizeOptions.value.findIndex((item2) => {
-        return item2.name === o.name;
-      });
-    };
-    const handleClose = () => {
-      visible.value = false;
-    };
     const toggleMenu = () => {
-      if (!props.disabled) {
-        visible.value = !visible.value;
-      }
+      visible.value = !visible.value;
     };
-    const onInputChange = (val) => {
-      if (props.filterMethod) {
-        props.filterMethod(val);
-      } else if (props.remote) {
-        props.remoteMethod(val);
-      }
-    };
-    const debouncedOnInputChange = lodash.exports.debounce(onInputChange, wait.value);
-    const handleInput = (event) => {
-      const value = event.target.value;
-      inputValue.value = value;
-      query.value = value;
-      if (props.remote) {
-        debouncedOnInputChange(value);
-      } else {
-        onInputChange(value);
-      }
+    const closeMenu = () => {
+      visible.value = false;
     };
-    const selectOptionClick = (e, item2) => {
+    const {
+      loadMore
+    } = useLazyLoad(dopdownRef, inputValue, props.filterOption, props.loadMore);
+    const {
+      handleInput
+    } = useInput(inputValue, ctx2);
+    const handleClick = (option2) => {
       const {
-        disabledKey
+        optionDisabledKey: disabledKey
       } = props;
-      if (disabledKey && item2[disabledKey]) {
-        e.stopPropagation();
-      } else {
-        query.value = item2.name;
-        selectedIndex.value = findIndex(item2);
-        inputValue.value = "";
-        ctx2.emit("update:modelValue", item2.name);
-        visible.value = false;
-      }
-    };
-    const loadMore = () => {
-      if (!props.enableLazyLoad)
+      if (disabledKey && !!option2[disabledKey])
         return;
-      const dropdownVal = dropdownRef.value;
-      if (dropdownVal.clientHeight + dropdownVal.scrollTop >= dropdownVal.scrollHeight) {
-        props.loadMore();
-      }
+      ctx2.emit("update:modelValue", option2.label);
+      closeMenu();
     };
     const {
       handleKeydown
-    } = keyboardSelect(dropdownRef, visible, hoverIndex, selectedIndex, filteredOptions, toggleMenu, selectOptionClick);
-    provide("InjectionKey", {
-      dropdownRef,
-      props: reactive(__spreadValues({}, toRefs(props))),
-      visible,
-      emptyText,
-      selectedIndex,
-      hoverIndex,
-      loadMore,
-      selectOptionClick,
-      renderDefaultSlots,
-      renderEmptySlots
+    } = useKeyboardSelect(dopdownRef, props.optionDisabledKey, visible, hoverIndex, selectIndex, filteredOptions, toggleMenu, closeMenu, handleClick);
+    watch(() => props.modelValue, (newVal) => {
+      inputValue.value = newVal;
     });
     return () => {
       const selectCls = className$2("devui-editable-select devui-form-group devui-has-feedback", {
-        "devui-select-open": visible.value
+        "devui-select-open": visible.value === true
       });
-      const inputCls = className$2("devui-form-control devui-dropdown-origin devui-dropdown-origin-open", {
-        disabled: props.disabled
-      });
-      return createVNode(Fragment, null, [withDirectives(createVNode("div", {
+      return withDirectives(createVNode("div", {
         "class": selectCls,
-        "onClick": toggleMenu,
-        "ref": origin
+        "ref": origin,
+        "style": {
+          width: props.width + "px"
+        }
       }, [createVNode("input", {
-        "class": inputCls,
-        "disabled": props.disabled,
-        "type": "text",
+        "class": "devui-form-control devui-dropdown-origin devui-dropdown-origin-open",
+        "onClick": withModifiers(toggleMenu, ["self"]),
         "onInput": handleInput,
-        "value": query.value,
-        "onKeydown": handleKeydown
+        "onKeydown": handleKeydown,
+        "value": inputValue.value,
+        "disabled": props.disabled,
+        "placeholder": props.placeholder,
+        "type": "text"
       }, null), createVNode("span", {
         "class": "devui-form-control-feedback"
       }, [createVNode("span", {
         "class": "devui-select-chevron-icon"
       }, [createVNode(resolveComponent("d-icon"), {
         "name": "select-arrow"
-      }, null)])]), renderDropdown(props.appendToBody, 0)]), [[resolveDirective("click-outside"), handleClose]]), renderDropdown(props.appendToBody, 1)]);
+      }, null)])]), renderDropdown()]), [[resolveDirective("click-outside"), closeMenu]]);
     };
   }
 });
@@ -14833,7 +14753,7 @@ EditableSelect.install = function(app) {
 var EditableSelectInstall = {
   title: "EditableSelect \u53EF\u8F93\u5165\u4E0B\u62C9\u9009\u62E9\u6846",
   category: "\u6570\u636E\u5F55\u5165",
-  status: "10%",
+  status: "100%",
   install(app) {
     app.use(EditableSelect);
   }
@@ -17472,6 +17392,41 @@ var LayoutInstall = {
     app.use(Aside);
   }
 };
+const loadingConstructor = defineComponent(Loading);
+const cacheTarget = /* @__PURE__ */ new WeakMap();
+const loading = {
+  open(options = {}) {
+    const parent = options.target || document.body;
+    if (cacheTarget.has(parent)) {
+      return cacheTarget.get(parent);
+    }
+    parent.style.position = options.positionType;
+    const isFull = document.body === parent;
+    options = __spreadValues(__spreadValues({}, new LoadingProps()), options);
+    const instance = createComponent$1(loadingConstructor, __spreadProps(__spreadValues({}, options), {
+      isFull
+    }), options.loadingTemplateRef ? () => options.loadingTemplateRef : null);
+    cacheTarget.set(parent, instance);
+    instance.proxy.open();
+    parent.appendChild(instance.proxy.$el);
+    const close = instance.proxy.close;
+    instance.loadingInstance = instance.proxy;
+    instance.loadingInstance.close = (...args) => {
+      cacheTarget.delete(parent);
+      close(...args);
+    };
+    return instance;
+  }
+};
+var LoadingInstall = {
+  title: "Loading \u52A0\u8F7D\u63D0\u793A",
+  category: "\u53CD\u9988",
+  status: "100%",
+  install(app) {
+    app.directive("dLoading", loadingDirective);
+    app.config.globalProperties.$loadingService = loading;
+  }
+};
 const modalProps = {
   width: {
     type: String,
@@ -22859,7 +22814,7 @@ const createColumnGenerator = () => {
   const _columns = ref([]);
   const insertColumn = (column) => {
     _columns.value.push(column);
-    _columns.value.sort((a, b) => a.order > b.order ? 1 : -1);
+    _columns.value.sort((a, b) => a.order - b.order);
   };
   const sortColumn = () => {
     _columns.value.sort((a, b) => a.order > b.order ? 1 : -1);
@@ -22913,7 +22868,7 @@ const createSelection = (dataSource, _data) => {
   };
 };
 const createSorter = (dataSource, _data) => {
-  const sortData = (field, direction, compareFn = (field2, a, b) => a[field2] > b[field2]) => {
+  const sortData = (field, direction, compareFn = (fieldKey, a, b) => a[fieldKey] > b[fieldKey]) => {
     if (direction === "ASC") {
       _data.value = _data.value.sort((a, b) => compareFn(field, a, b) ? 1 : -1);
     } else if (direction === "DESC") {
@@ -22930,8 +22885,8 @@ const createFilter = (dataSource, _data) => {
     fieldSet.add(field);
     const fields = [...fieldSet];
     _data.value = dataSource.value.filter((item2) => {
-      return fields.reduce((prev, field2) => {
-        return prev && results2.indexOf(item2[field2]) !== -1;
+      return fields.reduce((prev, fieldKey) => {
+        return prev && results2.indexOf(item2[fieldKey]) !== -1;
       }, true);
     });
   };
@@ -23275,48 +23230,74 @@ const TD = defineComponent({
     }, [column.value.renderCell(props.row, props.index)]);
   }
 });
-var table = "";
-var Table = defineComponent({
-  name: "DTable",
-  props: TableProps,
-  setup(props, ctx2) {
-    const table2 = getCurrentInstance();
-    const store = createStore(toRef(props, "data"));
-    table2.store = store;
-    provide(TABLE_TOKEN, table2);
-    const {
-      classes,
-      style: style2
-    } = useTable(props);
-    const isEmpty2 = computed(() => props.data.length === 0);
-    const fixHeaderCompo = computed(() => {
+var FixHeader = defineComponent({
+  props: {
+    classes: {
+      type: Object,
+      default: () => ({})
+    },
+    isEmpty: {
+      type: Boolean
+    }
+  },
+  setup(props) {
+    return () => {
       return createVNode("div", {
         "class": "devui-table-view"
       }, [createVNode("div", {
-        "style": "overflow: hidden scroll;"
+        "style": "overflow:hidden scroll;"
       }, [createVNode("table", {
-        "class": classes.value,
+        "class": props.classes,
         "cellpadding": "0",
         "cellspacing": "0"
       }, [createVNode(ColGroup, null, null), createVNode(TableHeader, null, null)])]), createVNode("div", {
         "class": "scroll-view"
       }, [createVNode("table", {
-        "class": classes.value,
+        "class": props.classes,
         "cellpadding": "0",
         "cellspacing": "0"
-      }, [createVNode(ColGroup, null, null), !isEmpty2.value && createVNode(TableBody, {
+      }, [createVNode(ColGroup, null, null), !props.isEmpty && createVNode(TableBody, {
         "style": "flex: 1"
       }, null)])])]);
-    });
-    const normalHeaderCompo = computed(() => {
+    };
+  }
+});
+var NormalHeader = defineComponent({
+  props: {
+    classes: {
+      type: Object,
+      default: () => ({})
+    },
+    isEmpty: {
+      type: Boolean
+    }
+  },
+  setup(props) {
+    return () => {
       return createVNode("table", {
-        "class": classes.value,
+        "class": props.classes,
         "cellpadding": "0",
         "cellspacing": "0"
       }, [createVNode(ColGroup, null, null), createVNode(TableHeader, {
-        "style": "position: relative"
-      }, null), !isEmpty2.value && createVNode(TableBody, null, null)]);
-    });
+        "style": "position:relative"
+      }, null), !props.isEmpty && createVNode(TableBody, null, null)]);
+    };
+  }
+});
+var table = "";
+var Table = defineComponent({
+  name: "DTable",
+  props: TableProps,
+  setup(props, ctx2) {
+    const table2 = getCurrentInstance();
+    const store = createStore(toRef(props, "data"));
+    table2.store = store;
+    provide(TABLE_TOKEN, table2);
+    const {
+      classes,
+      style: style2
+    } = useTable(props);
+    const isEmpty2 = computed(() => props.data.length === 0);
     ctx2.expose({
       getCheckedRows() {
         return store.getCheckedRows();
@@ -23325,7 +23306,13 @@ var Table = defineComponent({
     return () => withDirectives(createVNode("div", {
       "class": "devui-table-wrapper",
       "style": style2.value
-    }, [ctx2.slots.default(), props.fixHeader ? fixHeaderCompo.value : normalHeaderCompo.value, isEmpty2.value && createVNode("div", {
+    }, [ctx2.slots.default(), props.fixHeader ? createVNode(FixHeader, {
+      "classes": classes.value,
+      "is-empty": isEmpty2.value
+    }, null) : createVNode(NormalHeader, {
+      "classes": classes.value,
+      "is-empty": isEmpty2.value
+    }, null), isEmpty2.value && createVNode("div", {
       "class": "devui-table-empty"
     }, [createTextVNode("No Data")])]), [[resolveDirective("dLoading"), props.showLoading]]);
   }
@@ -23390,6 +23377,9 @@ function formatWidth(width) {
 function formatMinWidth(minWidth) {
   return formatWidth(minWidth) || 80;
 }
+function defaultRenderHeader() {
+  return h("span", { class: "title" }, this.header);
+}
 function createColumn(props, templates) {
   const {
     field,
@@ -23407,31 +23397,38 @@ function createColumn(props, templates) {
     fixedRight
   } = props;
   const column = reactive({});
-  watch([field, header2, order], ([field2, header22, order2]) => {
-    column.field = field2;
-    column.header = header22;
-    column.order = order2;
+  function defaultRenderCell(rowData, index2) {
+    var _a, _b;
+    const value = rowData[this.field];
+    if (templates.default) {
+      return templates.default(rowData);
+    }
+    if (this.formatter) {
+      return this.formatter(rowData, value, index2);
+    }
+    return (_b = (_a = value == null ? void 0 : value.toString) == null ? void 0 : _a.call(value)) != null ? _b : "";
+  }
+  watch([field, header2, order], ([fieldVal, headerVal, orderVal]) => {
+    column.field = fieldVal;
+    column.header = headerVal;
+    column.order = orderVal;
   }, { immediate: true });
-  watch([sortable, compareFn], ([sortable2, compareFn2]) => {
-    column.sortable = sortable2;
-    column.compareFn = compareFn2;
+  watch([sortable, compareFn], ([sortableVal, compareFnVal]) => {
+    column.sortable = sortableVal;
+    column.compareFn = compareFnVal;
   });
-  watch([
-    filterable,
-    filterList,
-    filterMultiple
-  ], ([filterable2, filterList2, filterMultiple2]) => {
-    column.filterable = filterable2;
-    column.filterMultiple = filterMultiple2;
-    column.filterList = filterList2;
+  watch([filterable, filterList, filterMultiple], ([filterableVal, filterListVal, filterMultipleVal]) => {
+    column.filterable = filterableVal;
+    column.filterMultiple = filterMultipleVal;
+    column.filterList = filterListVal;
   }, { immediate: true });
   watch([fixedLeft, fixedRight], ([left, right]) => {
     column.fixedLeft = left;
     column.fixedRight = right;
   }, { immediate: true });
-  watch([width, minWidth], ([width2, minWidth2]) => {
-    column.width = formatWidth(width2);
-    column.minWidth = formatMinWidth(minWidth2);
+  watch([width, minWidth], ([widthVal, minWidthVal]) => {
+    column.width = formatWidth(widthVal);
+    column.minWidth = formatMinWidth(minWidthVal);
     column.realWidth = column.width || column.minWidth;
   });
   onBeforeMount(() => {
@@ -23443,17 +23440,6 @@ function createColumn(props, templates) {
   });
   return column;
 }
-function defaultRenderHeader() {
-  return h("span", { class: "title" }, this.header);
-}
-function defaultRenderCell(rowData, index2) {
-  var _a, _b;
-  const value = rowData[this.field];
-  if (this.formatter) {
-    return this.formatter(rowData, value, index2);
-  }
-  return (_b = (_a = value == null ? void 0 : value.toString) == null ? void 0 : _a.call(value)) != null ? _b : "";
-}
 var Column = defineComponent({
   name: "DColumn",
   props: TableColumnProps,
@@ -26838,8 +26824,8 @@ function useDraggable(draggable, dropType, node, renderData, data) {
     dragState
   };
 }
-var IconOpen$1 = "data:image/svg+xml;base64,PHN2ZwogIHdpZHRoPSIxNnB4IgogIGhlaWdodD0iMTZweCIKICB2aWV3Qm94PSIwIDAgMTYgMTYiCiAgdmVyc2lvbj0iMS4xIgogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIKICBjbGFzcz0ic3ZnLWljb24gc3ZnLWljb24tY2xvc2UiCj4KICA8ZyBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE1IiBoZWlnaHQ9IjE1IiByeD0iMiIgc3Ryb2tlPSIjNWU3Y2UwIj48L3JlY3Q+CiAgICA8cmVjdCB4PSI0IiB5PSI3IiB3aWR0aD0iOCIgaGVpZ2h0PSIyIiBmaWxsPSIjNWU3Y2UwIj48L3JlY3Q+CiAgPC9nPgo8L3N2Zz4=";
-var IconClose$1 = "data:image/svg+xml;base64,PHN2ZwogIHdpZHRoPSIxNnB4IgogIGhlaWdodD0iMTZweCIKICB2aWV3Qm94PSIwIDAgMTYgMTYiCiAgdmVyc2lvbj0iMS4xIgogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIKICBjbGFzcz0ic3ZnLWljb24iCj4KICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxyZWN0IHg9IjAuNSIgeT0iMC41IiB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHJ4PSIyIiBzdHJva2U9IiMyNTJiM2EiPjwvcmVjdD4KICAgIDxwYXRoCiAgICAgIGZpbGw9IiMyNTJiM2EiCiAgICAgIGQ9Ik04Ljc1LDQgTDguNzUsNy4yNSBMMTIsNy4yNSBMMTIsOC43NSBMOC43NDksOC43NSBMOC43NSwxMiBMNy4yNSwxMiBMNy4yNDksOC43NSBMNCw4Ljc1IEw0LDcuMjUgTDcuMjUsNy4yNSBMNy4yNSw0IEw4Ljc1LDQgWiIKICAgID48L3BhdGg+CiAgPC9nPgo8L3N2Zz4K";
+var IconOpen$1 = "data:image/svg+xml;base64,PHN2Zw0KICB3aWR0aD0iMTZweCINCiAgaGVpZ2h0PSIxNnB4Ig0KICB2aWV3Qm94PSIwIDAgMTYgMTYiDQogIHZlcnNpb249IjEuMSINCiAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIg0KICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayINCiAgY2xhc3M9InN2Zy1pY29uIHN2Zy1pY29uLWNsb3NlIg0KPg0KICA8ZyBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgPHJlY3QgeD0iMC41IiB5PSIwLjUiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgcng9IjIiIHN0cm9rZT0iIzVlN2NlMCI+PC9yZWN0Pg0KICAgIDxyZWN0IHg9IjQiIHk9IjciIHdpZHRoPSI4IiBoZWlnaHQ9IjIiIGZpbGw9IiM1ZTdjZTAiPjwvcmVjdD4NCiAgPC9nPg0KPC9zdmc+";
+var IconClose$1 = "data:image/svg+xml;base64,PHN2Zw0KICB3aWR0aD0iMTZweCINCiAgaGVpZ2h0PSIxNnB4Ig0KICB2aWV3Qm94PSIwIDAgMTYgMTYiDQogIHZlcnNpb249IjEuMSINCiAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIg0KICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayINCiAgY2xhc3M9InN2Zy1pY29uIg0KPg0KICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE1IiBoZWlnaHQ9IjE1IiByeD0iMiIgc3Ryb2tlPSIjMjUyYjNhIj48L3JlY3Q+DQogICAgPHBhdGgNCiAgICAgIGZpbGw9IiMyNTJiM2EiDQogICAgICBkPSJNOC43NSw0IEw4Ljc1LDcuMjUgTDEyLDcuMjUgTDEyLDguNzUgTDguNzQ5LDguNzUgTDguNzUsMTIgTDcuMjUsMTIgTDcuMjQ5LDguNzUgTDQsOC43NSBMNCw3LjI1IEw3LjI1LDcuMjUgTDcuMjUsNCBMOC43NSw0IFoiDQogICAgPjwvcGF0aD4NCiAgPC9nPg0KPC9zdmc+DQo=";
 var NodeContent = defineComponent({
   name: "DTreeNodeContent",
   props: {
@@ -27267,8 +27253,8 @@ function useClear(props, ctx2, data) {
     handleClearItem
   };
 }
-var IconOpen = "data:image/svg+xml;base64,PHN2ZwogIHdpZHRoPSIxNnB4IgogIGhlaWdodD0iMTZweCIKICB2aWV3Qm94PSIwIDAgMTYgMTYiCiAgdmVyc2lvbj0iMS4xIgogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIKICBjbGFzcz0ic3ZnLWljb24gc3ZnLWljb24tY2xvc2UiCj4KICA8ZyBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE1IiBoZWlnaHQ9IjE1IiByeD0iMiIgc3Ryb2tlPSIjNWU3Y2UwIj48L3JlY3Q+CiAgICA8cmVjdCB4PSI0IiB5PSI3IiB3aWR0aD0iOCIgaGVpZ2h0PSIyIiBmaWxsPSIjNWU3Y2UwIj48L3JlY3Q+CiAgPC9nPgo8L3N2Zz4=";
-var IconClose = "data:image/svg+xml;base64,PHN2ZwogIHdpZHRoPSIxNnB4IgogIGhlaWdodD0iMTZweCIKICB2aWV3Qm94PSIwIDAgMTYgMTYiCiAgdmVyc2lvbj0iMS4xIgogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIKICBjbGFzcz0ic3ZnLWljb24iCj4KICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxyZWN0IHg9IjAuNSIgeT0iMC41IiB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHJ4PSIyIiBzdHJva2U9IiMyNTJiM2EiPjwvcmVjdD4KICAgIDxwYXRoCiAgICAgIGZpbGw9IiMyNTJiM2EiCiAgICAgIGQ9Ik04Ljc1LDQgTDguNzUsNy4yNSBMMTIsNy4yNSBMMTIsOC43NSBMOC43NDksOC43NSBMOC43NSwxMiBMNy4yNSwxMiBMNy4yNDksOC43NSBMNCw4Ljc1IEw0LDcuMjUgTDcuMjUsNy4yNSBMNy4yNSw0IEw4Ljc1LDQgWiIKICAgID48L3BhdGg+CiAgPC9nPgo8L3N2Zz4K";
+var IconOpen = "data:image/svg+xml;base64,PHN2Zw0KICB3aWR0aD0iMTZweCINCiAgaGVpZ2h0PSIxNnB4Ig0KICB2aWV3Qm94PSIwIDAgMTYgMTYiDQogIHZlcnNpb249IjEuMSINCiAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIg0KICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayINCiAgY2xhc3M9InN2Zy1pY29uIHN2Zy1pY29uLWNsb3NlIg0KPg0KICA8ZyBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+DQogICAgPHJlY3QgeD0iMC41IiB5PSIwLjUiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgcng9IjIiIHN0cm9rZT0iIzVlN2NlMCI+PC9yZWN0Pg0KICAgIDxyZWN0IHg9IjQiIHk9IjciIHdpZHRoPSI4IiBoZWlnaHQ9IjIiIGZpbGw9IiM1ZTdjZTAiPjwvcmVjdD4NCiAgPC9nPg0KPC9zdmc+";
+var IconClose = "data:image/svg+xml;base64,PHN2Zw0KICB3aWR0aD0iMTZweCINCiAgaGVpZ2h0PSIxNnB4Ig0KICB2aWV3Qm94PSIwIDAgMTYgMTYiDQogIHZlcnNpb249IjEuMSINCiAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIg0KICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayINCiAgY2xhc3M9InN2Zy1pY29uIg0KPg0KICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4NCiAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE1IiBoZWlnaHQ9IjE1IiByeD0iMiIgc3Ryb2tlPSIjMjUyYjNhIj48L3JlY3Q+DQogICAgPHBhdGgNCiAgICAgIGZpbGw9IiMyNTJiM2EiDQogICAgICBkPSJNOC43NSw0IEw4Ljc1LDcuMjUgTDEyLDcuMjUgTDEyLDguNzUgTDguNzQ5LDguNzUgTDguNzUsMTIgTDcuMjUsMTIgTDcuMjQ5LDguNzUgTDQsOC43NSBMNCw3LjI1IEw3LjI1LDcuMjUgTDcuMjUsNCBMOC43NSw0IFoiDQogICAgPjwvcGF0aD4NCiAgPC9nPg0KPC9zdmc+DQo=";
 var TreeSelect = defineComponent({
   name: "DTreeSelect",
   directives: {