@braks/vue-flow / GraphNode

Interface: GraphNode<Data, CustomEvents>

Type parameters

NameType
DataElementData
CustomEventsextends Record<string, CustomEvent> = any

Hierarchy

  • Node<Data, CustomEvents>

    GraphNode

Table of contents

Properties

Properties

class

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

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: boolean

Inherited from

Node.connectable


data

Optional data: Data

Additional data that is passed to your custom components

Inherited from

Node.data


dimensions

dimensions: Dimensions

node width, height


dragHandle

Optional dragHandle: string

Inherited from

Node.dragHandle


draggable

Optional draggable: boolean

Inherited from

Node.draggable


events

Optional events: Partial<NodeEventsHandler<CustomEvents>>

contextual and custom events that are passed to your custom components

Inherited from

Node.events


expandParent

Optional expandParent: boolean

expands parent area to fit child node

Inherited from

Node.expandParent


extent

Optional extent: "parent" | CoordinateExtent

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

Inherited from

Node.extent


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


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


selectable

Optional selectable: boolean

Inherited from

Node.selectable


selected

selected: boolean


snapGrid

Optional snapGrid: SnapGrid

move on grid

Inherited from

Node.snapGrid


sourcePosition

Optional sourcePosition: Position

handle position

Inherited from

Node.sourcePosition


style

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

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

overwrites current node type

Inherited from

Node.template


type

Optional type: string

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

Inherited from

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