import { type ComponentPropsWithoutRef, type RefCallback } from "react";
import { xy } from "@synnaxlabs/x";
import { type RenderProp } from '../util/renderProp';
interface ContextMenuState {
    visible: boolean;
    keys: string[];
    xy: xy.XY;
}
/** Supported event types for triggering a context menu. */
export type ContextMenuEvent = xy.Client & {
    preventDefault: () => void;
    stopPropagation: () => void;
    target: Element;
};
/** Opens the context menu. See {@link Menu.useContextMenu} for more details. */
export type ContextMenuOpen = (pos: xy.Crude | ContextMenuEvent, keys?: string[]) => void;
/** Return value for the {@Menu.useContextMenu} hook. */
export interface UseContextMenuReturn extends ContextMenuState {
    visible: boolean;
    close: () => void;
    open: ContextMenuOpen;
    ref: RefCallback<HTMLDivElement>;
}
export declare const CONTEXT_SELECTED: string;
export declare const CONTEXT_TARGET: string;
/**
 * Menu.useContextMenu extracts the logic for toggling a context menu, allowing
 * the caller to control the menu's visibility and position.
 *
 * @returns visible - Whether the menu is visible.
 * @returns close - A function to close the menu.
 * @returns open - A function to open the menu. The function accepts an XY coordinate and
 * an optional set of keys to set as the selected menu items. It's important to note
 * that these keys override the default behavior of the menu, which is explained in
 * the documentation for {@link Menu.ContextMenu}.
 */
export declare const useContextMenu: () => UseContextMenuReturn;
export interface ContextMenuMenuProps {
    keys: string[];
}
export interface ContextMenuProps extends UseContextMenuReturn, ComponentPropsWithoutRef<"div"> {
    menu?: RenderProp<ContextMenuMenuProps>;
}
/**
 * Menu.ContextMenu wraps a set of children with a context menu. When the user right
 * clicks within wrapped area, the provided menu will be shown. Menu.ContextMenu should
 * be used in conjunction with the Menu.useContextMenu hook.
 *
 * The rendered menu is provided with a set of keys that represent the HTML IDs of the
 * context target elements. The first target is evaluated by traversing the parents
 * of the element that was right clicked until an element with the class "pluto-context-target"
 * is found. If no such element is found, the right clicked element itself is used as
 * the target. Subsequent targets are found by querying all siblings of the first target
 * that have the "pluto-context-selected" class.
 *
 * @example <caption>Example DOM structure</caption>
 *   <div id="pluto-menu-context__container">
 *    <div className="pluto-context-target" id="1">
 *      <span>
 *        <h2>I was right clicked!</h2>
 *      </span>
 *    </div>
 *    <div className="pluto-context-target pluto-context-selected" id="2">
 *    <div className="pluto-context-target" id="3">
 *   </div>
 *
 * In the above example, the keys provided to the menu would be ["1", "2"].
 *
 * The target resolution logic is ideal for both single and multi-select scenarios,
 * such as lists that have several selected rows that should be acted upon together.
 *
 * @param props - Props for the component. Expects all return values from the
 * useContextMenu hook. All non-hook and unlisted props will be spread to the
 * underlying div component acting as the root element.
 * @param props.menu - The menu to show when the user right clicks.
 */
export declare const ContextMenu: import("react").ForwardRefExoticComponent<Omit<ContextMenuProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
export {};
