Popover

Should this text appear in a popover?

Example

Basic

Show Code

<script lang="ts" setup>
import { RPopover, RSpace } from 'roughness'
</script>

<template>
  <RSpace vertical>
    <RPopover>
      <template #anchor>Tom is dreaming...</template>
      About giving Jerry as a gift to the girl he loves
    </RPopover>
    <RPopover trigger="click" side="bottom">
      <template #anchor>Click to wake Tom up</template>
      And let him find out that Jerry stole his cheese
    </RPopover>
  </RSpace>
</template>

Dropdown

Show Code

<script lang="ts" setup>
import { RPopover, RSpace } from 'roughness'
</script>

<template>
  <RPopover side="bottom">
    <template #anchor>
      <RButton>Hamburger</RButton>
    </template>
    <RSpace vertical>
      <RButton>Nord</RButton>
      <RButton>Mitte</RButton>
      <RButton>Harburg</RButton>
    </RSpace>
  </RPopover>
</template>

Usage

Props

Name	Type	Default Value	Description
align
graphicsOptions
open
side
trigger
...			See Card Props.

Events

Name	Type	Description
update:open

Slots

Name	Type	Description
anchor
...		See Card Slots.