WIP - fix date picker

frontend/components/ui/popover/PopoverContent.vue

@@ -1,12 +1,11 @@
 <script setup lang="ts">
-import type { PopoverContentEmits, PopoverContentProps } from "radix-vue"
+import type { PopoverContentEmits, PopoverContentProps } from "reka-ui"
 import type { HTMLAttributes } from "vue"
 import { reactiveOmit } from "@vueuse/core"
 import {
   PopoverContent,
-  PopoverPortal,
   useForwardPropsEmits,
-} from "radix-vue"
+} from "reka-ui"
 import { cn } from "@/lib/utils"
 
 defineOptions({
@@ -28,17 +27,15 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
 </script>
 
 <template>
-  <PopoverPortal to="body">
-    <PopoverContent
-      v-bind="{ ...forwarded, ...$attrs }"
-      :class="
-        cn(
-          'z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-          props.class,
-        )
-      "
-    >
-      <slot />
-    </PopoverContent>
-  </PopoverPortal>
+  <PopoverContent
+    v-bind="{ ...forwarded, ...$attrs }"
+    :class="
+      cn(
+        'z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
+        props.class,
+      )
+    "
+  >
+    <slot />
+  </PopoverContent>
 </template>