Interface: NodeProps<Data, CustomEvents, Type> #

these props are passed to node components

Type parameters #

Table of contents #

Properties #

• connectable
• data
• dimensions
• dragHandle
• dragging
• events
• id
• isValidSourcePos
• isValidTargetPos
• label
• parentNode
• position
• resizing
• selected
• sourcePosition
• targetPosition
• type
• zIndex

Properties #

connectable #

• connectable: HandleConnectable

can node handles be connected

data #

• data: Data

additional data of node

dimensions #

• dimensions: Dimensions

dom element dimensions (width, height)

dragHandle #

• Optional dragHandle: string

drag handle query selector

dragging #

• dragging: boolean

is node currently dragging

events #

• events: NodeEventsOn<CustomEvents>

contextual and custom events of node

id #

• id: string

unique node id

isValidSourcePos #

• Optional isValidSourcePos: ValidConnectionFunc

called when used as source for new connection

isValidTargetPos #

• Optional isValidTargetPos: ValidConnectionFunc

called when used as target for new connection

label #

• Optional label: string | Object | VNode<RendererNode, RendererElement, { [key: string]: any; }> | Component<any, any, any, ComputedOptions, MethodOptions>

node label, either pass a string or a VNode For example like this: h('div', props, children)) Object is just a type-hack for Vue, ignore that

parentNode #

• Optional parentNode: string

parent node id

position #

• position: XYPosition

node x, y (relative) position on graph

resizing #

• resizing: boolean

selected #

• selected: boolean

is node selected

sourcePosition #

• Optional sourcePosition: Position

handle position

targetPosition #

• Optional targetPosition: Position

handle position

type #

• Optional type: Type

node type

zIndex #

• zIndex: number

node z-index