@html-graph/html-graph 0.1.3 → 0.1.5

package/README.md

@@ -9,7 +9,7 @@
 </a>
 
 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 an edge can be attached to.
+Port is an entity of a node to which edges can be attached to.
 
 Visit <a target="_blank" href="https://html-graph.github.io/use-cases/">use cases</a> and [use cases implementation](use-cases).
 
@@ -61,27 +61,25 @@ const canvas = new HtmlGraphBuilder()
   .setResizeReactiveNodes()
   .build();
 
-const node1 = createNode({
-  name: "Node 1",
-  x: 200,
-  y: 400,
-  frontPortId: "node-1-in",
-  backPortId: "node-1-out",
-});
-
-const node2 = createNode({
-  name: "Node 2",
-  x: 600,
-  y: 500,
-  frontPortId: "node-2-in",
-  backPortId: "node-2-out",
-});
-
-const canvasElement = document.getElementById("canvas");
-
 canvas
-  .attach(canvasElement)
-  .addNode(node1)
-  .addNode(node2)
+  .attach(document.getElementById("canvas"))
+  .addNode(
+    createNode({
+      name: "Node 1",
+      x: 200,
+      y: 400,
+      frontPortId: "node-1-in",
+      backPortId: "node-1-out",
+    }),
+  )
+  .addNode(
+    createNode({
+      name: "Node 2",
+      x: 600,
+      y: 500,
+      frontPortId: "node-2-in",
+      backPortId: "node-2-out",
+    }),
+  )
   .addEdge({ from: "node-1-out", to: "node-2-in" });
 ```

package/dist/main.d.ts

@@ -42,7 +42,7 @@ declare interface AddPortRequest {
     readonly direction: number;
 }
 
-export declare type BeforeTransformStartedFn = () => void;
+export declare type BeforeTransformChangeFn = () => void;
 
 export declare interface BezierEdgeParams {
     readonly color?: string | undefined;
@@ -244,7 +244,11 @@ declare type CustomPriority = PriorityFn;
 
 export declare interface DragOptions {
     readonly moveOnTop?: boolean;
-    readonly dragCursor?: string | null;
+    readonly mouse?: {
+        readonly dragCursor?: string | null;
+        readonly mouseDownEventValidator?: (event: MouseEvent) => boolean;
+        readonly mouseUpEventValidator?: (event: MouseEvent) => boolean;
+    };
     readonly events?: {
         readonly onNodeDrag?: (payload: NodeDragPayload) => void;
         readonly onBeforeNodeDrag?: (payload: NodeDragPayload) => boolean;
@@ -576,7 +580,7 @@ declare interface StraightEdgeShape_2 {
     readonly detourDirection?: number;
 }
 
-export declare type TransformFinishedFn = () => void;
+export declare type TransformChangeFn = () => void;
 
 export declare interface TransformOptions {
     readonly scale?: {
@@ -587,8 +591,10 @@ export declare interface TransformOptions {
     };
     readonly transformPreprocessor?: TransformPreprocessorOption | TransformPreprocessorOption[];
     readonly events?: {
-        readonly onBeforeTransformStarted?: BeforeTransformStartedFn;
-        readonly onTransformFinished?: TransformFinishedFn;
+        readonly onTransformStarted?: () => void;
+        readonly onTransformFinished?: () => void;
+        readonly onBeforeTransformChange?: BeforeTransformChangeFn;
+        readonly onTransformChange?: TransformChangeFn;
     };
 }
 
@@ -650,9 +656,6 @@ export declare class UserDraggableNodesCanvas implements Canvas {
     private maxNodePriority;
     private readonly nodes;
     private grabbedNodeId;
-    private onNodeDrag;
-    private onBeforeNodeDrag;
-    private onNodeDragFinished;
     private readonly nodeIdGenerator;
     private element;
     private readonly onWindowMouseMove;
@@ -660,9 +663,8 @@ export declare class UserDraggableNodesCanvas implements Canvas {
     private readonly onWindowTouchMove;
     private readonly onWindowTouchFinish;
     private previousTouchCoords;
-    private readonly freezePriority;
     private readonly window;
-    private readonly dragCursor;
+    private readonly options;
     constructor(canvas: Canvas, dragOptions?: DragOptions);
     attach(element: HTMLElement): UserDraggableNodesCanvas;
     detach(): UserDraggableNodesCanvas;