⛔️ Popover

Updated 2026-05-14

Content guidelines

Popovers display richer contextual content than a tooltip. They appear on click and can contain formatted text, links, and actions. Use them when the information is too long or interactive for a tooltip.

When to use

To explain a concept or term inline, without leaving the current page.
To show a small set of related actions in a compact overlay (also called an action popover).
To provide definitions or help text for complex fields.
Do not use popovers for critical error messages - use inline alerts or validation messages.

Style

Popover title: short noun phrase in sentence case. Optional but recommended for longer content.
Body: plain prose, two to four sentences maximum.
Avoid bullet lists inside popovers - keep content scannable through short sentences.
Link text within a popover follows the same descriptive link text guidelines as inline links.

Behavior

Opens on click, closes on click outside or Escape.
Do not open popovers on hover - use tooltips for hover-triggered content.
Trap focus inside the popover while it is open for accessibility.

Object preview panels display a summary of an asset’s key attributes without requiring full navigation to the detail page. They appear as side panels or overlays and are used to support quick inspection workflows.

When to use

When a user hovers over or clicks an item in a list or search result and wants a quick view of its properties.
To reduce context switching during browsing or review tasks.

Style

Panel title is the asset name. Use the exact name - do not rephrase.
Use short attribute labels (one to two words) followed by their values.
Group related attributes under a subheading where the panel is long.
Include a View full details link at the bottom to navigate to the full detail page.

Attribute label examples

✓ Do

Owner

✗ Don't

Assigned owner

✓ Do

Last modified

✗ Don't

Date of last modification

✓ Do

Type

✗ Don't

Object type

✓ Do

Description

✗ Don't

Asset description