Skip to main content

DefaultGroupComponent

This component will be used as the default component when rendering groups, if you do not provide a specific component mapping for a given group type in your view. It will attempt to write the group's label property into the template, or will use an empty string if that is not defined.

Extends

Methods

addNewPort()

addNewPort(type, data): void

Instructs the model to add a new port with the given data to the vertex this component represents. This will call the model's portFactory.

Parameters

type

string

data

ObjectData

Returns

void

Class Member

Inherited from

BaseGroupComponent.addNewPort


addPort()

addPort(data): Port

Adds a port with the given data to the vertex this component represents.

Parameters

data

ObjectData

Returns

Port

Class Member

Inherited from

BaseGroupComponent.addPort


addToSelection()

addToSelection(): void

Adds the vertex this component represents to the current selection in the model.

Returns

void

Class Member

Inherited from

BaseGroupComponent.addToSelection


cloneGroup()

cloneGroup(options?): void

Instructs the model to clone this group - which will result in a new group being added to the UI, whose position will be shifted slightly in X and Y from the cloned group.

Parameters

options?

SurfaceVertexCloneOptions

Returns

void

Class Member

Inherited from

BaseGroupComponent.cloneGroup


cloneVertex()

cloneVertex(options?): void

Clones this vertex, optionally setting to a given position, or offsetting from the original, and optionally magnetizing the new vertex's position, and flashing it to show the user where it is.

Parameters

options?

SurfaceVertexCloneOptions

Returns

void

Class Member

Inherited from

BaseGroupComponent.cloneVertex


flashGroup()

flashGroup(duration, animName?): void

Flash this Group

Parameters

duration

number

Optional; defaults to 1000ms. Duration of the animation in milliseconds.

animName?

string

Optional; the name of the CSS animation to apply. Defaults to ANIM_SURFACE_ELEMENT_FLASH.

Returns

void

Class Member

Inherited from

BaseGroupComponent.flashGroup


flashVertex()

flashVertex(duration, animName?): void

Flash this vertex

Parameters

duration

number

Optional; defaults to 1000ms. Duration of the animation in milliseconds.

animName?

string

Optional; the name of the CSS animation to apply. Defaults to ANIM_SURFACE_ELEMENT_FLASH.

Returns

void

Inherited from

BaseGroupComponent.flashVertex


getGroup()

getGroup(): Group

Gets the group that this component represents.

Returns

Group

Class Member

Inherited from

BaseGroupComponent.getGroup


getMembers()

getMembers(): Node[]

Gets the child vertices for this group. Group members may be of type Node or Group.

Returns

Node[]

Class Member

Inherited from

BaseGroupComponent.getMembers


getPort()

getPort(portId): Port

Gets the port with the given ID

Parameters

portId

string

ID of the port to retrieve

Returns

Port

Class Member

Inherited from

BaseGroupComponent.getPort


getVertex()

getVertex(): Group

Gets the vertex that this component represents. Subclasses have getters that return more specific subclasses of Vertex.

Returns

Group

Class Member

Inherited from

BaseGroupComponent.getVertex


removeFromSelection()

removeFromSelection(): void

Removes the vertex this component represents from the current selection in the model.

Returns

void

Class Member

Inherited from

BaseGroupComponent.removeFromSelection


removeGroup()

removeGroup(): void

Shortcut method to remove the Group (and therefore this whole component)

Returns

void

Class Member

Inherited from

BaseGroupComponent.removeGroup


removePort()

removePort(portId): void

Removes the port with the given id.

Parameters

portId

string

ID of the port to remove

Returns

void

Class Member

Inherited from

BaseGroupComponent.removePort


removeVertex()

removeVertex(): void

Removes the vertex this component represents from the data model, which will cause this component to be cleaned up.

Returns

void

Class Member

Inherited from

BaseGroupComponent.removeVertex


setAsSelection()

setAsSelection(): void

Sets the vertex this component represents as the current selection in the model.

Returns

void

Class Member

Inherited from

BaseGroupComponent.setAsSelection


updateGroup()

updateGroup(data): void

Shortcut method to update the current data backing this Group, for convenience.

Parameters

data

ObjectData

Data to update the group with.

Returns

void

Class Member

Inherited from

BaseGroupComponent.updateGroup


updateVertex()

updateVertex(data): void

Shortcut method to update the current data backing this vertex, for convenience.

Parameters

data

ObjectData

Returns

void

Class Member

Inherited from

BaseGroupComponent.updateVertex

Properties

$data

readonly $data: WritableSignal<ObjectData>

This signal represents the underlying data for the vertex this component represents.

Class Member

Inherited from

BaseGroupComponent.$data


allSourceEdges

allSourceEdges: WritableSignal<Edge[]>

This signal provides all of the edges for which this vertex or one of its ports is the source.

Inherited from

BaseGroupComponent.allSourceEdges


allTargetEdges

allTargetEdges: WritableSignal<Edge[]>

This signal provides all of the edges for which this vertex or one of its ports is the target.

Inherited from

BaseGroupComponent.allTargetEdges


data

data: ObjectData

Data object for the vertex

Class Member

Inherited from

BaseGroupComponent.data


sourceEdges

sourceEdges: WritableSignal<Edge[]>

This signal provides all of the edges for which this vertex is the source. These are edges connected to the vertex, not to its ports.

Inherited from

BaseGroupComponent.sourceEdges


targetEdges

targetEdges: WritableSignal<Edge[]>

This signal provides all of the edges for which this vertex is the target. These are edges connected to the vertex, not to its ports.

Inherited from

BaseGroupComponent.targetEdges


zoom

zoom: WritableSignal<number>

This is a signal that provides the current zoom for the canvas the component is in. You can use this to selectively hide/show content based upon the zoom level.

Class Member

Inherited from

BaseGroupComponent.zoom