import { ElementRef, EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy } from '@angular/core';
import { CurveFactory } from 'd3-shape';
import { Observable } from 'rxjs';
import { DefsTemplateDirective, EdgeTemplateDirective, NodeTemplateDirective } from './templates';
import { GraphDirection } from './models/graph-direction.model';
import { TransformedEdge } from './models/transformed-edge.model';
import { TransformedNode } from './models/transformed-node.model';
import * as i0 from "@angular/core";
export declare class GraphyComponent<N, E> implements AfterViewInit, OnDestroy {
    private el;
    private cd;
    /**
     * The D3 curve used for defining the shape of edges (from `'d3-shape'` library). Available
     * options can be found at: https://github.com/d3/d3-shape/blob/main/README.md#curves.
     */
    curve: CurveFactory;
    /** Whether to enable zooming. */
    enableZooming: boolean;
    /** Whether to enable panning. */
    enablePanning: boolean;
    /** The speed of zooming in/out, if zoom is enabled. */
    zoomSpeed: number;
    /** Whether to reverse the zoom direction, if zoom is enabled. */
    invertZoomDirection: boolean;
    /** Whether to center the graph on any input changes to nodes or edges. */
    centerOnChanges: boolean;
    /**
     * The direction of the graph layout. For example, using `GraphOrientation.LEFT_TO_RIGHT` in an
     * acyclic graph will cause edges to point from the left to the right.
     */
    direction: GraphDirection;
    /** Number of pixels to use as a margin around the left and right of the graph. */
    marginX: number;
    /** Number of pixels to use as a margin around the top and bottom of the graph. */
    marginY: number;
    /** The width of the graph (eg. `'600px'`). */
    get width(): string;
    set width(value: string);
    _width: string;
    /** The height of the graph (eg. `'600px'`). */
    get height(): string;
    set height(value: string);
    _height: string;
    /** Event emitted when centering the graph. */
    readonly onCenter: EventEmitter<void>;
    /** Event emitted when zooming in/out of the graph. */
    readonly onZoom: EventEmitter<void>;
    /** Event emitted when the graph is being panned. */
    readonly onPan: EventEmitter<void>;
    /** Event emitted when graph is initially rendered and on any subsequent re-renders. */
    readonly onRender: EventEmitter<void>;
    /** The array of nodes to display, along with additional layout information. */
    transformedNodes: TransformedNode<N>[];
    /** The array of edges to display, along with additional layout information. */
    transformedEdges: TransformedEdge<E>[];
    /** Subject that emits when the component has been destroyed. */
    private readonly _onDestroy$;
    /** The dimensions of the container SVG view box. */
    private _viewBox$;
    /** The SVG view box in a format that can be bound to in the template. */
    readonly _stringifiedViewBox$: Observable<string>;
    /** The structural directive that holds the template for SVG defs. */
    readonly _defsTemplate: DefsTemplateDirective;
    /** The structural directive that holds the template for edges. */
    readonly _edgeTemplate: EdgeTemplateDirective<E>;
    /** The structural directive that holds the template for nodes. */
    readonly _nodeTemplate: NodeTemplateDirective<N>;
    /** Reference to the SVG container element. */
    private readonly _graphContainer;
    /** Reference to the nodes container element. */
    private readonly _nodesContainer;
    /** Reference to the individual node elements. */
    private readonly _nodeElements;
    /** The current dimensions of the container SVG view box. */
    private get _viewBox();
    /** The array of nodes to display in the graph. */
    private get _inputNodes();
    /** The array of edges to display in the graph. */
    private get _inputEdges();
    /** The curve interpolation function for edge lines. */
    private get _curveInterpolationFn();
    constructor(el: ElementRef<HTMLElement>, cd: ChangeDetectorRef);
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    /** Render the input nodes and edges into the SVG container. */
    renderGraph(): void;
    /** Pan horizontally and vertically by given pixel deltas. */
    pan(deltaX: number, deltaY: number): void;
    /** Pan horizontally by a given pixel delta. */
    panX(deltaX: number): void;
    /** Pan vertically by a given pixel delta. */
    panY(deltaY: number): void;
    /** Pan to a specific x, y coordinate. */
    panToCoordinates(x: number, y: number): void;
    /** Zoom by a factor. */
    zoom(factor: number): void;
    /** Pan to get the center point of the nodes in the middle of the view box. */
    center(): void;
    /** Tracking function for nodes and edges. */
    _trackById(_index: number, object: TransformedNode<N> | TransformedEdge<E>): string;
    /** Update the SVG container view box. */
    private _updateViewBox;
    /** Set width/height of the view box container to match the dimensions of the host element. */
    private _resetViewBoxDimensions;
    /** Create the Dagre graph object using the user-defined config, edges, and nodes. */
    private _createDagreGraph;
    /** Get an input node by its ID. */
    private _getInputNode;
    /** Get an input edge by its source ID and target ID. */
    private _getInputEdge;
    /** Render nodes with `visibility: hidden` CSS attribute. */
    private _renderNodesOffscreen;
    /** Get the dimensions of a node element. */
    private _getNodeDimensions;
    /** Listen for zoom events and update the view box accordingly. */
    private _registerZoomListener;
    /** Listen for panning events and update the view box accordingly. */
    private _registerPanningListener;
    /** Get the X and Y coordinates from a `MouseEvent` in the SVG container. */
    private _getPointFromEvent;
    /** Listen for when graph is rendered/re-rendered and center the graph. */
    private _registerCenterListener;
    static ɵfac: i0.ɵɵFactoryDeclaration<GraphyComponent<any, any>, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<GraphyComponent<any, any>, "graphy-ng", never, { "curve": "curve"; "enableZooming": "enableZooming"; "enablePanning": "enablePanning"; "zoomSpeed": "zoomSpeed"; "invertZoomDirection": "invertZoomDirection"; "centerOnChanges": "centerOnChanges"; "direction": "direction"; "marginX": "marginX"; "marginY": "marginY"; "width": "width"; "height": "height"; }, { "onCenter": "onCenter"; "onZoom": "onZoom"; "onPan": "onPan"; "onRender": "onRender"; }, ["_defsTemplate", "_edgeTemplate", "_nodeTemplate"], ["*"]>;
}