Popover

Basic popover

Open: false

<script setup>
import { ref } from 'vue'
const open = ref(false)
</script>

<template>
  <FuiPopover :open="open" @update:open="open = $event">
    <FuiPopoverTrigger>
      <FuiButton>Open</FuiButton>
    </FuiPopoverTrigger>
    <FuiPopoverSurface>
      <p>Content</p>
    </FuiPopoverSurface>
  </FuiPopover>
</template>

Modal popover

<FuiPopover modal>
  <FuiPopoverTrigger>
    <FuiButton>Open</FuiButton>
  </FuiPopoverTrigger>
  <FuiPopoverSurface>
    <p>Content</p>
  </FuiPopoverSurface>
</FuiPopover>

Props

Prop	Type	Default	Description
modal	boolean	false	Modal behavior
open	boolean	undefined	Controlled open state