Skip to content

Tooltip

Tooltip properties

PropertiesDescription
children(optional) Provide a string or a React Element to be shown as the tooltip content.
active(optional) set to true the tooltip will show up.
position(optional) defines the offset position to the target element the arrow appears. Can be top, right, left and bottom. Defaults to top.
align(optional) defines the offset alignment to the target element the arrow appears. Can be center, right and left. Defaults to center.
arrow(optional) defines the direction where the arrow appears. Can be center, top, right, bottom and left. Defaults to center.
skipPortal(optional) set to true to disable the React Portal behavior. Defaults to false.
showDelay(optional) define the delay until the tooltip should show up after the initial hover / active state.
hideDelay(optional) define the delay until the tooltip should disappear up after initial visibility.
size(optional) defines the spacing size of the tooltip. Can be large or basis. Defaults to basis.
targetElement(optional) provide an element directly as a React Node or a React Ref that will be wrapped and rendered.
targetSelector(optional) specify a vanilla HTML selector by a string as the target element.
noAnimation(optional) set to true if no fade-in animation should be used.
fixedPosition(optional) If set to true, the Tooltip will be fixed in its scroll position by using CSS position: fixed;. Defaults to false.
Space(optional) spacing properties like top or bottom are supported.