From 2e1bfc35c0ca13d1ea944867730c36dc89f0a925 Mon Sep 17 00:00:00 2001 From: moklick Date: Tue, 23 Jan 2024 13:04:02 +0100 Subject: [PATCH] chore(onbeforedelete): use correct node/edge types, pass generic --- examples/react/src/examples/CustomNode/index.tsx | 4 ++++ packages/react/src/index.ts | 1 - packages/react/src/types/component-props.ts | 2 +- packages/react/src/types/general.ts | 6 ++++++ packages/react/src/types/store.ts | 2 +- packages/svelte/src/lib/store/initial-store.ts | 4 ++-- packages/svelte/src/lib/types/general.ts | 7 ++++++- packages/system/src/types/general.ts | 2 +- packages/system/src/utils/graph.ts | 4 ++-- 9 files changed, 23 insertions(+), 9 deletions(-) diff --git a/examples/react/src/examples/CustomNode/index.tsx b/examples/react/src/examples/CustomNode/index.tsx index 22433db0..a8c0f55d 100644 --- a/examples/react/src/examples/CustomNode/index.tsx +++ b/examples/react/src/examples/CustomNode/index.tsx @@ -15,6 +15,7 @@ import { applyNodeChanges, OnNodesChange, OnConnect, + OnBeforeDelete, } from '@xyflow/react'; import ColorSelectorNode from './ColorSelectorNode'; @@ -142,6 +143,8 @@ const CustomNodeFlow = () => { [setEdges] ); + const onBeforeDelete: OnBeforeDelete = useCallback(async (params) => true, []); + return ( { fitView minZoom={0.3} maxZoom={2} + onBeforeDelete={onBeforeDelete} > { diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts index 8ad67000..bcb12cdf 100644 --- a/packages/react/src/index.ts +++ b/packages/react/src/index.ts @@ -79,7 +79,6 @@ export { type ColorMode, type ColorModeClass, type HandleType, - type OnBeforeDelete, type ShouldResize, type OnResizeStart, type OnResize, diff --git a/packages/react/src/types/component-props.ts b/packages/react/src/types/component-props.ts index f8bc8dfd..6018e1f5 100644 --- a/packages/react/src/types/component-props.ts +++ b/packages/react/src/types/component-props.ts @@ -21,7 +21,6 @@ import type { IsValidConnection, ColorMode, SnapGrid, - OnBeforeDelete, } from '@xyflow/system'; import type { @@ -44,6 +43,7 @@ import type { SelectionDragHandler, EdgeMouseHandler, OnNodeDrag, + OnBeforeDelete, } from '.'; /** diff --git a/packages/react/src/types/general.ts b/packages/react/src/types/general.ts index 1a7462ad..53d95d68 100644 --- a/packages/react/src/types/general.ts +++ b/packages/react/src/types/general.ts @@ -11,6 +11,7 @@ import { FitBounds, XYPosition, NodeProps, + OnBeforeDeleteBase, } from '@xyflow/system'; import type { NodeChange, EdgeChange, Node, Edge, ReactFlowInstance, EdgeProps } from '.'; @@ -59,3 +60,8 @@ export type ViewportHelperFunctions = { flowToScreenPosition: (position: XYPosition) => XYPosition; viewportInitialized: boolean; }; + +export type OnBeforeDelete = OnBeforeDeleteBase< + NodeType, + EdgeType +>; diff --git a/packages/react/src/types/store.ts b/packages/react/src/types/store.ts index a0d5f8cc..b3e0449e 100644 --- a/packages/react/src/types/store.ts +++ b/packages/react/src/types/store.ts @@ -26,7 +26,6 @@ import { type EdgeLookup, type ConnectionLookup, type NodeLookup, - OnBeforeDelete, } from '@xyflow/system'; import type { @@ -43,6 +42,7 @@ import type { UnselectNodesAndEdgesParams, OnDelete, OnNodeDrag, + OnBeforeDelete, } from '.'; export type ReactFlowStore = { diff --git a/packages/svelte/src/lib/store/initial-store.ts b/packages/svelte/src/lib/store/initial-store.ts index 26c57c86..ea7b9118 100644 --- a/packages/svelte/src/lib/store/initial-store.ts +++ b/packages/svelte/src/lib/store/initial-store.ts @@ -23,7 +23,6 @@ import { type OnConnectStart, type OnConnectEnd, type NodeLookup, - type OnBeforeDelete, type EdgeLookup } from '@xyflow/system'; @@ -47,7 +46,8 @@ import type { Edge, FitViewOptions, OnDelete, - OnEdgeCreate + OnEdgeCreate, + OnBeforeDelete } from '$lib/types'; import { createNodesStore, createEdgesStore } from './utils'; import { initConnectionProps, type ConnectionProps } from './derived-connection-props'; diff --git a/packages/svelte/src/lib/types/general.ts b/packages/svelte/src/lib/types/general.ts index 4f5fa30b..e67ad88c 100644 --- a/packages/svelte/src/lib/types/general.ts +++ b/packages/svelte/src/lib/types/general.ts @@ -5,7 +5,8 @@ import type { Position, XYPosition, ConnectingHandle, - Connection + Connection, + OnBeforeDeleteBase } from '@xyflow/system'; import type { Node } from './nodes'; @@ -52,3 +53,7 @@ export type FitViewOptions = FitViewOptionsBase; export type OnDelete = (params: { nodes: Node[]; edges: Edge[] }) => void; export type OnEdgeCreate = (connection: Connection) => Edge | Connection | void; +export type OnBeforeDelete< + NodeType extends Node = Node, + EdgeType extends Edge = Edge +> = OnBeforeDeleteBase; diff --git a/packages/system/src/types/general.ts b/packages/system/src/types/general.ts index 5fe4a844..8ac3d6be 100644 --- a/packages/system/src/types/general.ts +++ b/packages/system/src/types/general.ts @@ -142,7 +142,7 @@ export type ColorMode = ColorModeClass | 'system'; export type ConnectionLookup = Map>; -export type OnBeforeDelete = ({ +export type OnBeforeDeleteBase = ({ nodes, edges, }: { diff --git a/packages/system/src/utils/graph.ts b/packages/system/src/utils/graph.ts index fa56a987..f7e177b9 100644 --- a/packages/system/src/utils/graph.ts +++ b/packages/system/src/utils/graph.ts @@ -22,7 +22,7 @@ import { NodeDragItem, CoordinateExtent, OnError, - OnBeforeDelete, + OnBeforeDeleteBase, } from '../types'; import { errorMessages } from '../constants'; @@ -347,7 +347,7 @@ export async function getElementsToRemove[]; nodes: NodeType[]; edges: EdgeType[]; - onBeforeDelete?: OnBeforeDelete; + onBeforeDelete?: OnBeforeDeleteBase; }): Promise<{ nodes: NodeType[]; edges: EdgeType[];