Skip to content
On this page

Interface: State

Hierarchy

Table of contents

Properties

Properties

__experimentalFeatures

Optional __experimentalFeatures: Object

Type declaration

NameType
nestedFlow?boolean

Inherited from

Omit.__experimentalFeatures


applyDefault

applyDefault: boolean

Overrides

Omit.applyDefault


ariaLiveMessage

ariaLiveMessage: string


autoConnect

autoConnect: boolean | Connector

Overrides

Omit.autoConnect


autoPanOnConnect

autoPanOnConnect: boolean

Overrides

Omit.autoPanOnConnect


autoPanOnNodeDrag

autoPanOnNodeDrag: boolean

Overrides

Omit.autoPanOnNodeDrag


connectOnClick

connectOnClick: boolean

Overrides

Omit.connectOnClick


connectionClickStartHandle

connectionClickStartHandle: null | ConnectingHandle


connectionEndHandle

connectionEndHandle: null | ConnectingHandle


connectionLineOptions

connectionLineOptions: ConnectionLineOptions

Overrides

Omit.connectionLineOptions


connectionLineStyle

connectionLineStyle: null | CSSProperties

Deprecated

use style

Overrides

Omit.connectionLineStyle


connectionLineType

connectionLineType: null | ConnectionLineType

Deprecated

use type

Overrides

Omit.connectionLineType


connectionMode

connectionMode: ConnectionMode

Overrides

Omit.connectionMode


connectionPosition

connectionPosition: XYPosition


connectionRadius

connectionRadius: number

Overrides

Omit.connectionRadius


connectionStartHandle

connectionStartHandle: null | ConnectingHandle


connectionStatus

connectionStatus: null | ConnectionStatus


d3Selection

Readonly d3Selection: null | D3Selection


d3Zoom

Readonly d3Zoom: null | D3Zoom


d3ZoomHandler

Readonly d3ZoomHandler: null | D3ZoomHandler


defaultEdgeOptions

defaultEdgeOptions: undefined | DefaultEdgeOptions

Overrides

Omit.defaultEdgeOptions


defaultMarkerColor

defaultMarkerColor: string

Overrides

Omit.defaultMarkerColor


defaultViewport

defaultViewport: Partial<ViewportTransform>

Overrides

Omit.defaultViewport


deleteKeyCode

deleteKeyCode: null | KeyFilter

Overrides

Omit.deleteKeyCode


dimensions

Readonly dimensions: Dimensions

viewport dimensions - do not change!


disableKeyboardA11y

disableKeyboardA11y: boolean

Overrides

Omit.disableKeyboardA11y


edgeTypes

Optional edgeTypes: EdgeTypesObject

