vue-devui 1.6.4 → 1.6.5

package/editor-md/index.es.js

@@ -21,7 +21,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { toRefs, onMounted, onUnmounted, watch, defineComponent, ref, renderSlot, useSlots, createVNode, reactive, computed, nextTick, onBeforeMount, onBeforeUnmount, Transition, mergeProps, unref, withModifiers, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, provide, Teleport, vShow, createTextVNode, isVNode } from "vue";
+import { toRefs, onMounted, onUnmounted, watch, defineComponent, ref, renderSlot, useSlots, createVNode, reactive, computed, nextTick, onBeforeUnmount, onBeforeMount, Transition, mergeProps, unref, withModifiers, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, provide, Teleport, vShow, createTextVNode, isVNode } from "vue";
 import "clipboard";
 import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
 import { onClickOutside } from "@vueuse/core";
@@ -7268,13 +7268,15 @@ function useEditorMd(props, ctx) {
     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;
@@ -7388,6 +7390,13 @@ function useEditorMd(props, ctx) {
     const cursor = editorIns.getCursor();
     let i = prefixes.value.length;
     const value = editorIns.getLine(cursor.line).replace(/\t/g, " ");
+    let result = false;
+    if (beforeShowHint == null ? void 0 : beforeShowHint.value) {
+      result = beforeShowHint.value(value);
+    }
+    if (result) {
+      return;
+    }
     const selection = editorIns.getSelection();
     const isImgRegx = /^\!\[\S+/;
     if (selection) {
@@ -7502,12 +7511,22 @@ function useEditorMd(props, ctx) {
       }
     }
   };
+  const onDocumentClick = (e) => {
+    var _a;
+    if (isHintShow.value && e.target !== containerRef.value && !((_a = containerRef.value) == null ? void 0 : _a.contains(e.target))) {
+      hideHint();
+    }
+  };
   onMounted(async () => {
     await import("codemirror/addon/display/placeholder.js");
     await import("codemirror/mode/markdown/markdown.js");
     const module = await import("codemirror");
     CodeMirror = module.default;
     initEditor();
+    document.addEventListener("click", onDocumentClick);
+  });
+  onBeforeUnmount(() => {
+    document.removeEventListener("click", onDocumentClick);
   });
   watch(modelValue, (val) => {
     if (editorIns) {
@@ -7548,6 +7567,7 @@ function useEditorMd(props, ctx) {
     overlayRef,
     cursorRef,
     renderRef,
+    containerRef,
     toolbars,
     previewHtmlList,
     isHintShow,
@@ -7675,6 +7695,9 @@ const editorMdProps = __spreadProps(__spreadValues({}, commonProps), {
   },
   customHintReplaceFn: {
     type: Function
+  },
+  beforeShowHint: {
+    type: Function
   }
 });
 const EditorMdInjectionKey = Symbol("d-editor-md");
@@ -7826,17 +7849,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;
@@ -7860,9 +7873,6 @@ function useDropdown(id, visible, isOpen, origin, dropdownRef, popDirection, emi
         }
       }
     }
-    if (dropdownEl) {
-      calcPopDirection(dropdownEl);
-    }
   });
   onMounted(() => {
     dropdownMap.set(id, { toggleEl: origin.value });
@@ -8251,7 +8261,7 @@ var Dropdown = defineComponent({
       props,
       emit
     });
-    useDropdown(id, visible, isOpen, origin, dropdownRef, currentPosition, emit);
+    useDropdown(id, visible, isOpen, origin, dropdownRef, emit);
     const {
       overlayModelValue,
       overlayShowValue,
@@ -9237,6 +9247,7 @@ var EditorMd = defineComponent({
       overlayRef,
       cursorRef,
       renderRef,
+      containerRef,
       isHintShow,
       toolbars,
       previewHtmlList,
@@ -9267,6 +9278,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",
@@ -9293,7 +9305,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 _a, _b;