import * as React from "react";
import type { FormHostMembers } from "../hostContext";
export declare const sketchDialogClasses: {
    canvasContainer: string;
    canvasScroller: string;
    drawingCanvas: string;
    highlightCanvas: string;
    size: string;
    titleText: string;
};
export type HistoryItem = DrawingHistoryItem | ImageHistoryItem;
/**
 * A history item for the end user drawing a line on the dialog.
 */
type DrawingHistoryItem = {
    /** The style for the ends of the line. */
    lineCap: CanvasLineCap;
    /** The thickness of the line. */
    lineWidth: number;
    /** The points that comprise the line. */
    points: Point[];
    /** The style used to draw the line. This is typically a colour. */
    strokeStyle: string | CanvasGradient | CanvasPattern;
    /** The tool used to draw the line. This determines which canvas the line is drawn onto. */
    tool: ToolType;
};
/**
 * A history item for re-editing an existing sketch.
 * This replaces the `DrawingHistoryItem` entries from the initial editing of the form.
 */
type ImageHistoryItem = {
    /** A data url representing the previous annotations.  */
    dataUrl: string;
    /** The pen tool is specified here to ensure the image is drawn on the correct canvas. */
    tool: "pen";
};
export interface SketchDialogResult {
    dataUrl: string;
    height: number;
    history: HistoryItem[];
    width: number;
}
interface StyledDialogProps {
    dataUrl: string | undefined;
    height: number | undefined;
    history: HistoryItem[];
    host: FormHostMembers;
    onClose: (confirm: boolean, result?: SketchDialogResult) => void;
    source: string;
    title: React.JSX.Element | null;
    width: number | undefined;
}
/**
 * The type of tool being used to draw on the image.
 */
type ToolType = "pen" | "highlighter";
type Point = {
    x: number;
    y: number;
};
declare const SketchDialog: ({ dataUrl, height, history: previousHistory, host, onClose, source, title, width, }: StyledDialogProps) => React.JSX.Element;
export default SketchDialog;