"use client"

import { Airdrop, Radar, Sound } from "iconsax-react"

import { Button } from "@/registry/ui/button/button"
import {
  Tooltip,
  TooltipContent,
  TooltipProvider,
  TooltipTrigger,
} from "@/registry/ui/tooltip/tooltip"

export default function TooltipBasicDemo() {
  return (
    <TooltipProvider>
      <div className="flex items-center gap-1">
        <Tooltip>
          <TooltipTrigger
            render={
              <Button variant="ghost" size="icon" aria-label="Boost relay" />
            }
          >
            <Airdrop color="currentColor" />
          </TooltipTrigger>
          <TooltipContent>Boost relay</TooltipContent>
        </Tooltip>

        <Tooltip>
          <TooltipTrigger
            render={
              <Button
                variant="ghost"
                size="icon"
                aria-label="Track station KX-42"
              />
            }
          >
            <Radar color="currentColor" />
          </TooltipTrigger>
          <TooltipContent>Track station KX-42</TooltipContent>
        </Tooltip>

        <Tooltip>
          <TooltipTrigger
            render={
              <Button variant="ghost" size="icon" aria-label="Scan frequencies" />
            }
          >
            <Sound color="currentColor" />
          </TooltipTrigger>
          <TooltipContent>Scan frequencies</TooltipContent>
        </Tooltip>
      </div>
    </TooltipProvider>
  )
}
Draw

Examples
