From a6d0692e159ac1f4ae14b987c4d3a034b316e923 Mon Sep 17 00:00:00 2001 From: HIsheR Date: Mon, 26 Oct 2026 12:40:24 +0800 Subject: [PATCH] =?UTF-8?q?iter(g71):=20=E6=95=B0=E6=8D=AE=E8=A1=A8?= =?UTF-8?q?=E8=A1=A8=E5=A4=B4=E8=A1=A5=20aria-sort=20=E4=B8=89=E6=80=81?= =?UTF-8?q?=E6=92=AD=E6=8A=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .ua/index.json | 5 +++-- llms-full.txt | 3 ++- packages/skin/ui/src/dataTable.ts | 12 ++++++++++-- packages/skin/ui/ua.manifest.json | 3 ++- 4 files changed, 17 insertions(+), 6 deletions(-) diff --git a/.ua/index.json b/.ua/index.json index e719fb8..88ba9a9 100644 --- a/.ua/index.json +++ b/.ua/index.json @@ -1,6 +1,6 @@ { "$schema": "ui-arch-registry-index/0.1", - "generatedAt": "2026-10-26T04:36:57.291Z", + "generatedAt": "2026-10-26T04:40:12.953Z", "repoRoot": ".", "packages": [ { @@ -1725,7 +1725,8 @@ "表头粘性固定（滚动容器 max-height 420px），斑马纹 + 悬停高亮由 CSS 提供", "数据在途时传 loading（布尔或信号）：表格体换成骨架行、筛选与翻页禁用，返回后置回 false 即恢复", "需要独立分页器联动时传 page 信号：const page = signal(1)，dataTable({ page }) 与 pagination({ page }) 共用", - "需要批量操作时传 selected 信号：内部勾选实时写回，外部置空或赋值即同步整表（跨页保留，按 rowKey 存）" + "需要批量操作时传 selected 信号：内部勾选实时写回，外部置空或赋值即同步整表（跨页保留，按 rowKey 存）", + "可排序表头的 aria-sort 跟随排序态同步（ascending / descending / none），读屏能直接播报当前列序，箭头只是视觉补充" ] }, { diff --git a/llms-full.txt b/llms-full.txt index c46e7a0..66c37cb 100644 --- a/llms-full.txt +++ b/llms-full.txt @@ -1,6 +1,6 @@ # @ui-arch 组件库 Agent 文档（无图形版） -> 自动生成于 2026-10-26T04:36:57.291Z，数据源：各包 ua.manifest.json，勿手改。人类版文档站：apps/docs/index.html。 +> 自动生成于 2026-10-26T04:40:12.953Z，数据源：各包 ua.manifest.json，勿手改。人类版文档站：apps/docs/index.html。 > 组件 = 普通函数，传 props 返回 DOM；状态用 signal 双向绑定：读 signal() 写 signal(v)。 ## 快速上手 @@ -930,6 +930,7 @@ dataTable({ data: users, selectable: true, columns: [{ key: 'name', header: '姓 9. 数据在途时传 loading（布尔或信号）：表格体换成骨架行、筛选与翻页禁用，返回后置回 false 即恢复 10. 需要独立分页器联动时传 page 信号：const page = signal(1)，dataTable({ page }) 与 pagination({ page }) 共用 11. 需要批量操作时传 selected 信号：内部勾选实时写回，外部置空或赋值即同步整表（跨页保留，按 rowKey 存） +12. 可排序表头的 aria-sort 跟随排序态同步（ascending / descending / none），读屏能直接播报当前列序，箭头只是视觉补充 现场演示：apps/docs/demo.html#sec-table diff --git a/packages/skin/ui/src/dataTable.ts b/packages/skin/ui/src/dataTable.ts index 1ab0f28..583a173 100644 --- a/packages/skin/ui/src/dataTable.ts +++ b/packages/skin/ui/src/dataTable.ts @@ -102,8 +102,8 @@ export function dataTable(props: DataTableProps): H }, ); - const th = (col: (typeof props.columns)[number]) => - h( + const th = (col: (typeof props.columns)[number]) => { + const el = h( 'th', { class: `${col.sortable ? 'ua-sortable' : ''}${col.align ? ` ua-align-${col.align}` : ''}`.trim(), @@ -112,6 +112,14 @@ export function dataTable(props: DataTableProps): H col.header ?? col.key, col.sortable ? sortMark(col.key) : null, ); + if (col.sortable) { + effect(() => { + const rule = state().sorting.find((r) => r.key === col.key); // 与视觉箭头同源 + el.setAttribute('aria-sort', rule ? (rule.dir === 'asc' ? 'ascending' : 'descending') : 'none'); + }); + } + return el; + }; /*** 骨架行：列宽与表头对齐，行数取当前每页条数（上限 6 行防过长） ***/ const skeletonRows = (): Node[] => { diff --git a/packages/skin/ui/ua.manifest.json b/packages/skin/ui/ua.manifest.json index 7e3f4d2..496a8e1 100644 --- a/packages/skin/ui/ua.manifest.json +++ b/packages/skin/ui/ua.manifest.json @@ -1596,7 +1596,8 @@ "表头粘性固定（滚动容器 max-height 420px），斑马纹 + 悬停高亮由 CSS 提供", "数据在途时传 loading（布尔或信号）：表格体换成骨架行、筛选与翻页禁用，返回后置回 false 即恢复", "需要独立分页器联动时传 page 信号：const page = signal(1)，dataTable({ page }) 与 pagination({ page }) 共用", - "需要批量操作时传 selected 信号：内部勾选实时写回，外部置空或赋值即同步整表（跨页保留，按 rowKey 存）" + "需要批量操作时传 selected 信号：内部勾选实时写回，外部置空或赋值即同步整表（跨页保留，按 rowKey 存）", + "可排序表头的 aria-sort 跟随排序态同步（ascending / descending / none），读屏能直接播报当前列序，箭头只是视觉补充" ] }, {