Tooltips

Interactive tooltips that don't disappear when you try to click their content, plus smooth animations and auto-initialization.

Interactive tooltips

The main enhancement — tooltips that stay open when hovering their content:

<button data-bs-toggle="tooltip"
        data-bs-interactive="true"
        data-bs-html="true"
        title="<button onclick='...'>Copy</button>">
  Interactive content
</button>

Add data-bs-interactive to make tooltips interactive. This automatically:

• Sets trigger: "manual" for programmatic control
• Enables html: true for rich content (though you should still add it for clarity)
• Adds hover tracking to both trigger and tooltip
• Implements 100ms hide delay to prevent flickering

Enhanced animations

Bravo replaces Bootstrap's fade with scale + directional movement:

The animation combines:

• Scale: 0.8 → 1.0
• Translate: 5px from placement direction
• Duration: 300ms with ease timing

This is achieved through a custom template that wraps content in .tooltip-container for transform animations.

Details

• Interactive mode: Tooltips become hoverable containers, perfect for buttons/links inside
• Smart hover tracking: 100ms delay prevents accidental closing when moving cursor
• Custom template: Adds .tooltip-container wrapper for animation transforms
• Backwards compatible: Regular tooltips still work exactly like Bootstrap