LikeButton

클릭 시 하트가 채워지며 주변에 작은 입자가 터지는 burst 애니메이션. controlled/uncontrolled · 카운트 표시 · 키보드 토글.

Controlled + count 자동 증감

현재: liked=false, count=42

크기 변형

색상 변형

burst 입자 개수

비활성화

사용

import { LikeButton } from '@baneung-pack/ui';

// Controlled + count
<LikeButton
  liked={liked}
  onLikedChange={setLiked}
  count={count}
  size="lg"
/>

// Uncontrolled
<LikeButton defaultLiked count={42} />

// 커스텀 색
<LikeButton color="#F59E0B" burstColor="#FFD93D" />

// 카운트 없이 — 아이콘만
<LikeButton />

API

LikeButtonProps

Property	Type	기본값	설명
liked	boolean	—	Controlled 좋아요 상태.
defaultLiked	boolean	false	Uncontrolled 초기값.
onLikedChange	(liked: boolean) => void	—	변경 콜백.
count	number	—	카운트 표시 (선택).
disabled	boolean	false	비활성화.
size	'sm' \| 'md' \| 'lg'	'md'	크기.
color	string	'#FF2D78'	채워진 하트 색.
emptyColor	string	'#9CA5B3'	빈 하트 stroke.
burstColor	string	= color	burst 입자 색.
burstCount	number	6	burst 입자 개수.
aria-label	string	'좋아요'	보조 기술 라벨.