@selenite/graph-editor
Version:
A graph editor for visual programming, based on rete and svelte.
56 lines (55 loc) • 1.98 kB
TypeScript
import type { NodeEditor, NodeFactory } from '../editor';
import type { AreaExtra } from '../area';
import type { Schemes } from '../schemes';
import type { AreaPlugin, RenderSignal } from 'rete-area-plugin';
import { SetupClass, type SetupFunction } from './Setup';
import { ConnectionPlugin as BaseConnectionPlugin, type EventType, type SocketData, type Side } from 'rete-connection-plugin';
import type { Socket } from '../socket/Socket.svelte';
import type { Connection } from '../nodes';
import type { Scope } from 'rete';
import type { Position } from 'rete-connection-plugin/_types/types';
export declare class ConnectionPlugin extends BaseConnectionPlugin<Schemes, AreaExtra> {
protected factory: NodeFactory;
protected area: AreaPlugin<Schemes, AreaExtra>;
picked: boolean;
lastClickedSocket: boolean;
lastPickedSockedData: (SocketData & {
payload: Socket;
}) | undefined;
/** Last picked connection. */
lastConn?: Connection;
constructor(factory: NodeFactory, area: AreaPlugin<Schemes, AreaExtra>);
setParent(scope: Scope<AreaExtra | ({
type: 'pointermove';
data: {
position: Position;
event: PointerEvent;
};
} | {
type: 'pointerup';
data: {
position: Position;
event: PointerEvent;
};
} | RenderSignal<'socket', {
nodeId: string;
side: Side;
key: string;
}> | {
type: 'unmount';
data: {
element: HTMLElement;
};
}), [
]>): void;
/**
* Handles pointer down and up events to control interactive connection creation.
* @param event
* @param type
*/
pick(event: PointerEvent, type: EventType): Promise<void>;
}
export declare class ConnectionSetup extends SetupClass {
setup(editor: NodeEditor, area: AreaPlugin<Schemes, AreaExtra>, factory: NodeFactory): void;
}
export declare const setupConnections: SetupFunction;