vue-devui 1.6.4 → 1.6.5

package/vue-devui.es.js

@@ -10302,8 +10302,7 @@ const DEFAULT_PREFIX = "icon";
 const iconProps = {
   name: {
     type: String,
-    default: "",
-    required: true
+    default: ""
   },
   size: {
     type: [Number, String],
@@ -11428,17 +11427,7 @@ const useDropdownEvent = ({ id, isOpen, origin, dropdownRef, props, emit }) => {
     onInvalidate(() => subscriptions.forEach((v) => v()));
   });
 };
-function useDropdown(id, visible, isOpen, origin, dropdownRef, popDirection, emit) {
-  const calcPopDirection = (dropdownEl) => {
-    const elementHeight = dropdownEl.offsetHeight;
-    const bottomDistance = window.innerHeight - origin.value.getBoundingClientRect().bottom;
-    const isBottomEnough = bottomDistance >= elementHeight;
-    if (!isBottomEnough) {
-      popDirection.value = "top";
-    } else {
-      popDirection.value = "bottom";
-    }
-  };
+function useDropdown(id, visible, isOpen, origin, dropdownRef, emit) {
   watch(visible, (newVal, oldVal) => {
     if (oldVal === void 0) {
       return;
@@ -11462,9 +11451,6 @@ function useDropdown(id, visible, isOpen, origin, dropdownRef, popDirection, emi
         }
       }
     }
-    if (dropdownEl) {
-      calcPopDirection(dropdownEl);
-    }
   });
   onMounted(() => {
     dropdownMap.set(id, { toggleEl: origin.value });
@@ -11533,7 +11519,7 @@ var Dropdown$1 = defineComponent({
       props,
       emit
     });
-    useDropdown(id, visible, isOpen, origin, dropdownRef, currentPosition, emit);
+    useDropdown(id, visible, isOpen, origin, dropdownRef, emit);
     const {
       overlayModelValue,
       overlayShowValue,
@@ -11992,6 +11978,41 @@ const carouselProps = {
     default: 500
   }
 };
+function CarouselArrowLeft() {
+  return createVNode("svg", {
+    "width": "18px",
+    "height": "18px",
+    "viewBox": "0 0 16 16",
+    "version": "1.1"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("polygon", {
+    "fill": "#293040",
+    "fill-rule": "nonzero",
+    "points": "10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"
+  }, null)])]);
+}
+function CarouselArrowRight() {
+  return createVNode("svg", {
+    "width": "18px",
+    "height": "18px",
+    "viewBox": "0 0 16 16",
+    "version": "1.1"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("polygon", {
+    "fill": "#293040",
+    "fill-rule": "nonzero",
+    "transform": "translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",
+    "points": "11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"
+  }, null)])]);
+}
 var carousel = "";
 var Carousel = defineComponent({
   name: "DCarousel",
@@ -12151,14 +12172,10 @@ var Carousel = defineComponent({
       }, [createVNode("button", {
         "class": "arrow-left",
         "onClick": () => prev()
-      }, [createVNode(DIcon, {
-        "name": "arrow-left"
-      }, null)]), createVNode("button", {
+      }, [createVNode(CarouselArrowLeft, null, null)]), createVNode("button", {
         "class": "arrow-right",
         "onClick": () => next()
-      }, [createVNode(DIcon, {
-        "name": "arrow-right"
-      }, null)])]) : null, createVNode("div", {
+      }, [createVNode(CarouselArrowRight, null, null)])]) : null, createVNode("div", {
         "class": ns2.e("item-wrapper"),
         "ref": wrapperRef
       }, [createVNode("div", {
@@ -13484,6 +13501,71 @@ const inputProps = {
     default: false
   }
 };
+function SelectArrowIcon() {
+  return createVNode("svg", {
+    "width": "16px",
+    "height": "16px",
+    "viewBox": "0 0 16 16",
+    "version": "1.1",
+    "xmlns": "http://www.w3.org/2000/svg"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("path", {
+    "d": `M3.64644661,5.64644661 C3.82001296,5.47288026 4.08943736,5.45359511 4.2843055,5.58859116 L4.35355339,5.64644661 
+          L8,9.293 L11.6464466,5.64644661 C11.820013,5.47288026 12.0894374,5.45359511 12.2843055,5.58859116 L12.3535534,5.64644661 
+          C12.5271197,5.82001296 12.5464049,6.08943736 12.4114088,6.2843055 L12.3535534,6.35355339 L8.35355339,10.3535534 
+          C8.17998704,10.5271197 7.91056264,10.5464049 7.7156945,10.4114088 L7.64644661,10.3535534 L3.64644661,6.35355339 
+          C3.45118446,6.15829124 3.45118446,5.84170876 3.64644661,5.64644661 Z`
+  }, null)])]);
+}
+function SearchIcon$1() {
+  return createVNode("svg", {
+    "width": "16px",
+    "height": "16px",
+    "viewBox": "0 0 16 16",
+    "version": "1.1",
+    "xmlns": "http://www.w3.org/2000/svg"
+  }, [createVNode("g", {
+    "id": "dv-search-icon",
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("path", {
+    "d": `M7.71295742,1.53283795 C11.0266659,1.53283795 13.7129574,4.21912945 13.7129574,7.53283795 C13.7129574,9.0690006 
+          13.1356609,10.4703284 12.1861834,11.5317059 L14.5333041,13.8784875 C14.7285663,14.0737497 14.7285663,14.3903321 
+          14.5333041,14.5855943 C14.3597378,14.7591606 14.0903134,14.7784458 13.8954453,14.6434497 L13.8261974,14.5855943 
+          L11.4604434,12.2188804 C10.4336319,13.0411023 9.13072017,13.5328379 7.71295742,13.5328379 C4.39924893,13.5328379 
+          1.71295742,10.8465464 1.71295742,7.53283795 C1.71295742,4.21912945 4.39924893,1.53283795 7.71295742,1.53283795 Z M7.71295742,2.53283795 
+          C4.95153368,2.53283795 2.71295742,4.7714142 2.71295742,7.53283795 C2.71295742,10.2942617 4.95153368,12.5328379 7.71295742,12.5328379 
+          C10.4743812,12.5328379 12.7129574,10.2942617 12.7129574,7.53283795 C12.7129574,4.7714142 10.4743812,2.53283795 7.71295742,2.53283795 Z`,
+    "id": "\u5F62\u72B6\u7ED3\u5408",
+    "fill": "#71757F",
+    "fill-rule": "nonzero"
+  }, null)])]);
+}
+function InputClearIcon() {
+  return createVNode("svg", {
+    "width": "16px",
+    "height": "16px",
+    "viewBox": "0 0 16 16",
+    "version": "1.1",
+    "xmlns": "http://www.w3.org/2000/svg"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("path", {
+    "d": "M8,1 C11.8659932,1 15,4.13400675 15,8 C15,11.8659932 11.8659932,15 8,15 C4.13400675,15 1,11.8659932 1,8 C1,4.13400675           4.13400675,1 8,1 Z M5.87867966,5.17157288 C5.68341751,4.97631073 5.36683502,4.97631073 5.17157288,5.17157288           C4.99800652,5.34513923 4.97872137,5.61456363 5.11371742,5.80943177 L5.17157288,5.87867966 L7.29218611,7.99929289           L5.17157288,10.1213203 C4.97631073,10.3165825 4.97631073,10.633165 5.17157288,10.8284271 C5.34513923,11.0019935           5.61456363,11.0212786 5.80943177,10.8862826 L5.87867966,10.8284271 L7.99929289,8.70639967 L10.1213203,10.8284271           C10.3165825,11.0236893 10.633165,11.0236893 10.8284271,10.8284271 C11.0019935,10.6548608 11.0212786,10.3854364           10.8862826,10.1905682 L10.8284271,10.1213203 L8.70710678,8 L10.8284271,5.87867966 C11.0236893,5.68341751           11.0236893,5.36683502 10.8284271,5.17157288 C10.6548608,4.99800652 10.3854364,4.97872137 10.1905682,5.11371742           L10.1213203,5.17157288 L8,7.29289322 L5.87867966,5.17157288 Z",
+    "id": "\u5F62\u72B6",
+    "fill": "#D5D5DB",
+    "fill-rule": "nonzero"
+  }, null)])]);
+}
 function useInputRender$1(props, ctx2) {
   const formContext = inject(FORM_TOKEN, void 0);
   const formItemContext = inject(FORM_ITEM_TOKEN, void 0);
@@ -13692,11 +13774,8 @@ var DInput = defineComponent({
         "class": ns2.em("password", "icon"),
         "name": passwordVisible.value ? "preview" : "preview-forbidden",
         "onClick": clickPasswordIcon
-      }, null), showClearable.value && createVNode(DIcon, {
-        "size": inputSize.value,
+      }, null), showClearable.value && createVNode(InputClearIcon, {
         "class": ns2.em("clear", "icon"),
-        "name": "error-o",
-        "color": "#adb0b8",
         "onClick": onClear
       }, null)])]), ctx2.slots.append && createVNode("div", {
         "class": slotNs.e("append")
@@ -13760,16 +13839,12 @@ var Cascader = defineComponent({
         "onBlur": onBlur
       }, null), !showClearable.value && createVNode("div", {
         "class": `${ns2.e("icon")} ${ns2.m("drop-icon-animation")}`
-      }, [createVNode(resolveComponent("d-icon"), {
-        "name": "select-arrow",
-        "size": "12px"
-      }, null)]), showClearable.value && props.clearable && createVNode("div", {
+      }, [createVNode(SelectArrowIcon, null, null)]), showClearable.value && props.clearable && createVNode("div", {
         "class": `${ns2.e("icon")} ${ns2.e("close")}`,
         "onClick": clearData
-      }, [createVNode(resolveComponent("d-icon"), {
-        "name": "close",
-        "size": "12px"
-      }, null)])])]
+      }, [createVNode("div", {
+        "class": "close-icon-container"
+      }, [createVNode(InputClearIcon, null, null)])])])]
     }), createVNode(Teleport, {
       "to": "body"
     }, {
@@ -13821,7 +13896,7 @@ var CascaderInstall = {
     app.component(Cascader.name, Cascader);
   }
 };
-function SearchIcon$1() {
+function SearchIcon() {
   return createVNode("svg", {
     "width": "16px",
     "height": "16px",
@@ -17013,7 +17088,7 @@ var CategorySearch = defineComponent({
       }, [createVNode("div", {
         "class": "dp-category-search-icon",
         "onClick": onSearch
-      }, [createVNode(SearchIcon$1, null, null)]), createVNode("div", {
+      }, [createVNode(SearchIcon, null, null)]), createVNode("div", {
         "ref": scrollBarRef,
         "class": "dp-category-search-line-container"
       }, [createVNode("ul", {
@@ -18726,7 +18801,7 @@ var CollapseItem = defineComponent({
         "onClick": handlerTitleClick
       }, [ctx2.slots.title ? ctx2.slots.title() : props.title, createVNode("span", {
         "class": ns2.e("open-icon")
-      }, [createVNode(OpenIcon, null, null)])]), createVNode(Transition, {
+      }, [createVNode(SelectArrowIcon, null, null)])]), createVNode(Transition, {
         "name": transitionNs.b(),
         "onEnter": enter,
         "onLeave": leave
@@ -33580,7 +33655,7 @@ var Dropdown = defineComponent({
       debounceLoadMore();
     };
     const renderOption = () => {
-      if (props.options.length === 0) {
+      if (props.options.length === 0 && !select2.loading.value) {
         return createVNode("li", {
           "class": ns2.em("item", "no-data-tip")
         }, [slots.noResultItem ? slots.noResultItem() : emptyText.value]);
@@ -35846,13 +35921,15 @@ function useEditorMd(props, ctx2) {
     customHintReplaceFn,
     hintConfig,
     disableChangeEvent,
-    modelValue
+    modelValue,
+    beforeShowHint
   } = toRefs(props);
   const toolbars = reactive(cloneDeep_1(DEFAULT_TOOLBARS));
   const editorRef = ref();
   const renderRef = ref();
   const overlayRef = ref();
   const cursorRef = ref();
+  const containerRef = ref();
   const isHintShow = ref();
   const previewHtmlList = ref([]);
   let editorIns;
@@ -35966,6 +36043,13 @@ function useEditorMd(props, ctx2) {
     const cursor = editorIns.getCursor();
     let i = prefixes.value.length;
     const value = editorIns.getLine(cursor.line).replace(/\t/g, " ");
+    let result2 = false;
+    if (beforeShowHint == null ? void 0 : beforeShowHint.value) {
+      result2 = beforeShowHint.value(value);
+    }
+    if (result2) {
+      return;
+    }
     const selection = editorIns.getSelection();
     const isImgRegx = /^\!\[\S+/;
     if (selection) {
@@ -36080,12 +36164,22 @@ function useEditorMd(props, ctx2) {
       }
     }
   };
+  const onDocumentClick = (e) => {
+    var _a2;
+    if (isHintShow.value && e.target !== containerRef.value && !((_a2 = containerRef.value) == null ? void 0 : _a2.contains(e.target))) {
+      hideHint();
+    }
+  };
   onMounted(async () => {
     await import("codemirror/addon/display/placeholder.js");
     await import("codemirror/mode/markdown/markdown.js");
     const module2 = await import("codemirror");
     CodeMirror = module2.default;
     initEditor();
+    document.addEventListener("click", onDocumentClick);
+  });
+  onBeforeUnmount(() => {
+    document.removeEventListener("click", onDocumentClick);
   });
   watch(modelValue, (val) => {
     if (editorIns) {
@@ -36126,6 +36220,7 @@ function useEditorMd(props, ctx2) {
     overlayRef,
     cursorRef,
     renderRef,
+    containerRef,
     toolbars,
     previewHtmlList,
     isHintShow,
@@ -36253,6 +36348,9 @@ const editorMdProps = __spreadProps(__spreadValues({}, commonProps$1), {
   },
   customHintReplaceFn: {
     type: Function
+  },
+  beforeShowHint: {
+    type: Function
   }
 });
 const EditorMdInjectionKey = Symbol("d-editor-md");
@@ -37113,6 +37211,7 @@ var EditorMd = defineComponent({
       overlayRef,
       cursorRef,
       renderRef,
+      containerRef,
       isHintShow,
       toolbars,
       previewHtmlList,
@@ -37143,6 +37242,7 @@ var EditorMd = defineComponent({
         "z-index": fullscreenZIndex.value
       }, {
         default: () => [createVNode("div", {
+          "ref": containerRef,
           "class": ["dp-md-container", {
             "dp-md-readonly": mode.value === "readonly",
             "dp-md-editonly": mode.value === "editonly",
@@ -37169,7 +37269,9 @@ var EditorMd = defineComponent({
           "onUpdate:modelValue": ($event) => isHintShow.value = $event,
           "origin": cursorRef.value || void 0,
           "align": "start",
-          "position": ["bottom-start"]
+          "position": ["bottom-start"],
+          "onClick": withModifiers(() => {
+          }, ["stop"])
         }, {
           default: () => {
             var _a2, _b;
@@ -41221,6 +41323,30 @@ var ModalBody = defineComponent({
     };
   }
 });
+function CloseIcon() {
+  return createVNode("svg", {
+    "width": "16px",
+    "height": "16px",
+    "viewBox": "0 0 16 16",
+    "version": "1.1",
+    "xmlns": "http://www.w3.org/2000/svg"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("path", {
+    "d": `M14.6887175,1.25368865 C15.0770801,1.64205125 15.0121881,2.34244569 14.544513,2.81012074 L9.383,7.971 L14.544513,13.1322854 
+					C14.9787827,13.5665551 15.0657548,14.2014859 14.7650189,14.6009195 L14.6887175,14.6887175 C14.3003549,15.0770801 
+					13.5999604,15.0121881 13.1322854,14.544513 L13.1322854,14.544513 L7.971,9.383 L2.81012075,14.544513 C2.3424457,15.0121881 
+					1.64205125,15.0770801 1.25368865,14.6887175 C0.865326051,14.3003549 0.930218063,13.5999605 1.39789313,13.1322854 L6.558,7.971 
+					L1.39789311,2.81012074 C0.963623424,2.37585105 0.876651354,1.74092026 1.17738727,1.34148668 L1.25368865,1.25368865 
+					C1.64205125,0.865326051 2.34244569,0.930218063 2.81012074,1.39789311 L2.81012074,1.39789311 L7.971,6.558 L13.1322854,1.39789311 
+					C13.5999605,0.930218063 14.3003549,0.865326051 14.6887175,1.25368865 Z`,
+    "fill": "#8A8E99",
+    "fill-rule": "nonzero"
+  }, null)])]);
+}
 var modal = "";
 var Modal = defineComponent({
   name: "DModal",
@@ -41337,8 +41463,8 @@ var Modal = defineComponent({
             "onClick": execClose,
             "class": "btn-close"
           }, [createVNode(DIcon, {
-            "name": "close",
-            "size": "20px"
+            "operable": true,
+            "component": CloseIcon()
           }, null)]), props.type ? renderType() : createVNode("div", {
             "style": {
               cursor: props.draggable ? "move" : "default"
@@ -42148,6 +42274,9 @@ function useSelect$2(props, selectRef, ctx2, focus, blur2, isSelectFocus, t) {
       (_a2 = dropdownRef.value) == null ? void 0 : _a2.updatePosition();
     }
   }, { flush: "post" });
+  onMounted(() => {
+    nextTick(updateInjectOptionsStatus);
+  });
   return {
     selectDisabled,
     selectSize,
@@ -42371,24 +42500,6 @@ var Option = defineComponent({
     };
   }
 });
-const SelectArrowIcon = () => createVNode("svg", {
-  "width": "1em",
-  "height": "1em",
-  "viewBox": "0 0 16 16",
-  "version": "1.1",
-  "xmlns": "http://www.w3.org/2000/svg"
-}, [createVNode("g", {
-  "stroke": "none",
-  "stroke-width": "1",
-  "fill": "none",
-  "fill-rule": "evenodd"
-}, [createVNode("path", {
-  "d": `M12.1464466,6.85355339 L8.35355339,10.6464466 C8.15829124,10.8417088 7.84170876,10.8417088
-        7.64644661,10.6464466 L3.85355339,6.85355339 C3.65829124,6.65829124 3.65829124,6.34170876
-        3.85355339,6.14644661 C3.94732158,6.05267842 4.07449854,6 4.20710678,6 L11.7928932,6 C12.0690356,6
-        12.2928932,6.22385763 12.2928932,6.5 C12.2928932,6.63260824 12.2402148,6.7597852 12.1464466,6.85355339 Z`,
-  "fill-rule": "nonzero"
-}, null)])]);
 function useSelectContent() {
   const ns2 = useNamespace$1("select");
   const select2 = inject(SELECT_TOKEN);
@@ -42579,7 +42690,7 @@ var SelectContent = defineComponent({
       }, null), createVNode("span", {
         "onClick": handleClear,
         "class": clearCls.value
-      }, [createVNode(AlertCloseIcon, null, null)]), createVNode("span", {
+      }, [createVNode(InputClearIcon, null, null)]), createVNode("span", {
         "class": arrowCls.value
       }, [createVNode(SelectArrowIcon, null, null)])]);
     };
@@ -43277,7 +43388,7 @@ var PageSize = defineComponent({
   setup() {
     const ns2 = useNamespace("pagination");
     const paginationContext = inject(paginationInjectionKey);
-    const iconRotate = ref(0);
+    const isOpen = ref(false);
     const {
       size,
       currentPageSize,
@@ -43286,8 +43397,13 @@ var PageSize = defineComponent({
       pageSizeChange,
       t
     } = paginationContext;
+    const pageSizeClasses = computed(() => ({
+      [ns2.e("size")]: true,
+      [ns2.em("size", size.value)]: Boolean(size.value),
+      [ns2.em("size", "open")]: isOpen.value
+    }));
     const onDropdownToggle = (e) => {
-      iconRotate.value = e ? 180 : 0;
+      isOpen.value = e;
     };
     return () => createVNode(Fragment, null, [createVNode(Dropdown$1, {
       "position": pageSizeDirection.value,
@@ -43296,14 +43412,8 @@ var PageSize = defineComponent({
     }, {
       default: () => createVNode("div", {
         "tabindex": "0",
-        "class": [ns2.e("size"), size.value ? ns2.em("size", size.value) : ""]
-      }, [createVNode(DIcon, {
-        "name": "select-arrow",
-        "size": "16px",
-        "rotate": iconRotate.value
-      }, {
-        prefix: () => createVNode("span", null, [currentPageSize.value])
-      })]),
+        "class": pageSizeClasses.value
+      }, [createVNode("span", null, [currentPageSize.value]), createVNode(SelectArrowIcon, null, null)]),
       menu: () => createVNode("ul", null, [pageSizeOptions.value.map((item, index2) => createVNode("li", {
         "class": {
           active: item === currentPageSize.value
@@ -45305,26 +45415,6 @@ const keydownHandles = (ctx2, keywords, props) => {
   };
 };
 var search = "";
-const SearchCloseIcon = () => createVNode("svg", {
-  "viewBox": "0 0 1024 1024",
-  "width": "12px",
-  "height": "12px"
-}, [createVNode("path", {
-  "d": `M940.8 207.530667L818.602667 85.333333l-305.493334 305.493334L207.616 85.333333
-      85.333333 207.530667l305.493334 305.493333L85.333333 818.517333l122.282667 122.282667
-      305.493333-305.493333 305.493334 305.493333 122.197333-122.282667-305.493333-305.493333z`,
-  "p-id": "30810"
-}, null)]);
-const SearchIcon = () => createVNode("svg", {
-  "viewBox": "0 0 1024 1024",
-  "version": "1.1",
-  "width": "12px",
-  "height": "12px"
-}, [createVNode("path", {
-  "d": "M1005.312 914.752l-198.528-198.464A448 448 0 1 0 0 448a448 448 0 0 0 716.288 358.784l198.4 198.4a64 64 0 1 0 90.624-90.432zM448 767.936A320 320 0 1 1 448 128a320 320 0 0 1 0 640z",
-  "fill": "#262626",
-  "p-id": "32547"
-}, null)]);
 var DSearch = defineComponent({
   name: "DSearch",
   props: searchProps,
@@ -45379,13 +45469,13 @@ var DSearch = defineComponent({
       }, [props.iconPosition === "left" && createVNode("div", {
         "class": ns2.e("icon"),
         "onClick": onClickHandle
-      }, [createVNode(SearchIcon, null, null)]), createVNode(DInput, inputProps2, null), clearIconShow.value && createVNode("div", {
+      }, [createVNode(SearchIcon$1, null, null)]), createVNode(DInput, inputProps2, null), clearIconShow.value && createVNode("div", {
         "class": ns2.e("clear"),
         "onClick": onClearHandle
-      }, [createVNode(SearchCloseIcon, null, null)]), props.iconPosition === "right" && createVNode("div", {
+      }, [createVNode(InputClearIcon, null, null)]), props.iconPosition === "right" && createVNode("div", {
         "class": ns2.e("icon"),
         "onClick": onClickHandle
-      }, [createVNode(SearchIcon, null, null)])]);
+      }, [createVNode(SearchIcon$1, null, null)])]);
     };
   }
 });
@@ -54098,7 +54188,7 @@ const installs = [
   VirtualListInstall
 ];
 var vueDevui = {
-  version: "1.6.4",
+  version: "1.6.5",
   install(app) {
     installs.forEach((p) => app.use(p));
   }