shadcn/uiのTooltipをdisabledのボタンに使う

https://ui.shadcn.com/docs/components/tooltip

これをこんな感じに使いたい！！

button in buttonにならないようにasChildをつけてこんなコードになったけど...

<Tooltip>
  <TooltipTrigger className="cursor-not-allowed" asChild>
    <Button
      variant="outline"
      size="sm"
      disabled
    >
      Disconnect
    </Button>
  </TooltipTrigger>
  <TooltipContent>
    <p>You cannot unlink your last account</p>
  </TooltipContent>
</Tooltip>

ホバーしても何も出てこない...(泣)

https://github.com/radix-ui/primitives/issues/1914

radix-uiのGitHubにIssueを発見。
pointer-eventsが悪さをしていそう。

cssでpointer-events: auto !important;を設定すればいいらしいけど、これをglobalにいれるのは影響がありそうなので避けたいところ...

https://github.com/shadcn-ui/ui/issues/1022#issuecomment-2671213590

さらに調べたらこんな解決法を発見！
shadcn/uiのボタンのスタイルを書き換えるらしい
こんな感じ (上記のページより引用&翻訳)

1. classdisabled:pointer-events-noneを削除
2. すべての hover:x を enabled:hover:xに置き換え
3. 必要に応じて、disabled:cursor-not-allowedを追加
   🚫のカーソルが表示される

この方法が一番スマートだし影響が少なくて良さそう！

できた！

🚫のカーソルもちゃんと表示されてるけど、windowsの仕様でスクリーンショットからは消えちゃうみたい...
ボタンがdisabledな理由を書きたいときって割とあるから、結構使えそう