Components
StatPill
아이콘 + 숫자 칩.
import { StatPill } from '@coldsurfers/surf-ui/primitives'1,20431목 18:00 배달
import { StatPill } from '@coldsurfers/surf-ui/primitives'export default function Example() { return ( <> <StatPill icon="👁" value="1,204" /> <StatPill icon="🔥" value="31" tone="hot" /> <StatPill value="목 18:00 배달" /> </> )}조회 👁 1,204 · 반응 🔥 31 같은 숫자 하나를 붙입니다(Figma 1028:210). 숫자는 Geist 고정폭이라 바뀌어도 칩 폭이 덜 흔들립니다.
무엇을 세는지는 모릅니다 — 포맷한 문자열을 value 로 넘깁니다. tone="hot" 은 주황 틴트입니다.
Props
Prop
Type
그 밖의 HTMLAttributes<HTMLSpanElement> 속성은 루트 엘리먼트로 그대로 통과한다.