Interface: GraphNode<Data, CustomEvents, Type>

Type parameters

Name	Type
Data	ElementData
CustomEvents	extends Record<string, CustomEvent> = any
Type	extends string = string

Hierarchy

• Node<Data, CustomEvents, Type>

  ↳ GraphNode

Table of contents

Properties

• ariaLabel
• class
• computedPosition
• connectable
• data
• deletable
• dimensions
• dragHandle
• draggable
• dragging
• events
• expandParent
• extent
• focusable
• handleBounds
• height
• hidden
• id
• initialized
• isParent
• isValidSourcePos
• isValidTargetPos
• label
• parentNode
• position
• resizing
• selectable
• selected
• sourcePosition
• style
• targetPosition
• template
• type
• width
• zIndex

Properties

ariaLabel

• Optional ariaLabel: string

Inherited from

Node.ariaLabel

---

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)

Inherited from

Node.class

---

computedPosition

• computedPosition: XYZPosition

absolute position in relation to parent elements + z-index

---

connectable

• Optional connectable: HandleConnectable

Disable/enable connecting node

Inherited from

Node.connectable

---

data

• data: Data

Additional data that is passed to your custom components

Overrides

Node.data

---

deletable

• Optional deletable: boolean

Disable/enable deleting node

Inherited from

Node.deletable

---

dimensions

• dimensions: Dimensions

node width, height

---

dragHandle

• Optional dragHandle: string

element selector as drag handle for node (can only be dragged from the dragHandle el)

Inherited from

Node.dragHandle

---

draggable

• Optional draggable: boolean

Disable/enable dragging node

Inherited from

Node.draggable

---

dragging

• dragging: boolean

---

events

• events: Partial<NodeEventsHandler<CustomEvents>>

contextual and custom events that are passed to your custom components

Overrides

Node.events

---

expandParent

• Optional expandParent: boolean

expands parent area to fit child node

Inherited from

Node.expandParent

---

extent

• Optional extent: CoordinateExtent | CoordinateExtentRange | "parent"

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

Inherited from

Node.extent

---

focusable

• Optional focusable: boolean

Disable/enable focusing node (a11y)

Inherited from

Node.focusable

---

handleBounds

• handleBounds: NodeHandleBounds

---

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)

Inherited from

Node.height

---

hidden

• Optional hidden: boolean

Is node hidden

Inherited from

Node.hidden

---

id

• id: string

Unique node id

Inherited from

Node.id

---

initialized

• initialized: boolean

---

isParent

• isParent: boolean

---

isValidSourcePos

• Optional isValidSourcePos: ValidConnectionFunc

called when used as source for new connection

Inherited from

Node.isValidSourcePos

---

isValidTargetPos

• Optional isValidTargetPos: ValidConnectionFunc

called when used as target for new connection

Inherited from

Node.isValidTargetPos

---

label

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

A node label

Inherited from

Node.label

---

parentNode

• Optional parentNode: string

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

Inherited from

Node.parentNode

---

position

• position: XYPosition

initial node position x, y

Inherited from

Node.position

---

resizing

• resizing: boolean

---

selectable

• Optional selectable: boolean

Disable/enable selecting node

Inherited from

Node.selectable

---

selected

• selected: boolean

---

sourcePosition

• Optional sourcePosition: Position

handle position

Inherited from

Node.sourcePosition

---

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)

Inherited from

Node.style

---

targetPosition

• Optional targetPosition: Position

handle position

Inherited from

Node.targetPosition

---

template

• Optional template: NodeComponent

Deprecated

will be removed in the next major release overwrites current node type

Inherited from

Node.template

---

type

• type: Type

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

Overrides

Node.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)

Inherited from

Node.width

---

zIndex

• Optional zIndex: number

Inherited from

Node.zIndex