vue-devui 1.5.13 → 1.5.14

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, isVNode, ref, reactive, createTextVNode, provide, onMounted, watch, Transition, withDirectives, vShow, nextTick, onUnmounted, unref, withModifiers, Comment as Comment$1, Text, h, cloneVNode, Teleport, onBeforeUnmount, render as render$1, resolveDirective, resolveDynamicComponent, toRef, shallowRef, onBeforeMount, onUpdated, readonly, toRaw, watchEffect, renderSlot, useSlots, createApp, shallowReactive, vModelText, effect, TransitionGroup } from "vue";
+import { createVNode, getCurrentInstance, defineComponent, toRefs, inject, computed, Fragment, mergeProps, resolveComponent, isVNode, ref, reactive, createTextVNode, provide, onMounted, watch, Transition, withDirectives, vShow, nextTick, onUnmounted, unref, withModifiers, Comment as Comment$1, Text, h, cloneVNode, Teleport, onBeforeUnmount, render as render$1, resolveDirective, resolveDynamicComponent, toRef, shallowRef, onBeforeMount, onUpdated, readonly, toRaw, watchEffect, renderSlot, useSlots, createApp, shallowReactive, effect, TransitionGroup } from "vue";
 import { useRoute } from "vue-router";
 import Clipboard from "clipboard";
 import { offset, autoPlacement, arrow, shift, computePosition, flip } from "@floating-ui/dom";
@@ -7904,6 +7904,9 @@ function useOverlay(props, emit) {
     ];
     props.showArrow && middleware.push(arrow({ element: arrowEl }));
     props.shiftOffset !== void 0 && middleware.push(shift());
