示例
直接操作示例，查看组件在具体任务中的状态与反馈。
显示密度设置
使用建议
legend 命名整组控件
单选、多选或同一主题的输入使用简洁 legend；不要用外部视觉标题替代原生字段组名称。
说明与错误保持真实关联
description 和 error 会生成并合并 ARIA ID；自定义 ID 必须唯一、非空且不包含空白。
整组禁用使用原生 disabled
需要同时禁用所有后代控件时设置 fieldset disabled，并保留说明为何不可操作及如何恢复。
引入方式
从已验证的公开子路径导入组件；全局样式接入方式见安装指南。
import { BaseFieldset } from '@inf-monkeys-tech/monkeys-design/components/base';当前限制
- Fieldset 不管理单个字段值、校验时机或提交逻辑；error 内容和错误恢复仍由宿主表单状态负责。
- T17 尚缺真实 Chromium hydration、focus、axe、visual 与 packed React 18/19 证据；原生 disabled、错误关联和键盘焦点尚未完成浏览器闭环。
- Automated axe/browser native-disabled checks and deterministic visual evidence are pending T17/T23.
API
查看组件源码export interface BaseFieldsetProps
extends Omit<
FieldsetHTMLAttributes<HTMLFieldSetElement>,
'children' | 'className' | 'style'
> {
children?: ReactNode;
legend: ReactNode;
description?: ReactNode;
descriptionId?: string;
error?: ReactNode;
errorId?: string;
appearance?: BaseAppearance;
className?: string;
classNames?: BaseFieldsetClassNames;
style?: CSSProperties;
}| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
children | 在 BaseFieldset 内渲染的子内容；支持渲染函数时以对应的 Props 类型为准。 | ReactNode | — |
legend必填 | 字段组的标题内容，并作为 fieldset 的 legend。 | ReactNode | — |
description | 用于补充标题或标签含义的说明内容。 | ReactNode | — |
descriptionId | 说明文本元素的 id，用于建立 aria-describedby 关联。 | string | — |
error | 字段校验失败时显示的错误内容。 | ReactNode | — |
errorId | 错误文本元素的 id，用于建立可访问性关联。 | string | — |
appearance | 覆盖组件使用的外观令牌或局部样式配置。 | BaseAppearance | — |
className | 追加到组件根元素的 CSS 类名。 | string | — |
classNames | 按组件公开的结构插槽分别追加 CSS 类名。 | BaseFieldsetClassNames | — |
style | 追加到组件根元素的内联样式。 | CSSProperties | — |