Skip to catalog content
Mado UI Open-code components

Source-owned · zero runtime dependencies

primitive · tooltip

Tooltip

A plain hint tooltip with authored descriptions and progressive hover, focus and Escape behavior.

Install with npx @madojs/ui@latest add tooltip.

Primitive

Tooltip

Supplement a clear action

Keep the button understandable on its own. The tooltip adds a short description without taking focus or intercepting click.

Keyboard shortcut: C. Copies the command without leaving the current page.

The action has not been used.

Composition

  • Reference one short, non-interactive tooltip from an enabled native trigger with aria-describedby, then attach paired madoUiTooltip refs.

Public API

export madoUiTooltip()
Returns trigger and tooltip refs for validated progressive behavior.
class mado-ui-tooltip-trigger / mado-ui-tooltip
Trigger positioning hook and plain hint surface.
attribute interestfor / popover="hint"
Native Interest Invoker relationship and hint lifecycle.
css-property --mado-ui-tooltip-show-delay / --mado-ui-tooltip-hide-delay
Progressive hover/focus timing.

Detected public classes

  • .mado-ui-tooltip
  • .mado-ui-tooltip-trigger

Detected public CSS properties

  • --mado-ui-color-action
  • --mado-ui-color-action-contrast
  • --mado-ui-radius-sm
  • --mado-ui-shadow-panel
  • --mado-ui-space-3
  • --mado-ui-tooltip-background
  • --mado-ui-tooltip-border
  • --mado-ui-tooltip-color
  • --mado-ui-tooltip-font-size
  • --mado-ui-tooltip-hide-delay
  • --mado-ui-tooltip-max-block-size
  • --mado-ui-tooltip-max-inline-size
  • --mado-ui-tooltip-offset
  • --mado-ui-tooltip-padding
  • --mado-ui-tooltip-position-area
  • --mado-ui-tooltip-radius
  • --mado-ui-tooltip-shadow
  • --mado-ui-tooltip-show-delay

Accessibility contract

  • aria-describedby keeps the text available even when no visual tooltip opens; essential information stays visible elsewhere.

Keyboard

  • Focus reveals the hint; Escape closes it without activating or moving the trigger.

Focus

  • Focus always remains on the trigger; tooltip content is non-interactive.

Fallback

  • Without Interest Invokers, the helper supplies hover/focus behavior where Popover and Anchor Positioning are available; otherwise the description remains accessible.

Installation graph

Direct dependencies

Resolved install order

Copied source

The CLI resolves each registry source path into the configured project target. Links below point to the exact catalog build tag.