chore(types): cleanup

packages/core/src/hooks/useDrag/index.ts

@@ -1,12 +1,13 @@
-import { RefObject, useEffect, useRef, MouseEvent, useState, useCallback } from 'react';
+import { useEffect, useRef, useState, useCallback } from 'react';
+import type { RefObject, MouseEvent } from 'react';
 import { drag } from 'd3-drag';
 import { select } from 'd3-selection';
 import type { D3DragEvent, SubjectPosition } from 'd3';
 
 import { useStoreApi } from '../../hooks/useStore';
-import { NodeDragItem, Node, SelectionDragHandler } from '../../types';
 import { getDragItems, getEventHandlerParams, hasSelector, calcNextPosition } from './utils';
 import { handleNodeClick } from '../../components/Nodes/utils';
+import type { NodeDragItem, Node, SelectionDragHandler } from '../../types';
 
 export type UseDragEvent = D3DragEvent<HTMLDivElement, null, SubjectPosition>;
 export type UseDragData = { dx: number; dy: number };

packages/core/src/hooks/useDrag/utils.ts

@@ -1,7 +1,7 @@
-import { RefObject } from 'react';
+import type { RefObject } from 'react';
 
-import { CoordinateExtent, Node, NodeDragItem, NodeInternals, XYPosition } from '../../types';
 import { clampPosition, devWarn } from '../../utils';
