diff --git a/examples/Basic/Basic.vue b/examples/Basic/Basic.vue index 9b35105c..0814c288 100644 --- a/examples/Basic/Basic.vue +++ b/examples/Basic/Basic.vue @@ -7,13 +7,10 @@ import { Connection, Edge, Elements, - FlowElement, FlowInstance, addEdge, isNode, removeElements, - Node, - useVueFlow, } from '~/index' const onNodeDragStop = (e) => console.log('drag stop', e) @@ -27,8 +24,8 @@ const elements = ref([ { id: 'e1-3', source: '1', target: '3' }, ]) const vfInstance = ref() -const onElementsRemove = (elementsToRemove: Elements) => (elements.value = removeElements(elementsToRemove, elements.value)) -const onConnect = (params: Edge | Connection) => (elements.value = addEdge(params, elements.value)) +const onElementsRemove = (elementsToRemove: Elements) => removeElements(elementsToRemove, elements.value) +const onConnect = (params: Edge | Connection) => addEdge(params, elements.value) const onLoad = (flowInstance: FlowInstance) => { flowInstance.fitView({ padding: 0.1 }) vfInstance.value = flowInstance diff --git a/src/index.ts b/src/index.ts index ed24bff0..9300e7d5 100644 --- a/src/index.ts +++ b/src/index.ts @@ -15,7 +15,6 @@ export { updateEdge, getTransformForBounds, getRectOfNodes, - isInputDOMNode, graphPosToZoomedPos, } from './utils/graph' export { defaultEdgeTypes, defaultNodeTypes } from './utils/store' diff --git a/src/utils/graph.ts b/src/utils/graph.ts index d6f29bcd..8dcd33fc 100644 --- a/src/utils/graph.ts +++ b/src/utils/graph.ts @@ -69,11 +69,14 @@ export const getIncomers = (node: GraphNode, elements: Elements) => getConnected export const removeElements = (elementsToRemove: Elements, elements: Elements) => { const nodeIdsToRemove = elementsToRemove.map((n) => n.id) - - return elements.filter((element) => { + const shouldRemove = (element: Node | Edge) => { const { target, source } = isEdge(element) ? element : { target: '', source: '' } - return !(nodeIdsToRemove.includes(element.id) || nodeIdsToRemove.includes(target) || nodeIdsToRemove.includes(source)) + return nodeIdsToRemove.includes(element.id) || nodeIdsToRemove.includes(target) || nodeIdsToRemove.includes(source) + } + elements.forEach((element, i) => { + if (shouldRemove(element)) elements.splice(i, 1) }) + return elements.filter((element) => !shouldRemove(element)) } const getEdgeId = ({ source, sourceHandle, target, targetHandle }: Connection): ElementId => @@ -106,8 +109,8 @@ export const addEdge = (edgeParams: Edge | Connection, elements: Elements) => { } as Edge } if (connectionExists(edge, elements)) return elements - - return elements.push(edge) + elements.push(edge) + return [...elements, edge] } export const updateEdge = (oldEdge: Edge, newConnection: Connection, elements: Elements) => {