diff --git a/src/components/primitives/Tooltip.tsx b/src/components/primitives/Tooltip.tsx index 501655ff2..640c5c2cd 100644 --- a/src/components/primitives/Tooltip.tsx +++ b/src/components/primitives/Tooltip.tsx @@ -1,4 +1,5 @@ import * as RadixTooltip from "@radix-ui/react-tooltip"; +import { useEffect, useState } from "react"; import { useTheme } from "../../context/Theme.context"; import type { Component } from "../../utils/types"; import Text from "../primitives/Text"; @@ -13,12 +14,27 @@ export type TooltipProps = Component<{ export default function Tooltip({ helper, onOpen, children, icon = true, className }: TooltipProps) { const { vars } = useTheme(); + const [open, setOpen] = useState(false); + const [isTouchDevice, setIsTouchDevice] = useState(false); + + useEffect(() => { + if (typeof document === "undefined") return; + if (!("ontouchstart" in window)) return; + setIsTouchDevice(true); + }, []); return ( - open && onOpen?.()}> + { + if (isTouchDevice) setOpen(isOpen); + if (isOpen) onOpen?.(); + }} + delayDuration={0}> - + {/* biome-ignore lint/a11y/useKeyWithClickEvents: */} + setOpen(prev => !prev) : undefined}>
{children}
{!!icon && }