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.
animatePosition(optional) set to true to animate a single Tooltip from one element to another element. You also need to set a unique group name.
fixedPosition(optional) If set to true, the Tooltip will be fixed in its scroll position by using CSS position: fixed;. Defaults to false.
skipPortal(optional) set to true to disable the React Portal behavior. Defaults to false.
noAnimation(optional) set to true if no fade-in animation should be used.
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.
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.
size(optional) defines the spacing size of the tooltip. Can be large or basis. Defaults to basis.
group(optional) if the tooltip should animate from one target to the next, define a unique ID.
Space(optional) spacing properties like top or bottom are supported.