Components

Popover

A generic anchored surface — the Menu / Select popover holding arbitrary content.

Available since@crisp-ui-kit/crisp@0.11.0

The measured popover surface (radius 12, layered soft shadow, inset border) holding arbitrary content rather than menu items. Opens below its trigger (flips up when there's no room), closes on outside pointer-down and Escape.

It stays inside the viewport: when the preferred align or side would overflow it flips to the trigger's other edge, then shifts in with 8px padding. Pass collide={false} for the old fixed placement.

Installation

npm install @crisp-ui-kit/crisp

Props

Prop

Type

Notes

  • Collision (crisp#1290). Popover measures its surface and stays inside the viewport. It flips to the trigger's other inline edge when the preferred one overflows, shifts inside an 8px window padding when neither edge fits, and applies the same check above and below (setting a max-height when neither side has room). An explicit align is still the preferred placement, so align="end" is no longer needed as a workaround near the right edge. Pass collide={false} for the old fixed placement.

On this page