Elements

Info

A small info-icon button that reveals a popover on hover — for an inline explanation next to a label or field.

html

<UiInfo />

text is the text content shown inside the popover when no content slot is provided.

color is the color theme of the icon and its hover background.

content positions the popover relative to the trigger: side, alignment, and offset.

API Reference

Generated from the component's source — props, slots and emits as the component actually declares them.

Prop

Type

Default

Description

string

—

The text content shown inside the popover when no `content` slot is provided.

'neutral'

The color theme of the icon and its hover background.

PopoverContentProps

{ side: 'top', align: 'center', sideOffset: 8 }

Positioning options for the popover content, such as side, alignment, and offset.

Slot

content

type Color = "neutral" | "primary" | "secondary" | "success" | "error" | "warning" | "info" | "pending";

interface PopoverContentProps {
    side?: "top" | "right" | "bottom" | "left";
    align?: "start" | "center" | "end";
    sideOffset?: number;
}