feat(Popover): ability to add overlay (#1014)

docs/components/content/examples/PopoverExampleOverlay.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="flex gap-4 items-center">
+    <UPopover overlay>
+      <UButton color="white" label="Open" trailing-icon="i-heroicons-chevron-down-20-solid" />
+
+      <template #panel>
+        <div class="p-4">
+          <Placeholder class="h-20 w-48" />
+        </div>
+      </template>
+    </UPopover>
+  </div>
+</template>

docs/content/6.overlays/3.popover.md

@@ -25,6 +25,14 @@ Use the `open` prop to manually control showing the panel.
 
 :component-example{component="popover-example-open"}
 
+### Overlay :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"}
+
+:component-example{component="popover-example-overlay"}
+
+::callout{icon="i-heroicons-light-bulb"}
+  Clicking on the `overlay` emits `update:open`. If you are manually controlling the `open` prop, you will need to use a [`v-model` argument](https://vuejs.org/guide/components/v-model.html#v-model-arguments) (`v-model:open`).
+::
+
 ## Popper
 
 Use the `popper` prop to customize the popper instance.