@html-graph/html-graph 0.0.57 → 0.0.59

package/README.md

@@ -10,11 +10,11 @@
     <img width="100%" src="https://raw.githubusercontent.com/html-graph/html-graph/master/media/full-demo.gif"/>
 </a>
 
-Visit <a target="_blank" href="https://html-graph.github.io">use cases</a> and [use cases implementation](use-cases).
-
 Instead of connecting nodes directly this library uses concept of ports, which provide greater fexibility at managing edges.
 Port is an entity of a node to which edge can be attached to.
 
+Visit <a target="_blank" href="https://html-graph.github.io">use cases</a> and [use cases implementation](use-cases).
+
 ## Features:
 
 - easy nodes customization using HTML
@@ -35,9 +35,6 @@ import { HtmlGraphBuilder } from "@html-graph/html-graph";
 
 const canvas = new HtmlGraphBuilder()
   .setOptions({
-    background: {
-      type: "dots",
-    },
     edges: {
       shape: {
         hasTargetArrow: true,

package/dist/main.d.ts

@@ -1,10 +1,3 @@
-declare interface AbstractViewportTransformer {
-    getViewportMatrix(): TransformState;
-    getContentMatrix(): TransformState;
-    patchViewportMatrix(scale: number | null, x: number | null, y: number | null): void;
-    patchContentMatrix(scale: number | null, dx: number | null, dy: number | null): void;
-}
-
 export declare interface AddEdgeRequest {
     readonly id?: unknown;
     readonly from: string;
@@ -25,22 +18,6 @@ export declare interface AddNodeRequest {
     readonly priority?: number;
 }
 
-export declare type BackgroundDrawingFn = (ctx: CanvasRenderingContext2D, transformer: PublicViewportTransformer) => void;
-
-declare type BackgroundOptions = {
-    readonly type: "none";
-} | {
-    readonly type: "dots";
-    readonly dotColor?: string;
-    readonly dotGap?: number;
-    readonly dotRadius?: number;
-    readonly color?: string;
-    readonly limit?: number;
-} | {
-    readonly type: "custom";
-    readonly drawingFn: BackgroundDrawingFn;
-};
-
 export declare class BezierEdgeShape implements EdgeShape {
     private readonly curvature;
     private readonly arrowLength;
@@ -51,7 +28,8 @@ export declare class BezierEdgeShape implements EdgeShape {
     private readonly sourceArrow;
     private readonly targetArrow;
     constructor(color: string, width: number, curvature: number, arrowLength: number, arrowWidth: number, hasSourceArrow: boolean, hasTargetArrow: boolean);
-    update(x: number, y: number, width: number, height: number, from: GraphPort, to: GraphPort): void;
+    update(to: Point, flipX: number, flipY: number, fromDir: number, toDir: number): void;
+    private createLinePath;
 }
 
 declare interface BezierEdgeShape_2 {
@@ -161,7 +139,7 @@ export declare class CanvasCore implements Canvas {
     updateNode(nodeId: unknown, request: UpdateNodeRequest): CanvasCore;
     removeNode(nodeId: unknown): CanvasCore;
     markPort(port: MarkPortRequest): CanvasCore;
-    updatePort(portId: string, request: UpdatePortRequest): CanvasCore;
+    updatePort(portId: string, request?: UpdatePortRequest): CanvasCore;
     unmarkPort(portId: string): CanvasCore;
     addEdge(edge: AddEdgeRequest): CanvasCore;
     updateEdge(edgeId: unknown, request: UpdateEdgeRequest): CanvasCore;
@@ -179,10 +157,6 @@ export declare type CenterFn = (width: number, height: number) => Point;
 declare type ConstantPriority = number;
 
 export declare interface CoreOptions {
-    /**
-     * canvas background settings
-     */
-    readonly background?: BackgroundOptions;
     /**
      * nodes related behavior
      */
@@ -295,11 +269,11 @@ export declare class CycleCircleEdgeShape implements EdgeShape {
     private readonly radius;
     private readonly smallRadius;
     readonly svg: SVGSVGElement;
-    private readonly group;
     private readonly line;
     private readonly arrow;
     constructor(color: string, width: number, arrowLength: number, arrowWidth: number, hasArrow: boolean, radius: number, smallRadius: number);
-    update(x: number, y: number, _width: number, _height: number, from: GraphPort): void;
+    update(_to: Point, flipX: number, flipY: number, fromDir: number): void;
+    private createLinePath;
 }
 
 export declare class CycleSquareEdgeShape implements EdgeShape {
@@ -308,13 +282,29 @@ export declare class CycleSquareEdgeShape implements EdgeShape {
     private readonly side;
     private readonly minPortOffset;
     readonly svg: SVGSVGElement;
-    private readonly group;
     private readonly line;
     private readonly arrow;
     private readonly roundness;
     private readonly linePoints;
     constructor(color: string, width: number, arrowLength: number, arrowWidth: number, hasArrow: boolean, side: number, minPortOffset: number, roundness: number);
-    update(x: number, y: number, _width: number, _height: number, from: GraphPort): void;
+    update(_to: Point, flipX: number, flipY: number, fromDir: number): void;
+    private createLinePath;
+}
+
+export declare class DetourBezierEdgeShape implements EdgeShape {
+    private readonly curvature;
+    private readonly arrowLength;
+    private readonly arrowWidth;
+    readonly svg: SVGSVGElement;
+    private readonly group;
+    private readonly line;
+    private readonly sourceArrow;
+    private readonly targetArrow;
+    private readonly detourX;
+    private readonly detourY;
+    constructor(color: string, width: number, curvature: number, arrowLength: number, arrowWidth: number, hasSourceArrow: boolean, hasTargetArrow: boolean, detourDistance: number, detourDirection: number);
+    update(to: Point, flipX: number, flipY: number, fromDir: number, toDir: number): void;
+    private createLinePath;
 }
 
 export declare class DetourStraightEdgeShape implements EdgeShape {
@@ -330,7 +320,8 @@ export declare class DetourStraightEdgeShape implements EdgeShape {
     private readonly detourX;
     private readonly detourY;
     constructor(color: string, width: number, arrowLength: number, arrowWidth: number, arrowOffset: number, hasSourceArrow: boolean, hasTargetArrow: boolean, roundness: number, detourDistance: number, detourDirection: number);
-    update(x: number, y: number, width: number, height: number, from: GraphPort, to: GraphPort): void;
+    update(to: Point, flipX: number, flipY: number, fromDir: number, toDir: number): void;
+    private createLinePath;
 }
 
 export declare interface DragOptions {
@@ -342,16 +333,9 @@ export declare interface DragOptions {
     };
 }
 
-declare interface EdgePayload {
-    readonly from: unknown;
-    readonly to: unknown;
-    shape: EdgeShape;
-    priority: number;
-}
-
 export declare interface EdgeShape {
     readonly svg: SVGSVGElement;
-    update(x: number, y: number, width: number, height: number, from: GraphPort, to: GraphPort): void;
+    update(to: Point, flipX: number, flipY: number, fromDir: number, toDir: number): void;
 }
 
 declare type EdgeShape_2 = BezierEdgeShape_2 | StraightEdgeShape_2 | CustomEdgeShape | HorizontalEdgeShape_2 | VerticalEdgeShape_2;
@@ -384,40 +368,6 @@ export declare interface GraphPort {
     readonly direction: number;
 }
 
-declare class GraphStore {
-    private readonly nodes;
-    private readonly ports;
-    private readonly nodePorts;
-    private readonly portNodeId;
-    private readonly edges;
-    private readonly incommingEdges;
-    private readonly outcommingEdges;
-    private readonly cycleEdges;
-    addNode(nodeId: unknown, element: HTMLElement, x: number, y: number, centerFn: CenterFn, priority: number): void;
-    getAllNodeIds(): readonly unknown[];
-    getNode(nodeId: unknown): NodePayload | undefined;
-    removeNode(nodeId: unknown): void;
-    addPort(portId: unknown, element: HTMLElement, nodeId: unknown, centerFn: CenterFn, dir: number): void;
-    getPort(portId: unknown): PortPayload | undefined;
-    getAllPortIds(): readonly unknown[];
-    getNodePortIds(nodeId: unknown): readonly unknown[] | undefined;
-    getPortNodeId(portId: unknown): unknown | undefined;
-    removePort(portId: unknown): void;
-    addEdge(edgeId: unknown, fromPortId: unknown, toPortId: unknown, shape: EdgeShape, priority: number): void;
-    getAllEdgeIds(): readonly unknown[];
-    getEdge(edgeId: unknown): EdgePayload | undefined;
-    removeEdge(edgeId: unknown): void;
-    clear(): void;
-    getPortIncomingEdgeIds(portId: unknown): readonly unknown[];
-    getPortOutcomingEdgeIds(portId: unknown): readonly unknown[];
-    getPortCycleEdgeIds(portId: unknown): readonly unknown[];
-    getPortAdjacentEdgeIds(portId: unknown): readonly unknown[];
-    getNodeIncomingEdgeIds(nodeId: unknown): readonly unknown[];
-    getNodeOutcomingEdgeIds(nodeId: unknown): readonly unknown[];
-    getNodeCycleEdgeIds(nodeId: unknown): readonly unknown[];
-    getNodeAdjacentEdgeIds(nodeId: unknown): readonly unknown[];
-}
-
 export declare class HorizontalEdgeShape implements EdgeShape {
     private readonly arrowLength;
     private readonly arrowWidth;
@@ -429,7 +379,8 @@ export declare class HorizontalEdgeShape implements EdgeShape {
     private readonly sourceArrow;
     private readonly targetArrow;
     constructor(color: string, width: number, arrowLength: number, arrowWidth: number, arrowOffset: number, hasSourceArrow: boolean, hasTargetArrow: boolean, roundness: number);
-    update(x: number, y: number, width: number, height: number, from: GraphPort, to: GraphPort): void;
+    update(to: Point, flipX: number, flipY: number, fromDir: number, toDir: number): void;
+    private createLinePath;
 }
 
 declare interface HorizontalEdgeShape_2 {
@@ -487,14 +438,6 @@ export declare interface NodeDragPayload {
     readonly y: number;
 }
 
-declare interface NodePayload {
-    element: HTMLElement;
-    x: number;
-    y: number;
-    centerFn: CenterFn;
-    priority: number;
-}
-
 export declare interface PatchMatrixRequest {
     readonly scale?: number;
     readonly dx?: number;
@@ -506,28 +449,20 @@ export declare interface Point {
     readonly y: number;
 }
 
-declare interface PortPayload {
-    readonly element: HTMLElement;
-    centerFn: CenterFn;
-    direction: number;
-}
-
 declare type Priority = ConstantPriority | IncrementalPriority | SharedIncrementalPriority | CustomPriority;
 
 export declare type PriorityFn = () => number;
 
-declare class PublicGraphStore {
-    private readonly graphStore;
-    constructor(graphStore: GraphStore);
+export declare interface PublicGraphStore {
     getAllNodeIds(): readonly unknown[];
     getAllPortIds(): readonly unknown[];
     getNode(nodeId: unknown): GraphNode | null;
     getNodePortIds(nodeId: unknown): readonly unknown[] | undefined;
     getPort(portId: unknown): GraphPort | null;
-    getPortNodeId(portId: string): unknown | null;
+    getPortNodeId(portId: unknown): unknown | null;
     getAllEdgeIds(): readonly unknown[];
     getEdge(edgeId: unknown): GraphEdge | null;
-    getPortAdjacentEdgeIds(portId: string): readonly unknown[];
+    getPortAdjacentEdgeIds(portId: unknown): readonly unknown[];
     getNodeAdjacentEdgeIds(nodeId: unknown): readonly unknown[];
     getPortIncomingEdgeIds(portId: unknown): readonly unknown[];
     getPortOutcomingEdgeIds(portId: unknown): readonly unknown[];
@@ -537,9 +472,7 @@ declare class PublicGraphStore {
     getNodeCycleEdgeIds(nodeId: unknown): readonly unknown[];
 }
 
-export declare class PublicViewportTransformer {
-    private readonly transformer;
-    constructor(transformer: AbstractViewportTransformer);
+export declare interface PublicViewportTransformer {
     getViewportMatrix(): TransformState;
     getContentMatrix(): TransformState;
 }
@@ -557,7 +490,8 @@ export declare class StraightEdgeShape implements EdgeShape {
     private readonly sourceArrow;
     private readonly targetArrow;
     constructor(color: string, width: number, arrowLength: number, arrowWidth: number, arrowOffset: number, hasSourceArrow: boolean, hasTargetArrow: boolean, roundness: number);
-    update(x: number, y: number, width: number, height: number, from: GraphPort, to: GraphPort): void;
+    update(to: Point, flipX: number, flipY: number, fromDir: number, toDir: number): void;
+    private createLinePath;
 }
 
 declare interface StraightEdgeShape_2 {
@@ -575,7 +509,7 @@ declare interface StraightEdgeShape_2 {
     readonly detourDirection?: number;
 }
 
-export declare type TransformFinishedFn = (transform: TransformPayload) => void;
+export declare type TransformFinishedFn = () => void;
 
 export declare interface TransformOptions {
     readonly scale?: {
@@ -741,7 +675,8 @@ export declare class VerticalEdgeShape implements EdgeShape {
     private readonly sourceArrow;
     private readonly targetArrow;
     constructor(color: string, width: number, arrowLength: number, arrowWidth: number, arrowOffset: number, hasSourceArrow: boolean, hasTargetArrow: boolean, roundness: number);
-    update(x: number, y: number, width: number, height: number, from: GraphPort, to: GraphPort): void;
+    update(to: Point, flipX: number, flipY: number, fromDir: number, toDir: number): void;
+    private createLinePath;
 }
 
 declare interface VerticalEdgeShape_2 {