import * as React from "react";
import { MathInputI18nContext } from "../i18n-context";
import type { KeypadAPI, KeypadContextType } from "../../types";
type Props = {
    keypadElement?: KeypadAPI;
    ariaLabel: string;
    onBlur: () => void;
    onChange: (value: string, callback: any) => void;
    onFocus: () => void;
    style: any;
    value: string;
};
type DefaultProps = {
    style: Props["style"];
    value: Props["value"];
};
type HandleState = {
    animateIntoPosition?: boolean;
    visible: boolean;
    x?: number;
    y?: number;
};
type State = {
    focused: boolean;
    handle: HandleState;
    showInputFocusStyle: boolean;
};
declare class MathInput extends React.Component<Props, State> {
    static contextType: React.Context<{
        strings: import("../../strings").MathInputStrings;
        locale: string;
    }>;
    context: React.ContextType<typeof MathInputI18nContext>;
    didTouchOutside: boolean | null | undefined;
    didScroll: boolean | null | undefined;
    mathField: any;
    recordTouchStartOutside: (e: any) => void;
    blurOnTouchEndOutside: (e: any) => void;
    blurOnClickOutside: (e: any) => void;
    dragListener: any;
    inputRef: HTMLDivElement | null | undefined;
    _isMounted: boolean | null | undefined;
    _mathContainer: any;
    _container: HTMLDivElement;
    _root: any;
    _containerBounds: ClientRect;
    static defaultProps: DefaultProps;
    state: State;
    componentDidMount(): void;
    componentDidUpdate(prevProps: Props, prevState: State): void;
    componentWillUnmount(): void;
    _updateInputPadding: () => void;
    /** Returns the current bounds of the keypadElement */
    _getKeypadBounds(): DOMRect | null;
    _updateCursorHandle: (animateIntoPosition?: boolean) => void;
    _hideCursorHandle: () => void;
    _handleScroll: () => void;
    blur: () => void;
    focus: (setKeypadActive: KeypadContextType["setKeypadActive"]) => void;
    /**
     * Tries to determine which DOM node to place the cursor next to based on
     * where the user drags the cursor handle.  If it finds a node it will
     * place the cursor next to it, update the handle to be under the cursor,
     * and return true.  If it doesn't find a node, it returns false.
     *
     * It searches for nodes by doing it tests at the following points:
     *
     *   (x - dx, y), (x, y), (x + dx, y)
     *
     * If it doesn't find any nodes from the rendered math it will update y
     * by adding dy.
     *
     * The algorithm ends its search when y goes outside the bounds of
     * containerBounds.
     *
     * @param {DOMRect} containerBounds - bounds of the container node
     * @param {number} x - the initial x coordinate in the viewport
     * @param {number} y - the initial y coordinate in the viewport
     * @param {number} dx - horizontal spacing between elementFromPoint calls
     * @param {number} dy - vertical spacing between elementFromPoint calls,
     *                      sign determines direction.
     * @returns {boolean} - true if a node was hit, false otherwise.
     */
    _findHitNode(containerBounds: ClientRect, x: number, y: number, dx: number, dy: number): boolean;
    /**
     * Inserts the cursor at the DOM node closest to the given coordinates,
     * based on hit-tests conducted using #_findHitNode.
     *
     * @param {number} x - the x coordinate in the viewport
     * @param {number} y - the y coordinate in the viewport
     */
    _insertCursorAtClosestNode(x: number, y: number): void;
    handleTouchStart: (e: React.TouchEvent<Element>, keypadActive: KeypadContextType["keypadActive"], setKeypadActive: KeypadContextType["setKeypadActive"]) => void;
    handleClick: (e: React.MouseEvent, keypadActive: KeypadContextType["keypadActive"], setKeypadActive: KeypadContextType["setKeypadActive"]) => void;
    handleTouchMove: (e: React.TouchEvent<Element>) => void;
    handleTouchEnd: (e: React.TouchEvent<Element>) => void;
    /**
     * When a touch starts in the cursor handle, we track it so as to avoid
     * handling any touch events ourself.
     *
     * @param {TouchEvent} e - the raw touch event from the browser
     */
    onCursorHandleTouchStart: (e: React.TouchEvent<HTMLSpanElement>) => void;
    _constrainToBound(value: number, min: number, max: number, friction: number): number;
    /**
     * When the user moves the cursor handle update the position of the cursor
     * and the handle.
     *
     * @param {TouchEvent} e - the raw touch event from the browser
     */
    onCursorHandleTouchMove: (e: React.TouchEvent<HTMLSpanElement>) => void;
    /**
     * When the user releases the cursor handle, animate it back into place.
     *
     * @param {TouchEvent} e - the raw touch event from the browser
     */
    onCursorHandleTouchEnd: (e: React.TouchEvent<HTMLSpanElement>) => void;
    /**
     * If the gesture is cancelled mid-drag, simply hide it.
     *
     * @param {TouchEvent} e - the raw touch event from the browser
     */
    onCursorHandleTouchCancel: (e: React.TouchEvent<HTMLSpanElement>) => void;
    domKeyToMathQuillKey: (key: string) => string | null | undefined;
    handleKeyUp: (e: React.KeyboardEvent<HTMLDivElement>) => void;
    getBorderWidthPx: () => number;
    getInputInnerPadding: () => {
        paddingTop: number;
        paddingRight: number;
        paddingBottom: number;
        paddingLeft: number;
    };
    render(): React.ReactNode;
}
export default MathInput;
