元数据列表
@astryxdesign/core v0.7.1 · MetadataList
属性
MetadataList
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
columns | 'multi' | 'single' | number | 'single' | 单列时标签在值旁边。数字或 multi 把标签叠在值上面。multi 按至少 280px 的轨道自动填充。 |
label | { position?: 'start' | 'top', width?: number | string } | 单列在旁边,其余在上方 | width 决定标签轨道宽度,只在标签位于值旁边时生效。数字按像素计。 |
maxNumOfItems | number | - | 超出这个数量的项收进「显示更多」。水平排列时忽略。 |
orientation | 'vertical' | 'horizontal' | 'vertical' | 水平排列会换行,并忽略 columns、label 和 maxNumOfItems。 |
title | string | - | 列表上方的纯文本标题。复杂内容用 title 插槽。 |
MetadataListItem
| 名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
label | string | - | 字段名。默认插槽是值。icon 插槽画在标签前面。 |
主题
packages/core/styles/metadata-list.css 读取语义 token。标签是 medium 字重的正文字号,颜色是次要文字。值是主要文字色。左右排列时行距 8px、列距 16px,值这一行至少 24px 高。上下堆叠时间距 2px。标题下方留 12px。「显示更多」使用强调色。
原生属性
其余属性落到根元素 <dl>,以及每一项的 <dt> 或包裹元素上。