@html-graph/html-graph 1.1.1 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/main.d.ts +162 -90
- package/dist/main.js +587 -333
- package/dist/main.umd.cjs +1 -1
- package/package.json +1 -1
package/dist/main.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export declare interface AddEdgeRequest {
|
|
2
2
|
readonly id?: unknown | undefined;
|
|
3
|
-
readonly from:
|
|
4
|
-
readonly to:
|
|
3
|
+
readonly from: unknown;
|
|
4
|
+
readonly to: unknown;
|
|
5
5
|
readonly shape?: EdgeShape | undefined;
|
|
6
6
|
readonly priority?: number | undefined;
|
|
7
7
|
}
|
|
@@ -109,11 +109,21 @@ export declare interface Canvas {
|
|
|
109
109
|
/**
|
|
110
110
|
* provides api for accessing graph model
|
|
111
111
|
*/
|
|
112
|
-
readonly
|
|
112
|
+
readonly graph: Graph;
|
|
113
|
+
/**
|
|
114
|
+
* @deprecated
|
|
115
|
+
* use "graph" property instead
|
|
116
|
+
*/
|
|
117
|
+
readonly model: Graph;
|
|
113
118
|
/**
|
|
114
|
-
* provides api for canvas
|
|
119
|
+
* provides api for canvas accessing viewport state
|
|
115
120
|
*/
|
|
116
|
-
readonly
|
|
121
|
+
readonly viewport: Viewport;
|
|
122
|
+
/**
|
|
123
|
+
* @deprecated
|
|
124
|
+
* use "viewport" property instead
|
|
125
|
+
*/
|
|
126
|
+
readonly transformation: Viewport;
|
|
117
127
|
/**
|
|
118
128
|
* adds node to graph
|
|
119
129
|
*/
|
|
@@ -187,18 +197,40 @@ declare class CanvasBuilder {
|
|
|
187
197
|
private coreOptions;
|
|
188
198
|
private dragOptions;
|
|
189
199
|
private transformOptions;
|
|
200
|
+
private virtualScrollOptions;
|
|
190
201
|
private hasDraggableNode;
|
|
191
202
|
private hasTransformableViewport;
|
|
192
203
|
private hasResizeReactiveNodes;
|
|
204
|
+
private boxRenderingTrigger;
|
|
205
|
+
/**
|
|
206
|
+
* specifies options for fundamental aspects of visualization
|
|
207
|
+
*/
|
|
193
208
|
setOptions(options: CoreOptions): CanvasBuilder;
|
|
209
|
+
/**
|
|
210
|
+
* enables nodes draggable bu user
|
|
211
|
+
*/
|
|
194
212
|
setUserDraggableNodes(options?: DragOptions): CanvasBuilder;
|
|
195
213
|
/**
|
|
196
214
|
* @deprecated
|
|
197
215
|
* use setUserTransformableViewport instead
|
|
198
216
|
*/
|
|
199
217
|
setUserTransformableCanvas(options?: TransformOptions): CanvasBuilder;
|
|
218
|
+
/**
|
|
219
|
+
* enables viewport transformable by user
|
|
220
|
+
*/
|
|
200
221
|
setUserTransformableViewport(options?: TransformOptions): CanvasBuilder;
|
|
222
|
+
/**
|
|
223
|
+
* enables automatic edges update on node resize
|
|
224
|
+
*/
|
|
201
225
|
setResizeReactiveNodes(): CanvasBuilder;
|
|
226
|
+
/**
|
|
227
|
+
* sets emitter for rendering graph inside bounded area
|
|
228
|
+
*/
|
|
229
|
+
setBoxRenderingTrigger(trigger: EventSubject<RenderingBox>): CanvasBuilder;
|
|
230
|
+
setVirtualScroll(options: VirtualScrollOptions): CanvasBuilder;
|
|
231
|
+
/**
|
|
232
|
+
* builds final canvas
|
|
233
|
+
*/
|
|
202
234
|
build(): Canvas;
|
|
203
235
|
}
|
|
204
236
|
export { CanvasBuilder }
|
|
@@ -208,12 +240,14 @@ export { CanvasBuilder as HtmlGraphBuilder }
|
|
|
208
240
|
* @deprecated
|
|
209
241
|
*/
|
|
210
242
|
export declare class CanvasCore implements Canvas {
|
|
211
|
-
readonly
|
|
212
|
-
readonly
|
|
243
|
+
readonly viewport: Viewport;
|
|
244
|
+
readonly transformation: Viewport;
|
|
245
|
+
readonly graph: Graph;
|
|
246
|
+
readonly model: Graph;
|
|
213
247
|
private readonly internalTransformation;
|
|
214
248
|
private readonly internalModel;
|
|
215
249
|
private readonly graphStoreController;
|
|
216
|
-
private readonly
|
|
250
|
+
private readonly htmlView;
|
|
217
251
|
private readonly onAfterNodeAdded;
|
|
218
252
|
private readonly onAfterEdgeAdded;
|
|
219
253
|
private readonly onAfterEdgeShapeUpdated;
|
|
@@ -224,7 +258,6 @@ export declare class CanvasCore implements Canvas {
|
|
|
224
258
|
private readonly onAfterNodeUpdated;
|
|
225
259
|
private readonly onBeforeEdgeRemoved;
|
|
226
260
|
private readonly onBeforeNodeRemoved;
|
|
227
|
-
private readonly onAfterTransformUpdate;
|
|
228
261
|
constructor(apiOptions?: CoreOptions_2);
|
|
229
262
|
attach(element: HTMLElement): CanvasCore;
|
|
230
263
|
detach(): CanvasCore;
|
|
@@ -380,11 +413,48 @@ declare type EdgeShapeFactory = () => EdgeShape;
|
|
|
380
413
|
|
|
381
414
|
declare type EdgeShapeFactory_2 = () => EdgeShape;
|
|
382
415
|
|
|
416
|
+
declare interface EventEmitter<T> {
|
|
417
|
+
emit(payload: T): void;
|
|
418
|
+
}
|
|
419
|
+
|
|
383
420
|
declare interface EventHandler<T> {
|
|
384
421
|
subscribe(callback: (payload: T) => void): void;
|
|
385
422
|
unsubscribe(callback: (payload: T) => void): void;
|
|
386
423
|
}
|
|
387
424
|
|
|
425
|
+
export declare class EventSubject<T> implements EventEmitter<T>, EventHandler<T> {
|
|
426
|
+
private readonly callbacks;
|
|
427
|
+
subscribe(callback: (payload: T) => void): void;
|
|
428
|
+
unsubscribe(callback: (payload: T) => void): void;
|
|
429
|
+
emit(payload: T): void;
|
|
430
|
+
}
|
|
431
|
+
|
|
432
|
+
/**
|
|
433
|
+
* This entity is responsible for providing access to end user in a safe way
|
|
434
|
+
*/
|
|
435
|
+
declare class Graph {
|
|
436
|
+
private readonly graphStore;
|
|
437
|
+
constructor(graphStore: GraphStore);
|
|
438
|
+
getNode(nodeId: unknown): GraphNode | null;
|
|
439
|
+
getAllNodeIds(): readonly unknown[];
|
|
440
|
+
getPort(portId: unknown): GraphPort | null;
|
|
441
|
+
getAllPortIds(): readonly unknown[];
|
|
442
|
+
getNodePortIds(nodeId: unknown): readonly unknown[] | null;
|
|
443
|
+
getPortNodeId(portId: unknown): unknown | null;
|
|
444
|
+
getAllEdgeIds(): readonly unknown[];
|
|
445
|
+
getEdge(edgeId: unknown): GraphEdge | null;
|
|
446
|
+
getPortIncomingEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
447
|
+
getPortOutcomingEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
448
|
+
getPortCycleEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
449
|
+
getPortAdjacentEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
450
|
+
getNodeIncomingEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
451
|
+
getNodeOutcomingEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
452
|
+
getNodeCycleEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
453
|
+
getNodeAdjacentEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
454
|
+
}
|
|
455
|
+
export { Graph }
|
|
456
|
+
export { Graph as PublicGraphStore }
|
|
457
|
+
|
|
388
458
|
export declare interface GraphEdge {
|
|
389
459
|
readonly from: unknown;
|
|
390
460
|
readonly to: unknown;
|
|
@@ -570,63 +640,38 @@ declare type Priority_2 = ConstantPriority_2 | IncrementalPriority_2 | SharedInc
|
|
|
570
640
|
|
|
571
641
|
export declare type PriorityFn = () => number;
|
|
572
642
|
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
constructor(graphStore: GraphStore);
|
|
579
|
-
getNode(nodeId: unknown): GraphNode | null;
|
|
580
|
-
getAllNodeIds(): readonly unknown[];
|
|
581
|
-
getPort(portId: unknown): GraphPort | null;
|
|
582
|
-
getAllPortIds(): readonly unknown[];
|
|
583
|
-
getNodePortIds(nodeId: unknown): readonly unknown[] | null;
|
|
584
|
-
getPortNodeId(portId: unknown): unknown | null;
|
|
585
|
-
getAllEdgeIds(): readonly unknown[];
|
|
586
|
-
getEdge(edgeId: unknown): GraphEdge | null;
|
|
587
|
-
getPortIncomingEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
588
|
-
getPortOutcomingEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
589
|
-
getPortCycleEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
590
|
-
getPortAdjacentEdgeIds(portId: unknown): readonly unknown[] | null;
|
|
591
|
-
getNodeIncomingEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
592
|
-
getNodeOutcomingEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
593
|
-
getNodeCycleEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
594
|
-
getNodeAdjacentEdgeIds(nodeId: unknown): readonly unknown[] | null;
|
|
595
|
-
}
|
|
596
|
-
|
|
597
|
-
/**
|
|
598
|
-
* This entity is responsible for providing viewport transformation state to the
|
|
599
|
-
* end user in a safe way
|
|
600
|
-
*/
|
|
601
|
-
export declare class PublicViewportTransformer {
|
|
602
|
-
private readonly transformer;
|
|
603
|
-
constructor(transformer: ViewportTransformer);
|
|
604
|
-
getViewportMatrix(): TransformState;
|
|
605
|
-
getContentMatrix(): TransformState;
|
|
643
|
+
export declare interface RenderingBox {
|
|
644
|
+
readonly x: number;
|
|
645
|
+
readonly y: number;
|
|
646
|
+
readonly width: number;
|
|
647
|
+
readonly height: number;
|
|
606
648
|
}
|
|
607
649
|
|
|
608
650
|
export declare class ResizeReactiveNodesCanvas implements Canvas {
|
|
609
651
|
private readonly canvas;
|
|
610
|
-
readonly
|
|
611
|
-
readonly
|
|
652
|
+
readonly viewport: Viewport;
|
|
653
|
+
readonly transformation: Viewport;
|
|
654
|
+
readonly graph: Graph;
|
|
655
|
+
readonly model: Graph;
|
|
612
656
|
private readonly nodes;
|
|
613
657
|
private readonly nodeIdGenerator;
|
|
614
658
|
private readonly nodesResizeObserver;
|
|
659
|
+
private readonly window;
|
|
615
660
|
constructor(canvas: Canvas);
|
|
616
|
-
attach(element: HTMLElement):
|
|
617
|
-
detach():
|
|
618
|
-
addNode(request: AddNodeRequest):
|
|
619
|
-
updateNode(nodeId: unknown, request?: UpdateNodeRequest):
|
|
620
|
-
removeNode(nodeId: unknown):
|
|
621
|
-
markPort(port: MarkPortRequest):
|
|
622
|
-
updatePort(portId: string, request?: UpdatePortRequest):
|
|
623
|
-
unmarkPort(portId: string):
|
|
624
|
-
addEdge(edge: AddEdgeRequest):
|
|
625
|
-
updateEdge(edgeId: unknown, request?: UpdateEdgeRequest):
|
|
626
|
-
removeEdge(edgeId: unknown):
|
|
627
|
-
patchViewportMatrix(request: PatchMatrixRequest):
|
|
628
|
-
patchContentMatrix(request: PatchMatrixRequest):
|
|
629
|
-
clear():
|
|
661
|
+
attach(element: HTMLElement): Canvas;
|
|
662
|
+
detach(): Canvas;
|
|
663
|
+
addNode(request: AddNodeRequest): Canvas;
|
|
664
|
+
updateNode(nodeId: unknown, request?: UpdateNodeRequest): Canvas;
|
|
665
|
+
removeNode(nodeId: unknown): Canvas;
|
|
666
|
+
markPort(port: MarkPortRequest): Canvas;
|
|
667
|
+
updatePort(portId: string, request?: UpdatePortRequest): Canvas;
|
|
668
|
+
unmarkPort(portId: string): Canvas;
|
|
669
|
+
addEdge(edge: AddEdgeRequest): Canvas;
|
|
670
|
+
updateEdge(edgeId: unknown, request?: UpdateEdgeRequest): Canvas;
|
|
671
|
+
removeEdge(edgeId: unknown): Canvas;
|
|
672
|
+
patchViewportMatrix(request: PatchMatrixRequest): Canvas;
|
|
673
|
+
patchContentMatrix(request: PatchMatrixRequest): Canvas;
|
|
674
|
+
clear(): Canvas;
|
|
630
675
|
destroy(): void;
|
|
631
676
|
private handleNodeResize;
|
|
632
677
|
}
|
|
@@ -714,6 +759,7 @@ export declare interface TransformOptions {
|
|
|
714
759
|
readonly scale?: {
|
|
715
760
|
readonly mouseWheelSensitivity?: number;
|
|
716
761
|
readonly mouseWheelEventVerifier?: (event: WheelEvent) => boolean;
|
|
762
|
+
readonly wheelFinishTimeout?: number;
|
|
717
763
|
};
|
|
718
764
|
readonly shift?: {
|
|
719
765
|
readonly cursor?: string | null;
|
|
@@ -782,8 +828,10 @@ export declare interface UpdatePortRequest {
|
|
|
782
828
|
|
|
783
829
|
export declare class UserDraggableNodesCanvas implements Canvas {
|
|
784
830
|
private readonly canvas;
|
|
785
|
-
readonly
|
|
786
|
-
readonly
|
|
831
|
+
readonly graph: Graph;
|
|
832
|
+
readonly model: Graph;
|
|
833
|
+
readonly viewport: Viewport;
|
|
834
|
+
readonly transformation: Viewport;
|
|
787
835
|
private maxNodePriority;
|
|
788
836
|
private readonly nodes;
|
|
789
837
|
private grabbedNodeId;
|
|
@@ -797,20 +845,20 @@ export declare class UserDraggableNodesCanvas implements Canvas {
|
|
|
797
845
|
private readonly window;
|
|
798
846
|
private readonly options;
|
|
799
847
|
constructor(canvas: Canvas, dragOptions?: DragOptions);
|
|
800
|
-
attach(element: HTMLElement):
|
|
801
|
-
detach():
|
|
802
|
-
addNode(request: AddNodeRequest):
|
|
803
|
-
updateNode(nodeId: unknown, request?: UpdateNodeRequest):
|
|
804
|
-
removeNode(nodeId: unknown):
|
|
805
|
-
markPort(port: MarkPortRequest):
|
|
806
|
-
updatePort(portId: string, request?: UpdatePortRequest):
|
|
807
|
-
unmarkPort(portId: string):
|
|
808
|
-
addEdge(edge: AddEdgeRequest):
|
|
809
|
-
updateEdge(edgeId: unknown, request?: UpdateEdgeRequest):
|
|
810
|
-
removeEdge(edgeId: unknown):
|
|
811
|
-
patchViewportMatrix(request: PatchMatrixRequest):
|
|
812
|
-
patchContentMatrix(request: PatchMatrixRequest):
|
|
813
|
-
clear():
|
|
848
|
+
attach(element: HTMLElement): Canvas;
|
|
849
|
+
detach(): Canvas;
|
|
850
|
+
addNode(request: AddNodeRequest): Canvas;
|
|
851
|
+
updateNode(nodeId: unknown, request?: UpdateNodeRequest): Canvas;
|
|
852
|
+
removeNode(nodeId: unknown): Canvas;
|
|
853
|
+
markPort(port: MarkPortRequest): Canvas;
|
|
854
|
+
updatePort(portId: string, request?: UpdatePortRequest): Canvas;
|
|
855
|
+
unmarkPort(portId: string): Canvas;
|
|
856
|
+
addEdge(edge: AddEdgeRequest): Canvas;
|
|
857
|
+
updateEdge(edgeId: unknown, request?: UpdateEdgeRequest): Canvas;
|
|
858
|
+
removeEdge(edgeId: unknown): Canvas;
|
|
859
|
+
patchViewportMatrix(request: PatchMatrixRequest): Canvas;
|
|
860
|
+
patchContentMatrix(request: PatchMatrixRequest): Canvas;
|
|
861
|
+
clear(): Canvas;
|
|
814
862
|
destroy(): void;
|
|
815
863
|
private dragNode;
|
|
816
864
|
private updateMaxNodePriority;
|
|
@@ -823,11 +871,14 @@ export declare class UserDraggableNodesCanvas implements Canvas {
|
|
|
823
871
|
|
|
824
872
|
declare class UserTransformableViewportCanvas implements Canvas {
|
|
825
873
|
private readonly canvas;
|
|
826
|
-
readonly
|
|
827
|
-
readonly
|
|
874
|
+
readonly graph: Graph;
|
|
875
|
+
readonly model: Graph;
|
|
876
|
+
readonly viewport: Viewport;
|
|
877
|
+
readonly transformation: Viewport;
|
|
828
878
|
private element;
|
|
829
879
|
private prevTouches;
|
|
830
880
|
private window;
|
|
881
|
+
private wheelFinishTimer;
|
|
831
882
|
private readonly onMouseDown;
|
|
832
883
|
private readonly onWindowMouseMove;
|
|
833
884
|
private readonly onWindowMouseUp;
|
|
@@ -838,20 +889,20 @@ declare class UserTransformableViewportCanvas implements Canvas {
|
|
|
838
889
|
private readonly observer;
|
|
839
890
|
private readonly options;
|
|
840
891
|
constructor(canvas: Canvas, transformOptions?: TransformOptions);
|
|
841
|
-
attach(element: HTMLElement):
|
|
842
|
-
detach():
|
|
843
|
-
addNode(node: AddNodeRequest):
|
|
844
|
-
updateNode(nodeId: unknown, request?: UpdateNodeRequest):
|
|
845
|
-
removeNode(nodeId: unknown):
|
|
846
|
-
markPort(port: MarkPortRequest):
|
|
847
|
-
updatePort(portId: string, request?: UpdatePortRequest):
|
|
848
|
-
unmarkPort(portId: string):
|
|
849
|
-
addEdge(edge: AddEdgeRequest):
|
|
850
|
-
updateEdge(edgeId: unknown, request?: UpdateEdgeRequest):
|
|
851
|
-
removeEdge(edgeId: unknown):
|
|
852
|
-
patchViewportMatrix(request: PatchMatrixRequest):
|
|
853
|
-
patchContentMatrix(request: PatchMatrixRequest):
|
|
854
|
-
clear():
|
|
892
|
+
attach(element: HTMLElement): Canvas;
|
|
893
|
+
detach(): Canvas;
|
|
894
|
+
addNode(node: AddNodeRequest): Canvas;
|
|
895
|
+
updateNode(nodeId: unknown, request?: UpdateNodeRequest): Canvas;
|
|
896
|
+
removeNode(nodeId: unknown): Canvas;
|
|
897
|
+
markPort(port: MarkPortRequest): Canvas;
|
|
898
|
+
updatePort(portId: string, request?: UpdatePortRequest): Canvas;
|
|
899
|
+
unmarkPort(portId: string): Canvas;
|
|
900
|
+
addEdge(edge: AddEdgeRequest): Canvas;
|
|
901
|
+
updateEdge(edgeId: unknown, request?: UpdateEdgeRequest): Canvas;
|
|
902
|
+
removeEdge(edgeId: unknown): Canvas;
|
|
903
|
+
patchViewportMatrix(request: PatchMatrixRequest): Canvas;
|
|
904
|
+
patchContentMatrix(request: PatchMatrixRequest): Canvas;
|
|
905
|
+
clear(): Canvas;
|
|
855
906
|
destroy(): void;
|
|
856
907
|
private moveViewport;
|
|
857
908
|
private scaleViewport;
|
|
@@ -859,6 +910,7 @@ declare class UserTransformableViewportCanvas implements Canvas {
|
|
|
859
910
|
private removeMouseDragListeners;
|
|
860
911
|
private stopTouchDrag;
|
|
861
912
|
private removeTouchDragListeners;
|
|
913
|
+
private performTransform;
|
|
862
914
|
}
|
|
863
915
|
export { UserTransformableViewportCanvas as UserTransformableCanvas }
|
|
864
916
|
export { UserTransformableViewportCanvas }
|
|
@@ -926,6 +978,19 @@ declare interface VerticalEdgeShape_3 {
|
|
|
926
978
|
readonly detourDirection?: number | undefined;
|
|
927
979
|
}
|
|
928
980
|
|
|
981
|
+
/**
|
|
982
|
+
* This entity is responsible for providing viewport transformation state to the
|
|
983
|
+
* end user in a safe way
|
|
984
|
+
*/
|
|
985
|
+
declare class Viewport {
|
|
986
|
+
private readonly transformer;
|
|
987
|
+
constructor(transformer: ViewportTransformer);
|
|
988
|
+
getViewportMatrix(): TransformState;
|
|
989
|
+
getContentMatrix(): TransformState;
|
|
990
|
+
}
|
|
991
|
+
export { Viewport as PublicViewportTransformer }
|
|
992
|
+
export { Viewport }
|
|
993
|
+
|
|
929
994
|
/**
|
|
930
995
|
* This entity is responsible for storing viewport transformation
|
|
931
996
|
*/
|
|
@@ -941,4 +1006,11 @@ declare class ViewportTransformer {
|
|
|
941
1006
|
patchContentMatrix(matrix: PatchTransformRequest): void;
|
|
942
1007
|
}
|
|
943
1008
|
|
|
1009
|
+
declare interface VirtualScrollOptions {
|
|
1010
|
+
readonly maxNodeContainingRadius: {
|
|
1011
|
+
readonly vertical: number;
|
|
1012
|
+
readonly horizontal: number;
|
|
1013
|
+
};
|
|
1014
|
+
}
|
|
1015
|
+
|
|
944
1016
|
export { }
|