컴포넌트
ButtonConfetti
클릭(또는 Enter/Space) 시 버튼 위치에서 색종이가 터지는 Canvas2D 컨페티 버튼으로, 컨테이너 내부에만 렌더링되어 격리된다.
- 분류
- 컴포넌트
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/ButtonConfetti-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| label | string | "축하 발사 🎉" | 버튼에 표시할 라벨 텍스트 |
| particleCount | number | 80 | 한 번 클릭 시 방출할 색종이 조각 수 |
| spread | number | 8.5 | 발사 초기 속도 스케일(클수록 넓게 퍼짐) |
| gravity | number | 0.3 | 중력 가속도(클수록 빨리 떨어짐) |
| colors | readonly string[] | 브랜드 팔레트(#C084FC/#EC4899/#5EEAD4 외) | 색종이 색상 팔레트(hex). 미지정 시 브랜드 팔레트 사용 |
| onFire | () => void | undefined | 클릭으로 컨페티를 발사할 때 호출되는 콜백 |