+import type { CoordinateExtent, Node, NodeDragItem, NodeInternals, XYPosition } from '../../types';
 
 export function isParentSelected(node: Node, nodeInternals: NodeInternals): boolean {
   if (!node.parentNode) {

packages/core/src/hooks/useEdges.ts

@@ -1,5 +1,5 @@
 import { useStore } from '../hooks/useStore';
-import { Edge, ReactFlowState } from '../types';
+import type { Edge, ReactFlowState } from '../types';
 
 const edgesSelector = (state: ReactFlowState) => state.edges;
 

packages/core/src/hooks/useGlobalKeyHandler.ts

@@ -3,7 +3,7 @@ import { useEffect } from 'react';
 import { useStoreApi } from '../hooks/useStore';
 import useKeyPress from './useKeyPress';
 import { getConnectedEdges } from '../utils/graph';
-import { KeyCode, NodeChange, Node } from '../types';
+import type { KeyCode, NodeChange, Node } from '../types';
 
 interface HookParams {
   deleteKeyCode: KeyCode | null;

packages/core/src/hooks/useKeyPress.ts

@@ -1,6 +1,6 @@
 import { useState, useEffect, useRef, useMemo } from 'react';
 
-import { KeyCode } from '../types';
+import type { KeyCode } from '../types';
 
 type Keys = Array<string>;
 type PressedKeys = Set<string>;

packages/core/src/hooks/useNodes.ts

@@ -1,5 +1,5 @@
 import { useStore } from '../hooks/useStore';
-import { Node, ReactFlowState } from '../types';
+import type { Node, ReactFlowState } from '../types';
 
 const nodesSelector = (state: ReactFlowState) => Array.from(state.nodeInternals.values());
 

packages/core/src/hooks/useNodesEdgesState.ts

@@ -1,8 +1,9 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { useState, useCallback, SetStateAction, Dispatch } from 'react';
+import { useState, useCallback } from 'react';
+import type { SetStateAction, Dispatch } from 'react';
 
 import { applyNodeChanges, applyEdgeChanges } from '../utils/changes';
-import { Node, NodeChange, Edge, EdgeChange } from '../types';
+import type { Node, NodeChange, Edge, EdgeChange } from '../types';
 
 type ApplyChanges<ItemType, ChangesType> = (changes: ChangesType[], items: ItemType[]) => ItemType[];
 type OnChange<ChangesType> = (changes: ChangesType[]) => void;

packages/core/src/hooks/useNodesInitialized.ts

@@ -1,6 +1,6 @@
-import { ReactFlowState } from '../types';
 import { internalsSymbol } from '../utils';
 import { useStore } from './useStore';
+import type { ReactFlowState } from '../types';
 
 const selector = (s: ReactFlowState) => {
   if (s.nodeInternals.size === 0) {

packages/core/src/hooks/useOnInitHandler.ts

@@ -1,7 +1,7 @@
 import { useEffect, useRef } from 'react';
 
 import useReactFlow from './useReactFlow';
-import { OnInit } from '../types';
+import type { OnInit } from '../types';
 
 function useOnInitHandler(onInit: OnInit | undefined) {
   const rfInstance = useReactFlow();

packages/core/src/hooks/useReactFlow.ts

@@ -2,7 +2,7 @@ import { useCallback, useMemo } from 'react';
 
 import useViewportHelper from './useViewportHelper';
 import { useStoreApi } from '../hooks/useStore';
-import {
+import type {
   ReactFlowInstance,
   Instance,
   NodeAddChange,

packages/core/src/hooks/useResizeHandler.ts

@@ -1,4 +1,5 @@
-import { useEffect, MutableRefObject } from 'react';
+import { useEffect } from 'react';
+import type { MutableRefObject } from 'react';
 
 import { useStoreApi } from '../hooks/useStore';
 import { devWarn, getDimensions } from '../utils';

packages/core/src/hooks/useStore.ts

@@ -1,8 +1,9 @@
 import { useContext, useMemo } from 'react';
-import { StoreApi, useStore as useZustandStore } from 'zustand';
+import { useStore as useZustandStore } from 'zustand';
+import type { StoreApi } from 'zustand';
 
 import StoreContext from '../contexts/RFStoreContext';
-import { ReactFlowState } from '../types';
+import type { ReactFlowState } from '../types';
 
 const errorMessage =
   '[React Flow]: Seems like you have not used zustand provider as an ancestor. Help: https://reactflow.dev/error#100';

packages/core/src/hooks/useUpdateNodeInternals.ts

@@ -1,7 +1,7 @@
 import { useCallback } from 'react';
 
 import { useStoreApi } from '../hooks/useStore';
-import { UpdateNodeInternals } from '../types';
+import type { UpdateNodeInternals } from '../types';
 
 function useUpdateNodeInternals(): UpdateNodeInternals {
   const store = useStoreApi();

packages/core/src/hooks/useUpdateNodePositions.ts

@@ -2,8 +2,7 @@ import { useCallback } from 'react';
 
 import { useStoreApi } from '../hooks/useStore';
 import { calcNextPosition } from './useDrag/utils';
-
-import { XYPosition } from '../types';
+import type { XYPosition } from '../types';
 
 function useUpdateNodePositions() {
   const store = useStoreApi();

packages/core/src/hooks/useViewport.ts

@@ -1,7 +1,7 @@
 import shallow from 'zustand/shallow';
 
 import { useStore } from '../hooks/useStore';
-import { Viewport, ReactFlowState } from '../types';
+import type { Viewport, ReactFlowState } from '../types';
 
 const viewportSelector = (state: ReactFlowState) => ({
   x: state.transform[0],

packages/core/src/hooks/useViewportHelper.ts

@@ -4,8 +4,8 @@ import shallow from 'zustand/shallow';
 
 import { useStoreApi, useStore } from '../hooks/useStore';
 import { pointToRendererPoint, getTransformForBounds, getD3Transition } from '../utils/graph';
-import { ViewportHelperFunctions, ReactFlowState, XYPosition } from '../types';
 import { fitView as fitViewStore } from '../store/utils';
+import type { ViewportHelperFunctions, ReactFlowState, XYPosition } from '../types';
 
 // eslint-disable-next-line @typescript-eslint/no-empty-function
 const noop = () => {};

packages/core/src/hooks/useVisibleEdges.ts

@@ -2,8 +2,8 @@ import { useCallback } from 'react';
 
 import { useStore } from '../hooks/useStore';
 import { isEdgeVisible } from '../container/EdgeRenderer/utils';
-import { ReactFlowState, NodeInternals, Edge } from '../types';
 import { internalsSymbol, isNumeric } from '../utils';
+import type { ReactFlowState, NodeInternals, Edge } from '../types';
 
 const defaultEdgeTree = [{ level: 0, isMaxLevel: true, edges: [] }];
 

packages/core/src/hooks/useVisibleNodes.ts

@@ -2,8 +2,7 @@ import { useCallback } from 'react';
 
 import { useStore } from '../hooks/useStore';
 import { getNodesInside } from '../utils/graph';
-
-import { ReactFlowState } from '../types';
+import type { ReactFlowState } from '../types';
 
 function useVisibleNodes(onlyRenderVisible: boolean) {
   const nodes = useStore(