BOBTooltip

<BOBTooltip Text="This is a basic tooltip">
    <BOBButton Text="Hover me" OnClick="@(() => { })" />
</BOBTooltip>

<BOBTooltip Text="Top" Placement="TooltipPlacement.Top"><BOBButton Text="Top" Size="BOBSize.Small" /></BOBTooltip>
<BOBTooltip Text="Bottom" Placement="TooltipPlacement.Bottom"><BOBButton Text="Bottom" Size="BOBSize.Small" /></BOBTooltip>
<BOBTooltip Text="Left" Placement="TooltipPlacement.Left"><BOBButton Text="Left" Size="BOBSize.Small" /></BOBTooltip>
<BOBTooltip Text="Right" Placement="TooltipPlacement.Right"><BOBButton Text="Right" Size="BOBSize.Small" /></BOBTooltip>
<BOBTooltip Text="TopStart" Placement="TooltipPlacement.TopStart"><BOBButton Text="TopStart" Size="BOBSize.Small" /></BOBTooltip>
<BOBTooltip Text="TopEnd" Placement="TooltipPlacement.TopEnd"><BOBButton Text="TopEnd" Size="BOBSize.Small" /></BOBTooltip>
<BOBTooltip Text="BottomStart" Placement="TooltipPlacement.BottomStart"><BOBButton Text="BottomStart" Size="BOBSize.Small" /></BOBTooltip>
<BOBTooltip Text="BottomEnd" Placement="TooltipPlacement.BottomEnd"><BOBButton Text="BottomEnd" Size="BOBSize.Small" /></BOBTooltip>

<BOBTooltip Text="Hover (default)" Trigger="TooltipTrigger.Hover">
    <BOBButton Text="Hover" />
</BOBTooltip>
<BOBTooltip Text="Focus via keyboard" Trigger="TooltipTrigger.Focus">
    <BOBButton Text="Focus (Tab)" />
</BOBTooltip>
<BOBTooltip Text="Click to toggle" Trigger="TooltipTrigger.Click">
    <BOBButton Text="Click" />
</BOBTooltip>
<BOBTooltip Text="Hover or focus" Trigger="TooltipTrigger.HoverAndFocus">
    <BOBButton Text="Hover + Focus" />
</BOBTooltip>

<BOBTooltip>
    <ChildContent>
        <BOBButton Text="With icon + text" />
    </ChildContent>
    <TooltipContent>
        <div style="text-align: center;">
            <BOBSvgIcon Icon="@BOBIconKeys.UI.Info" Color="@PaletteColor.Primary" />
            <p style="margin: 0.5rem 0 0;"><strong>Information</strong></p>
            <p style="margin: 0; font-size: 0.85em;">Rich tooltip content.</p>
        </div>
    </TooltipContent>
</BOBTooltip>
<BOBTooltip Interactive="true">
    <ChildContent>
        <BOBButton Text="Keyboard shortcuts" />
    </ChildContent>
    <TooltipContent>
        <div>
            <strong>Shortcuts</strong>
            <ul style="margin: 0.5rem 0 0; padding-left: 1.2rem;">
                <li>Ctrl+S — Save</li>
                <li>Ctrl+Z — Undo</li>
                <li>Ctrl+Y — Redo</li>
            </ul>
        </div>
    </TooltipContent>
</BOBTooltip>

<BOBTooltip Text="Closes in 2s" AutoCloseAfterMs="2000">
    <BOBButton Text="Auto-close 2s" />
</BOBTooltip>
<BOBTooltip Text="Hover into tooltip to keep it open" Interactive="true" AutoCloseAfterMs="3000">
    <BOBButton Text="Interactive + auto-close" />
</BOBTooltip>

<BOBTooltip Text="Instant show" ShowDelay="0">
    <BOBButton Text="No show delay" />
</BOBTooltip>
<BOBTooltip Text="500ms leave delay" LeaveDelay="500">
    <BOBButton Text="Sticky leave" />
</BOBTooltip>
<BOBTooltip Text="20px away from trigger" Offset="20">
    <BOBButton Text="20px offset" />
</BOBTooltip>
<BOBTooltip Text="No arrow" Arrow="false">
    <BOBButton Text="No arrow" />
</BOBTooltip>

<BOBTooltip Text="Tooltip with low elevation" Elevation="2">
    <BOBButton Text="Elevation 2" />
</BOBTooltip>
<BOBTooltip Text="Tooltip with high elevation" Elevation="8">
    <BOBButton Text="Elevation 8" />
</BOBTooltip>