import type { MaybeGetter } from "../types";
export type SpatialMenuProps<T> = {
    /**
     * The currently highlighted value.
     */
    highlighted?: MaybeGetter<T | null | undefined>;
    /**
     * Called when the highlighted value changes.
     */
    onHighlightChange?: (highlighted: T | null) => void;
    onSelect?: (value: T) => void;
    /**
     * Whether navigation should wrap around when reaching the edges.
     * @default false
     */
    wrap?: MaybeGetter<boolean>;
    /**
     * Scroll behavior when highlighting an item with the keyboard.
     * `null` to disable scrolling.
     *
     * @default "smooth"
     */
    scrollBehavior?: MaybeGetter<"smooth" | "instant" | "auto" | null>;
    /**
     * The maximum distance a the centerX of an item can be in relation
     * to the highlighted item to be considered as being on the same column.
     *
     * Set to `null` to disable.
     *
     * @default 16
     */
    toleranceCol?: MaybeGetter<number | null>;
    /**
     * The maximum distance a the centerY of an item can be in relation
     * to the highlighted item to be considered as being on the same row.
     *
     * Set to `null` to disable.
     *
     * @default 16
     */
    toleranceRow?: MaybeGetter<number | null>;
    /**
     * If `true`, arrow keys will navigate cross-axis as well, if no item
     * is available on the current axis.
     *
     * @default true
     */
    crossAxis?: MaybeGetter<boolean>;
};
export declare class SpatialMenu<T> {
    #private;
    onSelect: ((value: T) => void) | undefined;
    wrap: boolean;
    scrollBehavior: "auto" | "smooth" | "instant" | null;
    toleranceCol: number | null;
    toleranceRow: number | null;
    crossAxis: boolean;
    selectionMode: "keyboard" | "mouse";
    get highlighted(): T | null;
    set highlighted(v: T | null);
    constructor(props?: SpatialMenuProps<T>);
    /** The root element. */
    get root(): {
        readonly [x: symbol]: (node: HTMLElement) => () => void;
        readonly "data-melt-spatial-menu-root": "";
        readonly tabindex: 0;
        readonly onkeydown: (e: KeyboardEvent) => void;
    };
    get input(): {
        readonly [x: symbol]: (node: HTMLInputElement) => () => void;
        readonly "data-melt-spatial-menu-input": "";
        readonly onkeydown: (e: KeyboardEvent) => void;
    };
    getItem(value: T, options?: Pick<SpatialMenuItemProps<T>, "onSelect" | "disabled">): SpatialMenuItem<T>;
}
type SpatialMenuItemProps<T> = {
    value: T;
    onSelect?: () => void;
    disabled?: boolean;
    parent: SpatialMenu<T>;
    lifecycle: {
        onMount: () => void;
        onUnmount: () => void;
    };
};
declare class SpatialMenuItem<T> {
    #private;
    value: T;
    disabled: boolean;
    el: HTMLElement | null;
    parent: SpatialMenu<T>;
    highlighted: boolean;
    constructor(props: SpatialMenuItemProps<T>);
    attrs: {
        readonly "data-melt-spatial-menu-item": "";
        readonly "data-highlighted": "" | undefined;
        readonly "data-disabled": "" | undefined;
        readonly onmousemove: () => void;
        readonly onclick: () => void;
    };
    get rect(): DOMRect | undefined;
    get extendedRect(): (DOMRect & {
        centerX: number;
        centerY: number;
    }) | undefined;
    onSelect(): void;
}
export {};