import React from 'react'; import { SpringConfig } from 'react-spring'; import { StyleProps } from './styles'; import { TapState } from './taply'; import { AnimationFunction } from './animation'; import { PopupPlacement } from './PopupController'; export type TooltipChildrenProps = { onChangeTapState: (tapState: TapState) => void; onClick: () => void; popupRef: React.Ref; }; export interface TooltipProps extends StyleProps<[TooltipProps]> { /** Content of the tooltip */ tooltip: React.ReactNode; /** Target element for the tooltip */ children: React.ReactElement | ((props: TooltipChildrenProps) => React.ReactNode); /** Placement of the tooltip relative to the target */ placement?: Partial; /** Tooltip will show and hide on tap on the target element */ showOnTap?: boolean; /** Tooltip will show when the target element is hovered */ showOnHover?: boolean; /** Tooltip will show when the target element is focused */ showOnFocus?: boolean; /** Delay in ms before showing the tooltip after the show event */ showDelay?: number; /** * Delay in ms before hiding the tooltip after the hide event. * Hide will be cancelled if you will hover the tooltip when `showOnHover` * is `true`. This is useful, when you want to allow copying text * from the tooltip or clicking a link in it. */ hideDelay?: number; /** Component for hide and show animation */ animation?: AnimationFunction; /** Config for `react-spring` animation */ springConfig?: SpringConfig; } export interface TooltipArrowProps extends StyleProps<[TooltipArrowProps]>, React.HTMLProps { /** Width of the arrow, for the orientation like this: "^" */ width: number | string; /** Height of the arrow */ height: number | string; /** Margin between arrow and tooltip's corner */ margin: number | string; /** Color of the arrow */ color: string; } declare const TooltipArrow: (inProps: TooltipArrowProps) => import("react/jsx-runtime").JSX.Element; declare const Tooltip: (inProps: TooltipProps) => import("react/jsx-runtime").JSX.Element; export { TooltipArrow, Tooltip };