Tooltip

import { Tooltip } from 'yarcl';

Delete

<Tooltip content="Search">
  <IconButton aria-label="Search"><SearchIcon /></IconButton>
</Tooltip>

• Opens after delay (400 ms) on hover, immediately on keyboard focus; closes on Esc.
• Sets aria-describedby on the trigger.
• Keep the content short and plain. Tooltips can’t contain interactive elements; use HoverCard or Popover for that.

Props

Prop	Type	Default	Description
children required	ReactElement		A single focusable element, e.g. an IconButton.
content required	ReactNode		Short text describing the trigger. Keep it plain; tooltips can't contain interactive content.
delay	number	400	Delay before opening on hover, in ms. Opens immediately on keyboard focus.
placement	Placement	'top'	Preferred side. Flips when there isn't room.