@html-graph/html-graph 0.0.45 → 0.0.47

package/README.md

@@ -33,9 +33,9 @@ npm i @html-graph/html-graph
 ```
 
 ```typescript
-import { MarkPortRequest, CanvasBuilder } from "@html-graph/html-graph";
+import { MarkNodePortRequest, HtmlGraphBuilder } from "@html-graph/html-graph";
 
-const canvas = new CanvasBuilder()
+const canvas = new HtmlGraphBuilder()
   .setOptions({
     background: { type: "dots" },
     connections: { hasTargetArrow: true },

package/dist/main.d.ts

@@ -10,35 +10,10 @@ export declare interface AddNodeRequest {
     element: HTMLElement;
     x: number;
     y: number;
-    ports?: Record<string, MarkPortRequest>;
+    ports?: Record<string, MarkNodePortRequest>;
     centerFn?: CenterFn;
 }
 
-export declare interface ApiContentMoveTransform {
-    x?: number;
-    y?: number;
-}
-
-export declare interface ApiContentScaleTransform {
-    scale: number;
-    x?: number;
-    y?: number;
-}
-
-export declare interface ApiPort {
-    readonly id?: string;
-    readonly element: HTMLElement;
-    readonly nodeId: string;
-    readonly centerFn?: CenterFn;
-    readonly direction?: number | null;
-}
-
-export declare interface ApiTransform {
-    scale?: number;
-    x?: number;
-    y?: number;
-}
-
 export declare type BackgroundDrawingFn = (ctx: CanvasRenderingContext2D, transformer: PublicViewportTransformer) => void;
 
 declare type BackgroundOptions = {
@@ -107,7 +82,7 @@ export declare interface Canvas {
     /**
      * marks element as port of node
      */
-    markPort(port: ApiPort): Canvas;
+    markPort(port: MarkPortRequest): Canvas;
     /**
      * updates connections attached to port
      */
@@ -128,15 +103,15 @@ export declare interface Canvas {
     /**
      * applies transformation for viewport
      */
-    patchViewportTransform(apiTransform: ApiTransform): Canvas;
+    patchViewportState(apiTransform: PatchViewRequest): Canvas;
     /**
      * applies move transformation for content
      */
-    moveContent(apiTransform: ApiContentMoveTransform): Canvas;
+    moveViewport(apiTransform: MoveViewportRequest): Canvas;
     /**
      * applies scale transformation for content
      */
-    scaleContent(apiTransform: ApiContentScaleTransform): Canvas;
+    scaleViewport(apiTransform: ScaleViewportRequest): Canvas;
     /**
      * applies shift transformation for content
      */
@@ -148,7 +123,7 @@ export declare interface Canvas {
     /**
      * updates connection
      */
-    updateConnectionController(connectionId: string, controller: ConnectionController): Canvas;
+    updateConnection(connectionId: string, request: UpdateConnectionRequest): Canvas;
     /**
      * drags node in viewport
      */
@@ -179,41 +154,30 @@ export declare interface Canvas {
     destroy(): void;
 }
 
-export declare class CanvasBuilder {
-    private coreOptions;
-    private transformOptions;
-    private isDraggable;
-    private isTransformable;
-    setOptions(options: CoreOptions): CanvasBuilder;
-    setDraggableNodes(): CanvasBuilder;
-    setTransformableCanvas(options?: TransformOptions): CanvasBuilder;
-    build(): Canvas;
-}
-
 /**
- * Provides core API for acting on graph
+ * Provides low level API for acting on graph
  */
 export declare class CanvasCore implements Canvas {
     private readonly apiOptions?;
     readonly transformation: PublicViewportTransformer;
     readonly model: PublicGraphStore;
-    private readonly options;
     private readonly di;
+    private readonly connectionControllerFactory;
     constructor(apiOptions?: CoreOptions | undefined);
     addNode(node: AddNodeRequest): CanvasCore;
     moveNodeOnTop(nodeId: string): CanvasCore;
     removeNode(nodeId: string): CanvasCore;
-    markPort(port: ApiPort): CanvasCore;
+    markPort(port: MarkPortRequest): CanvasCore;
     updatePortConnections(portId: string): CanvasCore;
     unmarkPort(portId: string): CanvasCore;
     addConnection(connection: AddConnectionRequest): CanvasCore;
     removeConnection(connectionId: string): CanvasCore;
-    patchViewportTransform(apiTransform: ApiTransform): CanvasCore;
-    moveContent(apiTransform: ApiContentMoveTransform): CanvasCore;
-    scaleContent(apiTransform: ApiContentScaleTransform): CanvasCore;
+    patchViewportState(apiTransform: PatchViewRequest): CanvasCore;
+    moveViewport(apiTransform: MoveViewportRequest): CanvasCore;
+    scaleViewport(apiTransform: ScaleViewportRequest): CanvasCore;
     moveToNodes(nodeIds: readonly string[]): CanvasCore;
     updateNodeCoords(nodeId: string, x: number, y: number): CanvasCore;
-    updateConnectionController(connectionId: string, controller: ConnectionController): CanvasCore;
+    updateConnection(connectionId: string, request: UpdateConnectionRequest): CanvasCore;
     dragNode(nodeId: string, dx: number, dy: number): CanvasCore;
     clear(): CanvasCore;
     attach(element: HTMLElement): CanvasCore;
@@ -333,17 +297,17 @@ export declare class DraggableNodesCanvas implements Canvas {
     constructor(canvas: Canvas);
     addNode(node: AddNodeRequest): DraggableNodesCanvas;
     removeNode(nodeId: string): DraggableNodesCanvas;
-    markPort(port: ApiPort): DraggableNodesCanvas;
+    markPort(port: MarkPortRequest): DraggableNodesCanvas;
     updatePortConnections(portId: string): DraggableNodesCanvas;
     unmarkPort(portId: string): DraggableNodesCanvas;
     addConnection(connection: AddConnectionRequest): DraggableNodesCanvas;
     removeConnection(connectionId: string): DraggableNodesCanvas;
-    patchViewportTransform(apiTransform: ApiTransform): DraggableNodesCanvas;
-    moveContent(apiTransform: ApiContentMoveTransform): DraggableNodesCanvas;
-    scaleContent(apiTransform: ApiContentScaleTransform): DraggableNodesCanvas;
+    patchViewportState(apiTransform: PatchViewRequest): DraggableNodesCanvas;
+    moveViewport(apiTransform: MoveViewportRequest): DraggableNodesCanvas;
+    scaleViewport(apiTransform: ScaleViewportRequest): DraggableNodesCanvas;
     moveToNodes(nodeIds: readonly string[]): DraggableNodesCanvas;
     updateNodeCoords(nodeId: string, x: number, y: number): DraggableNodesCanvas;
-    updateConnectionController(connectionId: string, controller: ConnectionController): DraggableNodesCanvas;
+    updateConnection(connectionId: string, request: UpdateConnectionRequest): DraggableNodesCanvas;
     dragNode(nodeId: string, dx: number, dy: number): DraggableNodesCanvas;
     moveNodeOnTop(nodeId: string): DraggableNodesCanvas;
     clear(): DraggableNodesCanvas;
@@ -391,14 +355,38 @@ declare class GraphStore {
     clear(): void;
 }
 
+export declare class HtmlGraphBuilder {
+    private coreOptions;
+    private transformOptions;
+    private isDraggable;
+    private isTransformable;
+    setOptions(options: CoreOptions): HtmlGraphBuilder;
+    setDraggableNodes(): HtmlGraphBuilder;
+    setTransformableCanvas(options?: TransformOptions): HtmlGraphBuilder;
+    build(): Canvas;
+}
+
 declare type LayersMode = "connections-on-top" | "nodes-on-top" | "connections-follow-node";
 
-export declare type MarkPortRequest = HTMLElement | {
+export declare type MarkNodePortRequest = HTMLElement | {
     readonly element: HTMLElement;
     readonly centerFn?: CenterFn;
     readonly direction?: number | null;
 };
 
+export declare interface MarkPortRequest {
+    readonly id?: string;
+    readonly element: HTMLElement;
+    readonly nodeId: string;
+    readonly centerFn?: CenterFn;
+    readonly direction?: number | null;
+}
+
+export declare interface MoveViewportRequest {
+    x?: number;
+    y?: number;
+}
+
 declare interface NodePayload {
     element: HTMLElement;
     x: number;
@@ -406,12 +394,18 @@ declare interface NodePayload {
     centerFn: CenterFn;
 }
 
+export declare interface PatchViewRequest {
+    scale?: number;
+    x?: number;
+    y?: number;
+}
+
 declare type Point = [number, number];
 
 export declare interface PortPayload {
-    element: HTMLElement;
-    centerFn: CenterFn;
-    direction: number | null;
+    readonly element: HTMLElement;
+    readonly centerFn: CenterFn;
+    readonly direction: number | null;
 }
 
 declare class PublicGraphStore {
@@ -469,6 +463,12 @@ export declare class PublicViewportTransformer {
     getAbsScale(): number;
 }
 
+export declare interface ScaleViewportRequest {
+    scale: number;
+    x?: number;
+    y?: number;
+}
+
 export declare class StraightConnectionController implements ConnectionController {
     private readonly color;
     private readonly width;
@@ -520,17 +520,17 @@ export declare class TransformableCanvas implements Canvas {
     constructor(canvas: Canvas, options?: TransformOptions | undefined);
     addNode(node: AddNodeRequest): TransformableCanvas;
     removeNode(nodeId: string): TransformableCanvas;
-    markPort(port: ApiPort): TransformableCanvas;
+    markPort(port: MarkPortRequest): TransformableCanvas;
     updatePortConnections(portId: string): TransformableCanvas;
     unmarkPort(portId: string): TransformableCanvas;
     addConnection(connection: AddConnectionRequest): TransformableCanvas;
     removeConnection(connectionId: string): TransformableCanvas;
-    patchViewportTransform(apiTransform: ApiTransform): TransformableCanvas;
-    moveContent(apiTransform: ApiContentMoveTransform): TransformableCanvas;
-    scaleContent(apiTransform: ApiContentScaleTransform): TransformableCanvas;
+    patchViewportState(apiTransform: PatchViewRequest): TransformableCanvas;
+    moveViewport(apiTransform: MoveViewportRequest): TransformableCanvas;
+    scaleViewport(apiTransform: ScaleViewportRequest): TransformableCanvas;
     moveToNodes(nodeIds: readonly string[]): TransformableCanvas;
     updateNodeCoords(nodeId: string, x: number, y: number): TransformableCanvas;
-    updateConnectionController(connectionId: string, controller: ConnectionController): TransformableCanvas;
+    updateConnection(connectionId: string, request: UpdateConnectionRequest): TransformableCanvas;
     dragNode(nodeId: string, dx: number, dy: number): TransformableCanvas;
     moveNodeOnTop(nodeId: string): TransformableCanvas;
     clear(): TransformableCanvas;
@@ -554,6 +554,10 @@ export declare interface TransformOptions {
     };
 }
 
+declare interface UpdateConnectionRequest {
+    readonly controller?: ConnectionController;
+}
+
 declare class ViewportTransformer {
     private state;
     /**