overlays
Display a non-modal dialog that floats around a trigger element.
<template>
<UPopover>
<UButton color="white" label="Open" trailing-icon="i-heroicons-chevron-down-20-solid" />
<template #panel>
<!-- Content -->
</template>
</UPopover>
</template>
Prop | Default | Description |
---|---|---|
popper | {} | {} |
mode | "click" | string |
openDelay | 50 | number |
closeDelay | 0 | number |
disabled | false | boolean |
ui | appConfig.ui.popover | any |
{
"wrapper": "relative",
"container": "z-20",
"width": "",
"background": "bg-white dark:bg-gray-900",
"shadow": "shadow-lg",
"rounded": "rounded-md",
"ring": "ring-1 ring-gray-200 dark:ring-gray-800",
"base": "overflow-hidden focus:outline-none",
"transition": {
"enterActiveClass": "transition ease-out duration-200",
"enterFromClass": "opacity-0 translate-y-1",
"enterToClass": "opacity-100 translate-y-0",
"leaveActiveClass": "transition ease-in duration-150",
"leaveFromClass": "opacity-100 translate-y-0",
"leaveToClass": "opacity-0 translate-y-1"
},
"popper": {
"strategy": "fixed"
}
}