Skip to content

Tooltip

requires layer

A pop-up box that appears when a user hovers over an element.

Usage

The component takes an object as first parameter. This will be used to find the closest layer to the component. The layer will be used to position the tooltip. The second parameter are the properties. By default, the tooltip is shown when the object is hovered.

Properties

Variant, AppearanceOverride

Use the Variant and AppearanceOverride properties to style the component.

Available variants differ per color and can be viewed in the UI demo below.

Pass Variant as a string and AppearanceOverride as an optionalColorTable. More information on overrides can be found here.

The variant is directly passed to a popover, and any appearance overrides are also passed to the popover. As such, theming information is available here.

FollowMouse

If this is true, the tooltip will follow the mouse.

Type

luau

Code block has not loaded. An error may have occurred.

RelativePosition

Optional extra offset to the tooltip's position.

Type

luau

Code block has not loaded. An error may have occurred.

Placement

The placement of the tooltip relative to the object. If FollowMouse is true, this will be ignored.

Type

luau

Code block has not loaded. An error may have occurred.

Text

Type

luau

Code block has not loaded. An error may have occurred.

Visible

Type

luau

Code block has not loaded. An error may have occurred.

DisableHoverBehaviour

If this is true, custom behaviour can be used for displaying the tooltip, by manipulating the Visible property.

Type

luau

Code block has not loaded. An error may have occurred.

Padding

Type

luau

Code block has not loaded. An error may have occurred.

Enabled

Type

luau

Code block has not loaded. An error may have occurred.

Instance Properties

This instance takes all the properties of a Frame. SpecialKeys, such as fusion.Children will also be passed to the instance.

Slots

Slots allow you to customize specific aspects of the component completely, often replacing the old instances. Slots are passed parameters that allow the slot to interact with component data that is normally not exposed. Generally, an useColor (the function passed by theme:get()) function is passed as first parameter to allow the new components to use the same color as the parent component. When using slots, make sure to wrap any code that uses reactive values in a Computed (or any other classes that isolate state), to prevent unnecessary updates.

Content

The content of the tooltip. This will overwrite any existing content.

Function Type

luau

Code block has not loaded. An error may have occurred.