컴포넌트
ButtonSlideText
호버/포커스 시 슬라이드로 드러나는 대체 텍스트. 미지정 시 기본값 "지금 시작하기"가 사용되며, 빈 문자열을 주면 label과 동일하게 동작한다.
- 분류
- 컴포넌트
- 난이도
- easy
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/ButtonSlideText-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| label | string | "자세히 보기" | 기본(대기) 상태에 보이는 텍스트. |
| hoverLabel | string | "지금 시작하기" | 호버/포커스 시 슬라이드로 드러나는 대체 텍스트(미지정 시 label과 동일). |
| direction | "up" | "down" | "up" | 슬라이드 방향. up은 위로 올림, down은 아래로 내림. |
| stagger | number | 26 | 글자별 순차 지연(ms). 0이면 전체가 동시에 슬라이드. |
| duration | number | 340 | 개별 글자 슬라이드 전환 지속(ms). |
| accentColor | string | "#C084FC" | 호버 시 배경/대체 라벨/화살표에 적용되는 강조 색상. |