import React from "react";
export declare type ShapeDirection = "r2l" | "l2r" | "l2l" | "r2r" | "b2t" | "b2b" | "t2t" | "t2b";
export interface Props extends React.SVGProps<SVGPathElement> {
    el1: HTMLDivElement;
    el2: HTMLDivElement;
    shape: "s" | "line" | "narrow-s";
    direction?: ShapeDirection;
    grids?: number;
    stem?: number;
    roundCorner?: boolean;
    stroke?: string;
    strokeWidth?: number;
    minStep?: number;
    startArrow?: boolean;
    endArrow?: boolean;
    arrowSize?: number;
}
export interface Point {
    x: number;
    y: number;
}
export interface ShapeConnectorProps extends React.SVGProps<SVGPathElement> {
    startPoint: Point;
    endPoint: Point;
    stroke?: string;
    strokeWidth?: number;
    startArrow?: boolean;
    endArrow?: boolean;
    arrowSize?: number;
}
/**
 * Connect elements with svg paths
 * @param el1 first element (HTML or React component)
 * @param el2 second element (HTML or React component)
 * @param shape s | line | narrow-s
 * @param direction (right, left, top, bottom) --> (right, left, top, bottom) if shape is narrow-s
 * @param grid number of columns in X/Y axis from the start point to the end point
 * @param stem min distance from the start point to the first transition
 * @param minStep radius of the transition curve, default is min of (deltaX/grid, deltaY/grid)
 * @param roundCorner true to have a curve transition
 * @param stroke color of the svg path
 * @param strokeWidth width of the svg path
 * @param startArrow true to have an arrow at the start point (not applicable for s shape)
 * @param endArrow true to have an arrow at the end point (not applicable for s shape)
 * @param arrowSize size of arrows
 */
export default function SvgConnector(props: Props): JSX.Element | null;
//# sourceMappingURL=SvgConnector.d.ts.map