Button

버튼은 클릭 시 특정 동작을 수행하거나 다른 페이지로 이동할 때 사용됩니다.

Examples

import { Button } from "@seoulpi/ui/button";

function Example() {
  return <Button variant="default">Click me</Button>;
}

Variants

다양한 시각적 의도를 표현하기 위해 여러 변형을 제공합니다.

• Default: 주요 동작에 사용 (기본값)
• Secondary: 보조 동작에 사용
• Outline: 경계선만 강조된 버튼
• Ghost: 배경색 없이 텍스트만 노출되는 버튼
• Destructive: 위험하거나 삭제 동작에 사용

Sizes

• SM: 작은 크기
• MD: 기본 크기
• LG: 강조하고 싶은 큰 크기

Usage Notes

• 명확한 레이블을 사용하여 행동을 설명하세요.
• 접근성을 위해 버튼 내부에 아이콘만 있을 경우 aria-label을 반드시 제공하세요.