express.ui.tooltip

express.ui.tooltip(id=None, placement='auto', options=None, **kwargs)

Context manager for a tooltip

This function wraps tooltip.

Display additional information when focusing (or hovering over) a UI element.

Parameters

id: Optional[str] = None

A character string. Required to reactively respond to the visibility of the tooltip (via the input[id] value) and/or update the visibility/contents of the tooltip.

placement: Literal[‘auto’, ‘top’, ‘right’, ‘bottom’, ‘left’] = ‘auto’

The placement of the tooltip relative to its trigger.

options: Optional[dict[str, object]] = None

A list of additional Bootstrap options.

Examples

#| standalone: true
#| components: [editor, viewer]
#| layout: vertical
#| viewerHeight: 400

## file: app.py
from icons import question_circle_fill

from shiny.express import ui

with ui.tooltip(id="btn_tooltip"):
    ui.input_action_button("btn", "A button", class_="mt-3")

    "A message"

with ui.card(class_="mt-3"):
    with ui.card_header():
        with ui.tooltip(placement="right", id="card_tooltip"):
            ui.span("Card title ", question_circle_fill)
            "Additional info"

    "Card body content..."