@html-graph/html-graph 2.5.0 → 3.1.0

package/README.md

@@ -49,7 +49,10 @@ function createNode({ name, x, y, frontPortId, backPortId }) {
   };
 }
 
+const element = document.getElementById("canvas");
+
 const canvas = new CanvasBuilder()
+  .setElement(element)
   .setDefaults({
     edges: {
       shape: {
@@ -59,17 +62,9 @@ const canvas = new CanvasBuilder()
   })
   .enableUserDraggableNodes()
   .enableUserTransformableViewport()
-  .enableVirtualScroll({
-    nodeContainingRadius: {
-      horizontal: 25,
-      vertical: 25,
-    },
-  })
-  .enableResizeReactiveNodes()
   .build();
 
 canvas
-  .attach(document.getElementById("canvas"))
   .addNode(
     createNode({
       name: "Node 1",

package/dist/html-graph.d.ts

@@ -14,14 +14,6 @@ declare interface AddEdgeRequest_2 {
     readonly priority: number;
 }
 
-declare interface AddEdgeRequest_3 {
-    readonly id: unknown;
-    readonly from: unknown;
-    readonly to: unknown;
-    readonly shape: EdgeShape;
-    readonly priority: number;
-}
-
 export declare type AddNodePorts = Iterable<MarkNodePortRequest>;
 
 export declare interface AddNodeRequest {
@@ -43,15 +35,6 @@ declare interface AddNodeRequest_2 {
     readonly priority: number;
 }
 
-declare interface AddNodeRequest_3 {
-    readonly id: unknown;
-    readonly element: HTMLElement;
-    readonly x: number;
-    readonly y: number;
-    readonly centerFn: CenterFn;
-    readonly priority: number;
-}
-
 declare interface AddPortRequest {
     readonly id: unknown;
     readonly nodeId: unknown;
@@ -98,11 +81,9 @@ declare type BezierEdgeShapeConfig = {
 
 export declare class Canvas {
     readonly element: HTMLElement;
-    private readonly controller;
-    private readonly nodeIdGenerator;
-    private readonly portIdGenerator;
-    private readonly edgeIdGenerator;
-    private readonly defaults;
+    private readonly graphStore;
+    private readonly viewportStore;
+    private readonly htmlView;
     /**
      * provides api for accessing graph model
      */
@@ -111,20 +92,25 @@ export declare class Canvas {
      * provides api for accessing viewport state
      */
     readonly viewport: Viewport;
-    constructor(element: HTMLElement, controller: CanvasController, options: CanvasDefaults);
-    /**
-     * @deprecated
-     * use CanvasBuilder.attach instead
-     * attaches canvas to given element
-     * detaches element first when canvas is attached
-     */
-    attach(element: HTMLElement): Canvas;
-    /**
-     * @deprecated
-     * attach canvas once instead, then reattach wrapper element
-     * detaches canvas from element when attached
-     */
-    detach(): Canvas;
+    private readonly defaults;
+    private readonly nodeIdGenerator;
+    private readonly portIdGenerator;
+    private readonly edgeIdGenerator;
+    private readonly onAfterNodeAdded;
+    private readonly onAfterNodeUpdated;
+    private readonly onAfterNodePriorityUpdated;
+    private readonly onBeforeNodeRemoved;
+    private readonly onAfterPortUpdated;
+    private readonly onBeforePortUnmarked;
+    private readonly onAfterEdgeAdded;
+    private readonly onAfterEdgeShapeUpdated;
+    private readonly onAfterEdgeUpdated;
+    private readonly onAfterEdgePriorityUpdated;
+    private readonly onBeforeEdgeRemoved;
+    private readonly onBeforeClear;
+    private readonly onBeforeDestroyEmitter;
+    readonly onBeforeDestroy: EventHandler<void>;
+    constructor(element: HTMLElement, graphStore: GraphStore, viewportStore: ViewportStore, htmlView: HtmlView, options: CanvasDefaults);
     /**
      * adds node to graph
      */
@@ -194,16 +180,11 @@ export declare class CanvasBuilder {
     private hasTransformableViewport;
     private hasResizeReactiveNodes;
     private boxRenderingTrigger;
-    attach(element: HTMLElement): CanvasBuilder;
+    setElement(element: HTMLElement): CanvasBuilder;
     /**
      * specifies default values for graph entities
      */
     setDefaults(defaults: CanvasDefaults): CanvasBuilder;
-    /**
-     * @deprecated
-     * use setDefaults instead
-     */
-    setOptions(options: CanvasDefaults): CanvasBuilder;
     /**
      * enables nodes draggable by user
      */
@@ -228,33 +209,7 @@ export declare class CanvasBuilder {
     private reset;
 }
 
-declare interface CanvasController {
-    readonly graph: Graph;
-    readonly viewport: Viewport;
-    /**
-     * @deprecated
-     */
-    attach(element: HTMLElement): void;
-    /**
-     * @deprecated
-     */
-    detach(): void;
-    addNode(node: AddNodeRequest_3): void;
-    updateNode(nodeId: unknown, request: UpdateNodeRequest_3): void;
-    removeNode(nodeId: unknown): void;
-    markPort(port: MarkPortRequest_2): void;
-    updatePort(portId: unknown, request: UpdatePortRequest_3): void;
-    unmarkPort(portId: unknown): void;
-    addEdge(edge: AddEdgeRequest_3): void;
-    updateEdge(edgeId: unknown, request: UpdateEdgeRequest_3): void;
-    removeEdge(edgeId: unknown): void;
-    patchViewportMatrix(request: PatchMatrixRequest_2): void;
-    patchContentMatrix(request: PatchMatrixRequest_2): void;
-    clear(): void;
-    destroy(): void;
-}
-
-declare interface CanvasDefaults {
+export declare interface CanvasDefaults {
     /**
      * nodes related behavior
      */
@@ -292,8 +247,6 @@ declare interface CanvasDefaults {
         readonly priority?: Priority;
     };
 }
-export { CanvasDefaults }
-export { CanvasDefaults as CoreOptions }
 
 export declare type CenterFn = (width: number, height: number) => Point;
 
@@ -368,40 +321,15 @@ export declare class EventSubject<T> implements EventEmitter<T>, EventHandler<T>
 export declare class Graph {
     private readonly graphStore;
     readonly onAfterNodeAdded: EventHandler<unknown>;
-    /**
-     * @deprecated
-     * use onAfterNodeUpdated instead
-     */
-    readonly onAfterNodeCoordinatesUpdated: EventHandler<unknown>;
     readonly onAfterNodeUpdated: EventHandler<unknown>;
     readonly onAfterNodePriorityUpdated: EventHandler<unknown>;
     readonly onBeforeNodeRemoved: EventHandler<unknown>;
     readonly onAfterPortMarked: EventHandler<unknown>;
-    /**
-     * @deprecated
-     * use onAfterPortMarked instead
-     */
-    readonly onAfterPortAdded: EventHandler<unknown>;
     readonly onAfterPortUpdated: EventHandler<unknown>;
-    /**
-     * @deprecated
-     * use onAfterPortUpdated instead
-     */
-    readonly onAfterPortDirectionUpdated: EventHandler<unknown>;
     readonly onBeforePortUnmarked: EventHandler<unknown>;
-    /**
-     * @deprecated
-     * use onBeforePortUnmarked instead
-     */
-    readonly onBeforePortRemoved: EventHandler<unknown>;
     readonly onAfterEdgeAdded: EventHandler<unknown>;
     readonly onAfterEdgeShapeUpdated: EventHandler<unknown>;
     readonly onAfterEdgeUpdated: EventHandler<unknown>;
-    /**
-     * @deprecated
-     * use onAfterEdgeUpdated instead
-     */
-    readonly onAfterEdgeAdjacentPortsUpdated: EventHandler<unknown>;
     readonly onAfterEdgePriorityUpdated: EventHandler<unknown>;
     readonly onBeforeEdgeRemoved: EventHandler<unknown>;
     readonly onBeforeClear: EventHandler<void>;
@@ -411,11 +339,6 @@ export declare class Graph {
     getPort(portId: unknown): GraphPort | null;
     getAllPortIds(): readonly unknown[];
     getNodePortIds(nodeId: unknown): readonly unknown[] | null;
-    /**
-     * @deprecated
-     * use graph.getPort()?.nodeId ?? null instead
-     */
-    getPortNodeId(portId: unknown): unknown | null;
     getAllEdgeIds(): readonly unknown[];
     getEdge(edgeId: unknown): GraphEdge | null;
     getPortIncomingEdgeIds(portId: unknown): readonly unknown[] | null;
@@ -555,6 +478,20 @@ export declare class HtmlGraphError extends Error {
     readonly name = "HtmlGraphError";
 }
 
+declare interface HtmlView {
+    attachNode(nodeId: unknown): void;
+    detachNode(nodeId: unknown): void;
+    attachEdge(edgeId: unknown): void;
+    detachEdge(edgeId: unknown): void;
+    clear(): void;
+    destroy(): void;
+    updateNodePosition(nodeId: unknown): void;
+    updateNodePriority(nodeId: unknown): void;
+    updateEdgeShape(edgeId: unknown): void;
+    renderEdge(edgeId: unknown): void;
+    updateEdgePriority(edgeId: unknown): void;
+}
+
 declare type IncrementalPriority = "incremental";
 
 export declare type MarkNodePortRequest = {
@@ -570,13 +507,6 @@ export declare interface MarkPortRequest {
     readonly direction?: number;
 }
 
-declare interface MarkPortRequest_2 {
-    readonly id: unknown;
-    readonly element: HTMLElement;
-    readonly nodeId: unknown;
-    readonly direction: number;
-}
-
 export declare interface NodeDragPayload {
     readonly nodeId: unknown;
     readonly element: HTMLElement;
@@ -599,12 +529,6 @@ export declare interface PatchMatrixRequest {
     readonly y?: number | undefined;
 }
 
-declare interface PatchMatrixRequest_2 {
-    readonly scale?: number | undefined;
-    readonly x?: number | undefined;
-    readonly y?: number | undefined;
-}
-
 declare interface PatchTransformRequest {
     readonly scale?: number;
     readonly x?: number;
@@ -751,13 +675,6 @@ declare interface UpdateEdgeRequest_2 {
     readonly priority?: number;
 }
 
-declare interface UpdateEdgeRequest_3 {
-    readonly from?: unknown | undefined;
-    readonly to?: unknown | undefined;
-    readonly shape?: EdgeShape | undefined;
-    readonly priority?: number | undefined;
-}
-
 export declare interface UpdateNodeRequest {
     readonly x?: number | undefined;
     readonly y?: number | undefined;
@@ -772,13 +689,6 @@ declare interface UpdateNodeRequest_2 {
     readonly priority?: number;
 }
 
-declare interface UpdateNodeRequest_3 {
-    readonly x?: number | undefined;
-    readonly y?: number | undefined;
-    readonly priority?: number | undefined;
-    readonly centerFn?: CenterFn | undefined;
-}
-
 export declare interface UpdatePortRequest {
     readonly direction?: number;
 }
@@ -787,10 +697,6 @@ declare interface UpdatePortRequest_2 {
     readonly direction?: number;
 }
 
-declare interface UpdatePortRequest_3 {
-    readonly direction?: number;
-}
-
 export declare interface VerticalEdgeParams {
     readonly color?: string | undefined;
     readonly width?: number | undefined;