Tooltip

Contextual information on hover

Examples

{
  "type": "tooltip",
  "content": "Helpful information",
  "children": [
    {
      "type": "button",
      "label": "Hover me"
    }
  ]
}

interface TooltipSchema {
  type: 'tooltip';
  content: string;
  children: SchemaNode;
  side?: 'top' | 'right' | 'bottom' | 'left';
}

Drawer

Sliding panel from edge of screen

Popover

Floating content panel