import type * as React from 'react'; import { Placement } from '@popperjs/core'; import { AnalyticsOverrideProps, AnalyticsParentDataProps } from '../analytics'; export interface BaseTooltipProps extends Omit, AnalyticsParentDataProps { /** * Classes applied to the tooltip trigger when the tooltip is active */ activeClassName?: string; /** * Helpful description of the tooltip for screenreaders */ ariaLabel?: string; /** * Tooltip trigger content */ children: React.ReactNode; /** * Classes applied to the tooltip trigger */ className?: string; /** * Configurable text for the aria-label of the tooltip's close button */ closeButtonLabel?: string; /** * When provided, will render the passed in component for the tooltip trigger. Typically will be a `button`, `a`, or rarely an `input` element. */ component?: React.ReactElement | any | ((...args: any[]) => any); /** * Heading for the tooltip content. This will show above 'title' content and inline with 'closeButton' if closeButton is set */ contentHeading?: React.ReactNode; /** * Tooltip that behaves like a dialog, i.e. a tooltip that only appears on click, traps focus, and contains interactive content. For more information, see Deque's [tooltip dialog documentation](https://dequeuniversity.com/library/aria/tooltip-dialog) */ dialog?: boolean; /** * `id` applied to tooltip body container element. If not provided, a unique id will be automatically generated and used. */ id?: string; /** * Sets the size of the invisible border around interactive tooltips that prevents it from immediately hiding when the cursor leaves the tooltip. */ interactiveBorder?: number; inversed?: boolean; /** * Applies `skidding` and `distance` offsets to the tooltip relative to the trigger. See the [`popperjs` docs](https://popper.js.org/docs/v2/modifiers/popper-offsets/) for more info. */ offset?: [number, number]; /** * Called when the tooltip is hidden */ onClose?: () => any; /** * Called when the tooltip is shown */ onOpen?: () => any; /** * Placement of the tooltip body relative to the trigger. See the [`popperjs` docs](https://popper.js.org/docs/v2/constructors/#options) for more info. */ placement?: Placement; /** * `maxWidth` styling applied to the tooltip body */ maxWidth?: string; /** * Determines if close button is shown in tooltip. It is recommended that the close button is only used if `dialog=true` */ showCloseButton?: boolean; /** * Content inside the tooltip body or popover. If contains interactive elements use the `dialog` prop. */ title: React.ReactNode; /** * Duration of the `react-transition-group` CSSTransition. See the [`timeout` option](http://reactcommunity.org/react-transition-group/transition#Transition-prop-timeout) for more info. */ transitionDuration?: number; /** * Helpful description of the tooltip for screenreaders. An alias for `ariaLabel` specifically added to improve accessibility for the web component version of this component. */ triggerAriaLabel?: string; /** * `zIndex` styling applied to the tooltip body */ zIndex?: number; } type OtherProps = Omit & React.ComponentPropsWithRef<'a'>, keyof BaseTooltipProps>; export type TooltipProps = BaseTooltipProps & OtherProps; export declare const placements: Placement[]; /** * Tooltips provide additional information upon hover, focus or click. * For information about how and when to use this component, * [refer to its full documentation page](https://design.cms.gov/components/tooltip/). * * When using the `` as the only child of ``, be sure to * provide an `aria-label` on the `` to ensure an accessible name for * the trigger. */ export declare const Tooltip: { (props: TooltipProps): import("react/jsx-runtime").JSX.Element; defaultProps: { component: string; interactiveBorder: number; maxWidth: string; offset: number[]; placement: string; transitionDuration: number; zIndex: number; }; }; export default Tooltip;