Tooltip API

API reference docs for theTooltipcomponent. For examples and details on the usage of this component, visit the component demo page.

Props​

Props

Type

Description

Default

children

(props: { triggerProps: TooltipTriggerProps<React.ElementType>}) => React.ReactNode

The child element that the tooltip will wrap, such as a button or other interactive element.

_

content

string

The text or content that will be displayed inside the tooltip.

_

id?

string

An optional ID for the tooltip.

If no value is provided, an ID will be automatically generated

_

maxWidth?

number

The maximum width of the popover.

200

placement?

'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end'

Internally imports type Placement from @floating-ui/react-dom

Defines the tooltip's placement relative to the trigger element.

top

shouldUsePortal?

boolean

Whether the tooltip should be placed within a React Portal.

true

strategy?

'absolute' | 'fixed'

Internally imports type Strategy from @floating-ui/react-dom

The strategy used to position the floating element.

absolute

visibilityHidden?

boolean

Controls the visibility of tooltip. When set to true tooltip will not render and removes all events in trigger element

false