Checkbox

Checkbox 组件,源码位于 components/ui/checkbox.tsx。以下示例为组件库源码的构建期真实渲染。

样式变体

默认Default

单个布尔项,适合设置或同意项。

已选Checked

受控或默认选中态都沿用同一视觉模型。

形态变体

带标签With label

用 label 扩大点击范围,不要只留下 16px 命中区。

状态变体

禁用Disabled

禁用态使用 --color-disabled-*,不靠 opacity。

错误Invalid

表单校验失败时配合错误文案使用。

形态变体

空选项规则Empty guidance

Checkbox 不负责搜索;选项为空时展示 EmptyState 或禁用整组。

No checkbox options available

多选列表Multi selection

多个 Checkbox 表示可叠加选择;互斥选择用 RadioGroup。

批量操作Bulk action

表格或列表中的行选择应通过 Checkbox 暴露清晰 aria-label。