feat(ui): migrate from v-tooltip to floating-vue

packages/peeky-client/package.json

@@ -26,11 +26,11 @@
     "@vue/apollo-composable": "^4.0.0-alpha.12",
     "@vue/apollo-util": "^4.0.0-alpha.14",
     "@zhuowenli/vue-feather-icons": "^5",
+    "floating-vue": "^2.0.0-beta.3",
     "graphql": "^15.4.0",
     "graphql-tag": "^2.11.0",
     "graphql-ws": "^5.5.5",
     "monaco-editor": "^0.26.1",
-    "v-tooltip": "^4.0.0-beta.15",
     "vue": "^3.2.20",
     "vue-router": "^4.0.3",
     "vue-resize": "^2.0.0-alpha.1",

packages/peeky-client/src/features/run/RunManager.vue

@@ -163,7 +163,7 @@ const darkMode = computed<boolean>({
 
       <VDropdown
         placement="bottom-start"
-        :offset="[0, 10]"
+        :distance="10"
       >
         <BaseButton
           color="gray"

packages/peeky-client/src/main.ts

@@ -2,11 +2,11 @@ import './style/vars.css'
 import './style/index.css'
 import './style/transitions.css'
 import './style/ansi.css'
-import 'v-tooltip/dist/v-tooltip.css'
+import 'floating-vue/dist/style.css'
 
 import { createApp, provide } from 'vue'
 import { DefaultApolloClient } from '@vue/apollo-composable'
-import VTooltip from 'v-tooltip'
+import FloatingVue from 'floating-vue'
 import App from './App.vue'
 import { router } from './router'
 import { apolloClient } from './apollo'
@@ -18,8 +18,15 @@ const app = createApp({
   },
 })
 app.use(router)
-app.use(VTooltip, {
+app.use(FloatingVue, {
   themes: {
+    tooltip: {
+      instantMove: true,
+      delay: {
+        show: 500,
+        hide: 300,
+      },
+    },
     dropdown: {
       computeTransformOrigin: true,
     },