UITooltip

UITooltip

A tooltip component for displaying informative text when hovering over elements.

<template>
  <UITooltip
    title="Tooltip content"
    placement="top"
    :mouseEnterDelay="0.1"
    :mouseLeaveDelay="0.1"
  >
    <UIButton>Hover me</UIButton>
  </UITooltip>
</template>

Props

• title (string | VNode): Tooltip content
• placement (‘top’ | ‘bottom’ | ‘left’ | ‘right’): Tooltip position
• trigger (‘hover’ | ‘focus’ | ‘click’ | ‘contextmenu’): Show trigger
• mouseEnterDelay (number): Show delay in seconds
• mouseLeaveDelay (number): Hide delay in seconds
• visible (boolean): Control visibility
• defaultVisible (boolean): Default visibility
• arrow (boolean): Show arrow
• maxWidth (number | string): Maximum width
• color (string): Background color
• overlayClassName (string): Custom overlay class
• overlayStyle (object): Custom overlay style
• zIndex (number): Z-index value

Events

• update:visible: Emitted when visibility changes
• visibleChange: Emitted when visibility changes
• show: Emitted when tooltip shows
• hide: Emitted when tooltip hides

Slots

• default: Trigger element content
• title: Custom tooltip content