Components/Checkbox

Checkbox

선택/해제 가능한 체크박스 입력 컴포넌트입니다. Radix UI Checkbox 기반.

Installation

bash
npx axis-cli add checkbox

Usage

tsx
import { Checkbox, Label } from '@axis-ds/ui-react'

export function Example() {
  return (
    <div className="flex items-center space-x-2">
      <Checkbox id="terms" />
      <Label htmlFor="terms">이용약관에 동의합니다</Label>
    </div>
  )
}

Disabled

tsx
<div className="flex items-center space-x-2">
  <Checkbox id="disabled" disabled />
  <Label htmlFor="disabled" className="text-muted-foreground">
    비활성화된 체크박스
  </Label>
</div>

Props

checked
Type:boolean | "indeterminate"
Default:-

체크 상태 (controlled)

defaultChecked
Type:boolean
Default:-

기본 체크 상태

onCheckedChange
Type:(checked: boolean | "indeterminate") => void
Default:-

체크 상태 변경 콜백

disabled
Type:boolean
Default:false

비활성화 여부

required
Type:boolean
Default:false

필수 입력 여부

name
Type:string
Default:-

폼 필드 이름

value
Type:string
Default:"on"

폼 제출 값