import type { Placement } from '@floating-ui/react';
import type { ReactElement, ReactNode } from 'react';
/**
 * Configuration options for the Tooltip component.
 */
type TooltipOptions = {
    /**
     * Whether the tooltip should be initially open.
     * @default false
     */
    initialOpen?: boolean;
    /**
     * The preferred placement of the tooltip relative to its trigger.
     * @default 'top'
     */
    placement?: Placement;
    /**
     * Controlled open state. When provided, the tooltip becomes controlled.
     * @default undefined
     */
    open?: boolean;
    /**
     * Callback function called when the open state changes.
     * @param open - The new open state
     */
    onOpenChange?: (open: boolean) => void;
    /**
     * The distance in pixels between the tooltip and its trigger.
     * @default 4
     */
    sideOffset?: number;
    /**
     * The minimum distance in pixels between the tooltip and the viewport edge.
     * @default 12
     */
    collisionPadding?: number;
    /**
     * The minimum distance in pixels between the arrow and the tooltip content edge.
     * @default 4
     */
    arrowPadding?: number;
    /**
     * Whether the tooltip is disabled. When disabled, the tooltip will not show.
     * @default false
     */
    disabled?: boolean;
    /**
     * The visual variant of the tooltip.
     * - `default`: Small tooltip with dark background
     * - `detail`: Larger tooltip with light background for detailed content
     * @default 'default'
     */
    variant?: 'default' | 'detail';
};
/**
 * Custom hook that provides tooltip functionality using floating-ui.
 * Handles positioning, interactions, and animations.
 *
 * @param options - Configuration options for the tooltip
 * @returns Object containing tooltip state, refs, and interaction handlers
 */
declare function useTooltip({ initialOpen, placement, open: controlledOpen, onOpenChange: setControlledOpen, sideOffset, collisionPadding, arrowPadding, disabled, variant, }?: TooltipOptions): {
    refs: {
        arrow: import("react").RefObject<HTMLDivElement>;
        reference: import("react").MutableRefObject<import("@floating-ui/react-dom").ReferenceType | null> & import("react").MutableRefObject<import("@floating-ui/react").ReferenceType | null>;
        floating: React.MutableRefObject<HTMLElement | null>;
        setReference: ((node: import("@floating-ui/react-dom").ReferenceType | null) => void) & ((node: import("@floating-ui/react").ReferenceType | null) => void);
        setFloating: ((node: HTMLElement | null) => void) & ((node: HTMLElement | null) => void);
        domReference: import("react").MutableRefObject<Element | null>;
        setPositionReference(node: import("@floating-ui/react").ReferenceType | null): void;
    };
    variant: "default" | "detail";
    placement: Placement;
    strategy: import("@floating-ui/react-dom").Strategy;
    middlewareData: import("@floating-ui/react-dom").MiddlewareData;
    x: number;
    y: number;
    isPositioned: boolean;
    update: () => void;
    floatingStyles: React.CSSProperties;
    elements: {
        reference: import("@floating-ui/react-dom").ReferenceType | null;
        floating: HTMLElement | null;
    } & import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
    context: {
        x: number;
        y: number;
        placement: Placement;
        strategy: import("@floating-ui/react-dom").Strategy;
        middlewareData: import("@floating-ui/react-dom").MiddlewareData;
        isPositioned: boolean;
        update: () => void;
        floatingStyles: React.CSSProperties;
        open: boolean;
        onOpenChange: (open: boolean, event?: Event, reason?: import("@floating-ui/react").OpenChangeReason) => void;
        events: import("@floating-ui/react").FloatingEvents;
        dataRef: React.MutableRefObject<import("@floating-ui/react").ContextData>;
        nodeId: string | undefined;
        floatingId: string;
        refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
        elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
    };
    getReferenceProps: (userProps?: React.HTMLProps<Element>) => Record<string, unknown>;
    getFloatingProps: (userProps?: React.HTMLProps<HTMLElement>) => Record<string, unknown>;
    getItemProps: (userProps?: Omit<React.HTMLProps<HTMLElement>, "selected" | "active"> & {
        active?: boolean;
        selected?: boolean;
    }) => Record<string, unknown>;
    open: boolean;
    setOpen: (open: boolean) => void;
};
/**
 * A flexible tooltip component that displays contextual information when hovering or focusing on an element.
 *
 * @example
 * ```
 * <Tooltip content="This is a tooltip">
 *   <button>Hover me</button>
 * </Tooltip>
 * ```
 *
 * @example
 * ```
 * // Detailed tooltip with custom placement
 * <Tooltip
 *   content="This is a detailed tooltip with more information"
 *   variant="detail"
 *   placement="bottom-start"
 * >
 *   <button>Hover me</button>
 * </Tooltip>
 * ```
 *
 * @example
 * ```
 * // Controlled tooltip
 * const [isOpen, setIsOpen] = useState(false)
 *
 * <Tooltip
 *   content="Controlled tooltip"
 *   open={isOpen}
 *   onOpenChange={setIsOpen}
 * >
 *   <button onClick={() => setIsOpen(!isOpen)}>Click me</button>
 * </Tooltip>
 * ```
 */
declare const Tooltip: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
    /**
     * The trigger element that will show the tooltip on hover/focus.
     * Must be a valid React element.
     */
    children: ReactElement;
    /**
     * The content to display inside the tooltip.
     */
    content: ReactNode;
    /**
     * The visual variant of the tooltip.
     * - `default`: Small tooltip with dark background
     * - `detail`: Larger tooltip with light background for detailed content
     * @default 'default'
     */
    variant?: "default" | "detail";
} & TooltipOptions & import("react").RefAttributes<HTMLDivElement>>>;
/**
 * Provider component that manages tooltip delay groups for coordinated tooltip behavior.
 * Wrap your application or tooltip-containing components with this provider to enable
 * smooth transitions when moving between multiple tooltips.
 *
 * @example
 * ```
 * <TooltipProvider>
 *   <Tooltip content="First tooltip">
 *     <button>Button 1</button>
 *   </Tooltip>
 *   <Tooltip content="Second tooltip">
 *     <button>Button 2</button>
 *   </Tooltip>
 * </TooltipProvider>
 * ```
 */
declare const TooltipProvider: import("react").MemoExoticComponent<({ children }: {
    children: ReactNode;
}) => import("react/jsx-runtime").JSX.Element>;
export { Tooltip, TooltipProvider, useTooltip };