Interface ReactViewPortOptions

Extension of port definition in a view that adds jsx/component.

interface ReactViewPortOptions {
    allowLoopback?: boolean;
    allowVertexLoopback?: boolean;
    anchor?: AnchorSpec;
    anchorOffsetX?: number;
    anchorOffsetY?: number;
    anchorOrientationX?: number;
    anchorOrientationY?: number;
    anchorPositionFinder?: ((el: Element, pos: PointXY, vertex: Node | Group, def: ViewNodeOptions, evt: Event) => ArrayAnchorSpec);
    anchorPositions?: ObjectAnchorSpec[];
    anchorX?: number;
    anchorY?: number;
    component?: Component<{}, {}, any>;
    edgeType?: string;
    endpoint?: EndpointSpec;
    events?: ViewEventOptions;
    hoverPaintStyle?: PaintStyle;
    isEndpoint?: boolean;
    isSource?: boolean;
    isTarget?: boolean;
    jsx?: ((ctx: JsxWrapperProps<Port>) => any);
    maxConnections?: number;
    mergeStrategy?: string;
    paintStyle?: PaintStyle;
    parameters?: Record<string, any>;
    parent?: string | string[];
    uniqueEndpoint?: boolean;
}

Hierarchy

  • Omit<ViewPortOptions, "template" | "templateId">
    • ReactViewPortOptions

Properties

allowLoopback? allowVertexLoopback? anchor? anchorOffsetX? anchorOffsetY? anchorOrientationX? anchorOrientationY? anchorPositionFinder? anchorPositions? anchorX? anchorY? component? edgeType? endpoint? events? hoverPaintStyle? isEndpoint? isSource? isTarget? jsx? maxConnections? mergeStrategy? paintStyle? parameters? parent? uniqueEndpoint?

Properties

OptionalallowLoopback

allowLoopback?: boolean

Whether or not to allow edges from this vertex back to itself. Defaults to true. This flag will not prevent an edge from a port back to the node/group to which it belongs - for that, see allowVertexLoopback.

OptionalallowVertexLoopback

allowVertexLoopback?: boolean

Whether or not to allow edges from a port back to the vertex it belongs to. Defaults to true.

Optionalanchor

anchor?: AnchorSpec

Spec for anchors connected to this port

OptionalanchorOffsetX

anchorOffsetX?: number

Offset, in pixels, to apply to the position in the x axis after the anchorX value has been used to compute its default position.

OptionalanchorOffsetY

anchorOffsetY?: number

Offset, in pixels, to apply to the position in the y axis after the anchorY value has been used to compute its default position.

OptionalanchorOrientationX

anchorOrientationX?: number

The orientation in the x axis for connections attached to an anchor created for this port.

OptionalanchorOrientationY

anchorOrientationY?: number

The orientation in the y axis for connections attached to an anchor created for this port.

OptionalanchorPositionFinder

anchorPositionFinder?: ((el: Element, pos: PointXY, vertex: Node | Group, def: ViewNodeOptions, evt: Event) => ArrayAnchorSpec)

Optional function to call on connection drop, to determine the location for the target anchor for the new connection. Returning null from this indicates no preference, and the Toolkit will use its own computed value. Note that the return value from this method is ArrayAnchorSpec, meaning an array in the format [ x, y, orientationX, orientationY, offsetX, offsetY ]. Note also that offsetX and offsetY are optional, and will be defaulted to 0.

OptionalanchorPositions

anchorPositions?: ObjectAnchorSpec[]

Optional array of anchor positions to use.

OptionalanchorX

anchorX?: number

The x location of any anchors created for this port. Allows you to specify where, in proportional values, the anchor should be located in the x axis. For a full discussion of how to use this (and the other anchor properties in this interface), see the documentation for anchors.

OptionalanchorY

anchorY?: number

The y location of any anchors created for this port. Allows you to specify where, in proportional values, the anchor should be located in the y axis.

Optionalcomponent

component?: Component<{}, {}, any>

Component used to render this port type. Supply this or JSX.

Deprecated

This is likely to be removed in an upcoming version.

OptionaledgeType

edgeType?: string

Type of edges generated by this port.

Optionalendpoint

endpoint?: EndpointSpec

If isEndpoint is set to true, you can provide a spec for the endpoint with this parameter.

Optionalevents

events?: ViewEventOptions

Optional map of event bindings.

OptionalhoverPaintStyle

hoverPaintStyle?: PaintStyle

If isEndpoint is set to true, you can provide a spec for the endpoint's hover paint style with this parameter.

OptionalisEndpoint

isEndpoint?: boolean

If true, the port is rendered as an endpoint. By default this is false (meaning the port is represented by some DOM element that you have rendered).

OptionalisSource

isSource?: boolean

Whether or not the port can act as a source for dragged connections. Defaults to false.

OptionalisTarget

isTarget?: boolean

Whether or not the port can act as a target for dragged connections. Defaults to false.

Optionaljsx

jsx?: ((ctx: JsxWrapperProps<Port>) => any)

JSX used to render this port type. Supply this or a Component.

OptionalmaxConnections

maxConnections?: number

Maximum number of connections this vertex supports. Default is 1. A value of -1 means no limit.

OptionalmergeStrategy

mergeStrategy?: string

When merging a type description into its parent(s), values in the child for connector, anchor and anchors will always overwrite any such values in the parent. But other values, such as overlays, will be merged with their parent's entry for that key. You can force a child's type to override every corresponding value in its parent by setting mergeStrategy:'override'.

OptionalpaintStyle

paintStyle?: PaintStyle

If isEndpoint is set to true, you can provide a spec for the endpoint's paint style with this parameter.

Optionalparameters

parameters?: Record<string, any>

A map of parameters that the template engine will merge with the backing data when rendering the vertex.

Optionalparent

parent?: string | string[]

Optional ID of one or more edge definitions to include in this definition. The child definition is merged on top of the parent definition(s). Circular references are not allowed and will throw an error.

OptionaluniqueEndpoint

uniqueEndpoint?: boolean

Normally, each time a new connection is established a port on which isEndpoint is set to true, a new endpoint is created for that connection. Setting this flag will cause the Toolkit to only ever create a single endpoint for the port, to which all connections should be attached. Note that you may wish to consider the maxConnections parameter if you use this, as by default the endpoint will be created with a limit of 1 connection.

Settings

Member Visibility

On This Page

Properties
Version :