Interface: Node<Data, CustomEvents> #

Type parameters #

Hierarchy #

• Node

  ↳ GraphNode

Table of contents #

Properties #

• ariaLabel
• class
• connectable
• data
• deletable
• dragHandle
• draggable
• events
• expandParent
• extent
• focusable
• height
• hidden
• id
• isValidSourcePos
• isValidTargetPos
• label
• parentNode
• position
• selectable
• sourcePosition
• style
• targetPosition
• template
• type
• width
• zIndex

Properties #

ariaLabel #

• Optional ariaLabel: string

class #

• Optional class: string | ClassFunc<GraphNode<Data, CustomEvents, string>>

Additional class names, can be a string or a callback returning a string (receives current flow element)

connectable #

• Optional connectable: HandleConnectable

data #

• Optional data: Data

Additional data that is passed to your custom components

deletable #

• Optional deletable: boolean

Disable/enable deleting node

dragHandle #

• Optional dragHandle: string

draggable #

• Optional draggable: boolean

Disable/enable dragging node

events #

• Optional events: Partial<NodeEventsHandler<CustomEvents>>

contextual and custom events that are passed to your custom components

expandParent #

• Optional expandParent: boolean

expands parent area to fit child node

extent #

• Optional extent: CoordinateExtent | ExtendedParentExtent | "parent"

define node extent, i.e. area in which node can be moved

focusable #

• Optional focusable: boolean

Disable/enable focusing node (a11y)

height #

• Optional height: string | number | HeightFunc

Fixed height of node, applied as style You can pass a number which will be used in pixel values (height: 300 -> height: 300px) or pass a string with units (height: 10rem -> height: 10rem)

hidden #

• Optional hidden: boolean

Is node hidden

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 | VNode<RendererNode, RendererElement, { [key: string]: any; }> | Component<any, any, any, ComputedOptions, MethodOptions>

A node label

parentNode #

• Optional parentNode: string

define node as a child node by setting a parent node id

position #

• position: XYPosition

initial node position x, y

selectable #

• Optional selectable: boolean

Disable/enable selecting node

sourcePosition #

• Optional sourcePosition: Position

handle position

style #

• Optional style: Styles | StyleFunc<GraphNode<Data, CustomEvents, string>>

Additional styles, can be an object or a callback returning an object (receives current flow element)

targetPosition #

• Optional targetPosition: Position

handle position

template #

• Optional template: NodeComponent

overwrites current node type

type #

• Optional type: string

node type, can be a default type or a custom type

width #

• Optional width: string | number | WidthFunc

Fixed width of node, applied as style You can pass a number which will be used in pixel values (width: 300 -> width: 300px) or pass a string with units (width: 10rem -> width: 10rem)

zIndex #

• Optional zIndex: number