Inputs

Checkbox

다중 선택. indeterminate 상태 지원.

폼 안 다중 선택, 동의 항목 등에 사용. 부모-자식 트리 표현 시 indeterminate 지원. Radix Checkbox 기반.

import { Checkbox } from "@nxtgen-org/react";

Basic

Controlled

이용약관에 동의합니다

tsx

1const [agreed, setAgreed] = useState(false);
2
3<Checkbox
4  label="이용약관에 동의합니다"
5  checked={agreed}
6  onCheckedChange={(v) => setAgreed(v === true)}
7/>

States

indeterminate / disabled

indeterminate

disabled + checked

disabled

tsx

1<Checkbox label="indeterminate" checked="indeterminate" />
2<Checkbox label="disabled + checked" disabled checked />
3<Checkbox label="disabled" disabled />

API

Name	Type	Default	Description
checked	boolean \| "indeterminate"	—	—
defaultChecked	boolean \| "indeterminate"	—	—
onCheckedChange	(checked: boolean \| "indeterminate") => void	—	—
label	string	—	—
description	string	—	—
disabled	boolean	false	—
...props	Radix Checkbox Root props	—	—