表单组件版本 0.1.0

Label 标签

为表单控件提供可点击且可访问的明确文字名称。

使用概览

适合使用

  • 输入、选择或开关控件需要稳定的可见名称时。

不建议使用

  • 文字只是说明内容,或没有实际可关联的表单控件时。

真实示例

工作区名称标签

通过控件标识关联可见字段名称。

正在加载示例…

安装

本地候选警告Registry 地址仅指向当前本地文档站;npm 包也只用于本地候选验证,尚未公开发布。
pnpm dlx shadcn@4.16.0 add http://127.0.0.1:3000/r/label.json

基础用法

导入

import { Label } from "@richardqiu/quartz/label";

JSX

<Label htmlFor="workspace-name">工作区名称</Label>

状态与控制摘要

默认
label · textactive · boolean

API 参考

属性类型默认值说明
htmlForstring未设置关联目标表单控件的唯一标识。

组合结构

  1. 01Label

键盘约定

  • Tab 会聚焦关联控件,而不是标签本身。

可访问性契约

  • 在 Field 之外使用时,通过 htmlFor 关联控件 ID。
  • 必填提示保持可见,同时由控件保留原生 required 属性。