From 7ab1ab0e94eb103ca19d8f1b9413c415cc396142 Mon Sep 17 00:00:00 2001
From: zbeyens <zbeyens@udecode.io>
Date: Thu, 28 Mar 2024 07:51:35 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .changeset/quiet-squids-travel.md           | 5 +++++
 packages/dnd/src/components/useDraggable.ts | 8 ++++++--
 2 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/quiet-squids-travel.md

diff --git a/.changeset/quiet-squids-travel.md b/.changeset/quiet-squids-travel.md
new file mode 100644
index 0000000000..c44f0e7bef
--- /dev/null
+++ b/.changeset/quiet-squids-travel.md
@@ -0,0 +1,5 @@
+---
+"@udecode/plate-dnd": patch
+---
+
+Fix `handleRef` type
diff --git a/packages/dnd/src/components/useDraggable.ts b/packages/dnd/src/components/useDraggable.ts
index a39411a280..b9cee9cf21 100644
--- a/packages/dnd/src/components/useDraggable.ts
+++ b/packages/dnd/src/components/useDraggable.ts
@@ -1,16 +1,20 @@
 import React from 'react';
 import { TEditor, TElement } from '@udecode/plate-common';
-import { ConnectDragSource, DropTargetMonitor } from 'react-dnd';
+import { DropTargetMonitor } from 'react-dnd';
 
 import { DragItemNode, DropLineDirection, useDndBlock } from '..';
 
+import type { ReactElement, RefObject } from 'react';
+
 export type DraggableState = {
   dropLine: DropLineDirection;
   isHovered: boolean;
   setIsHovered: (isHovered: boolean) => void;
   isDragging: boolean;
   nodeRef: React.RefObject<HTMLDivElement>;
-  dragRef: ConnectDragSource;
+  dragRef: (
+    elementOrNode: RefObject<any> | ReactElement | Element | null
+  ) => void;
 };
 
 export const useDraggableState = (props: {