import {ref, computed, onUnmounted, nextTick} from 'vue'
import {computePosition, flip, offset, shift} from '@floating-ui/dom'
+import {useMediaQuery} from '@vueuse/core'
import type {ITask} from '@/modelTypes/ITask'
import {getTaskIdentifier} from '@/models/task'
@@ -101,6 +105,9 @@ const props = defineProps<{
const HOVER_DELAY = 1000 // 1 second
const MAX_DESCRIPTION_LENGTH = 150
+// Taps on touch devices emulate mouseenter, which would show the tooltip unexpectedly.
+const canHover = useMediaQuery('(hover: hover) and (pointer: fine)')
+
const triggerRef = ref(null)
const tooltipRef = ref(null)
const showTooltip = ref(false)
@@ -152,6 +159,10 @@ async function updatePosition() {
}
function handleMouseEnter() {
+ if (!canHover.value) {
+ return
+ }
+
// Clear any existing timeout
if (hoverTimeout) {
clearTimeout(hoverTimeout)