/**
 * ConnectionSocket
 */
export declare enum ConnectionSocket {
    Back = 0,
    Front = 1
}
/**
 * ConnectionOptions
 */
export interface ConnectionOptions {
    sourceSocket?: ConnectionSocket;
    targetSocket?: ConnectionSocket;
    lineWidth?: number;
    color?: string;
    dashed?: boolean;
}
/**
 * ConnectDOM
 *
 * @whatItDoes
 *
 * This util is used to create connections between elements in the dom
 * The canvas for the connections must be set up in a specific container element
 *
 * @howToUse
 *
 * // create a new instance of ConnectDomCanvas
 * // it will create a canvas inside the given element with "pointer-events: none"
 * // to not interfere with your events and the canvas will always fit your element size
 * var connectCanvas = new ConnectDomCanvas("#connections-container");
 *
 * // clear previous connections made
 * connectCanvas.clear();
 *
 * // add a connection for two elements
 * // optionally you can define connection options. EX:
 * // var options = {
 * //   sourceSocket: ConnectDOMSocket.FRONT, // side where the connection will come out from source element
 * //   targetSocket: ConnectDOMSocket.BACK, // side where the connection will come in to target element
 * //   lineWidth: 4,
 * //   color: "rgb(255,0,0)"
 * //   dashed: true
 * // }
 * connectCanvas.connect("css_selector_for_source_element", "css_selector_for_target_element", options);
 *
 * // then just draw all the connections
 * connectCanvas.draw();
 *
 * // to redraw other connections just follow the same sequence
 * connectCanvas.clear();
 * connectCanvas.connect(...);
 * connectCanvas.connect(...);
 * (...)
 * connectCanvas.draw();
 *
 * IMPORTANT NOTE 01: Whenever any element connected changes its size or position the canvas must be redrawn
 * (call: 'connectCanvas.draw()'), otherwise the connections will be in misplaced positions
 * IMPORTANT NOTE 02: As the canvas fits the container element, when the container is resized the canvas must also be
 * redrawn (call: 'connectCanvas.draw()') , otherwise it will be stretched out and the connections will be in misplaced positions
 *
 * Also, note that, redrawing the canvas is not an expensive task for the browser. Actually it is very light in terms of performance.
 * You probably only need to reduce the times you call the draw() method when the number of elements connected is ver high
 */
export declare class ConnectDOMCanvas {
    private selector;
    private element;
    private canvas;
    private connectionOffset;
    private connections;
    /**
     * Constructor
     * @param selector the container selector
     * @param connectionOffset connections offset
     * @param zIndex the canvas z-index
     */
    constructor(selector: string, zIndex: number, connectionOffset?: number);
    /**
     * Get element connection point
     */
    private getElementConnectionPoint;
    /**
     * Connects two dom elements
     * @param sourceSelector source selector
     * @param targetSelector target selector
     * @param options the connection options
     */
    connect(sourceSelector: string, targetSelector: string, options: ConnectionOptions): void;
    /**
     * Clear connections
     */
    clear(): void;
    /**
     * Draw canvas
     */
    draw(): void;
    /**
     * Destroy instance
     */
    destroy(): void;
}