表单与选择@neumorphism-ui/checkbox

Checkbox

在透明的原生 input 上叠加拟物表面，同时保留表单提交和浏览器无障碍能力。支持受控、非受控、indeterminate 状态以及 shadcn 风格的 onCheckedChange。

@neumorphism-ui/checkbox

预览

接收价格提醒已应用到部分工作区不可用选项

npx shadcn@latest add @neumorphism-ui/checkbox

CLI 会依次处理 npm 依赖、base token、utils 和组件源码。

首次使用此 Registry？请先完成 namespace 配置。

npx shadcn@latest add @neumorphism-ui/checkbox @neumorphism-ui/label

import { Checkbox } from "@/components/ui/checkbox"
import { Label } from "@/components/ui/label"

<div className="flex items-center gap-2">
  <Checkbox id="updates" defaultChecked />
  <Label htmlFor="updates">接收产品更新</Label>
</div>

组件	属性	类型	默认值	说明
`Checkbox`	`checked`	`boolean \| "indeterminate"`	`—`	受控的选中或混合状态。
`Checkbox`	`defaultChecked`	`boolean`	`false`	非受控模式下的初始选中状态。
`Checkbox`	`onCheckedChange`	`(checked: boolean \| "indeterminate") => void`	`—`	选中状态变化时调用。
`Checkbox`	`disabled`	`boolean`	`false`	禁用输入和指针操作。
`Checkbox`	`name / value / required`	`native input props`	`—`	用于表单提交的原生 checkbox 属性。