Tooltip

Use RzTooltip to show concise contextual hints for buttons, links, and icons. Wrap related tooltips in a TooltipProvider when you want shared delay settings.

TooltipProvider with nested tooltips

This example wraps a section with TooltipProvider and shows nested RzTooltip components using TooltipTrigger and TooltipContent.

Source

<TooltipProvider DelayDuration="250" SkipDelayDuration="300">
    <section class="flex flex-wrap items-center gap-4">
        <RzTooltip>
            <TooltipTrigger AsChild>
                <RzButton Variant="ThemeVariant.Primary">Save</RzButton>
            </TooltipTrigger>
            <TooltipContent>
                Save your current changes.
            </TooltipContent>
        </RzTooltip>

        <RzTooltip>
            <TooltipTrigger AsChild>
                <RzButton Variant="ThemeVariant.Secondary">Share</RzButton>
            </TooltipTrigger>
            <TooltipContent Anchor="AnchorPoint.Top">
                Invite collaborators to this document.
            </TooltipContent>
        </RzTooltip>
    </section>
</TooltipProvider>

Minimal tooltip

A direct equivalent to the common pattern <Tooltip><TooltipTrigger>...</TooltipTrigger><TooltipContent>...</TooltipContent></Tooltip>, using RizzyUI names.

Source

<RzTooltip>
    <TooltipTrigger AsChild>
        <RzButton Variant="ThemeVariant.Secondary">Hover me</RzButton>
    </TooltipTrigger>
    <TooltipContent>
        A simple tooltip.
    </TooltipContent>
</RzTooltip>

Component Parameters

The following tables summarize primary tooltip parameters.

RzTooltip

Property	Description	Type	Default
`ChildContent`	Should include `TooltipTrigger` and `TooltipContent`.	`RenderFragment`	Required
`Anchor`	Preferred anchor placement around trigger.	`AnchorPoint`	`Top`
`DelayDuration`	Open delay in milliseconds.	`int`	`700`
`Open`	Controlled open state for two-way binding.	`bool?`	`null`
`DefaultOpen`	Initial open state when uncontrolled.	`bool`	`false`

TooltipProvider

Property	Description	Type	Default
`ChildContent`	Nested tooltips receiving shared defaults.	`RenderFragment`	Required
`DelayDuration`	Shared delay before opening.	`int`	`0`
`SkipDelayDuration`	Window after close where reopen skips full delay.	`int`	`300`

Alpine API

Tooltip positioning and interactions are implemented by Alpine x-data component rzTooltip.

Method	Parameters	Description
`queueOpen`	`None`	Starts the delayed open pipeline and shows tooltip.
`queueClose`	`None`	Starts delayed close behavior and hides tooltip.
`updatePosition`	`None`	Recomputes floating position using current anchor options.