vue-devui 1.6.30 → 1.6.31

package/types/code-review/src/composables/use-code-review.d.ts

@@ -4,5 +4,6 @@ import type { CodeReviewProps, IExpandLineNumberInfo } from '../code-review-type
 export declare function useCodeReview(props: CodeReviewProps, ctx: SetupContext, reviewContentRef: Ref<HTMLElement>, updateLineNumberMap: (expandLineNumberInfo: IExpandLineNumberInfo, newCode: string, direction: 'up' | 'down') => void, updateCheckedLine: (expandLineNumberInfo: IExpandLineNumberInfo, direction: 'up' | 'down') => void): {
     renderHtml: Ref<string>;
     diffFile: Ref<DiffFile[]>;
+    selectionSide: Ref<string>;
     onContentClick: (e: Event) => void;
 };

package/types/code-review/src/utils.d.ts

@@ -41,3 +41,4 @@ export declare function getSingleCheckedNumberAndCode(checkedTdNodes: HTMLElemen
 };
 export declare function addCommentCheckedForDouble(trNode: HTMLElement, leftMinNum: number, leftMaxNum: number, rightMinNum: number, rightMaxNum: number): HTMLElement[];
 export declare function addCommentCheckedForSingle(trNode: HTMLElement, leftMinNum: number, leftMaxNum: number, rightMinNum: number, rightMaxNum: number): HTMLElement[];
+export declare function getSelectionParent(el: HTMLElement): any;

package/vue-devui.es.js

@@ -17664,6 +17664,22 @@ function addCommentCheckedForSingle(trNode, leftMinNum, leftMaxNum, rightMinNum,
   }
   return result2;
 }
+function getSelectionParent(el) {
+  if (el.tagName === "TR") {
+    return;
+  }
+  if (el.tagName === "TD" && (el.classList.contains("d-code-left") || el.classList.contains("d-code-right"))) {
+    if (el.classList.contains("d-code-left")) {
+      return "left";
+    }
+    if (el.classList.contains("d-code-right")) {
+      return "right";
+    }
+  }
+  if (el.parentElement) {
+    return getSelectionParent(el.parentElement);
+  }
+}
 function useCodeReviewExpand(reviewContentRef, props, updateLineNumberMap, updateCheckedLine) {
   const { outputFormat, expandThreshold, expandLoader } = toRefs(props);
   const processSideBySide = () => {
@@ -17856,6 +17872,8 @@ function useCodeReview(props, ctx2, reviewContentRef, updateLineNumberMap, updat
   const { diff, outputFormat, allowExpand, showBlob } = toRefs(props);
   const renderHtml = ref("");
   const diffFile = ref([]);
+  const ns2 = useNamespace$1("code-review");
+  const selectionSide = ref("");
   const { insertExpandButton, onExpandButtonClick } = useCodeReviewExpand(reviewContentRef, props, updateLineNumberMap, updateCheckedLine);
   const initDiffContent = () => {
     diffFile.value = Diff2Html.parse(diff.value);
@@ -17870,10 +17888,69 @@ function useCodeReview(props, ctx2, reviewContentRef, updateLineNumberMap, updat
   const onContentClick = (e) => {
     onExpandButtonClick(e, props.options);
   };
+  function onSelectionChange() {
+    if (selectionSide.value) {
+      return;
+    }
+    if (typeof window === "undefined") {
+      return;
+    }
+    const selection = window.getSelection();
+    if ((selection == null ? void 0 : selection.toString()) && (selection == null ? void 0 : selection.anchorNode)) {
+      const side = getSelectionParent(selection.anchorNode);
+      if (side) {
+        selectionSide.value = side;
+      }
+    }
+  }
+  function onMousedown2(e) {
+    if (typeof window === "undefined") {
+      return;
+    }
+    const selection = window.getSelection();
+    const composedPath = e.composedPath();
+    const isLineNumber = composedPath.some((item) => {
+      var _a;
+      return (_a = item.classList) == null ? void 0 : _a.contains("d2h-code-side-linenumber");
+    });
+    const isClickInner = composedPath.some((item) => {
+      var _a;
+      return (_a = item.classList) == null ? void 0 : _a.contains(ns2.e("content"));
+    });
+    const clickSide = getSelectionParent(e.target);
+    if (selection && selection.toString()) {
+      const isInRange = selection == null ? void 0 : selection.getRangeAt(0).intersectsNode(e.target);
+      if (!isInRange || !isClickInner || clickSide === "left" && selectionSide.value === "right" || clickSide === "right" && selectionSide.value === "left" || isLineNumber) {
+        setTimeout(() => {
+          selectionSide.value = "";
+          selection.removeAllRanges();
+        });
+      }
+    } else {
+      selectionSide.value = "";
+    }
+  }
   watch(showBlob, initDiffContent);
   watch(outputFormat, initDiffContent);
   watch(diff, initDiffContent, { immediate: true });
-  return { renderHtml, diffFile, onContentClick };
+  watch(
+    () => props.outputFormat,
+    (val) => {
+      if (val === "side-by-side") {
+        document.addEventListener("selectionchange", onSelectionChange);
+        document.addEventListener("mousedown", onMousedown2, true);
+      } else {
+        document.removeEventListener("selectionchange", onSelectionChange);
+        document.removeEventListener("mousedown", onMousedown2, true);
+      }
+    },
+    { immediate: true }
+  );
+  onUnmounted(() => {
+    document.removeEventListener("selectionchange", onSelectionChange);
+    document.removeEventListener("mousedown", onMousedown2, true);
+  });
+  return { renderHtml, diffFile, selectionSide, onContentClick };
 }
 function useCodeReviewFold(props, ctx2) {
   const { fold } = toRefs(props);
@@ -18341,6 +18418,7 @@ var CodeReview = defineComponent({
     const {
       renderHtml,
       diffFile,
+      selectionSide,
       onContentClick
     } = useCodeReview(props, ctx2, reviewContentRef, updateLineNumberMap, updateCheckedLine);
     const {
@@ -18365,7 +18443,9 @@ var CodeReview = defineComponent({
     return () => {
       var _a, _b;
       return createVNode("div", {
-        "class": ns2.b()
+        "class": [ns2.b(), {
+          [ns2.m(`${selectionSide.value}-selected`)]: Boolean(selectionSide.value)
+        }]
       }, [createVNode(CodeReviewHeader, {
         "onClick": () => isFold.value = !isFold.value
       }, null), withDirectives(createVNode("div", null, [props.showBlob ? (_b = (_a = ctx2.slots).blob) == null ? void 0 : _b.call(_a) : createVNode("div", mergeProps({
@@ -54454,7 +54534,7 @@ const installs = [
   VirtualListInstall
 ];
 var vueDevui = {
-  version: "1.6.30",
+  version: "1.6.31",
   install(app) {
     installs.forEach((p) => app.use(p));
   }