iter(e05): 新增 divider 分隔线组件
This commit is contained in:
+9
-1
@@ -308,6 +308,14 @@
|
||||
"acceptance": "packages/skin/ui 新增 empty.ts:empty({title?, description?, action?}),居中排版,action 为可选 DOM 操作区(常见放按钮);只消费 --ua-* 令牌;导出、manifest、文档、llms-full.txt、README 清单同步;demo 加一节演示;npm run check 全绿",
|
||||
"status": "done",
|
||||
"notes": "empty(props):纯静态组件(无信号),role=status 由读屏播报;装饰符号 ⌀ 弱化为边框色且 aria-hidden;min-height 120px 撑留白(令牌只到 space-4);demo 新增 sec-empty(信号切换有数据/无结果对比,内容用响应式函数渲染);README 同步 32 组件"
|
||||
},
|
||||
{
|
||||
"id": "e05",
|
||||
"title": "新增 divider 分隔线组件",
|
||||
"motivation": "表单分组、卡片内区块、工具栏之间需要统一分隔语义,目前只有 menu 内部私有分隔线,独立场景无组件可用",
|
||||
"acceptance": "packages/skin/ui 新增 divider.ts:divider({label?, vertical?, dashed?}),水平/垂直两种方向,可带居中文案标签;只消费 --ua-* 令牌;导出、manifest、文档、llms-full.txt、README 清单同步;demo 加一节演示;npm run check 全绿",
|
||||
"status": "done",
|
||||
"notes": "divider(props):水平线用 ::before/::after 双线夹 label 居中文案;vertical 单线(伪元素清空,dashed 走 border-left);dashed 水平线 border-top 替代背景色;role=separator + aria-label;demo 新增 sec-divider(文案线/虚线/工具栏竖线三种用法);README 同步 33 组件"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
+30
-1
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"$schema": "ui-arch-registry-index/0.1",
|
||||
"generatedAt": "2026-10-23T10:11:22.346Z",
|
||||
"generatedAt": "2026-10-23T10:14:36.972Z",
|
||||
"repoRoot": ".",
|
||||
"packages": [
|
||||
{
|
||||
@@ -170,6 +170,7 @@
|
||||
"stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳",
|
||||
"rate(props):评分星标,value 信号双向绑定,hover 预览移出还原,键盘方向键调节,max 可配",
|
||||
"empty(props):空状态占位,title/description 可选,action 放操作区",
|
||||
"divider(props):分隔线,水平/垂直两种方向,可带居中文案标签,dashed 切虚线",
|
||||
"modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区",
|
||||
"drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭",
|
||||
"form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit",
|
||||
@@ -1210,6 +1211,34 @@
|
||||
"action 传入 DOM(如 ghost 按钮)引导用户下一步操作"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "divider",
|
||||
"title": "分隔线 Divider",
|
||||
"demo": "sec-divider",
|
||||
"props": [
|
||||
{
|
||||
"n": "label",
|
||||
"t": "string",
|
||||
"d": "居中文案标签;缺省纯线条"
|
||||
},
|
||||
{
|
||||
"n": "vertical",
|
||||
"t": "boolean",
|
||||
"d": "是否垂直分隔线(用于行内工具栏);缺省水平"
|
||||
},
|
||||
{
|
||||
"n": "dashed",
|
||||
"t": "boolean",
|
||||
"d": "是否虚线;缺省实线"
|
||||
}
|
||||
],
|
||||
"example": "divider({ label: '更多信息' }) / divider({ vertical: true })",
|
||||
"steps": [
|
||||
"在区块之间插入 divider 划分内容层次",
|
||||
"传 label 在水平线上显示居中文案,如「更多信息」",
|
||||
"工具栏内用 vertical: true 的行内竖线,dashed: true 切虚线弱化分隔感"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "pagination",
|
||||
"title": "分页器 Pagination",
|
||||
|
||||
@@ -38,3 +38,4 @@
|
||||
{"ts":"2026-10-23T17:57:31+08:00","id":"e02","result":"done","commit":"fc7a1e8","summary":"新增 stepper 步骤条:三态流转 + active 信号双向绑定 + clickable 回跳,门禁全绿"}
|
||||
{"ts":"2026-10-23T18:03:34+08:00","id":"e03","result":"done","commit":"ee20322","summary":"新增 rate 评分组件:星标点选 + hover 预览 + 键盘方向键调节,信号双向绑定,门禁全绿"}
|
||||
{"ts":"2026-10-23T18:11:46+08:00","id":"e04","result":"done","commit":"fd4ee01","summary":"新增 empty 空状态组件:title/description/action 居中占位,静态零依赖,门禁全绿"}
|
||||
{"ts":"2026-10-23T18:14:46+08:00","id":"e05","result":"done","commit":"pending","summary":"新增 divider 分隔线组件:水平/垂直 + 居中文案 + 虚线,门禁全绿"}
|
||||
|
||||
Reference in New Issue
Block a user