@gravity-ui/graph
Version:
Modern graph editor component
74 lines (73 loc) • 2.7 kB
TypeScript
import { DragContext, DragDiff } from "../../../services/drag";
import { AnchorState, EAnchorType } from "../../../store/anchor/Anchor";
import { TBlockId } from "../../../store/block/Block";
import { PortState } from "../../../store/connection/port/Port";
import { GraphComponent, TGraphComponentProps } from "../GraphComponent";
import { GraphLayer } from "../layers/graphLayer/GraphLayer";
export type TAnchorId = string | number;
export type TAnchor = {
id: string;
blockId: TBlockId;
type: EAnchorType | string;
index?: number;
};
export type TAnchorProps = TGraphComponentProps & TAnchor & {
size: number;
lineWidth: number;
zIndex: number;
port: PortState;
};
type TAnchorState = {
size: number;
raised: boolean;
selected: boolean;
};
export declare class Anchor<T extends TAnchorProps = TAnchorProps> extends GraphComponent<T, TAnchorState> {
readonly cursor = "pointer";
static CANVAS_HOVER_FACTOR: number;
static DETAILED_HOVER_FACTOR: number;
getEntityId(): number | string;
get zIndex(): number;
connectedState: AnchorState;
private shift;
constructor(props: T, parent: GraphLayer);
getHoverFactor(): number;
protected stateChanged(_nextState: TAnchorState): void;
protected propsChanged(_nextProps: T): void;
protected willMount(): void;
protected computeShift(state?: TAnchorState, props?: T): void;
protected onPositionChanged: () => void;
getPorts(): PortState[];
/**
* Get the position of the anchor.
* Returns the position of the anchor in the coordinate system of the graph(ABSOLUTE).
*
* Example:
* ```ts
* const pos = anchor.getPosition(); // { x: 100, y: 100 }
* ```
* port.getPoint is used port.$state.value so you can use this method in signals effect and compute.
* ```ts
* computed(() => {
* return anchor.getPosition().x + 10; // { x: 110, y: 100 }
* });
* ```
* @returns The position of the anchor in the coordinate system of the graph(ABSOLUTE).
*/
getPosition(): import("../../..").TPoint;
toggleSelected(): void;
/**
* Anchor is draggable only when connection creation is disabled.
* When connections can be created via anchors, dragging is handled by ConnectionLayer.
*/
isDraggable(): boolean;
handleDragStart(context: DragContext): void;
handleDrag(diff: DragDiff, context: DragContext): void;
handleDragEnd(context: DragContext): void;
protected isVisible(): boolean;
protected unmount(): void;
handleEvent(event: MouseEvent | KeyboardEvent): void;
private computeRenderSize;
protected render(): void;
}
export {};