fix(react): drag nodes after toggle hidden closes #3931

packages/react/CHANGELOG.md

@@ -10,7 +10,7 @@
 
 - better cursor defaults for the pane, nodes and edges
 - `disableKeyboardA11y` now also disables Enter and Escape for selecting/deselecting nodes and edges
-
+- fix bug where users couldn't drag a node after toggle nodes `hidden` attribute
 
 ## 12.0.0-next.9
 

packages/react/src/hooks/useDrag.ts

@@ -33,7 +33,6 @@ export function useDrag({
   useEffect(() => {
     if (nodeRef?.current) {
       xyDrag.current = XYDrag({
-        domNode: nodeRef.current,
         getStoreItems: () => store.getState(),
         onNodeMouseDown: (id: string) => {
           handleNodeClick({
@@ -55,11 +54,11 @@ export function useDrag({
   useEffect(() => {
     if (disabled) {
       xyDrag.current?.destroy();
-    } else {
+    } else if (nodeRef.current) {
       xyDrag.current?.update({
         noDragClassName,
         handleSelector,
-        domNode: nodeRef.current as Element,
+        domNode: nodeRef.current,
         isSelectable,
         nodeId,
       });