either use the edgeTypes prop to define your edge-types or use slots (<template #edge-mySpecialType="props">)

Inherited from

Omit.edgeTypes


edgeUpdaterRadius

edgeUpdaterRadius: number

Overrides

Omit.edgeUpdaterRadius


edges

edges: GraphEdge<any, any, string>[]

all stored edges

Overrides

Omit.edges


edgesFocusable

edgesFocusable: boolean

Overrides

Omit.edgesFocusable


edgesUpdatable

edgesUpdatable: EdgeUpdatable

Overrides

Omit.edgesUpdatable


elementsSelectable

elementsSelectable: boolean

Overrides

Omit.elementsSelectable


elevateEdgesOnSelect

elevateEdgesOnSelect: boolean

Overrides

Omit.elevateEdgesOnSelect


elevateNodesOnSelect

elevateNodesOnSelect: boolean

Overrides

Omit.elevateNodesOnSelect


fitViewOnInit

fitViewOnInit: boolean

Overrides

Omit.fitViewOnInit


hooks

Readonly hooks: Readonly<{ clickConnectEnd: EventHookExtended<undefined | MouseEvent | TouchEvent> ; clickConnectStart: EventHookExtended<{ event?: MouseEvent | TouchEvent } & OnConnectStartParams> ; connect: EventHookExtended<Connection> ; connectEnd: EventHookExtended<undefined | MouseEvent | TouchEvent> ; connectStart: EventHookExtended<{ event?: MouseEvent | TouchEvent } & OnConnectStartParams> ; edgeClick: EventHookExtended<EdgeMouseEvent> ; edgeContextMenu: EventHookExtended<EdgeMouseEvent> ; edgeDoubleClick: EventHookExtended<EdgeMouseEvent> ; edgeMouseEnter: EventHookExtended<EdgeMouseEvent> ; edgeMouseLeave: EventHookExtended<EdgeMouseEvent> ; edgeMouseMove: EventHookExtended<EdgeMouseEvent> ; edgeUpdate: EventHookExtended<EdgeUpdateEvent> ; edgeUpdateEnd: EventHookExtended<EdgeMouseEvent> ; edgeUpdateStart: EventHookExtended<EdgeMouseEvent> ; edgesChange: EventHookExtended<EdgeChange[]> ; error: EventHookExtended<VueFlowError<ErrorCode>> ; miniMapNodeClick: EventHookExtended<NodeMouseEvent> ; miniMapNodeDoubleClick: EventHookExtended<NodeMouseEvent> ; miniMapNodeMouseEnter: EventHookExtended<NodeMouseEvent> ; miniMapNodeMouseLeave: EventHookExtended<NodeMouseEvent> ; miniMapNodeMouseMove: EventHookExtended<NodeMouseEvent> ; move: EventHookExtended<{ event: WheelEvent | D3ZoomEvent<HTMLDivElement, any> ; flowTransform: ViewportTransform }> ; moveEnd: EventHookExtended<{ event: WheelEvent | D3ZoomEvent<HTMLDivElement, any> ; flowTransform: ViewportTransform }> ; moveStart: EventHookExtended<{ event: WheelEvent | D3ZoomEvent<HTMLDivElement, any> ; flowTransform: ViewportTransform }> ; nodeClick: EventHookExtended<NodeMouseEvent> ; nodeContextMenu: EventHookExtended<NodeMouseEvent> ; nodeDoubleClick: EventHookExtended<NodeMouseEvent> ; nodeDrag: EventHookExtended<NodeDragEvent> ; nodeDragStart: EventHookExtended<NodeDragEvent> ; nodeDragStop: EventHookExtended<NodeDragEvent> ; nodeMouseEnter: EventHookExtended<NodeMouseEvent> ; nodeMouseLeave: EventHookExtended<NodeMouseEvent> ; nodeMouseMove: EventHookExtended<NodeMouseEvent> ; nodesChange: EventHookExtended<NodeChange[]> ; nodesInitialized: EventHookExtended<GraphNode<any, any, string>[]> ; paneClick: EventHookExtended<MouseEvent> ; paneContextMenu: EventHookExtended<MouseEvent> ; paneMouseEnter: EventHookExtended<MouseEvent> ; paneMouseLeave: EventHookExtended<MouseEvent> ; paneMouseMove: EventHookExtended<MouseEvent> ; paneReady: EventHookExtended<VueFlowStore> ; paneScroll: EventHookExtended<undefined | WheelEvent> ; selectionContextMenu: EventHookExtended<{ event: MouseEvent ; nodes: GraphNode<any, any, string>[] }> ; selectionDrag: EventHookExtended<NodeDragEvent> ; selectionDragStart: EventHookExtended<NodeDragEvent> ; selectionDragStop: EventHookExtended<NodeDragEvent> ; selectionEnd: EventHookExtended<MouseEvent> ; selectionStart: EventHookExtended<MouseEvent> ; updateNodeInternals: EventHookExtended<string[]> ; viewportChange: EventHookExtended<ViewportTransform> ; viewportChangeEnd: EventHookExtended<ViewportTransform> ; viewportChangeStart: EventHookExtended<ViewportTransform> }>

Event hooks, you can manipulate the triggers at your own peril


initialized

initialized: boolean


isValidConnection

isValidConnection: null | ValidConnectionFunc

Overrides

Omit.isValidConnection


maxZoom

maxZoom: number

use setMaxZoom action to change maxZoom

Overrides

Omit.maxZoom


minZoom

minZoom: number

use setMinZoom action to change minZoom

Overrides

Omit.minZoom


multiSelectionActive

multiSelectionActive: boolean


multiSelectionKeyCode

multiSelectionKeyCode: null | KeyFilter

Overrides

Omit.multiSelectionKeyCode


noDragClassName

noDragClassName: string

Overrides

Omit.noDragClassName


noPanClassName

noPanClassName: string

Overrides

Omit.noPanClassName


noWheelClassName

noWheelClassName: string

Overrides

Omit.noWheelClassName


nodeExtent

nodeExtent: CoordinateExtent | CoordinateExtentRange

Overrides

Omit.nodeExtent


nodeTypes

Optional nodeTypes: NodeTypesObject

either use the nodeTypes prop to define your node-types or use slots (<template #node-mySpecialType="props">)

Inherited from

Omit.nodeTypes


nodes

nodes: GraphNode<any, any, string>[]

all stored nodes

Overrides

Omit.nodes


nodesConnectable

nodesConnectable: boolean

Overrides

Omit.nodesConnectable


nodesDraggable

nodesDraggable: boolean

Overrides

Omit.nodesDraggable


nodesFocusable

nodesFocusable: boolean

Overrides

Omit.nodesFocusable


nodesSelectionActive

nodesSelectionActive: boolean


onlyRenderVisibleElements

onlyRenderVisibleElements: boolean

if true will skip rendering any elements currently not inside viewport until they become visible

Overrides

Omit.onlyRenderVisibleElements


panActivationKeyCode

panActivationKeyCode: null | KeyFilter

Overrides

Omit.panActivationKeyCode


panOnDrag

panOnDrag: boolean | number[]

Overrides

Omit.panOnDrag


panOnScroll

panOnScroll: boolean

Overrides

Omit.panOnScroll


panOnScrollMode

panOnScrollMode: PanOnScrollMode

Overrides

Omit.panOnScrollMode


panOnScrollSpeed

panOnScrollSpeed: number

Overrides

Omit.panOnScrollSpeed


paneDragging

paneDragging: boolean


preventScrolling

preventScrolling: boolean

Overrides

Omit.preventScrolling


selectNodesOnDrag

selectNodesOnDrag: boolean

Overrides

Omit.selectNodesOnDrag


selectionKeyCode

selectionKeyCode: null | KeyFilter

Overrides

Omit.selectionKeyCode


selectionMode

selectionMode: SelectionMode

Overrides

Omit.selectionMode


snapGrid

snapGrid: SnapGrid

Overrides

Omit.snapGrid


snapToGrid

snapToGrid: boolean

Overrides

Omit.snapToGrid


translateExtent

translateExtent: CoordinateExtent

use setTranslateExtent action to change translateExtent

Overrides

Omit.translateExtent


userSelectionActive

userSelectionActive: boolean


userSelectionRect

userSelectionRect: null | SelectionRect


viewport

Readonly viewport: ViewportTransform

viewport transform x, y, z - do not change!


viewportRef

viewportRef: null | HTMLDivElement

Vue flow viewport element


vueFlowRef

vueFlowRef: null | HTMLDivElement

Vue flow element ref


zoomActivationKeyCode

zoomActivationKeyCode: null | KeyFilter

Overrides

Omit.zoomActivationKeyCode


zoomOnDoubleClick

zoomOnDoubleClick: boolean

Overrides

Omit.zoomOnDoubleClick


zoomOnPinch

zoomOnPinch: boolean

Overrides

Omit.zoomOnPinch


zoomOnScroll

zoomOnScroll: boolean

Overrides

Omit.zoomOnScroll

Released under the MIT License.