Vue FlowInterface: Node<Data, CustomEvents, Type> ​
Type parameters ​
| Name | Type |
|---|---|
Data | ElementData |
CustomEvents | extends Record<string, CustomEvent> = any |
Type | extends string = string |
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
Disable/enable connecting node
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
element selector as drag handle for node (can only be dragged from the dragHandle el)
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 | CoordinateExtentRange | "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
Deprecated
will be removed in the next major release overwrites current node type
type ​
• Optional type: Type
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