@focus.matters/diagrams 0.0.10 → 0.1.0

package/dist/src/Diagrams/custom/communication/edges/CommunicationEdge.d.ts

@@ -2,34 +2,8 @@ import { Edge } from '../../../store/elements/Edge';
 import { Element } from '../../../store/elements/Element';
 import { TEdgeState } from '../../../store/types';
 type CommunicationEdgeState = Partial<TEdgeState>;
-type SerializedCommunicationEdge = ReturnType<Edge["serialize"]> & {
-    label?: string;
-    labelPositioning?: [number, number];
-};
+/** Applies communication-diagram styling on top of shared editable edge state. */
 export declare class CommunicationEdge extends Edge {
-    isEditingLabel: boolean;
-    labelDraft: string;
     constructor(parent: Element | null, state: CommunicationEdgeState);
-    setLabel(label: string): void;
-    beginLabelEdit(): void;
-    cancelLabelEdit(): void;
-    confirmLabelEdit(): void;
-    serialize(): {
-        label: string;
-        labelPositioning: [number, number];
-        arrowHeadEnd: import('../../../store/types').EdgeArrowHead | undefined;
-        arrowHeadStart: import('../../../store/types').EdgeArrowHead | undefined;
-        displacementEnd: [number, number] | undefined;
-        displacementStart: [number, number] | undefined;
-        lineStyle: import('../../../store/types').EdgeLineStyle | undefined;
-        pathType: import('../../../store/types').EdgePathType | undefined;
-        steps: import('../../../store/elements/EdgePoint').TSerializedEdgePoint[];
-        stroke: string | undefined;
-        strokeWidth: number | undefined;
-        to: string;
-        toParentId: string;
-        class: string;
-    };
-    deserialize(o: SerializedCommunicationEdge): void;
 }
 export {};

package/dist/src/Diagrams/custom/editable/EditableLabel.d.ts

@@ -1,5 +1,5 @@
-import { EditableNode } from './EditableNode';
 import { Dimensions } from '../../store/primitives/Dimensions';
