chore(types): cleanup

packages/core/src/components/A11yDescriptions/index.tsx

@@ -1,6 +1,6 @@
 import { CSSProperties } from 'react';
 import { useStore } from '../../hooks/useStore';
-import { ReactFlowState } from '../../types';
+import type { ReactFlowState } from '../../types';
 
 const style: CSSProperties = { display: 'none' };
 const ariaLiveStyle: CSSProperties = {

packages/core/src/components/Attribution/index.tsx

@@ -1,5 +1,5 @@
 import Panel from '../Panel';
-import { PanelPosition, ProOptions } from '../../types';
+import type { PanelPosition, ProOptions } from '../../types';
 
 type AttributionProps = {
   proOptions?: ProOptions;

packages/core/src/components/ConnectionLine/index.tsx

@@ -4,9 +4,10 @@ import shallow from 'zustand/shallow';
 import { useStore } from '../../hooks/useStore';
 import { getBezierPath } from '../Edges/BezierEdge';
 import { getSmoothStepPath } from '../Edges/SmoothStepEdge';
-import { ConnectionLineType, ConnectionLineComponent, HandleType, Position, ReactFlowStore } from '../../types';
 import { getSimpleBezierPath } from '../Edges/SimpleBezierEdge';
 import { internalsSymbol } from '../../utils';
+import type { ConnectionLineComponent, HandleType, ReactFlowStore } from '../../types';
+import { Position, ConnectionLineType } from '../../types';
 
 type ConnectionLineProps = {
   connectionNodeId: string;

packages/core/src/components/Edges/BaseEdge.tsx

@@ -1,5 +1,5 @@
 import EdgeText from './EdgeText';
-import { BaseEdgeProps } from '../../types';
+import type { BaseEdgeProps } from '../../types';
 
 const BaseEdge = ({
   path,

packages/core/src/components/Edges/BezierEdge.tsx

@@ -2,7 +2,8 @@ import { memo } from 'react';
 
 import BaseEdge from './BaseEdge';
 import { getBezierEdgeCenter } from './utils';
-import { BezierEdgeProps, Position } from '../../types';
+import { Position } from '../../types';
+import type { BezierEdgeProps } from '../../types';
 
 export interface GetBezierPathParams {
   sourceX: number;

packages/core/src/components/Edges/EdgeAnchor.tsx

@@ -1,4 +1,4 @@
-import { FC, MouseEvent as ReactMouseEvent, SVGAttributes } from 'react';
+import type { FC, MouseEvent as ReactMouseEvent, SVGAttributes } from 'react';
 import cc from 'classcat';
 
 import { Position } from '../../types';

packages/core/src/components/Edges/EdgeText.tsx

@@ -1,4 +1,5 @@
-import { memo, useRef, useState, useEffect, FC, PropsWithChildren } from 'react';
+import { memo, useRef, useState, useEffect } from 'react';
+import type { FC, PropsWithChildren } from 'react';
 import cc from 'classcat';
 
 import { EdgeTextProps, Rect } from '../../types';

packages/core/src/components/Edges/SimpleBezierEdge.tsx

@@ -1,7 +1,9 @@
 import { memo } from 'react';
-import { EdgeProps, Position } from '../../types';
+
 import BaseEdge from './BaseEdge';
 import { getBezierEdgeCenter } from './utils';
+import { Position } from '../../types';
+import type { EdgeProps } from '../../types';
 
 export interface GetSimpleBezierPathParams {
   sourceX: number;

packages/core/src/components/Edges/SmoothStepEdge.tsx

@@ -1,8 +1,9 @@
 import { memo } from 'react';
 
-import { SmoothStepEdgeProps, Position, XYPosition } from '../../types';
 import BaseEdge from './BaseEdge';
 import { getEdgeCenter } from './utils';
+import { Position } from '../../types';
+import type { SmoothStepEdgeProps, XYPosition } from '../../types';
 
 export interface GetSmoothStepPathParams {
   sourceX: number;

packages/core/src/components/Edges/StepEdge.tsx

@@ -1,7 +1,7 @@
 import { memo, useMemo } from 'react';
 
-import { SmoothStepEdgeProps } from '../../types';
 import SmoothStepEdge from './SmoothStepEdge';
+import type { SmoothStepEdgeProps } from '../../types';
 
 const StepEdge = memo((props: SmoothStepEdgeProps) => (
   <SmoothStepEdge

packages/core/src/components/Edges/StraightEdge.tsx

@@ -1,8 +1,8 @@
 import { memo } from 'react';
 
 import BaseEdge from './BaseEdge';
-import { EdgeProps } from '../../types';
 import { getEdgeCenter } from './utils';
+import type { EdgeProps } from '../../types';
 
 export type GetStraightPathParams = {
   sourceX: number;

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

@@ -1,7 +1,7 @@
 import { MouseEvent as ReactMouseEvent } from 'react';
 import { StoreApi } from 'zustand';
 
-import { Edge, MarkerType, ReactFlowState } from '../../types';
+import type { Edge, MarkerType, ReactFlowState } from '../../types';
 
 export const getMarkerEnd = (markerType?: MarkerType, markerEndId?: string): string => {
   if (typeof markerEndId !== 'undefined' && markerEndId) {

packages/core/src/components/Edges/wrapEdge.tsx

@@ -1,4 +1,5 @@
-import { memo, ComponentType, useState, useMemo, KeyboardEvent, useRef } from 'react';
+import { memo, useState, useMemo, useRef } from 'react';
+import type { ComponentType, KeyboardEvent } from 'react';
 import cc from 'classcat';
 
 import { useStoreApi } from '../../hooks/useStore';
@@ -7,8 +8,8 @@ import { handleMouseDown } from '../Handle/handler';
 import { EdgeAnchor } from './EdgeAnchor';
 import { getMarkerId } from '../../utils/graph';
 import { getMouseHandler } from './utils';
-import { EdgeProps, WrapEdgeProps, Connection } from '../../types';
 import { elementSelectionKeys } from '../../utils';
+import type { EdgeProps, WrapEdgeProps, Connection } from '../../types';
 
 export default (EdgeComponent: ComponentType<EdgeProps>) => {
   const EdgeWrapper = ({

packages/core/src/components/Handle/handler.ts

@@ -1,8 +1,9 @@
-import { MouseEvent as ReactMouseEvent } from 'react';
+import type { MouseEvent as ReactMouseEvent } from 'react';
 import { StoreApi } from 'zustand';
 
 import { getHostForElement } from '../../utils';
-import { OnConnect, ConnectionMode, Connection, HandleType, ReactFlowState } from '../../types';
+import { ConnectionMode } from '../../types';
+import type { OnConnect, Connection, HandleType, ReactFlowState } from '../../types';
 
 type ValidConnectionFunc = (connection: Connection) => boolean;
 

packages/core/src/components/Handle/index.tsx

@@ -4,10 +4,11 @@ import shallow from 'zustand/shallow';
 
 import { useStore, useStoreApi } from '../../hooks/useStore';
 import NodeIdContext from '../../contexts/NodeIdContext';
-import { HandleProps, Connection, ReactFlowState, Position } from '../../types';
 import { checkElementBelowIsValid, handleMouseDown } from './handler';
 import { getHostForElement } from '../../utils';
 import { addEdge } from '../../utils/graph';
+import { Position } from '../../types';
+import type { HandleProps, Connection, ReactFlowState } from '../../types';
 
 const alwaysValid = () => true;
 

packages/core/src/components/Nodes/DefaultNode.tsx

@@ -1,7 +1,8 @@
 import { memo } from 'react';
 
 import Handle from '../../components/Handle';
-import { NodeProps, Position } from '../../types';
+import { Position } from '../../types';
+import type { NodeProps } from '../../types';
 
 const DefaultNode = ({
   data,

packages/core/src/components/Nodes/InputNode.tsx

@@ -1,7 +1,8 @@
 import { memo } from 'react';
 
 import Handle from '../../components/Handle';
-import { NodeProps, Position } from '../../types';
+import { Position } from '../../types';
+import type { NodeProps } from '../../types';
 
 const InputNode = ({ data, isConnectable, sourcePosition = Position.Bottom }: NodeProps) => (
   <>

packages/core/src/components/Nodes/OutputNode.tsx

@@ -1,7 +1,8 @@
 import { memo } from 'react';
 
 import Handle from '../../components/Handle';
-import { NodeProps, Position } from '../../types';
+import { Position } from '../../types';
+import type { NodeProps } from '../../types';
 
 const OutputNode = ({ data, isConnectable, targetPosition = Position.Top }: NodeProps) => (
   <>

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

@@ -1,8 +1,9 @@
 import { MouseEvent } from 'react';
 import { StoreApi } from 'zustand';
 
-import { HandleElement, Node, NodeOrigin, Position, ReactFlowState } from '../../types';
 import { getDimensions } from '../../utils';
+import { Position } from '../../types';
+import type { HandleElement, Node, NodeOrigin, ReactFlowState } from '../../types';
 
 export const getHandleBounds = (
   selector: string,

packages/core/src/components/Nodes/wrapNode.tsx

@@ -1,4 +1,5 @@
-import { useEffect, useRef, memo, ComponentType, MouseEvent, KeyboardEvent } from 'react';
+import { useEffect, useRef, memo } from 'react';
+import type { ComponentType, MouseEvent, KeyboardEvent } from 'react';
 import cc from 'classcat';
 
 import { useStoreApi } from '../../hooks/useStore';
@@ -7,8 +8,8 @@ import { ARIA_NODE_DESC_KEY } from '../A11yDescriptions';
 import useDrag from '../../hooks/useDrag';
 import useUpdateNodePositions from '../../hooks/useUpdateNodePositions';
 import { getMouseHandler, handleNodeClick } from './utils';
-import { NodeProps, WrapNodeProps, XYPosition } from '../../types';
 import { elementSelectionKeys } from '../../utils';
+import type { NodeProps, WrapNodeProps, XYPosition } from '../../types';
 
 export const arrowKeyDiffs: Record<string, XYPosition> = {
   ArrowUp: { x: 0, y: -1 },

packages/core/src/components/NodesSelection/index.tsx

@@ -3,16 +3,17 @@
  * made a selection with on or several nodes
  */
 
-import { memo, useRef, MouseEvent, KeyboardEvent, useEffect } from 'react';
+import { memo, useRef, useEffect } from 'react';
+import type { MouseEvent, KeyboardEvent } from 'react';
 import cc from 'classcat';
 import shallow from 'zustand/shallow';
 
 import { useStore, useStoreApi } from '../../hooks/useStore';
-import { Node, ReactFlowState } from '../../types';
 import { getRectOfNodes } from '../../utils/graph';
 import useDrag from '../../hooks/useDrag';
 import { arrowKeyDiffs } from '../Nodes/wrapNode';
 import useUpdateNodePositions from '../../hooks/useUpdateNodePositions';
+import type { Node, ReactFlowState } from '../../types';
 
 export interface NodesSelectionProps {
   onSelectionContextMenu?: (event: MouseEvent, nodes: Node[]) => void;

packages/core/src/components/Panel/index.tsx

@@ -1,8 +1,8 @@
-import { HTMLAttributes, ReactNode } from 'react';
+import type { HTMLAttributes, ReactNode } from 'react';
 import cc from 'classcat';
 
-import { PanelPosition, ReactFlowState } from '../../types';
 import { useStore } from '../../hooks/useStore';
+import type { PanelPosition, ReactFlowState } from '../../types';
 
 export type PanelProps = HTMLAttributes<HTMLDivElement> & {
   position: PanelPosition;

packages/core/src/components/ReactFlowProvider/index.tsx

@@ -1,9 +1,10 @@
-import { FC, PropsWithChildren, useRef } from 'react';
+import { useRef } from 'react';
+import type { FC, PropsWithChildren } from 'react';
 import { StoreApi } from 'zustand';
 
 import { Provider } from '../../contexts/RFStoreContext';
 import { createRFStore } from '../../store';
-import { ReactFlowState } from '../../types';
+import type { ReactFlowState } from '../../types';
 
 const ReactFlowProvider: FC<PropsWithChildren> = ({ children }) => {
   const storeRef = useRef<StoreApi<ReactFlowState> | null>(null);

packages/core/src/components/SelectionListener/index.tsx

@@ -1,8 +1,8 @@
 import { memo, useEffect } from 'react';
 import shallow from 'zustand/shallow';
 
-import { ReactFlowState, OnSelectionChangeFunc, Node, Edge } from '../../types';
 import { useStore, useStoreApi } from '../../hooks/useStore';
+import type { ReactFlowState, OnSelectionChangeFunc, Node, Edge } from '../../types';
 
 type SelectionListenerProps = {
   onSelectionChange?: OnSelectionChangeFunc;

packages/core/src/components/StoreUpdater/index.tsx

@@ -3,7 +3,7 @@ import { StoreApi } from 'zustand';
 import shallow from 'zustand/shallow';
 
 import { useStore, useStoreApi } from '../../hooks/useStore';
-import { Node, Edge, ReactFlowState, CoordinateExtent, ReactFlowProps, ReactFlowStore } from '../../types';
+import type { Node, Edge, ReactFlowState, CoordinateExtent, ReactFlowProps, ReactFlowStore } from '../../types';
 
 type StoreUpdaterProps = Pick<
   ReactFlowProps,

packages/core/src/components/UserSelection/index.tsx

@@ -7,8 +7,8 @@ import shallow from 'zustand/shallow';
 
 import { useStore, useStoreApi } from '../../hooks/useStore';
 import { getSelectionChanges } from '../../utils/changes';
-import { XYPosition, ReactFlowState, NodeChange, EdgeChange, Rect } from '../../types';
 import { getConnectedEdges, getNodesInside } from '../../utils/graph';
+import type { XYPosition, ReactFlowState, NodeChange, EdgeChange, Rect } from '../../types';
 
 type SelectionRect = Rect & {
   startX: number;