import * as React from "react";
import type { Coords, MarkingsType, PerseusImageBackground } from "@khanacademy/perseus-core";
type Props = {
    editableSettings: ReadonlyArray<"canvas" | "graph" | "snap" | "image" | "measure">;
    box: readonly number[];
    labels: readonly string[];
    range: Coords;
    step: [number, number];
    gridStep: [number, number];
    snapStep: [number, number];
    valid: boolean;
    backgroundImage: PerseusImageBackground;
    markings: MarkingsType;
    showProtractor?: boolean;
    showRuler?: boolean;
    showTooltips?: boolean;
    rulerLabel: string;
    rulerTicks: number;
    onChange: (values: Record<string, unknown>) => void;
};
type DefaultProps = {
    editableSettings: Props["editableSettings"];
    box: Props["box"];
    labels: Props["labels"];
    range: Props["range"];
    step: Props["step"];
    gridStep: Props["gridStep"];
    snapStep: Props["snapStep"];
    valid: Props["valid"];
    backgroundImage: Props["backgroundImage"];
    markings: Props["markings"];
    rulerLabel: Props["rulerLabel"];
    rulerTicks: Props["rulerTicks"];
    showProtractor?: Props["showProtractor"];
    showRuler?: Props["showRuler"];
    showTooltips?: Props["showTooltips"];
};
type State = {
    labelsTextbox: readonly string[];
    gridStepTextbox: number[];
    snapStepTextbox: number[];
    stepTextbox: number[];
    rangeTextbox: [number, number][];
    backgroundImage: PerseusImageBackground;
};
declare class GraphSettings extends React.Component<Props, State> {
    static displayName: "GraphSettings";
    static defaultProps: DefaultProps;
    _isMounted: boolean;
    constructor(props: Props);
    getInitialState(): State;
    componentDidMount(): void;
    UNSAFE_componentWillReceiveProps(nextProps: Props): void;
    componentWillUnmount(): void;
    stateFromProps(props: Props): State;
    changeRulerLabel(e: React.ChangeEvent<HTMLSelectElement>): void;
    changeRulerTicks(e: React.ChangeEvent<HTMLSelectElement>): void;
    changeBackgroundUrl(e: React.FocusEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>): void;
    renderLabelChoices(choices: ReadonlyArray<[string, string]>): React.JSX.Element[];
    validRange(range: [number, number]): string | true;
    validateStepValue(settings: {
        step: number;
        range: [number, number];
        name: string;
        minTicks: number;
        maxTicks: number;
    }): string | true;
    validSnapStep(step: number, range: [number, number]): string | true;
    validGridStep(step: number, range: [number, number]): string | true;
    validStep(step: number, range: [number, number]): string | true;
    validBackgroundImageSize(image: PerseusImageBackground): true | "Image must be smaller than 450px x 450px.";
    validateGraphSettings(range: Coords, step: number[], gridStep: number[], snapStep: number[], image: PerseusImageBackground): any;
    changeLabel(i: number, e: React.ChangeEvent<HTMLInputElement>): void;
    changeRange(i: number, values: [number, number]): void;
    changeStep(step: number[]): void;
    changeSnapStep(snapStep: number[]): void;
    changeGridStep(gridStep: number[]): void;
    changeGraph(): void;
    render(): React.JSX.Element;
}
export default GraphSettings;
