Skip to content

Tooltip

Overview

Tooltip is based on the Angular Material tooltip component.

Examples

import mesop as me


@me.page(
  security_policy=me.SecurityPolicy(
    allowed_iframe_parents=["https://google.github.io"]
  ),
  path="/tooltip",
)
def app():
  with me.tooltip(message="Tooltip message"):
    me.text(text="Hello, World")

API

tooltip

Creates a Tooltip component. Tooltip is a composite component.

PARAMETER DESCRIPTION
key

The component key.

TYPE: str | None DEFAULT: None

position

Allows the user to define the position of the tooltip relative to the parent element

TYPE: Literal['left', 'right', 'above', 'below', 'before', 'after'] DEFAULT: 'left'

position_at_origin

Whether tooltip should be relative to the click or touch origin instead of outside the element bounding box.

TYPE: bool DEFAULT: False

disabled

Disables the display of the tooltip.

TYPE: bool DEFAULT: False

show_delay_ms

The default delay in ms before showing the tooltip after show is called

TYPE: int DEFAULT: 0

hide_delay_ms

The default delay in ms before hiding the tooltip after hide is called

TYPE: int DEFAULT: 0

message

The message to be displayed in the tooltip

TYPE: str DEFAULT: ''