컴포넌트
Tooltip
호버 또는 포커스 시 방향별(top/bottom/left/right)로 페이드+슬라이드하며 등장하는 툴팁. 화살표, aria-describedby, ESC 닫기, prefers-reduced-motion을 지원한다.
- 분류
- 컴포넌트
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/Tooltip-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| content | ReactNode | — | 툴팁에 표시할 내용 (텍스트 또는 노드) |
| children | ReactNode | — | 툴팁을 띄우는 트리거 요소 (버튼, 아이콘 등) |
| position | "top" | "bottom" | "left" | "right" | "top" | 툴팁 등장 방향 |
| arrow | boolean | true | 화살표 표시 여부 |
| delay | number | 120 | 등장 전 지연 시간(ms) |
| className | string | undefined | 트리거 wrapper의 추가 className |