API for rete-render-utils package

BaseSocketPosition

sockets-position/base-socket-position.ts

Abstract class for socket position calculation. It can be extended to implement custom socket position calculation.

class BaseSocketPosition<Schemes extends BaseSchemes, K extends unknown>

Extended by DOMSocketPosition

Implements SocketPositionWatcher<Scope<never, K>>

Listens render rendered unmount nodetranslated noderesized

attach

sockets-position/base-socket-position.ts

Attach the watcher to the area's child scope.

attach(scope: Scope<never, [K]>): void

Returns void

calculatePosition

sockets-position/base-socket-position.ts

The method needs to be implemented that calculates the position of the socket.

calculatePosition(nodeId: string, side: Side, key: string, element: HTMLElement): Promise<null | Position>

Returns Promise<null | Position>

listen

sockets-position/base-socket-position.ts

Listen to socket position changes. Usually used by rendering plugins to update the start/end of the connection.

listen(nodeId: string, side: Side, key: string, change: OnChange): () => void

Returns () => void

DOMSocketPosition

sockets-position/dom-socket-position.ts

Class for socket position calculation based on DOM elements. It uses getElementCenter function to calculate the position.

class DOMSocketPosition<Schemes extends BaseSchemes, K extends unknown>

Extends BaseSocketPosition<Schemes, K>

attach

sockets-position/base-socket-position.ts

Attach the watcher to the area's child scope.

attach(scope: Scope<never, [K]>): void

Returns void

listen

sockets-position/base-socket-position.ts

Listen to socket position changes. Usually used by rendering plugins to update the start/end of the connection.

listen(nodeId: string, side: Side, key: string, change: OnChange): () => void

Returns () => void

SocketPositionWatcher

sockets-position/types.ts

Interface for socket position watcher.

type SocketPositionWatcher<ChildScope extends unknown> = {
  attach: unknown;
  listen: unknown;
};

Implemented by BaseSocketPosition

classicConnectionPath

connection.ts

Get classic SVG path for a connection between two points.

classicConnectionPath(points: [Position, Position], curvature: number): string

Returns string

getDOMSocketPosition

sockets-position/dom-socket-position.ts

Wrapper function for DOMSocketPosition class.

getDOMSocketPosition(props: Props): DOMSocketPosition<Schemes, K>

Returns DOMSocketPosition<Schemes, K>

getElementCenter

utils.ts

Calculates the center coordinates of a child element relative to a parent element.

getElementCenter(child: HTMLElement, parent: HTMLElement): Promise<{ x: number, y: number }>

Throws Error if the child element has a null offsetParent.

Returns Promise<{ x: number, y: number }> Position of the child element's center

loopConnectionPath

connection.ts

Get loop SVG path for a connection between two points.

loopConnectionPath(points: [Position, Position], curvature: number, size: number): string

Returns string