refactor(svelte,react): use getHandleBounds from utils package

packages/core/src/components/Nodes/utils.ts

@@ -1,42 +1,8 @@
 import { MouseEvent, RefObject } from 'react';
 import { StoreApi } from 'zustand';
-import { getDimensions } from '@reactflow/utils';
-import { Position, type HandleElement, type NodeOrigin } from '@reactflow/system';
 
 import type { Node, ReactFlowState } from '../../types';
 
-export const getHandleBounds = (
-  selector: string,
-  nodeElement: HTMLDivElement,
-  zoom: number,
-  nodeOrigin: NodeOrigin
-): HandleElement[] | null => {
-  const handles = nodeElement.querySelectorAll(selector);
-
-  if (!handles || !handles.length) {
-    return null;
-  }
-
-  const handlesArray = Array.from(handles) as HTMLDivElement[];
-  const nodeBounds = nodeElement.getBoundingClientRect();
-  const nodeOffset = {
-    x: nodeBounds.width * nodeOrigin[0],
-    y: nodeBounds.height * nodeOrigin[1],
-  };
-
-  return handlesArray.map((handle): HandleElement => {
-    const handleBounds = handle.getBoundingClientRect();
-
-    return {
-      id: handle.getAttribute('data-handleid'),
-      position: handle.getAttribute('data-handlepos') as unknown as Position,
-      x: (handleBounds.left - nodeBounds.left - nodeOffset.x) / zoom,
-      y: (handleBounds.top - nodeBounds.top - nodeOffset.y) / zoom,
-      ...getDimensions(handle),
-    };
-  });
-};
-
 export function getMouseHandler(
   id: string,
   getState: StoreApi<ReactFlowState>['getState'],

packages/svelte/src/lib/utils/index.ts

@@ -20,33 +20,6 @@ export const addEdge = addEdgeBase<Edge>;
 export const updateEdge = updateEdgeBase<Edge>;
 export const getConnectedEdges = getConnectedEdgesBase<Node, Edge>;
 
-export const getHandleBounds = (
-  selector: string,
-  nodeElement: HTMLDivElement,
-  zoom: number
-): HandleElement[] | null => {
-  const handles = nodeElement.querySelectorAll(selector);
-
-  if (!handles || !handles.length) {
-    return null;
-  }
-
-  const handlesArray = Array.from(handles) as HTMLDivElement[];
-  const nodeBounds = nodeElement.getBoundingClientRect();
-
-  return handlesArray.map((handle): HandleElement => {
-    const handleBounds = handle.getBoundingClientRect();
-
-    return {
-      id: handle.getAttribute('data-handleid'),
-      position: handle.getAttribute('data-handlepos') as unknown as Position,
-      x: (handleBounds.left - nodeBounds.left) / zoom,
-      y: (handleBounds.top - nodeBounds.top) / zoom,
-      ...getDimensions(handle)
-    };
-  });
-};
-
 export const createNodes = (
   nodes: Node[],
   defaultOptions?: DefaultNodeOptions