import type { ReactNode } from 'react';
import * as React from 'react';
interface ClearButtonProps {
    onClick?: (event?: React.MouseEvent | React.KeyboardEvent) => void;
    ariaLabel?: string;
    /** 'header' uses --color-navbar-fg tokens — only meaningful inside/near AppHeader */
    variant?: 'default' | 'header';
    /**
     * 'button' (default) renders a native <button>. Pass 'span' when this is
     * nested inside another interactive <button> (e.g. a Select/MultiSelect/
     * IntervalSelect trigger) - a <button> descendant of a <button> is invalid
     * HTML and breaks hydration. The span variant keeps the same class,
     * click/mousedown handling, and adds role="button" + Enter/Space
     * activation so it stays keyboard-operable without the invalid nesting.
     */
    as?: 'button' | 'span';
    /**
     * When true, the button is hidden until the nearest ancestor <button>
     * (e.g. a Select/MultiSelect/IntervalSelect trigger) is hovered or
     * contains focus, instead of always being visible whenever there's a
     * value to clear.
     */
    revealOnHover?: boolean;
}
export declare function ClearButton({ onClick, ariaLabel, variant, as, revealOnHover, }: ClearButtonProps): ReactNode;
export {};