🫥

Radix ToolTip を hover で表示させない!

2024/07/06に公開

「いや、Popoverで実装しろよ」みたいな声が聞こえてきます。そうですね。Popoverでやったほうがいいですw

https://www.radix-ui.com/primitives/docs/components/tooltip

一応メモ書き程度に書いておきます

<TooltipTrigger asChild>
  <button
    onClick={(e) => {
      e.preventDefault();
      setOpen(!open);
    }}
    onPointerMove={(e) => e.preventDefault()} // ホバーでツールチップを無効化
    onPointerLeave={(e) => e.preventDefault()} // ホバーでツールチップを無効化
  />
</TooltipTrigger>

まあ、Popover使いましょう。と、おもったけど Popover だと、画面内に複数同時に表示させられない(させづらい)とかの制限があったりするのでユースケースにあった方を選ぶのが良さそうです。

Discussion