component-recipe:
  id: button
  anatomy: [label, optional-leading-icon, focus-ring]
  variants: [primary, secondary, destructive]
  states: [default, hover, focus-visible, disabled, loading]
  rules:
    - primary는 화면의 지배적 작업 하나에만 사용한다.
    - 아이콘 단독 버튼은 접근 가능한 이름을 제공한다.
    - loading은 레이블 폭과 사용자 맥락을 보존한다.