import * as i0 from '@angular/core'; import { EventEmitter, ElementRef, NgZone, OnInit, OnChanges, OnDestroy, AfterViewInit, ChangeDetectorRef, TemplateRef, QueryList, SimpleChanges } from '@angular/core'; import * as i4 from '@angular/common'; import { Observable, Subscription, Subject } from 'rxjs'; import * as d3_scale from 'd3-scale'; import { Layout as Layout$1, ID3StyleLayoutAdaptor, Group, InputNode, Link } from 'webcola'; interface NodePosition { x: number; y: number; } interface NodeDimension { width: number; height: number; } interface Node { id: string; position?: NodePosition; dimension?: NodeDimension; transform?: string; label?: string; data?: any; meta?: any; layoutOptions?: any; parentId?: string; hidden?: boolean; } interface ClusterNode extends Node { childNodeIds?: string[]; } interface CompoundNode extends Node { childNodeIds?: string[]; } interface Edge { id?: string; source: string; target: string; label?: string; data?: any; points?: any; line?: string; textTransform?: string; textAngle?: number; oldLine?: any; oldTextPath?: string; textPath?: string; midPoint?: NodePosition; } interface Graph { edges: Edge[]; nodes: Node[]; compoundNodes?: CompoundNode[]; clusters?: ClusterNode[]; edgeLabels?: any; } interface Layout { settings?: any; run(graph: Graph): Graph | Observable; updateEdge(graph: Graph, edge: Edge): Graph | Observable; onDragStart?(draggingNode: Node, $event: MouseEvent): void; onDrag?(draggingNode: Node, $event: MouseEvent): void; onDragEnd?(draggingNode: Node, $event: MouseEvent): void; } declare class LayoutService { getLayout(name: string): Layout; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } declare enum PanningAxis { Both = "both", Horizontal = "horizontal", Vertical = "vertical" } declare enum MiniMapPosition { UpperLeft = "UpperLeft", UpperRight = "UpperRight" } declare class ColorHelper { scale: any; colorDomain: any[]; domain: any; customColors: any; constructor(scheme: any, domain: any, customColors?: any); generateColorScheme(scheme: any, domain: any): d3_scale.ScaleOrdinal; getColor(value: any): any; } interface ViewDimensions { width: number; height: number; } /** * Visibility Observer */ declare class VisibilityObserver { private element; private zone; visible: EventEmitter; timeout: any; isVisible: boolean; constructor(element: ElementRef, zone: NgZone); destroy(): void; onVisibilityChange(): void; runCheck(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * Matrix */ interface Matrix { a: number; b: number; c: number; d: number; e: number; f: number; } interface NgxGraphZoomOptions { autoCenter?: boolean; force?: boolean; } declare enum NgxGraphStates { Init = "init", Subscribe = "subscribe", Transform = "transform", Output = "output" } interface NgxGraphStateChangeEvent { state: NgxGraphStates; } declare class GraphComponent implements OnInit, OnChanges, OnDestroy, AfterViewInit { private el; zone: NgZone; cd: ChangeDetectorRef; private layoutService; nodes: Node[]; clusters: ClusterNode[]; compoundNodes: CompoundNode[]; links: Edge[]; activeEntries: any[]; curve: any; draggingEnabled: boolean; nodeHeight: number; nodeMaxHeight: number; nodeMinHeight: number; nodeWidth: number; nodeMinWidth: number; nodeMaxWidth: number; panningEnabled: boolean; panningAxis: PanningAxis; enableZoom: boolean; zoomSpeed: number; minZoomLevel: number; maxZoomLevel: number; autoZoom: boolean; panOnZoom: boolean; animate?: boolean; autoCenter: boolean; update$: Observable; center$: Observable; zoomToFit$: Observable; panToNode$: Observable; layout: string | Layout; layoutSettings: any; enableTrackpadSupport: boolean; showMiniMap: boolean; miniMapMaxWidth: number; miniMapMaxHeight: number; miniMapPosition: MiniMapPosition; view: [number, number]; scheme: any; customColors: any; deferDisplayUntilPosition: boolean; centerNodesOnPositionChange: boolean; enablePreUpdateTransform: boolean; select: EventEmitter; activate: EventEmitter; deactivate: EventEmitter; zoomChange: EventEmitter; clickHandler: EventEmitter; stateChange: EventEmitter; linkTemplate: TemplateRef; nodeTemplate: TemplateRef; clusterTemplate: TemplateRef; defsTemplate: TemplateRef; miniMapNodeTemplate: TemplateRef; nodeElements: QueryList; linkElements: QueryList; chartWidth: any; private isMouseMoveCalled; graphSubscription: Subscription; colors: ColorHelper; dims: ViewDimensions; seriesDomain: any; transform: string; isPanning: boolean; isDragging: boolean; draggingNode: Node; initialized: boolean; graph: Graph; graphDims: any; _oldLinks: Edge[]; oldNodes: Set; oldClusters: Set; oldCompoundNodes: Set; transformationMatrix: Matrix; _touchLastX: any; _touchLastY: any; minimapScaleCoefficient: number; minimapTransform: string; minimapOffsetX: number; minimapOffsetY: number; isMinimapPanning: boolean; minimapClipPathId: string; width: number; height: number; resizeSubscription: any; visibilityObserver: VisibilityObserver; private destroy$; constructor(el: ElementRef, zone: NgZone, cd: ChangeDetectorRef, layoutService: LayoutService); groupResultsBy: (node: any) => string; /** * Get the current zoom level */ get zoomLevel(): number; /** * Set the current zoom level */ set zoomLevel(level: number); /** * Get the current `x` position of the graph */ get panOffsetX(): number; /** * Set the current `x` position of the graph */ set panOffsetX(x: number); /** * Get the current `y` position of the graph */ get panOffsetY(): number; /** * Set the current `y` position of the graph */ set panOffsetY(y: number); /** * Angular lifecycle event * * * @memberOf GraphComponent */ ngOnInit(): void; ngOnChanges(changes: SimpleChanges): void; setLayout(layout: string | Layout): void; setLayoutSettings(settings: any): void; /** * Angular lifecycle event * * * @memberOf GraphComponent */ ngOnDestroy(): void; /** * Angular lifecycle event * * * @memberOf GraphComponent */ ngAfterViewInit(): void; /** * Base class update implementation for the dag graph * * @memberOf GraphComponent */ update(): void; /** * Creates the dagre graph engine * * @memberOf GraphComponent */ createGraph(): void; /** * Draws the graph using dagre layouts * * * @memberOf GraphComponent */ draw(): void; tick(): void; getMinimapTransform(): string; updateGraphDims(): void; updateMinimap(): void; /** * Measures the node element and applies the dimensions * * @memberOf GraphComponent */ applyNodeDimensions(): void; /** * Redraws the lines when dragged or viewport updated * * @memberOf GraphComponent */ redrawLines(_animate?: boolean): void; /** * Calculate the text directions / flipping * * @memberOf GraphComponent */ calcDominantBaseline(link: any): void; /** * Generate the new line path * * @memberOf GraphComponent */ generateLine(points: any): any; /** * Zoom was invoked from event * * @memberOf GraphComponent */ onZoom($event: WheelEvent, direction: string): void; /** * Pan by x/y * * @param x * @param y */ pan(x: number, y: number, ignoreZoomLevel?: boolean): void; /** * Pan to a fixed x/y * */ panTo(x: number, y: number): void; /** * Zoom by a factor * */ zoom(factor: number): void; /** * Zoom to a fixed level * */ zoomTo(level: number): void; /** * Drag was invoked from an event * * @memberOf GraphComponent */ onDrag(event: MouseEvent): void; redrawEdge(edge: Edge): void; /** * Update the entire view for the new pan position * * * @memberOf GraphComponent */ updateTransform(): void; /** * Node was clicked * * * @memberOf GraphComponent */ onClick(event: any): void; /** * Node was focused * * * @memberOf GraphComponent */ onActivate(event: any): void; /** * Node was defocused * * @memberOf GraphComponent */ onDeactivate(event: any): void; /** * Get the domain series for the nodes * * @memberOf GraphComponent */ getSeriesDomain(): any[]; /** * Tracking for the link * * * @memberOf GraphComponent */ trackLinkBy(index: number, link: Edge): any; /** * Tracking for the node * * * @memberOf GraphComponent */ trackNodeBy(index: number, node: Node): any; /** * Sets the colors the nodes * * * @memberOf GraphComponent */ setColors(): void; /** * On mouse move event, used for panning and dragging. * * @memberOf GraphComponent */ onMouseMove($event: MouseEvent): void; onMouseDown(event: MouseEvent): void; graphClick(event: MouseEvent): void; /** * On touch start event to enable panning. * * @memberOf GraphComponent */ onTouchStart(event: any): void; /** * On touch move event, used for panning. * */ onTouchMove($event: any): void; /** * On touch end event to disable panning. * * @memberOf GraphComponent */ onTouchEnd(): void; /** * On mouse up event to disable panning/dragging. * * @memberOf GraphComponent */ onMouseUp(event: MouseEvent): void; /** * On node mouse down to kick off dragging * * @memberOf GraphComponent */ onNodeMouseDown(event: MouseEvent, node: any): void; /** * On minimap drag mouse down to kick off minimap panning * * @memberOf GraphComponent */ onMinimapDragMouseDown(): void; /** * On minimap pan event. Pans the graph to the clicked position * * @memberOf GraphComponent */ onMinimapPanTo(event: MouseEvent): void; /** * Center the graph in the viewport */ center(): void; /** * Zooms to fit the entire graph */ zoomToFit(zoomOptions?: NgxGraphZoomOptions): void; /** * Pans to the node * @param nodeId */ panToNodeId(nodeId: string): void; getCompoundNodeChildren(ids: Array): Node[]; private panWithConstraints; private updateMidpointOnEdge; private _calcMidPointElk; basicUpdate(): void; getContainerDims(): any; /** * Checks if the graph has dimensions */ hasGraphDims(): boolean; /** * Checks if all nodes have dimension */ hasNodeDims(): boolean; /** * Checks if all compound nodes have dimension */ hasCompoundNodeDims(): boolean; /** * Checks if all clusters have dimension */ hasClusterDims(): boolean; /** * Checks if the graph and all nodes have dimension. */ hasDims(): boolean; protected unbindEvents(): void; private bindWindowResizeEvent; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } /** * Mousewheel directive * https://github.com/SodhanaLibrary/angular2-examples/blob/master/app/mouseWheelDirective/mousewheel.directive.ts * * @export */ declare class MouseWheelDirective { mouseWheelUp: EventEmitter; mouseWheelDown: EventEmitter; onMouseWheelChrome(event: any): void; onMouseWheelFirefox(event: any): void; onWheel(event: any): void; onMouseWheelIE(event: any): void; mouseWheelFunc(event: any): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } declare class GraphModule { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵmod: i0.ɵɵNgModuleDeclaration; static ɵinj: i0.ɵɵInjectorDeclaration; } declare class NgxGraphModule { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵmod: i0.ɵɵNgModuleDeclaration; static ɵinj: i0.ɵɵInjectorDeclaration; } interface ColaForceDirectedSettings { force?: Layout$1 & ID3StyleLayoutAdaptor; forceModifierFn?: (force: Layout$1 & ID3StyleLayoutAdaptor) => Layout$1 & ID3StyleLayoutAdaptor; onTickListener?: (internalGraph: ColaGraph) => void; viewDimensions?: ViewDimensions; } interface ColaGraph { groups: Group[]; nodes: InputNode[]; links: Array>; } declare function toNode(nodes: InputNode[], nodeRef: InputNode | number): InputNode; declare class ColaForceDirectedLayout implements Layout { defaultSettings: ColaForceDirectedSettings; settings: ColaForceDirectedSettings; inputGraph: Graph; outputGraph: Graph; internalGraph: ColaGraph & { groupLinks?: Edge[]; }; outputGraph$: Subject; draggingStart: { x: number; y: number; }; run(graph: Graph): Observable; updateEdge(graph: Graph, edge: Edge): Observable; internalGraphToOutputGraph(internalGraph: any): Graph; onDragStart(draggingNode: Node, $event: MouseEvent): void; onDrag(draggingNode: Node, $event: MouseEvent): void; onDragEnd(draggingNode: Node, $event: MouseEvent): void; } interface D3ForceDirectedSettings { force?: any; forceLink?: any; } interface D3Node { id?: string; x: number; y: number; width?: number; height?: number; fx?: number; fy?: number; } interface D3Edge { source: string | D3Node; target: string | D3Node; midPoint: NodePosition; } interface D3Graph { nodes: D3Node[]; edges: D3Edge[]; } interface MergedNode extends D3Node, Node { id: string; } declare function toD3Node(maybeNode: string | D3Node): D3Node; declare class D3ForceDirectedLayout implements Layout { defaultSettings: D3ForceDirectedSettings; settings: D3ForceDirectedSettings; inputGraph: Graph; outputGraph: Graph; d3Graph: D3Graph; outputGraph$: Subject; draggingStart: { x: number; y: number; }; run(graph: Graph): Observable; updateEdge(graph: Graph, edge: Edge): Observable; d3GraphToOutputGraph(d3Graph: D3Graph): Graph; onDragStart(draggingNode: Node, $event: MouseEvent): void; onDrag(draggingNode: Node, $event: MouseEvent): void; onDragEnd(draggingNode: Node, $event: MouseEvent): void; } declare enum Orientation { LEFT_TO_RIGHT = "LR", RIGHT_TO_LEFT = "RL", TOP_TO_BOTTOM = "TB", BOTTOM_TO_TOM = "BT" } declare enum Alignment { CENTER = "C", UP_LEFT = "UL", UP_RIGHT = "UR", DOWN_LEFT = "DL", DOWN_RIGHT = "DR" } interface DagreSettings { orientation?: Orientation; marginX?: number; marginY?: number; edgePadding?: number; rankPadding?: number; nodePadding?: number; align?: Alignment; acyclicer?: 'greedy' | undefined; ranker?: 'network-simplex' | 'tight-tree' | 'longest-path'; multigraph?: boolean; compound?: boolean; } declare class DagreLayout implements Layout { defaultSettings: DagreSettings; settings: DagreSettings; dagreGraph: any; dagreNodes: any; dagreEdges: any; run(graph: Graph): Graph; updateEdge(graph: Graph, edge: Edge): Graph; createDagreGraph(graph: Graph): any; } declare class DagreClusterLayout implements Layout { defaultSettings: DagreSettings; settings: DagreSettings; dagreGraph: any; dagreNodes: Node[]; dagreClusters: ClusterNode[]; dagreEdges: any; run(graph: Graph): Graph; updateEdge(graph: Graph, edge: Edge): Graph; createDagreGraph(graph: Graph): any; } interface DagreNodesOnlySettings extends DagreSettings { curveDistance?: number; } declare class DagreNodesOnlyLayout implements Layout { defaultSettings: DagreNodesOnlySettings; settings: DagreNodesOnlySettings; dagreGraph: any; dagreNodes: any; dagreEdges: any; run(graph: Graph): Graph; updateEdge(graph: Graph, edge: Edge): Graph; createDagreGraph(graph: Graph): any; } export { Alignment, ColaForceDirectedLayout, D3ForceDirectedLayout, DagreClusterLayout, DagreLayout, DagreNodesOnlyLayout, GraphComponent, GraphModule, LayoutService, MiniMapPosition, MouseWheelDirective, NgxGraphModule, NgxGraphStates, Orientation, PanningAxis, toD3Node, toNode }; export type { ClusterNode, ColaForceDirectedSettings, ColaGraph, CompoundNode, D3Edge, D3ForceDirectedSettings, D3Graph, D3Node, DagreNodesOnlySettings, DagreSettings, Edge, Graph, Layout, Matrix, MergedNode, NgxGraphStateChangeEvent, NgxGraphZoomOptions, Node, NodeDimension, NodePosition };