+    if (!overlayEl) {
+      return;
+    }
     const { x, y, placement, middlewareData } = await computePosition(hostEl, overlayEl, {
       strategy: "fixed",
       middleware
@@ -23764,7 +23767,7 @@ var Fullscreen = defineComponent({
 });
 var FullscreenInstall = {
   title: "Fullscreen \u5168\u5C4F",
-  category: "\u57FA\u7840\u7EC4\u4EF6",
+  category: "\u901A\u7528",
   install(app) {
     app.component(Fullscreen.name, Fullscreen);
   }
@@ -25396,11 +25399,19 @@ function useEditorMd(props, ctx2) {
   const toolbars = reactive(cloneDeep_1(DEFAULT_TOOLBARS));
   const editorRef = ref();
   const renderRef = ref();
+  const overlayRef = ref();
+  const cursorRef = ref();
+  const isHintShow = ref();
   const previewHtmlList = ref([]);
   let editorIns;
   let canPreviewScrollView = false;
+  let cursorHint = "";
+  let cursorHintEnd = -1;
+  let cursorHintStart = -1;
+  let prefix;
+  let hintShow = false;
   let CodeMirror;
-  computed(() => {
+  const prefixes = computed(() => {
     const result2 = [];
     for (const key in hintConfig == null ? void 0 : hintConfig.value) {
       if (typeof (hintConfig == null ? void 0 : hintConfig.value[key]) === "function" || (hintConfig == null ? void 0 : hintConfig.value[key]) && typeof (hintConfig == null ? void 0 : hintConfig.value[key].handler) === "function") {
@@ -25455,7 +25466,91 @@ function useEditorMd(props, ctx2) {
     canPreviewScrollView = false;
   };
   const onChecked = (e) => {
-    ctx2.emit("mdCheckedEvent", e);
+    ctx2.emit("checkedChange", e);
+  };
+  let timer;
+  const attachOverlay = () => {
+    timer = setTimeout(() => {
+      var _a;
+      cursorRef.value = ((_a = editorRef.value) == null ? void 0 : _a.parentNode.querySelector(".CodeMirror-cursor")) || void 0;
+      overlayRef.value.updatePosition();
+      isHintShow.value = true;
+      hintShow = true;
+    });
+  };
+  const hideHint = () => {
+    clearTimeout(timer);
+    isHintShow.value = false;
+  };
+  const showHint = () => {
+    if (hintShow) {
+      hideHint();
+    }
+    attachOverlay();
+  };
+  const getHintList = () => {
+    let handler;
+    if (typeof hintConfig.value[prefix] === "function") {
+      handler = hintConfig.value[prefix];
+    } else if (hintConfig.value[prefix] && typeof hintConfig.value[prefix].handler === "function") {
+      handler = hintConfig.value[prefix].handler;
+    }
+    const callback = (replaceText) => {
+      const cursor = editorIns.getCursor();
+      const endCh = cursorHintEnd;
+      const startCh = cursorHintStart;
+      if (editorIns.getLine(cursor.line).length === cursor.ch) {
+        editorIns.replaceRange(replaceText + " ", { line: cursor.line, ch: startCh }, { line: cursor.line, ch: endCh });
+      } else {
+        editorIns.replaceRange(replaceText, { line: cursor.line, ch: startCh }, { line: cursor.line, ch: endCh });
+        editorIns.setCursor(cursor.line, editorIns.getCursor().ch + 1);
+      }
+      editorIns.focus();
+      hideHint();
+    };
+    handler && handler({ prefix, cursorHint, callback });
+  };
+  const cursorActivityHandler = () => {
+    const cursor = editorIns.getCursor();
+    let i = prefixes.value.length;
+    const value = editorIns.getLine(cursor.line).replace(/\t/g, " ");
+    const selection = editorIns.getSelection();
+    const isImgRegx = /^\!\[\S+/;
+    if (selection) {
+      return;
+    }
+    let nowPrefix = "";
+    let hint = "";
+    while (i >= 1) {
+      i--;
+      nowPrefix = prefixes.value[i];
+      const startPos = value.lastIndexOf(nowPrefix, cursor.ch);
+      const endPos = value.indexOf(" ", cursor.ch) > -1 ? value.indexOf(" ", cursor.ch) : value.length;
+      hint = value.slice(startPos, cursor.ch);
+      if (startPos > 0 && value[startPos - 1] !== " " || startPos < 0 || !hint.includes(nowPrefix) || hint.endsWith(" ") || isImgRegx.test(hint)) {
+        cursorHint = "";
+        cursorHintStart = -1;
+        cursorHintEnd = -1;
+      } else {
+        prefix = prefixes.value[i];
+        cursorHint = hint.slice(prefix.length);
+        cursorHintStart = startPos;
+        cursorHintEnd = endPos;
+        break;
+      }
+    }
+    if (cursorHintStart > -1 && hint[0]) {
+      const spacePosition = value.lastIndexOf(" ", cursor.ch);
+      if (spacePosition > cursorHintStart) {
+        return;
+      }
+      setTimeout(() => {
+        showHint();
+        getHintList();
+      });
+    } else {
+      hideHint();
+    }
   };
   const onChange = debounce(() => {
     const content2 = editorIns.getValue();
@@ -25492,8 +25587,13 @@ function useEditorMd(props, ctx2) {
         shortKeys[toolbarItem.shortKey.replace(/\+/g, "-")] = (_a = toolbarItem.handler) == null ? void 0 : _a.bind(null, editorIns, toolbarItem.params);
       }
     }
-    editorIns.setOption("extraKeys", shortKeys);
+    editorIns.setOption("extraKeys", Object.assign({
+      Esc: () => {
+        hideHint();
+      }
+    }), shortKeys);
     editorIns.on("beforeChange", _enforceMaxLength);
+    editorIns.on("cursorActivity", lodash.exports.throttle(cursorActivityHandler, hintConfig.value && hintConfig.value.throttleTime || 300));
     editorIns.setSize("auto", "100%");
     refreshEditorCursor();
     editorIns.setCursor(editorIns.lineCount(), 0);
@@ -25571,9 +25671,12 @@ function useEditorMd(props, ctx2) {
   });
   return {
     editorRef,
+    overlayRef,
+    cursorRef,
     renderRef,
     toolbars,
     previewHtmlList,
+    isHintShow,
     getEditorIns,
     onPaste,
     previewContentChange,
@@ -25693,7 +25796,8 @@ const editorMdProps = __spreadProps(__spreadValues({}, commonProps$1), {
     default: 10
   },
   hintConfig: {
-    type: Object
+    type: Object,
+    default: {}
   },
   customHintReplaceFn: {
     type: Function
@@ -25987,13 +26091,17 @@ var ToolbarItem = defineComponent({
       const editorIns = getEditorIns();
       if (config.id === "fullscreen") {
         showFullscreen.value = !showFullscreen.value;
-      } else {
-        (_a = config.handler) == null ? void 0 : _a.call(config, editorIns, config.params);
+        if (window) {
+          const event = new Event("resize");
+          window.dispatchEvent(event);
+        }
       }
+      (_a = config.handler) == null ? void 0 : _a.call(config, editorIns, config.params);
     };
     return () => createVNode(Fragment, null, [config.type === "button" && createVNode(Tooltip, {
       "position": ["top", "bottom"],
-      "content": getTooltipContent(config.name, config.shortKey)
+      "content": getTooltipContent(config.name, config.shortKey),
+      "hide-after": 1e3
     }, {
       default: () => [createVNode("span", {
         "class": "md-toolbar-item",
@@ -26005,8 +26113,9 @@ var ToolbarItem = defineComponent({
       "align": "start"
     }, {
       default: () => createVNode("span", null, [createVNode(Tooltip, {
-        "position": ["top"],
-        "content": getTooltipContent(config.name)
+        "position": showFullscreen.value ? ["right"] : ["top"],
+        "content": getTooltipContent(config.name),
+        "hide-after": 1e3
       }, {
         default: () => [createVNode("span", {
           "class": "md-toolbar-item",
@@ -26432,7 +26541,7 @@ function useEditorMdRender(props, ctx2) {
       const result2 = previewRef.value.querySelectorAll("input");
       const index2 = [...result2].filter((el) => el.type === "checkbox").findIndex((item) => item === e.target);
       const checkContent = setChecked(e.target.checked, index2);
-      ctx2.emit("mdCheckedEvent", checkContent);
+      ctx2.emit("checkedChange", checkContent);
     }
   };
   return { previewRef, renderService, onPreviewClick, setContainerContent };
@@ -26486,7 +26595,7 @@ function useMdRenderWatcher(props, renderService, setContainerContent) {
 var MdRender = defineComponent({
   name: "DMdRender",
   props: mdRenderProps,
-  emits: ["mdRenderChange", "mdCheckedEvent"],
+  emits: ["mdRenderChange", "checkedChange"],
   setup(props, ctx2) {
     const {
       previewRef,
@@ -26512,7 +26621,7 @@ function _isSlot$7(s) {
 var EditorMd = defineComponent({
   name: "DEditorMd",
   props: editorMdProps,
-  emits: ["update:modelValue", "mdCheckedEvent", "selectHint", "afterEditorInit", "contentChange", "previewContentChange", "imageUpload"],
+  emits: ["update:modelValue", "checkedChange", "selectHint", "afterEditorInit", "contentChange", "previewContentChange", "imageUpload"],
   setup(props, ctx2) {
     const {
       mode,
@@ -26535,7 +26644,10 @@ var EditorMd = defineComponent({
     const showFullscreen = ref(false);
     const {
       editorRef,
+      overlayRef,
+      cursorRef,
       renderRef,
+      isHintShow,
       toolbars,
       previewHtmlList,
       onPaste,
@@ -26585,7 +26697,19 @@ var EditorMd = defineComponent({
         }, [createVNode("textarea", {
           "ref": editorRef,
           "placeholder": placeholder.value
-        }, [modelValue.value]), Boolean(maxlength == null ? void 0 : maxlength.value) && createVNode("div", {
+        }, [modelValue.value]), createVNode(FlexibleOverlay, {
+          "ref": overlayRef,
+          "modelValue": isHintShow.value,
+          "onUpdate:modelValue": ($event) => isHintShow.value = $event,
+          "origin": cursorRef.value || void 0,
+          "align": "start",
+          "position": ["bottom-start"]
+        }, {
+          default: () => {
+            var _a, _b;
+            return [(_b = (_a = ctx2.slots) == null ? void 0 : _a.hintTemplate) == null ? void 0 : _b.call(_a)];
+          }
+        }), Boolean(maxlength == null ? void 0 : maxlength.value) && createVNode("div", {
           "class": "dp-md-count"
         }, [modelValue.value.length || 0, createTextVNode("/"), maxlength.value])]), createVNode(MdRender, {
           "ref": renderRef,
@@ -26600,7 +26724,7 @@ var EditorMd = defineComponent({
           "disable-render": true,
           "md-plugins": mdPlugins.value,
           "onMdRenderChange": previewContentChange,
-          "onMdCheckedEvent": onChecked,
+          "onCheckedChange": onChecked,
           "onScroll": onPreviewScroll,
           "onMouseover": onPreviewMouseover,
           "onMouseout": onPreviewMouseout
@@ -27381,6 +27505,9 @@ class GitGraph$1 {
       style: "clip-path: circle(50%)"
     };
     this.setNodeAttr(img, imgAttrs);
+    const authorText = document.createElementNS("http://www.w3.org/2000/svg", "title");
+    authorText.appendChild(document.createTextNode(commit.author.name));
+    img.appendChild(authorText);
     this.svg.appendChild(img);
     if (!this.messageBoxWidth) {
       this.messageBoxWidth = this.svg.getBoundingClientRect.width - (avatar_box_x + 40);
@@ -31562,11 +31689,12 @@ function className$1(classStr, classOpt) {
 function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
   const formContext = inject(FORM_TOKEN, void 0);
   const formItemContext = inject(FORM_ITEM_TOKEN, void 0);
-  const ns2 = useNamespace("select");
+  const ns2 = useNamespace$1("select");
   const dropdownRef = ref();
   const selectDisabled = computed(() => (formContext == null ? void 0 : formContext.disabled) || props.disabled);
   const selectSize = computed(() => props.size || (formContext == null ? void 0 : formContext.size) || "md");
   const isObjectOption = ref(false);
+  const originRef = ref();
   const isOpen = ref(false);
   const toggleChange = (bool) => {
     if (selectDisabled.value) {
@@ -31576,16 +31704,9 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
     ctx2.emit("toggle-change", bool);
   };
   onClickOutside(dropdownRef, () => {
-    var _a;
-    if (props.multiple && isOpen.value) {
-      (_a = selectRef.value) == null ? void 0 : _a.clearMultipleSearchKey();
-      onBlur();
-    }
-    if (isOpen.value) {
-      toggleChange(false);
-    }
+    toggleChange(false);
   }, { ignore: [selectRef] });
-  const dropdownMenuMultipleNs = useNamespace("dropdown-menu-multiple");
+  const dropdownMenuMultipleNs = useNamespace$1("dropdown-menu-multiple");
   const selectCls = computed(() => {
     return className$1(ns2.b(), {
       [ns2.m("open")]: isOpen.value,
@@ -31696,11 +31817,8 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
     }
   };
   const valueChange = (item) => {
-    var _a;
     const { multiple } = props;
     let { modelValue } = props;
-    filterQuery.value = "";
-    handlerQueryFunc("");
     if (multiple) {
       const checkedItems = Array.isArray(modelValue) ? modelValue.slice() : [];
       const index2 = checkedItems.indexOf(item.value);
@@ -31727,7 +31845,6 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
       }
       getMultipleSelected(checkedItems);
     } else {
-      (_a = selectRef.value) == null ? void 0 : _a.clearSingleSearchKey();
       ctx2.emit("update:modelValue", item.value);
       getSingleSelected(item);
       toggleChange(false);
@@ -31738,8 +31855,6 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
     ctx2.emit("toggle-change", false);
   };
   const handleClear = () => {
-    filterQuery.value = "";
-    handlerQueryFunc("");
     if (props.multiple) {
       ctx2.emit("update:modelValue", []);
       ctx2.emit("value-change", []);
@@ -31752,6 +31867,7 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
       handleClose();
       blur2();
     }
+    filterQuery.value = "";
   };
   const tagDelete = (data) => {
     let { modelValue } = props;
@@ -31769,17 +31885,15 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
     ctx2.emit("remove-tag", data.value);
     getMultipleSelected(checkedItems);
   };
-  const onFocus = () => {
+  const onFocus = (e) => {
+    ctx2.emit("focus", e);
     if (!selectDisabled.value) {
       isSelectFocus.value = true;
     }
   };
-  const onBlur = () => {
+  const onBlur = (e) => {
+    ctx2.emit("blur", e);
     if (!selectDisabled.value) {
-      setTimeout(() => {
-        filterQuery.value = "";
-        handlerQueryFunc("");
-      }, 150);
       isSelectFocus.value = false;
     }
   };
@@ -31812,7 +31926,7 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
   const emptyText = computed(() => {
     const visibleOptionsCount = injectOptionsArray.value.filter((item) => {
       const label = item.name || item.value;
-      return label.toString().toLocaleLowerCase().includes(filterQuery.value.trim().toLocaleLowerCase());
+      return label.toString().toLocaleLowerCase().includes(filterQuery.value.toLocaleLowerCase().trim());
     }).length;
     if (isLoading.value) {
       return props.loadingText || t("loadingText");
@@ -31839,8 +31953,7 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
     }
   };
   watch(() => props.modelValue, () => {
-    formItemContext == null ? void 0 : formItemContext.validate("change").catch(() => {
-    });
+    formItemContext == null ? void 0 : formItemContext.validate("change").catch((err) => console.warn(err));
     updateInjectOptionsStatus();
   }, { deep: true });
   watch(injectOptions, () => {
@@ -31855,17 +31968,10 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
       (_a = dropdownRef.value) == null ? void 0 : _a.updatePosition();
     }
   }, { flush: "post" });
-  watch(isSelectFocus, (val) => {
-    if (val) {
-      ctx2.emit("focus");
-    } else {
-      ctx2.emit("blur");
-    }
-  });
-  onMounted(updateInjectOptionsStatus);
   return {
     selectDisabled,
     selectSize,
+    originRef,
     dropdownRef,
     isOpen,
     selectCls,
@@ -31890,7 +31996,7 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
 }
 const selectProps = {
   modelValue: {
-    type: [String, Number, Array, Boolean],
+    type: [String, Number, Array],
     default: ""
   },
   "onUpdate:modelValue": {
@@ -31905,10 +32011,6 @@ const selectProps = {
     type: String,
     default: ""
   },
-  position: {
-    type: Array,
-    default: () => ["bottom", "top"]
-  },
   overview: {
     type: String,
     default: "border"
@@ -31980,10 +32082,6 @@ const selectProps = {
   multipleLimit: {
     type: Number,
     default: 0
-  },
-  showEmptyWhenUnmatched: {
-    type: Boolean,
-    default: true
   }
 };
 const optionProps = {
@@ -32016,7 +32114,7 @@ const optionGroupProps = {
 const SELECT_TOKEN = Symbol("dSelect");
 const OPTION_GROUP_TOKEN = Symbol("dOptionGroup");
 function useOption(props) {
-  const ns2 = useNamespace("select");
+  const ns2 = useNamespace$1("select");
   const select2 = inject(SELECT_TOKEN, null);
   const optionGroup = inject(OPTION_GROUP_TOKEN, null);
   const currentName = computed(() => {
@@ -32032,23 +32130,20 @@ function useOption(props) {
       return select2.modelValue === props.value;
     }
   });
-  const isDisabled = computed(() => props.disabled || ((optionGroup == null ? void 0 : optionGroup.disabled) ? true : false));
   const optionItem = computed(() => {
     return {
       name: props.name || props.value + "" || "",
       value: props.value,
       create: props.create,
-      _checked: false,
-      disabled: isDisabled.value
+      _checked: false
     };
   });
+  const isDisabled = computed(() => props.disabled || ((optionGroup == null ? void 0 : optionGroup.disabled) ? true : false));
   const isObjectOption = ref(!!props.name);
   const selectOptionCls = computed(() => {
     return className$1(ns2.e("item"), {
       active: isOptionSelected.value,
-      disabled: isDisabled.value,
-      [ns2.em("item", "sm")]: (select2 == null ? void 0 : select2.selectSize) === "sm",
-      [ns2.em("item", "lg")]: (select2 == null ? void 0 : select2.selectSize) === "lg"
+      disabled: isDisabled.value
     });
   });
   const optionSelect = () => {
@@ -32246,16 +32341,12 @@ var TagInstall = {
   }
 };
 function useSelectContent() {
-  const ns2 = useNamespace("select");
+  const ns2 = useNamespace$1("select");
   const select2 = inject(SELECT_TOKEN);
   const formItemContext = inject(FORM_ITEM_TOKEN, void 0);
-  const styleType = inject(STYLE_TOKEN, void 0);
   const app = getCurrentInstance();
   const t = createI18nTranslate("DSelect", app);
   const searchQuery = ref("");
-  const singleSearchKey = ref("");
-  const singleInputRef = ref();
-  const singlePlaceholderWidth = computed(() => (select2 == null ? void 0 : select2.dropdownWidth) ? `${(select2 == null ? void 0 : select2.dropdownWidth) - 40}px` : "auto");
   const selectedData = computed(() => {
     return (select2 == null ? void 0 : select2.selectedOptions) || [];
   });
@@ -32273,37 +32364,21 @@ function useSelectContent() {
   const displayInputValue = computed(() => {
     var _a;
     if (select2 == null ? void 0 : select2.selectedOptions) {
-      return select2.selectedOptions.length > 1 ? select2.selectedOptions.map((item) => (item == null ? void 0 : item.name) || (item == null ? void 0 : item.value) || "").join(",") : ((_a = select2.selectedOptions[0]) == null ? void 0 : _a.name) || (select2.showEmptyWhenUnmatched ? "" : select2.modelValue);
+      return select2.selectedOptions.length > 1 ? select2.selectedOptions.map((item) => (item == null ? void 0 : item.name) || (item == null ? void 0 : item.value) || "").join(",") : ((_a = select2.selectedOptions[0]) == null ? void 0 : _a.name) || "";
     } else {
       return "";
     }
   });
-  const isPlaceholderDark = computed(() => {
-    if (!singleSearchKey.value) {
-      if (isSelectDisable.value) {
-        return false;
-      }
-      if (!displayInputValue.value) {
-        return true;
-      } else {
-        return select2 == null ? void 0 : select2.isSelectFocus;
-      }
-    } else {
-      return false;
-    }
-  });
   const mergeClearable = computed(() => {
     return !isSelectDisable.value && !!(select2 == null ? void 0 : select2.allowClear) && (displayInputValue.value ? true : false);
   });
   const isDisabledTooltip = computed(() => {
     return !isSupportTagsTooltip.value || !!(select2 == null ? void 0 : select2.isOpen);
   });
-  const isSupportFilter = computed(() => lodash.exports.isFunction(select2 == null ? void 0 : select2.filter) || typeof (select2 == null ? void 0 : select2.filter) === "boolean" && (select2 == null ? void 0 : select2.filter));
   const selectionCls = computed(() => {
     return className$1(ns2.e("selection"), {
       [ns2.e("clearable")]: mergeClearable.value,
-      [ns2.em("selection", "error")]: isValidateError.value,
-      [ns2.em("selection", "gray-style")]: styleType === "gray"
+      [ns2.em("selection", "error")]: isValidateError.value
     });
   });
   const inputCls = computed(() => {
@@ -32314,20 +32389,12 @@ function useSelectContent() {
   });
   const tagSize = computed(() => (select2 == null ? void 0 : select2.selectSize) || "sm");
   const placeholder = computed(() => displayInputValue.value ? "" : (select2 == null ? void 0 : select2.placeholder) || t("placeholder"));
-  const singlePlaceholder = computed(() => (select2 == null ? void 0 : select2.placeholder) || t("placeholder"));
   const isMultiple = computed(() => !!(select2 == null ? void 0 : select2.multiple));
   const handleClear = (e) => {
     e.preventDefault();
     e.stopPropagation();
-    searchQuery.value = "";
-    singleSearchKey.value = "";
     select2 == null ? void 0 : select2.handleClear();
   };
-  const onSingleInputWrapClick = () => {
-    if (!(select2 == null ? void 0 : select2.selectDisabled)) {
-      singleInputRef.value.focus();
-    }
-  };
   const tagDelete = (data) => {
     if (data && (data.value || data.value === 0)) {
       select2 == null ? void 0 : select2.tagDelete(data);
@@ -32337,69 +32404,41 @@ function useSelectContent() {
     select2 == null ? void 0 : select2.onFocus(e);
   };
   const onBlur = (e) => {
-    singleSearchKey.value = "";
     select2 == null ? void 0 : select2.onBlur(e);
   };
-  const onMultipleClick = () => {
-    if (select2 == null ? void 0 : select2.selectDisabled) {
-      return;
-    }
-    if (select2 == null ? void 0 : select2.isOpen) {
-      searchQuery.value = "";
-      select2 == null ? void 0 : select2.onBlur();
-    } else {
-      select2 == null ? void 0 : select2.onFocus();
-    }
-  };
-  const onArrowClick = () => {
-    if (isMultiple.value) {
-      onMultipleClick();
-    }
-  };
   const queryFilter = (e) => {
     e.preventDefault();
     e.stopPropagation();
     const query = e.target.value;
-    singleSearchKey.value = query;
-    searchQuery.value = query;
     if (!isReadOnly.value && (select2 == null ? void 0 : select2.debounceQueryFilter)) {
       select2 == null ? void 0 : select2.debounceQueryFilter(query);
     }
   };
   return {
-    singleInputRef,
     searchQuery,
-    singleSearchKey,
     selectedData,
     isSelectDisable,
     isSupportCollapseTags,
     isDisabledTooltip,
-    isSupportFilter,
     isReadOnly,
     selectionCls,
     inputCls,
     tagSize,
     placeholder,
-    singlePlaceholder,
-    singlePlaceholderWidth,
     isMultiple,
     displayInputValue,
-    isPlaceholderDark,
-    onSingleInputWrapClick,
     handleClear,
     tagDelete,
     onFocus,
     onBlur,
-    onMultipleClick,
-    onArrowClick,
     queryFilter
   };
 }
 var SelectContent = defineComponent({
   name: "SelectContent",
-  setup(_, ctx2) {
+  setup() {
     const formItemContext = inject(FORM_ITEM_TOKEN, void 0);
-    const ns2 = useNamespace("select");
+    const ns2 = useNamespace$1("select");
     const clearCls = computed(() => ({
       [ns2.e("clear")]: true,
       [ns2.em("clear", "feedback")]: Boolean(formItemContext == null ? void 0 : formItemContext.validateState) && (formItemContext == null ? void 0 : formItemContext.showFeedback)
@@ -32411,71 +32450,44 @@ var SelectContent = defineComponent({
     const multipleCls = ns2.e("multiple");
     const multipleInputCls = ns2.em("multiple", "input");
     const {
-      singleInputRef,
       searchQuery,
-      singleSearchKey,
       selectedData,
       isSelectDisable,
       isSupportCollapseTags,
       isDisabledTooltip,
       isReadOnly,
-      isSupportFilter,
       selectionCls,
       inputCls,
       tagSize,
       placeholder,
-      singlePlaceholder,
-      singlePlaceholderWidth,
       isMultiple,
-      isPlaceholderDark,
       displayInputValue,
-      onSingleInputWrapClick,
-      onMultipleClick,
-      onArrowClick,
       handleClear,
       tagDelete,
       onFocus,
       onBlur,
       queryFilter
     } = useSelectContent();
-    const clearSingleSearchKey = () => {
-      singleSearchKey.value = "";
-    };
-    const clearMultipleSearchKey = () => {
-      searchQuery.value = "";
-    };
-    ctx2.expose({
-      clearSingleSearchKey,
-      clearMultipleSearchKey
-    });
     return () => {
       return createVNode("div", {
         "class": selectionCls.value
       }, [isMultiple.value ? createVNode("div", {
-        "class": multipleCls,
-        "onClick": onMultipleClick
+        "class": multipleCls
       }, [!isSupportCollapseTags.value && selectedData.value.length >= 1 && selectedData.value.map((item) => createVNode(Tag, {
-        "deletable": !(isSelectDisable.value || item.disabled),
+        "deletable": true,
         "onTagDelete": withModifiers(() => tagDelete(item), ["prevent", "stop"]),
         "key": item.value,
-        "maxWidth": "78%",
-        "class": ["multiple-tag", {
-          disabled: isSelectDisable.value || item.disabled
-        }],
         "size": tagSize.value
       }, {
         default: () => [item.name]
       })), isSupportCollapseTags.value && selectedData.value.length >= 1 && createVNode(Tag, {
         "deletable": true,
-        "maxWidth": "75%",
-        "class": "multiple-tag",
         "onTagDelete": withModifiers(() => tagDelete(selectedData.value[0]), ["prevent", "stop"]),
         "size": tagSize.value
       }, {
         default: () => [selectedData.value[0].name]
       }), isSupportCollapseTags.value && selectedData.value.length > 1 && createVNode(Popover, {
         "trigger": "hover",
-        "auto-update-position": true,
         "disabled": isDisabledTooltip.value
       }, {
         default: () => createVNode(Tag, {
@@ -32487,49 +32499,39 @@ var SelectContent = defineComponent({
           "deletable": true,
           "onTagDelete": withModifiers(() => tagDelete(item), ["prevent", "stop"]),
           "key": item.value,
-          "class": "popover-tag",
           "size": tagSize.value
         }, {
           default: () => [item.name]
         }))])
       }), createVNode("div", {
         "class": multipleInputCls
-      }, [withDirectives(createVNode("input", {
+      }, [createVNode("input", {
         "ref": "input",
         "value": searchQuery.value,
         "type": "text",
         "class": inputCls.value,
         "placeholder": placeholder.value,
-        "readonly": isReadOnly.value || !isSupportFilter.value,
+        "readonly": isReadOnly.value,
         "disabled": isSelectDisable.value,
-        "onInput": queryFilter
-      }, null), [[vShow, !selectedData.value.length || isSupportFilter.value]])])]) : createVNode("div", {
-        "class": "single-inner-input",
-        "onClick": onSingleInputWrapClick
-      }, [!singleSearchKey.value && createVNode("span", {
-        "class": ["input-placeholder", {
-          "placeholder-dark": isPlaceholderDark.value
-        }],
-        "style": {
-          width: singlePlaceholderWidth.value
-        },
-        "title": displayInputValue.value || singlePlaceholder.value
-      }, [displayInputValue.value || singlePlaceholder.value]), withDirectives(createVNode("input", {
-        "ref": singleInputRef,
+        "onInput": queryFilter,
+        "onFocus": onFocus,
+        "onBlur": onBlur
+      }, null)])]) : createVNode("input", {
+        "ref": "input",
+        "value": displayInputValue.value,
         "type": "text",
-        "onUpdate:modelValue": ($event) => singleSearchKey.value = $event,
         "class": inputCls.value,
+        "placeholder": placeholder.value,
         "readonly": isReadOnly.value,
         "disabled": isSelectDisable.value,
         "onFocus": onFocus,
         "onBlur": onBlur,
         "onInput": queryFilter
-      }, null), [[vModelText, singleSearchKey.value]])]), createVNode("span", {
+      }, null), createVNode("span", {
         "onClick": handleClear,
         "class": clearCls.value
       }, [createVNode(AlertCloseIcon, null, null)]), createVNode("span", {
-        "class": arrowCls.value,
-        "onClick": onArrowClick
+        "class": arrowCls.value
       }, [createVNode(SelectArrowIcon, null, null)])]);
     };
   }
@@ -32557,38 +32559,11 @@ function useSelectFunction(props, selectRef) {
   };
   return { isSelectFocus, focus, blur: blur2 };
 }
-function useSelectMenuSize(selectRef, dropdownRef, isOpen) {
-  const originRef = ref();
-  const dropdownWidth = ref(0);
-  let observer;
-  const updateDropdownWidth = () => {
-    var _a;
-    dropdownWidth.value = ((_a = originRef.value) == null ? void 0 : _a.getBoundingClientRect().width) || 0;
-    if (isOpen.value) {
-      dropdownRef.value.updatePosition();
-    }
-  };
-  const watchInputSize = () => {
-    if (window) {
-      observer = new window.ResizeObserver(updateDropdownWidth);
-      observer.observe(originRef.value);
-    }
-  };
-  onMounted(() => {
-    originRef.value = selectRef.value.$el;
-    watchInputSize();
-    updateDropdownWidth();
-  });
-  onBeforeUnmount(() => {
-    observer == null ? void 0 : observer.unobserve(originRef.value);
-  });
-  return { originRef, dropdownWidth };
-}
 var select = "";
 var Select = defineComponent({
   name: "DSelect",
   props: selectProps,
-  emits: ["toggle-change", "value-change", "update:modelValue", "focus", "blur", "remove-tag", "clear", "load-more"],
+  emits: ["toggle-change", "value-change", "update:modelValue", "focus", "blur", "remove-tag", "clear"],
   setup(props, ctx2) {
     const app = getCurrentInstance();
     const t = createI18nTranslate("DSelect", app);
@@ -32601,6 +32576,7 @@ var Select = defineComponent({
     const {
       selectDisabled,
       selectSize,
+      originRef,
       dropdownRef,
       isOpen,
       selectCls,
@@ -32622,16 +32598,9 @@ var Select = defineComponent({
       isShowCreateOption
     } = useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t);
     const dropdownContainer = ref();
-    const {
-      originRef,
-      dropdownWidth
-    } = useSelectMenuSize(selectRef, dropdownRef, isOpen);
-    const scrollbarNs = useNamespace("scrollbar");
-    const ns2 = useNamespace("select");
-    const dropdownCls = {
-      [ns2.e("dropdown")]: true,
-      [ns2.em("dropdown", "multiple")]: props.multiple
-    };
+    const scrollbarNs = useNamespace$1("scrollbar");
+    const ns2 = useNamespace$1("select");
+    const dropdownCls = ns2.e("dropdown");
     const listCls = {
       [ns2.e("dropdown-list")]: true,
       [scrollbarNs.b()]: true
@@ -32643,8 +32612,17 @@ var Select = defineComponent({
       toggleChange
     });
     const isRender = ref(false);
-    onBeforeMount(() => {
-      isRender.value = true;
+    const position = ref(["bottom-start", "top-start"]);
+    const dropdownWidth = ref("0");
+    const updateDropdownWidth = () => {
+      var _a;
+      dropdownWidth.value = ((_a = originRef == null ? void 0 : originRef.value) == null ? void 0 : _a.clientWidth) ? originRef.value.clientWidth + "px" : "100%";
+    };
+    watch(selectRef, (val) => {
+      if (val) {
+        originRef.value = val.$el;
+        updateDropdownWidth();
+      }
     });
     const scrollToBottom = () => {
       const compareHeight = dropdownContainer.value.scrollHeight - dropdownContainer.value.clientHeight;
@@ -32654,18 +32632,22 @@ var Select = defineComponent({
       }
     };
     onMounted(() => {
+      isRender.value = true;
+      updateDropdownWidth();
+      window.addEventListener("resize", updateDropdownWidth);
       nextTick(() => {
         dropdownContainer.value.addEventListener("scroll", scrollToBottom);
       });
     });
+    onUnmounted(() => {
+      window.removeEventListener("resize", updateDropdownWidth);
+    });
     provide(SELECT_TOKEN, reactive(__spreadProps(__spreadValues({}, toRefs(props)), {
       selectDisabled,
       selectSize,
       isOpen,
-      isSelectFocus,
       selectedOptions,
       filterQuery,
-      dropdownWidth,
       valueChange,
       handleClear,
       updateInjectOptions,
@@ -32679,7 +32661,7 @@ var Select = defineComponent({
         "class": selectCls.value,
         "onClick": withModifiers(() => {
           toggleChange(!isOpen.value);
-        }, [])
+        }, ["stop"])
       }, [createVNode(SelectContent, {
         "ref": selectRef
       }, null), createVNode(Teleport, {
@@ -32693,9 +32675,9 @@ var Select = defineComponent({
             "onUpdate:modelValue": ($event) => isRender.value = $event,
             "ref": dropdownRef,
             "origin": originRef.value,
+            "align": "start",
             "offset": 4,
-            "place-strategy": "no-space",
-            "position": props.position,
+            "position": position.value,
             "style": {
               visibility: isOpen.value ? "visible" : "hidden",
               "z-index": isOpen.value ? "var(--devui-z-index-dropdown, 1052)" : -1
@@ -32706,14 +32688,11 @@ var Select = defineComponent({
               return [createVNode("div", {
                 "class": dropdownCls,
                 "style": {
-                  width: `${dropdownWidth.value}px`,
+                  width: `${dropdownWidth.value}`,
                   visibility: isOpen.value ? "visible" : "hidden"
                 }
               }, [withDirectives(createVNode("ul", {
                 "class": listCls,
-                "style": {
-                  padding: isShowEmptyText.value ? "0" : "12px"
-                },
                 "ref": dropdownContainer
               }, [isShowCreateOption.value && createVNode(Option, {
                 "value": filterQuery.value,
@@ -32733,8 +32712,7 @@ var Select = defineComponent({
                 default: () => [props.multiple ? createVNode(Checkbox, {
                   "modelValue": item._checked,
                   "label": item.name,
-                  "disabled": isDisabled(item),
-                  "class": "select-checkbox"
+                  "disabled": isDisabled(item)
                 }, null) : item.name || item.value]
               }))]), [[vShow, !isLoading.value]]), isShowEmptyText.value && createVNode("div", null, [((_c = ctx2.slots) == null ? void 0 : _c.empty) && ctx2.slots.empty(), !((_d = ctx2.slots) == null ? void 0 : _d.empty) && createVNode("p", {
                 "class": dropdownEmptyCls
@@ -32750,7 +32728,7 @@ var OptionGroup = defineComponent({
   name: "DOptionGroup",
   props: optionGroupProps,
   setup(props, ctx2) {
-    const ns2 = useNamespace("select");
+    const ns2 = useNamespace$1("select");
     provide(OPTION_GROUP_TOKEN, reactive(__spreadValues({}, toRefs(props))));
     return () => {
       var _a;
@@ -32789,7 +32767,7 @@ const paginationProps = {
   },
   pageSizeDirection: {
     type: Array,
-    default: () => ["centerDown", "centerUp"]
+    default: () => ["bottom", "top"]
   },
   pageIndex: {
     type: Number,
@@ -32935,7 +32913,7 @@ var ConfigMenu = defineComponent({
       isShowConfig,
       $slots
     } = this;
-    const ns2 = useNamespace$1("pagination");
+    const ns2 = useNamespace("pagination");
     return withDirectives(createVNode("div", {
       "class": ns2.e("config"),
       "ref": "paginationConfig"
@@ -33003,8 +32981,14 @@ var JumpPage = defineComponent({
       }
     };
     const jump = (e) => {
+      if (isNaN(curPage)) {
+        curPage = 1;
+      }
       if (curPage > (totalPages == null ? void 0 : totalPages.value)) {
-        return;
+        curPage = totalPages == null ? void 0 : totalPages.value;
+      }
+      if (curPage < 1) {
+        curPage = 1;
       }
       if ((e === "btn" || e.key === "Enter") && (cursor == null ? void 0 : cursor.value) !== curPage) {
         emit("changeCursorEmit", curPage);
@@ -33025,7 +33009,7 @@ var JumpPage = defineComponent({
       jump,
       showJumpButton
     } = this;
-    const ns2 = useNamespace$1("pagination");
+    const ns2 = useNamespace("pagination");
     const inputProps2 = {
       class: [ns2.e("input"), size ? ns2.em("input", size) : ""],
       size,
@@ -33147,7 +33131,7 @@ var PageNumBtn = defineComponent({
       nextChange,
       showTruePageIndex
     } = this;
-    const ns2 = useNamespace$1("pagination");
+    const ns2 = useNamespace("pagination");
     return createVNode("ul", {
       "class": [ns2.e("list"), size ? ns2.m(size) : ""]
     }, [createVNode("li", {
@@ -33233,13 +33217,14 @@ var PageNumBtn = defineComponent({
 });
 var PageSize = defineComponent({
   setup() {
-    const ns2 = useNamespace$1("pagination");
+    const ns2 = useNamespace("pagination");
     const paginationContext = inject(paginationInjectionKey);
     const iconRotate = ref(0);
     const {
       size,
       currentPageSize,
       pageSizeOptions,
+      pageSizeDirection,
       pageSizeChange,
       t
     } = paginationContext;
@@ -33247,7 +33232,7 @@ var PageSize = defineComponent({
       iconRotate.value = e ? 180 : 0;
     };
     return () => createVNode(Fragment, null, [createVNode(Dropdown$1, {
-      "position": ["bottom", "top"],
+      "position": pageSizeDirection.value,
       "class": ns2.e("size-list"),
       "onToggle": onDropdownToggle
     }, {
@@ -33265,9 +33250,9 @@ var PageSize = defineComponent({
         "class": {
           active: item === currentPageSize.value
         },
-        "onClick": withModifiers(pageSizeChange.bind(null, {
-          value: item
-        }), ["stop"]),
+        "onClick": () => {
+          pageSizeChange(item);
+        },
         "key": index2
       }, [item]))])
     }), createVNode("span", {
@@ -33294,6 +33279,7 @@ var Pagination = defineComponent({
     const {
       autoHide,
       pageSizeOptions,
+      pageSizeDirection,
       total,
       canChangePageSize,
       lite,
@@ -33311,7 +33297,7 @@ var Pagination = defineComponent({
       showJumpButton,
       haveConfigMenu
     } = toRefs(props);
-    const ns2 = useNamespace$1("pagination");
+    const ns2 = useNamespace("pagination");
     const totalPages = computed(() => Math.ceil(props.total / props.pageSize));
     const litePageOptions = computed(() => liteSelectOptions(totalPages.value));
     const cursor = computed({
@@ -33339,7 +33325,7 @@ var Pagination = defineComponent({
       emit("pageIndexChange", val);
     };
     const pageSizeChange = (val) => {
-      currentPageSize.value = val.value;
+      currentPageSize.value = val;
       if (props.autoFixPageIndex) {
         nextTick(() => {
           if (cursor.value > totalPages.value) {
@@ -33347,7 +33333,7 @@ var Pagination = defineComponent({
           }
         });
       }
-      emit("pageSizeChange", val.value);
+      emit("pageSizeChange", val);
     };
     const litePageIndexChange = (page) => {
       changeCursorEmit(page.value);
@@ -33356,6 +33342,7 @@ var Pagination = defineComponent({
       size,
       currentPageSize,
       pageSizeOptions,
+      pageSizeDirection,
       pageSizeChange,
       t
     });
@@ -44043,7 +44030,7 @@ const installs = [
   VirtualListInstall
 ];
 var vueDevui = {
-  version: "1.5.13",
+  version: "1.5.14",
   install(app) {
     installs.forEach((p) => app.use(p));
   }