툴팁

툴팁은 요소나 본문 텍스트에 제공되는 짧은 부가 설명이다.

사용 지침

아이콘 버튼의 의미 보강처럼 핵심 정보가 아닌 보조 설명에 사용하고, 모바일에서는 호버가 동작하지 않으므로 중요 정보는 항상 본문이나 라벨로 함께 전달합니다.

examples/tooltip/TooltipVertical.tsx

"use client"
import { Button } from "@/components/ui/dynamic/button"
import { Tooltip } from "@/components/ui/dynamic/tooltip"

examples/tooltip/TooltipHorizontal.tsx

"use client"
import { Button } from "@/components/ui/dynamic/button"
import { Tooltip } from "@/components/ui/dynamic/tooltip"

examples/tooltip/TooltipBox.tsx

"use client"
import { Button } from "@/components/ui/dynamic/button"
import { Tooltip } from "@/components/ui/dynamic/tooltip"

examples/tooltip/TooltipWithIcon.tsx

"use client"
import { CircleHelp } from "lucide-react"
import { Tooltip } from "@/components/ui/dynamic/tooltip"

Tab 포커스, ESC key 로 제어

examples/tooltip/TooltipKeyboard.tsx

"use client"
import { Button } from "@/components/ui/dynamic/button"
import { Tooltip } from "@/components/ui/dynamic/tooltip"