+import { EditableNode } from './EditableNode';
 export declare const EditableLabel: (({ node, box }: {
     node: EditableNode;
     box: Dimensions;

package/dist/src/Diagrams/custom/editable/EditableNode.d.ts

@@ -1,15 +1,21 @@
-import { Node, TNodeConstructorProps } from '../../store/elements/Node';
-import { Element } from '../../store/elements/Element';
 import { FC } from 'react';
+import { Element } from '../../store/elements/Element';
+import { Node, TNodeConstructorProps } from '../../store/elements/Node';
+/** Provides editable node labels while preserving the pending edit for confirmation or cancellation. */
 export declare abstract class EditableNode extends Node {
     editionMode: boolean;
     constructor(parent: Element | null, state: TNodeConstructorProps);
     get label(): string;
     private previous;
+    /** Starts a label editing session and saves the current value for a possible cancellation. */
     edit(): void;
+    /** Restores the saved label value and closes the active editing session without emitting changes. */
     cancel(): void;
+    /** Confirms the edit unless an event listener cancels it, then returns whether it was accepted. */
     confirm(): boolean;
     get isChanged(): boolean;
     protected get screenLabelBox(): import('../../store/primitives/Dimensions').Dimensions;
+    /** Returns the current label bounds so surrounding controls can avoid its rendered area. */
+    get labelScreenBox(): import('../../store/primitives/Dimensions').Dimensions;
     RenderScreen: FC<any>;
 }

package/dist/src/Diagrams/store/Canvas.d.ts

@@ -1,15 +1,17 @@
-import { Coordinates } from './primitives/Coordinates';
-import { Dimensions } from './primitives/Dimensions';
 import { Diagram } from './Diagram';
 import { Element } from './elements/Element';
+import { Coordinates } from './primitives/Coordinates';
+import { Dimensions } from './primitives/Dimensions';
 export type ScaleEvent = {
     previousScale: number;
     newScale: number;
     displacement: Coordinates;
 };
+/** Owns viewport scale, displacement, interaction sessions, and rendered canvas bounds. */
 export declare class Canvas extends Element {
     private unbindDocumentEvents;
     private mouseSessionStartedInFrame;
+    private centerAnimationFrame;
     protected _displacement: Coordinates;
     _scale: number;
     private gridSize;
@@ -22,19 +24,25 @@ export declare class Canvas extends Element {
     get framePosition(): Coordinates;
     get frameDimensions(): Dimensions;
     constructor(parent: Diagram);
+    /** Releases document listeners and cancels any viewport animation still in flight. */
     dispose(): void;
+    /** Marks programmatic pointer sessions as eligible for the canvas drag lifecycle. */
     markMouseSessionStartedInFrame(): void;
     get dragging(): boolean;
     protected _dragging: boolean;
     displacementStart: null | Coordinates;
     eventStart: null | Coordinates;
     protected bound(): void;
-    centerOnPoint(c: Coordinates): void;
-    /**
-     * @returns how much it displaced
-     */
+    /** Centers a world point in the viewport and optionally animates the pan. */
+    centerOnPoint(c: Coordinates, animated?: boolean): void;
+    private animateDisplacement;
+    private cancelCenterAnimation;
+    private applyDisplacement;
+    /** Applies a relative viewport displacement and returns the bounded movement used. */
     displace(c: Coordinates): Coordinates;
+    /** Replaces the viewport displacement while respecting configured canvas bounds. */
     setDisplacement(c: Coordinates): void;
+    /** Changes viewport scale around a screen-space focus point and preserves alignment. */
     setScale(newScale: number, zoomCenter?: Coordinates): void;
     /**
      * Given a pair of coordinates in the canvas, returns the matching coordinates in the screen
@@ -44,6 +52,7 @@ export declare class Canvas extends Element {
      * Given a pair of coordinates in the screen, returns the matching coordinates in the canvas
      */
     inverseFit<T extends Coordinates | Dimensions>(value: T): T;
+    /** Returns the CSS transform values representing current scale and displacement. */
     getDisplacementStyles(): {
         position: string;
         width: string;
@@ -53,6 +62,7 @@ export declare class Canvas extends Element {
         willChange: string;
     };
     protected setDisplacementStyles(element?: HTMLElement | null): void;
+    /** Updates the visual grid interval used by canvas background and snapping helpers. */
     setGridSize(gridSize: number): void;
     useRef: (el: HTMLElement | null) => void;
     private isInsideFrameFromTarget;

package/dist/src/Diagrams/store/Diagram.d.ts

@@ -1,87 +1,122 @@
 import { ReactNode } from 'react';
 import { Canvas } from './Canvas';
-import { Node } from './elements/Node';
-import { Coordinates } from './primitives/Coordinates';
 import { Edge } from './elements/Edge';
-import { Gateway } from './elements/Gateway';
 import { Element, Class } from './elements/Element';
-import { Priorities } from './extensions/Priorities';
-import { Rules } from './extensions/Rules';
-import { DiagramExtension } from './extensions/DiagramExtension';
-import { NodesAligner } from './extensions/NodesAligner';
+import { Gateway } from './elements/Gateway';
+import { Node } from './elements/Node';
 import { Creator } from './extensions/Creator';
+import { DiagramExtension } from './extensions/DiagramExtension';
+import { DistancesBalancer } from './extensions/DistancesBalancer';
+import { Dragger } from './extensions/Dragger';
 import { EdgesDragger } from './extensions/EdgesDragger';
+import { GridSnap } from './extensions/GridSnap';
+import { History } from './extensions/History';
 import { Hotkeys } from './extensions/Hotkeys';
+import { LabelsAligner } from './extensions/LabelsAligner';
 import { Measurer } from './extensions/Measurer';
-import { Selector } from './extensions/Selector';
+import { NodesAligner } from './extensions/NodesAligner';
 import { NodesConnector } from './extensions/NodesConnector';
-import { GridSnap } from './extensions/GridSnap';
-import { StraightDrag } from './extensions/StraightDrag';
-import { DistancesBalancer } from './extensions/DistancesBalancer';
 import { NodesResizer } from './extensions/NodesResizer';
-import { History } from './extensions/History';
-import { Dragger } from './extensions/Dragger';
 import { PathFindingRenderer } from './extensions/PathFindingRenderer';
-declare const DefaultExtensions: Readonly<{
+import { Priorities } from './extensions/Priorities';
+import { Rules } from './extensions/Rules';
+import { Selector } from './extensions/Selector';
+import { StraightDrag } from './extensions/StraightDrag';
+import { StraightLabelsDrag } from './extensions/StraightLabelsDrag';
+import { Coordinates } from './primitives/Coordinates';
+import { EdgePathType, TEdgeAnchorState } from './types';
+declare const getDefaultExtensions: () => {
     Creator: typeof Creator;
     DistancesBalancer: typeof DistancesBalancer;
+    StraightDrag: typeof StraightDrag;
+    StraightLabelsDrag: typeof StraightLabelsDrag;
     Dragger: typeof Dragger;
     EdgesDragger: typeof EdgesDragger;
     GridSnap: typeof GridSnap;
     History: typeof History;
     Hotkeys: typeof Hotkeys;
+    LabelsAligner: typeof LabelsAligner;
     Measurer: typeof Measurer;
     NodesAligner: typeof NodesAligner;
     NodesConnector: typeof NodesConnector;
     NodesResizer: typeof NodesResizer;
     PathFindingRenderer: typeof PathFindingRenderer;
     Selector: typeof Selector;
-    StraightDrag: typeof StraightDrag;
-}>;
+};
 export type TDefaultExensions = {
-    [key in keyof typeof DefaultExtensions]: boolean;
+    [key in keyof ReturnType<typeof getDefaultExtensions>]: boolean;
 };
 export type TDiagramSettings = Partial<{
     extensions: TDefaultExensions;
 }>;
+/** Owns diagram elements, extensions, camera state, and application interactions. */
 export declare class Diagram extends Element {
     readonly priorities: Priorities;
     rules: Rules;
     private focusContentTimer;
     private knownClasses;
+    /** Returns the registered runtime constructor associated with a serialized class name. */
     getClass(name: string): any;
+    /** Registers a runtime constructor so persisted elements can be restored safely. */
     registerClass(clazz: any, className?: any): void;
     edgeClass: typeof Edge;
+    /** Replaces the edge constructor used for subsequently created connections. */
     setDefaultEdge(clazz: typeof Edge): void;
     protected _extensions: Map<Class<DiagramExtension>, DiagramExtension>;
     protected _nodes: Map<string, Node<import('./types').TOrientation>>;
     protected _edges: Map<string, Edge>;
+    private _hoveredNode;
     canvas: Canvas;
     constructor(settings?: TDiagramSettings);
     get edges(): Readonly<Edge[]>;
+    /** Returns registered extensions in deterministic registration order for rendering. */
+    get extensions(): ReadonlyArray<DiagramExtension>;
     get nodes(): Readonly<Node[]>;
+    /** Returns the sole node currently hovered within this diagram application. */
+    get hoveredNode(): Node<any> | null;
+    /** Atomically transfers or clears the application-level node hover owner. */
+    setNodeHover(node: Node<any>, hovered: boolean): void;
+    /** Clears the application hover owner and its mirrored node presentation flag. */
+    clearNodeHover(): void;
     private getUniqueNodeId;
+    /** Adds a node, assigns a collision-free identifier, and attaches diagram state. */
     add<T extends Node>(node: T): T;
+    /** Registers an already constructed edge with both of its endpoint gateways. */
     addEdge(edge: Edge): void;
+    /** Creates and registers a routed edge between two compatible node gateways. */
     connect(from: Gateway, to: Gateway, options?: {
         fromDisplacement?: Coordinates;
+        pathType?: EdgePathType;
+        startAnchor?: TEdgeAnchorState;
+        endAnchor?: TEdgeAnchorState;
         toDisplacement?: Coordinates;
     }): Edge;
-    connectWithEdge(from: Gateway, to: Gateway, existentEdge: Edge): Edge;
+    /** Registers an existing edge instance and synchronizes both endpoint indexes. */
+    connectWithEdge(_from: Gateway, _to: Gateway, existentEdge: Edge): Edge;
+    /** Deletes a node and disconnects every edge still attached to its gateways. */
     delete(node: Node<any>): void;
+    /** Disconnects an edge from all gateway indexes and removes diagram ownership. */
     disconnect(edge: Edge): void;
     Context: ({ children }: {
         children: ReactNode;
     }) => import("react").JSX.Element;
+    /** Returns the edge registered under the requested application identifier. */
     getEdgeById(id: string): Edge | undefined;
+    /** Returns the node registered under the requested application identifier. */
     getNodeById(id: string): Node<import('./types').TOrientation> | undefined;
     get showGrid(): boolean;
+    /** Returns the initialized extension instance for the requested constructor. */
     getExtension<T extends DiagramExtension>(e: Class<T>): T;
+    /** Instantiates and initializes one extension before exposing it to callers. */
     registerExtension(e: Class<DiagramExtension>): void;
+    /** Toggles whether the diagram grid is currently visible to the application. */
     toggleGrid(): void;
     static use: () => Diagram;
+    /** Exports the complete current diagram contract as a serialized JSON string. */
     export(): string;
+    /** Requests reset approval and removes all nodes when the operation is accepted. */
     reset(): Promise<boolean>;
+    /** Serializes camera state and every owned node into the current persistence contract. */
     serialize(): {
         position: {
             x: number;
@@ -109,7 +144,25 @@ export declare class Diagram extends Element {
                     displacementEnd: [number, number] | undefined;
                     displacementStart: [number, number] | undefined;
                     lineStyle: import('./types').EdgeLineStyle | undefined;
-                    pathType: import('./types').EdgePathType | undefined;
+                    labels: {
+                        alignment: "right" | "left" | "center";
+                        id: string;
+                        size: {
+                            height: number;
+                            width: number;
+                        };
+                        text: string;
+                        position: [number, number];
+                    }[];
+                    pathType: EdgePathType;
+                    startAnchor: {
+                        mode: import('./types').EdgeAnchorMode;
+                        position: [number, number] | undefined;
+                    };
+                    endAnchor: {
+                        mode: import('./types').EdgeAnchorMode;
+                        position: [number, number] | undefined;
+                    };
                     steps: import('./elements/EdgePoint').TSerializedEdgePoint[];
                     stroke: string | undefined;
                     strokeWidth: number | undefined;
@@ -121,14 +174,19 @@ export declare class Diagram extends Element {
             }[];
             fill: string | undefined;
             labelFontSize: number | undefined;
+            labelOffset: [number, number] | undefined;
             stroke: string | undefined;
             strokewWidth: number | undefined;
             class: string;
         }[];
     };
+    /** Imports serialized nodes and edges while remapping any colliding identifiers. */
     import(w: string): void;
+    /** Pastes serialized nodes near the pointer while assigning fresh identifiers. */
     paste(w: string): void;
+    /** Fits all diagram content inside the current viewport with configurable padding. */
     focusContentInViewport(padding?: number): boolean;
+    /** Retries viewport fitting while layout dimensions settle after initial rendering. */
     focusContentInViewportWithRetry(attempts?: number, delayMs?: number): void;
 }
 export {};

package/dist/src/Diagrams/store/elements/DEdgeLabelChangeEvent.d.ts

@@ -0,0 +1,5 @@
+import { DChangeEvent } from './Events';
+/** Records an editable edge-label text or position mutation in diagram history. */
+export declare class DEdgeLabelChangeEvent extends DChangeEvent {
+    protected readonly __brand: void;
+}

package/dist/src/Diagrams/store/elements/Edge.d.ts

@@ -1,35 +1,83 @@
-import { TEdgeState } from '../types';
+import { MouseEvent } from 'react';
+import { Midpoint } from '../../components/objects/RenderEdge';
 import { Coordinates } from '../primitives/Coordinates';
+import { Dimensions } from '../primitives/Dimensions';
+import { EdgeRouterAnchor } from '../routers/EdgesRouter';
+import { EdgePathType, TEdgeAnchorState, TEdgeState } from '../types';
+import { EdgeLabel } from './EdgeLabel';
 import { EdgePoint, TSerializedEdgePoint } from './EdgePoint';
 import { Element } from './Element';
-import { Midpoint } from '../../components/objects/RenderEdge';
-import { MouseEvent } from 'react';
-import { Dimensions } from '../primitives/Dimensions';
+import { Gateway } from './Gateway';
+/** Models a routed connection, its endpoint anchors, editable label, and state. */
 export declare class Edge extends Element {
     state: TEdgeState;
     id: Readonly<string>;
     constructor(parent: Element | null, state: TEdgeState);
     get arrowHeadEnd(): import('../types').EdgeArrowHead | undefined;
     get arrowHeadStart(): import('../types').EdgeArrowHead | undefined;
-    get from(): import('./Gateway').Gateway;
+    get from(): Gateway;
     get hasManualSteps(): EdgePoint | undefined;
     get lineStyle(): import('../types').EdgeLineStyle | undefined;
-    get pathType(): import('../types').EdgePathType | undefined;
+    get pathType(): EdgePathType;
+    get startAnchor(): TEdgeAnchorState;
+    get endAnchor(): TEdgeAnchorState;
     get steps(): EdgePoint[];
     get stroke(): string | undefined;
     get strokeWidth(): number | undefined;
+    get labels(): readonly EdgeLabel[];
+    /** Creates one independent blank label exactly at the supplied world position. */
+    createLabel(position: Coordinates): EdgeLabel;
+    /** Removes one owned label and optionally records the deletion in history. */
+    removeLabel(label: EdgeLabel, emitChange?: boolean): void;
+    /** Updates the first label used by property panels, creating it when necessary. */
+    setPrimaryLabel(text: string): EdgeLabel | null;
+    /** Finds the length-weighted route midpoint used for programmatic first labels. */
+    defaultLabelPosition(): Coordinates;
+    /** Reports whether any routed segment intersects the supplied diagram bounds. */
     collides(box: Dimensions): boolean;
+    /** Updates one observable edge-state property through a MobX action boundary. */
     setState<K extends keyof TEdgeState>(prop: K, value: TEdgeState[K]): void;
+    /** Replaces the route and marks both endpoint coordinates as immutable anchors. */
     setSteps(steps: Coordinates[]): void;
-    get to(): import('./Gateway').Gateway;
+    /** Changes this edge routing strategy and immediately rebuilds its route. */
+    setPathType(pathType: EdgePathType): void;
+    /** Resolves a persisted fixed endpoint against the node's current geometry. */
+    resolveEndpointAnchor(endpoint: "from" | "to"): EdgeRouterAnchor;
+    /** Changes one endpoint between automatic and exact boundary positioning. */
+    setEndpointAnchor(endpoint: "from" | "to", anchor: TEdgeAnchorState, recompute?: boolean): void;
+    /** Reconnects one endpoint to a resolved node anchor and optionally reroutes. */
+    setResolvedEndpoint(endpoint: "from" | "to", resolved: EdgeRouterAnchor, anchor: TEdgeAnchorState, recompute?: boolean): void;
+    /** Reattaches resolved gateways safely and updates derived displacements. */
+    applyResolvedAnchors(start: EdgeRouterAnchor, end: EdgeRouterAnchor): void;
+    get to(): Gateway;
+    /** Restores the complete current edge contract and reconnects its target node. */
     deserialize(o: ReturnType<(typeof this)["serialize"]>): void;
+    /** Serializes routing, endpoint anchors, presentation, and editable label state. */
     serialize(): {
         arrowHeadEnd: import('../types').EdgeArrowHead | undefined;
         arrowHeadStart: import('../types').EdgeArrowHead | undefined;
         displacementEnd: [number, number] | undefined;
         displacementStart: [number, number] | undefined;
         lineStyle: import('../types').EdgeLineStyle | undefined;
-        pathType: import('../types').EdgePathType | undefined;
+        labels: {
+            alignment: "right" | "left" | "center";
+            id: string;
+            size: {
+                height: number;
+                width: number;
+            };
+            text: string;
+            position: [number, number];
+        }[];
+        pathType: EdgePathType;
+        startAnchor: {
+            mode: import('../types').EdgeAnchorMode;
+            position: [number, number] | undefined;
+        };
+        endAnchor: {
+            mode: import('../types').EdgeAnchorMode;
+            position: [number, number] | undefined;
+        };
         steps: TSerializedEdgePoint[];
         stroke: string | undefined;
         strokeWidth: number | undefined;
@@ -37,6 +85,8 @@ export declare class Edge extends Element {
         toParentId: string;
         class: string;
     };
+    /** Starts an orthogonal segment drag by emitting its normalized diagram event. */
     dragStart(midpoint: Midpoint, ev: MouseEvent): void;
+    /** Starts reconnecting one endpoint while preventing duplicate pointer handling. */
     dragEndpoint(endpoint: "from" | "to", ev: MouseEvent): void;
 }

package/dist/src/Diagrams/store/elements/EdgeLabel.d.ts

@@ -0,0 +1,64 @@
+import { Coordinates } from '../primitives/Coordinates';
+import { Edge } from './Edge';
+import { Element } from './Element';
+type EdgeLabelState = {
+    alignment?: "left" | "center" | "right";
+    id?: string;
+    text?: string;
+    position: Coordinates;
+    size?: {
+        height: number;
+        width: number;
+    };
+};
+/** Models one independently editable and movable screen-rendered edge label. */
+export declare class EdgeLabel extends Element {
+    parent: Edge;
+    readonly id: string;
+    text: string;
+    alignment: "left" | "center" | "right";
+    size: {
+        height: number;
+        width: number;
+    };
+    position: Coordinates;
+    isEditing: boolean;
+    draft: string;
+    private isNew;
+    constructor(parent: Edge, state: EdgeLabelState, isNew?: boolean);
+    /** Replaces persisted text for programmatic editors without emitting history. */
+    setText(text: string): void;
+    /** Changes horizontal text alignment and records the presentation update in history. */
+    setAlignment(alignment: "left" | "center" | "right"): void;
+    /** Replaces the persisted world-space label box size without emitting history immediately. */
+    setSize(size: {
+        height: number;
+        width: number;
+    }): void;
+    /** Opens this label editor with a draft copied from its persisted text value. */
+    beginEdit(): void;
+    /** Updates only the transient input draft while the label remains in edition. */
+    setDraft(text: string): void;
+    /** Cancels editing and discards a newly-created label that has never persisted. */
+    cancelEdit(): void;
+    /** Removes this label and emits history only when it has already been persisted. */
+    delete(): void;
+    /** Commits edited text, removing empty labels and emitting one history change. */
+    confirmEdit(): void;
+    /** Moves this label to an absolute diagram position without changing its edge. */
+    setPosition(position: Coordinates): void;
+    /** Records the completed pointer movement as one undoable diagram mutation. */
+    commitPosition(): void;
+    /** Serializes identity, alignment, size, text, and absolute world position for persistence. */
+    serialize(): {
+        alignment: "right" | "left" | "center";
+        id: string;
+        size: {
+            height: number;
+            width: number;
+        };
+        text: string;
+        position: [number, number];
+    };
+}
+export {};

package/dist/src/Diagrams/store/elements/Events.d.ts

@@ -1,11 +1,11 @@
-import { MouseEvent as ME, KeyboardEvent as KE } from 'react';
-import { Element } from './Element';
+import { KeyboardEvent as KE, MouseEvent as ME } from 'react';
+import { Midpoint } from '../../components/objects/RenderEdge';
 import { Coordinates } from '../primitives/Coordinates';
-import { Node } from './Node';
 import { Edge } from './Edge';
-import { Midpoint } from '../../components/objects/RenderEdge';
-import { MouseInformation } from './EventsMouseInformation';
+import { Element } from './Element';
+import { Node } from './Node';
 import { Dimensions } from '../primitives/Dimensions';
+import { MouseInformation } from './EventsMouseInformation';
 export type AnyMouseEvent = ME | MouseEvent;
 export type AnyKeyboardEvent = KE | KeyboardEvent;
 export declare abstract class DEvent {

package/dist/src/Diagrams/store/elements/Gateway.d.ts

@@ -7,9 +7,11 @@ export declare class Gateway extends Element {
     parent: Node<any>;
     state: TGatewayState;
     constructor(parent: Node<any>, state: Pick<TGatewayState, "maxIncomingConnections" | "maxOutgoingConnections" | "orientation" | "id"> & Partial<TGatewayState>);
-    addIncomingEdge(edge: Edge): void;
-    addOutgoingEdge(edge: Edge): void;
-    canConnect(from: Gateway): boolean;
+    addIncomingEdge(edge: Edge, _recompute?: boolean): void;
+    addOutgoingEdge(edge: Edge, recompute?: boolean): void;
+    canConnect(from: Gateway, ignoreEdge?: Edge): boolean;
+    /** Checks outgoing capacity while optionally ignoring a reconnected edge. */
+    canStartConnection(to: Gateway, ignoreEdge?: Edge): boolean;
     connectionDisplacement(c: Coordinates): Coordinates;
     connectionDistance(c: Coordinates): number;
     removeIncomingEdge(edge: Edge): void;
@@ -44,7 +46,25 @@ export declare class Gateway extends Element {
             displacementEnd: [number, number] | undefined;
             displacementStart: [number, number] | undefined;
             lineStyle: import('../types').EdgeLineStyle | undefined;
-            pathType: import('../types').EdgePathType | undefined;
+            labels: {
+                alignment: "right" | "left" | "center";
+                id: string;
+                size: {
+                    height: number;
+                    width: number;
+                };
+                text: string;
+                position: [number, number];
+            }[];
+            pathType: import('../types').EdgePathType;
+            startAnchor: {
+                mode: import('../types').EdgeAnchorMode;
+                position: [number, number] | undefined;
+            };
+            endAnchor: {
+                mode: import('../types').EdgeAnchorMode;
+                position: [number, number] | undefined;
+            };
             steps: import('./EdgePoint').TSerializedEdgePoint[];
             stroke: string | undefined;
             strokeWidth: number | undefined;