From 1a19bdcb542c1bf7dbaf76a77d505ddfee36d467 Mon Sep 17 00:00:00 2001
From: Takagi <1103069291@qq.com>
Date: Wed, 27 Mar 2024 12:26:06 +0800
Subject: [PATCH] fix: resolving the issue of the draggable extension not
 working in the editor (#5570)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#### What type of PR is this?

/kind bug
/area editor
/milestone 2.14.x

#### What this PR does / why we need it:

解决在默认编辑器中，插件扩展 getDraggable 方法可能无效的问题。向 handleDrop 中添加属性 `selection`，方便插件对当前拖拽元素进行处理。

部分插件拖拽之后可能无效果，此时需要插件自行实现 `handleDrop` 方法来处理拖拽后的情况。

#### How to test it?

测试 getDraggable 方法是否正常。插件中使用此方法是否显示拖拽图标。

#### Which issue(s) this PR fixes:

Fixes #5208

#### Does this PR introduce a user-facing change?
```release-note
解决默认编辑器 getDraggable 在部分插件中失效的问题。
```
---
 ui/packages/editor/docs/extension.md                 |  2 ++
 ui/packages/editor/src/extensions/draggable/index.ts | 10 ++++++----
 ui/packages/editor/src/types/index.ts                |  3 +++
 3 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/ui/packages/editor/docs/extension.md b/ui/packages/editor/docs/extension.md
index 81667be92..cf75cccb7 100644
--- a/ui/packages/editor/docs/extension.md
+++ b/ui/packages/editor/docs/extension.md
@@ -379,12 +379,14 @@ export interface DraggableItem {
     slice,
     insertPos,
     node,
+    selection,
   }: {
     view: EditorView;
     event: DragEvent;
     slice: Slice;
     insertPos: number;
     node: Node;
+    selection: Selection;
   }) => boolean | void;
   allowPropagationDownward?: boolean;   // 是否允许拖拽事件向内部传播，
 }
diff --git a/ui/packages/editor/src/extensions/draggable/index.ts b/ui/packages/editor/src/extensions/draggable/index.ts
index d2d71b18c..147ef90e0 100644
--- a/ui/packages/editor/src/extensions/draggable/index.ts
+++ b/ui/packages/editor/src/extensions/draggable/index.ts
@@ -470,11 +470,12 @@ const Draggable = Extension.create({
               const pos = view.posAtCoords(coords);
               if (!pos || !pos.pos) return false;
 
-              const nodeDom =
-                view.nodeDOM(pos.pos) ||
-                view.domAtPos(pos.pos)?.node ||
-                event.target;
+              const nodePos = pos.inside > -1 ? pos.inside : pos.pos;
 
+              const nodeDom =
+                view.nodeDOM(nodePos) ||
+                view.domAtPos(nodePos)?.node ||
+                event.target;
               if (!nodeDom) {
                 hideDragHandleDOM();
                 return false;
@@ -555,6 +556,7 @@ const Draggable = Extension.create({
                   slice,
                   insertPos,
                   node: activeNode?.node as Node,
+                  selection: activeSelection,
                 });
                 if (typeof handleDrop === "boolean") {
                   isDisableDrop = handleDrop;
diff --git a/ui/packages/editor/src/types/index.ts b/ui/packages/editor/src/types/index.ts
index 16965bad1..2c6c1c8d7 100644
--- a/ui/packages/editor/src/types/index.ts
+++ b/ui/packages/editor/src/types/index.ts
@@ -5,6 +5,7 @@ import type {
   Slice,
   EditorState,
   EditorView,
+  Selection,
 } from "@/tiptap/pm";
 import type { Component } from "vue";
 export interface ToolbarItem {
@@ -120,12 +121,14 @@ export interface DraggableItem {
     slice,
     insertPos,
     node,
+    selection,
   }: {
     view: EditorView;
     event: DragEvent;
     slice: Slice;
     insertPos: number;
     node: Node;
+    selection: Selection;
   }) => boolean | void;
   // allow drag-and-drop query propagation downward
   allowPropagationDownward?: boolean;