Tooltip

Examples

Schema

import type { SchemaNode } from '@object-ui/types';

interface TooltipSchema {
  type: 'tooltip';
  trigger?: SchemaNode | SchemaNode[];  // Element the tooltip attaches to
  content?: string;                     // Tooltip text — read first
  children?: SchemaNode | SchemaNode[]; // Rich content — the fallback half
  side?: 'top' | 'right' | 'bottom' | 'left';
  align?: 'start' | 'center' | 'end';
  delayDurationMs?: number;             // Delay before showing (ms)
}

The renderer reads schema.trigger for the trigger and schema.content || children for the body. content is text only: a node or a list of nodes there is refused by validation, because the renderer places content directly in the tooltip body and a node there fails to render (objectui#10295). Author rich content under children instead. When both are authored, a non-empty content wins and children is not rendered.

The trigger is authored under trigger, not children (objectui#6939). A tooltip that puts its trigger under children validates, but paints an empty trigger: children is the tooltip's rich-content slot, not its trigger.