Compare commits

...

4 Commits

Author SHA1 Message Date
HIsheR 62d4ce648d chore: 留痕补 commit 哈希 2026-10-23 18:07:59 +08:00
HIsheR ee20322e3f iter(e03): 新增 rate 评分组件 2026-10-23 18:07:42 +08:00
HIsheR dc4bac4d17 docs: 同步提交规范到 AGENTS/ITERATION/cli 清单 2026-10-23 18:07:39 +08:00
HIsheR 7072f77f88 feat(cli): 新增 commit-lint 提交信息校验 2026-10-23 18:07:37 +08:00
16 changed files with 249 additions and 10 deletions
+8
View File
@@ -292,6 +292,14 @@
"acceptance": "packages/skin/ui 新增 stepper.ts:stepper({steps, active, clickable?, onChange?}),done/current/upcoming 三态视觉,clickable 时已完成步骤可点回跳并写回 active 信号,aria-current=step;只消费 --ua-* 令牌;导出、manifest、文档、llms-full.txt、README 清单同步;demo 加一节演示;npm run check 全绿", "acceptance": "packages/skin/ui 新增 stepper.ts:stepper({steps, active, clickable?, onChange?}),done/current/upcoming 三态视觉,clickable 时已完成步骤可点回跳并写回 active 信号,aria-current=step;只消费 --ua-* 令牌;导出、manifest、文档、llms-full.txt、README 清单同步;demo 加一节演示;npm run check 全绿",
"status": "done", "status": "done",
"notes": "stepper(props):active 信号变化整条重渲染(effect 首跑赋值 + replaceWith,条目少开销可忽略);done 显示 ✓、current 光环聚焦、upcoming 弱化,aria-current=step;clickable 时已完成步骤渲染为 button 回跳写回信号;连接线用 .ua-step + .ua-step::before 横向短线;demo 新增 sec-stepper(上一步/下一步按钮 computed 禁用联动);README 同步 30 组件" "notes": "stepper(props):active 信号变化整条重渲染(effect 首跑赋值 + replaceWith,条目少开销可忽略);done 显示 ✓、current 光环聚焦、upcoming 弱化,aria-current=step;clickable 时已完成步骤渲染为 button 回跳写回信号;连接线用 .ua-step + .ua-step::before 横向短线;demo 新增 sec-stepper(上一步/下一步按钮 computed 禁用联动);README 同步 30 组件"
},
{
"id": "e03",
"title": "新增 rate 评分组件",
"motivation": "评价、打分场景常用,现有组件无覆盖;星标交互可完整复用信号双向绑定与微动画审美约定,单文件可控",
"acceptance": "packages/skin/ui 新增 rate.ts:rate({value, max?, disabled?, onChange?}),max 缺省 5,hover 预览移出还原,键盘 ←→/↑↓ 调节,aria 星标语义;只消费 --ua-* 令牌;导出、manifest、文档、llms-full.txt、README 清单同步;demo 加一节演示;npm run check 全绿",
"status": "done",
"notes": "rate(props):hover 预览用组件内局部 hover 信号(容器 mouseleave 归零),shown = hover || value 决定点亮数;value/hover 变化整条重渲染(与 stepper 同款 effect + replaceWith 模式);键盘 →/↑ 加分 ←/↓ 减分并 clamp [1,max];role=slider + aria-valuenow;选中色取 --ua-color-warning 金黄;demo 新增 sec-rate(可交互 + 只读两实例共用 score 信号);README 同步 31 组件"
} }
] ]
} }
+38 -1
View File
@@ -1,6 +1,6 @@
{ {
"$schema": "ui-arch-registry-index/0.1", "$schema": "ui-arch-registry-index/0.1",
"generatedAt": "2026-10-23T09:57:15.241Z", "generatedAt": "2026-10-23T10:03:21.198Z",
"repoRoot": ".", "repoRoot": ".",
"packages": [ "packages": [
{ {
@@ -168,6 +168,7 @@
"progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复", "progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复",
"tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签", "tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签",
"stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳", "stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳",
"rate(props):评分星标,value 信号双向绑定,hover 预览移出还原,键盘方向键调节,max 可配",
"modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区", "modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区",
"drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭", "drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭",
"form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit", "form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit",
@@ -1144,6 +1145,42 @@
"clickable: true 时已完成步骤可点击回跳并写回信号,配合 onChange 同步业务状态" "clickable: true 时已完成步骤可点击回跳并写回信号,配合 onChange 同步业务状态"
] ]
}, },
{
"id": "rate",
"title": "评分 Rate",
"demo": "sec-rate",
"props": [
{
"n": "value",
"t": "Signal<number>",
"r": 1,
"d": "当前评分(1 基整数值)信号,双向绑定:点选/键盘写回、外部赋值同步"
},
{
"n": "max",
"t": "number",
"d": "星标总数;缺省 5",
"df": "5"
},
{
"n": "disabled",
"t": "boolean | Signal<boolean>",
"d": "禁用态:布尔直接置位,传信号则动态同步"
},
{
"n": "onChange",
"t": "(value: number) => void",
"k": 1,
"d": "评分变化回调"
}
],
"example": "const score = signal(0); rate({ value: score, max: 5, onChange: (v) => console.log(v) })",
"steps": [
"用 signal(0) 创建评分信号并传入 value;0 表示未评分",
"点击星标或聚焦后按 →/↑ 加一分、←/↓ 减一分;悬停高亮预览、移出还原",
"max 可调整星标总数;disabled 支持布尔或信号禁用"
]
},
{ {
"id": "pagination", "id": "pagination",
"title": "分页器 Pagination", "title": "分页器 Pagination",
+1
View File
@@ -36,3 +36,4 @@
{"ts": "2026-10-23T09:12:49+00:00", "round": 29, "id": "d29", "result": "done", "commit": "", "summary": "menu Home/End 跳转对齐 select"} {"ts": "2026-10-23T09:12:49+00:00", "round": 29, "id": "d29", "result": "done", "commit": "", "summary": "menu Home/End 跳转对齐 select"}
{"ts":"2026-10-23T17:50:14+08:00","id":"e01","result":"done","commit":"20d7b94","summary":"新增 inputNumber 数字输入:−/+ 按钮 + 键盘上下步进,信号双向绑定,min/max/step 夹取,门禁全绿"} {"ts":"2026-10-23T17:50:14+08:00","id":"e01","result":"done","commit":"20d7b94","summary":"新增 inputNumber 数字输入:−/+ 按钮 + 键盘上下步进,信号双向绑定,min/max/step 夹取,门禁全绿"}
{"ts":"2026-10-23T17:57:31+08:00","id":"e02","result":"done","commit":"fc7a1e8","summary":"新增 stepper 步骤条:三态流转 + active 信号双向绑定 + clickable 回跳,门禁全绿"} {"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 预览 + 键盘方向键调节,信号双向绑定,门禁全绿"}
+2
View File
@@ -29,6 +29,8 @@
**门禁一条龙**:`npm run check` = build + style + typecheck + smoke + index + verify,提交前必过。`ua verify` 校验清单 ↔ 文档 ↔ 演示一致(docs.components 的 id 必须在 api.exports 有对应条目、props 必须带 n/t/d、demo 锚点必须在 `apps/demo/main.ts` 中存在),检查皮肤包样式表无硬编码颜色(`#hex` 一律禁止,必须走 `--ua-*` 令牌),并核对 README 的 `<!-- ua:components -->` 区块与清单组件集合完全一致。 **门禁一条龙**:`npm run check` = build + style + typecheck + smoke + index + verify,提交前必过。`ua verify` 校验清单 ↔ 文档 ↔ 演示一致(docs.components 的 id 必须在 api.exports 有对应条目、props 必须带 n/t/d、demo 锚点必须在 `apps/demo/main.ts` 中存在),检查皮肤包样式表无硬编码颜色(`#hex` 一律禁止,必须走 `--ua-*` 令牌),并核对 README 的 `<!-- ua:components -->` 区块与清单组件集合完全一致。
**提交信息规范**:`COMMITTING.md`(`<type>(<scope>): <中文祈使句>`),`ua commit-lint` + commit-msg 钩子自动校验,迭代提交用 `iter(<条目id>): <subject>`。
## Agent 查询组件库的三种方式 ## Agent 查询组件库的三种方式
1. **MCP(推荐)**:在 `~/.workbuddy/mcp.json` 注册: 1. **MCP(推荐)**:在 `~/.workbuddy/mcp.json` 注册:
+1 -1
View File
@@ -29,7 +29,7 @@ qa/probe ──门禁通过──▶ qa/stable ──人工审阅──▶ main
2. **选题**:读 `.ua/backlog.json`,取第一条 `status === "open"` 的条目;若全部关闭,按《选题规则》自行补充一条新点子后继续。 2. **选题**:读 `.ua/backlog.json`,取第一条 `status === "open"` 的条目;若全部关闭,按《选题规则》自行补充一条新点子后继续。
3. **实现**:按 `CODING.md` 编码规范实现,保持低侵入,单文件 < 200 行,涉及组件需同步 manifest/docs/llms-full.txt。 3. **实现**:按 `CODING.md` 编码规范实现,保持低侵入,单文件 < 200 行,涉及组件需同步 manifest/docs/llms-full.txt。
4. **门禁**:跑 `npm run check`(build → style → typecheck → smoke → index)。 4. **门禁**:跑 `npm run check`(build → style → typecheck → smoke → index)。
- **通过**:提交到 `qa/probe`(commit message 以 `iter:` 开头,注明 backlog 条目 id),推送 `qa/probe`,fast-forward 合并到 `qa/stable` 并推送;将 backlog 条目 `status` 置为 `done` 并随迭代提交。 - **通过**:提交到 `qa/probe`,提交信息按 `COMMITTING.md` 规范(`iter(<条目id>): <中文祈使句>`,元数据变更用 `chore(backlog): 记录 <id> 完成`;commit-msg 钩子自动校验),推送 `qa/probe`,fast-forward 合并到 `qa/stable` 并推送;将 backlog 条目 `status` 置为 `done` 并随迭代提交。
- **失败**:尝试修复一次;仍失败则放弃本轮——`qa/probe` 直接重置回 `qa/stable`,backlog 条目在 `notes` 里追加失败原因、`status` 保持 `open`,提交并推送该元数据变更(仅改 `.ua/backlog.json`,不碰代码)。 - **失败**:尝试修复一次;仍失败则放弃本轮——`qa/probe` 直接重置回 `qa/stable`,backlog 条目在 `notes` 里追加失败原因、`status` 保持 `open`,提交并推送该元数据变更(仅改 `.ua/backlog.json`,不碰代码)。
5. **留痕**:在 `.ua/iterations.log` 追加一行 JSON,**字段统一**:`{"ts":"本地ISO时间","id":"条目id","result":"done|aborted","commit":"短哈希","summary":"一句话"}`。硬性规范:`ts` 必须来自 `date` 命令实测(本地时间,带 +08:00 偏移,**禁止手写或用 UTC 换算**);时长结论必须来自两次时间查询之差,禁止使用「大约/接近」等估算词;并发实例格式不得自创变体。随本轮提交。 5. **留痕**:在 `.ua/iterations.log` 追加一行 JSON,**字段统一**:`{"ts":"本地ISO时间","id":"条目id","result":"done|aborted","commit":"短哈希","summary":"一句话"}`。硬性规范:`ts` 必须来自 `date` 命令实测(本地时间,带 +08:00 偏移,**禁止手写或用 UTC 换算**);时长结论必须来自两次时间查询之差,禁止使用「大约/接近」等估算词;并发实例格式不得自创变体。随本轮提交。
6. **边界**:不改 `main` 分支保护、不删分支、不动 `.workbuddy/`、不重写历史、不 force push 到 `qa/stable` 与 `main`。 6. **边界**:不改 `main` 分支保护、不删分支、不动 `.workbuddy/`、不重写历史、不 force push 到 `qa/stable` 与 `main`。
+4 -4
View File
@@ -11,13 +11,13 @@ npm run demo # 打开演示:apps/demo/dist/demo.html
npm run docs # 生成人类文档站 apps/docs/index.html + Agent 全量文档 llms-full.txt npm run docs # 生成人类文档站 apps/docs/index.html + Agent 全量文档 llms-full.txt
``` ```
## 组件(共 30 个) ## 组件(共 31 个)
<!-- ua:components --> <!-- ua:components -->
accordion · alert · avatar · badge · breadcrumb · button · card · checkbox · dataTable · drawer · form · inputNumber · menu · modal · pagination · popover · progress · radioGroup · select · skeleton · slider · spinner · stepper · switchButton · tabs · tag · textField · textarea · toast · tooltip accordion · alert · avatar · badge · breadcrumb · button · card · checkbox · dataTable · drawer · form · inputNumber · menu · modal · pagination · popover · progress · radioGroup · rate · select · skeleton · slider · spinner · stepper · switchButton · tabs · tag · textField · textarea · toast · tooltip
<!-- /ua:components --> <!-- /ua:components -->
分组:表单(button / textField / inputNumber / textarea / checkbox / switchButton / select / radioGroup / slider / form / formItem)、反馈(alert / toast / spinner / progress / skeleton / badge)、浮层(tooltip / popover / modal / drawer / menu)、导航(tabs / breadcrumb / pagination / accordion / stepper)、数据(dataTable / tag / avatar / card)。 分组:表单(button / textField / inputNumber / textarea / checkbox / switchButton / select / radioGroup / slider / rate / form / formItem)、反馈(alert / toast / spinner / progress / skeleton / badge)、浮层(tooltip / popover / modal / drawer / menu)、导航(tabs / breadcrumb / pagination / accordion / stepper)、数据(dataTable / tag / avatar / card)。
## 目录 ## 目录
@@ -25,7 +25,7 @@ accordion · alert · avatar · badge · breadcrumb · button · card · checkbo
|---|---| |---|---|
| `packages/core/frame` | @ui-arch/frame:signal / computed / effect + hyperscript(无虚拟 DOM) | | `packages/core/frame` | @ui-arch/frame:signal / computed / effect + hyperscript(无虚拟 DOM) |
| `packages/core/table-core` | @ui-arch/table-core:headless 表格(filter → sort → paginate 派生管线) | | `packages/core/table-core` | @ui-arch/table-core:headless 表格(filter → sort → paginate 派生管线) |
| `packages/skin/ui` | @ui-arch/ui:30 个 DOM 组件 + ui.css(只消费 `--ua-*` 令牌) | | `packages/skin/ui` | @ui-arch/ui:31 个 DOM 组件 + ui.css(只消费 `--ua-*` 令牌) |
| `packages/design/tokens` | @ui-arch/tokens:设计令牌(暗色只换值不换名) | | `packages/design/tokens` | @ui-arch/tokens:设计令牌(暗色只换值不换名) |
| `packages/tools/cli` | @ui-arch/cli:`ua` 命令行与 stdio MCP server | | `packages/tools/cli` | @ui-arch/cli:`ua` 命令行与 stdio MCP server |
| `apps/demo` | 交互演示(esbuild 打包成单文件) | | `apps/demo` | 交互演示(esbuild 打包成单文件) |
+16
View File
@@ -19,6 +19,7 @@ import {
popover, popover,
progress, progress,
radioGroup, radioGroup,
rate,
select, select,
showToast, showToast,
skeleton, skeleton,
@@ -119,6 +120,9 @@ const qty = signal(1);
// —— 步骤条:下单流程演示,按钮推进、点已完成步骤回跳 —— // —— 步骤条:下单流程演示,按钮推进、点已完成步骤回跳 ——
const stepIdx = signal(0); const stepIdx = signal(0);
// —— 评分:满意度演示,与只读实例共用同一信号 ——
const score = signal(0);
// —— 受控选中:dataTable 内部勾选实时写回,外部可清空 —— // —— 受控选中:dataTable 内部勾选实时写回,外部可清空 ——
const picked = signal<RowKey[]>([]); const picked = signal<RowKey[]>([]);
@@ -363,6 +367,18 @@ const content = h(
button({ label: '下一步', disabled: computed(() => stepIdx() === 2), onClick: () => stepIdx(Math.min(2, stepIdx() + 1)) }), button({ label: '下一步', disabled: computed(() => stepIdx() === 2), onClick: () => stepIdx(Math.min(2, stepIdx() + 1)) }),
), ),
), ),
section(
'sec-rate',
'评分',
'rate:点选星标打分,悬停预览移出还原,键盘 →/↑ 加分 ←/↓ 减分,disabled 只读展示。',
h(
'div',
{ class: 'row' },
rate({ value: score, onChange: (v) => toast.info(`评分 ${v} 星`) }),
h('span', { class: 'out' }, () => `当前:${score() || '未评分'}`),
),
h('div', { class: 'row' }, rate({ value: score, disabled: true })),
),
section( section(
'sec-menu', 'sec-menu',
'下拉菜单', '下拉菜单',
+25 -1
View File
@@ -1,6 +1,6 @@
# @ui-arch 组件库 Agent 文档(无图形版) # @ui-arch 组件库 Agent 文档(无图形版)
> 自动生成于 2026-10-23T09:57:15.241Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。 > 自动生成于 2026-10-23T10:03:21.198Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
> 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。 > 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。
## 快速上手 ## 快速上手
@@ -651,6 +651,29 @@ const step = signal(1); stepper({ steps: [{ label: '下单' }, { label: '支付'
现场演示:apps/docs/demo.html#sec-stepper 现场演示:apps/docs/demo.html#sec-stepper
### rate — 评分 Rate
参数:
- value(必填):Signal<number> —— 当前评分(1 基整数值)信号,双向绑定:点选/键盘写回、外部赋值同步
- max(默认 5):number —— 星标总数;缺省 5
- disabled:boolean | Signal<boolean> —— 禁用态:布尔直接置位,传信号则动态同步
- onChange(回调):(value: number) => void —— 评分变化回调
示例:
```
const score = signal(0); rate({ value: score, max: 5, onChange: (v) => console.log(v) })
```
手把手:
1. 用 signal(0) 创建评分信号并传入 value;0 表示未评分
2. 点击星标或聚焦后按 →/↑ 加一分、←/↓ 减一分;悬停高亮预览、移出还原
3. max 可调整星标总数;disabled 支持布尔或信号禁用
现场演示:apps/docs/demo.html#sec-rate
### pagination — 分页器 Pagination ### pagination — 分页器 Pagination
参数: 参数:
@@ -827,6 +850,7 @@ API 速览:
- progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复 - progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复
- tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签 - tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签
- stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳 - stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳
- rate(props):评分星标,value 信号双向绑定,hover 预览移出还原,键盘方向键调节,max 可配
- modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区 - modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区
- drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭 - drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭
- form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit - form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit
+1
View File
@@ -73,6 +73,7 @@
- progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复 - progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复
- tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签 - tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签
- stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳 - stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳
- rate(props):评分星标,value 信号双向绑定,hover 预览移出还原,键盘方向键调节,max 可配
- modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区 - modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区
- drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭 - drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭
- form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit - form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit
+1
View File
@@ -25,6 +25,7 @@ export { spinner } from './spinner.js';
export { progress } from './progress.js'; export { progress } from './progress.js';
export { tabs } from './tabs.js'; export { tabs } from './tabs.js';
export { stepper } from './stepper.js'; export { stepper } from './stepper.js';
export { rate } from './rate.js';
export { modal } from './modal.js'; export { modal } from './modal.js';
export { drawer } from './drawer.js'; export { drawer } from './drawer.js';
export { form, formItem } from './form.js'; export { form, formItem } from './form.js';
+34
View File
@@ -0,0 +1,34 @@
import { effect, h, signal } from '@ui-arch/frame';
import type { RateProps } from './types.js';
/*** 评分:星标点选,hover 预览移出还原,键盘 ←→/↑↓ 调节,value 信号双向绑定 ***/
export function rate(props: RateProps): HTMLDivElement {
const value = props.value;
const max = props.max ?? 5; // 星标总数缺省 5
const hover = signal(0); // 预览索引(1 基,0 表示无预览)
const emit = (v: number): void => { const n = Math.min(max, Math.max(1, v)); value(n); if (props.onChange) props.onChange(n); }; // 写回信号并回调
const render = (): HTMLElement => {
const shown = hover() || value(); // 预览优先,无预览显示当前值
const stars = [];
for (let i = 1; i <= max; i++) {
stars.push(h('button', {
class: `ua-rate-star${i <= shown ? ' is-on' : ''}`,
type: 'button',
disabled: props.disabled,
'aria-label': `${i} 星`,
onClick: () => emit(i),
onMouseEnter: () => hover(i),
}, '★'));
}
return h('div', { class: 'ua-rate', role: 'slider', 'aria-label': '评分', 'aria-valuemin': 1, 'aria-valuemax': max, 'aria-valuenow': value(), onMouseLeave: () => hover(0) }, ...stars);
};
let el!: HTMLElement; // 当前渲染产物(effect 首跑赋值)
effect(() => { const next = render(); if (el) el.replaceWith(next); el = next; }); // value/hover 变化整条重渲染(星标少,开销可忽略)
const keyNav = (e: KeyboardEvent): void => {
if (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight' && e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return; // 卫语句:只拦截方向键
e.preventDefault();
emit(value() + (e.key === 'ArrowRight' || e.key === 'ArrowUp' ? 1 : -1)); // →/↑ 加一分,←/↓ 减一分
};
el.addEventListener('keydown', keyNav);
return el as HTMLDivElement;
}
+8
View File
@@ -189,6 +189,14 @@ export interface StepperProps {
onChange?: (index: number) => void; // 步骤切换回调(点击回跳触发) onChange?: (index: number) => void; // 步骤切换回调(点击回跳触发)
} }
/*** 评分入参 ***/
export interface RateProps {
value: Signal<number>; // 当前评分(1 基整数值),双向绑定(点击/键盘写回、外部赋值同步)
max?: number; // 星标总数;缺省 5
disabled?: boolean | Signal<boolean>; // 禁用态:布尔直接置位,传信号则动态同步
onChange?: (value: number) => void; // 评分变化回调
}
/*** 徽标入参 ***/ /*** 徽标入参 ***/
export interface BadgeProps { export interface BadgeProps {
label: string; // 徽标文案 label: string; // 徽标文案
+37
View File
@@ -39,6 +39,7 @@
"progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复", "progress(props):进度条,value 信号驱动 0-100(满格切 success 色);不传 value 退化为不确定态无限往复",
"tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签", "tabs(props):标签页,active 信号双向绑定,滑动指示条 + 方向键环形导航,支持禁用页签",
"stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳", "stepper(props):步骤条,done/current/upcoming 三态,active 信号双向绑定,clickable 时已完成步骤可回跳",
"rate(props):评分星标,value 信号双向绑定,hover 预览移出还原,键盘方向键调节,max 可配",
"modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区", "modal(props, ...children):弹窗,open 信号驱动显隐,Esc / 遮罩 / × 关闭,size 三档宽度,footer 提供底部操作区",
"drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭", "drawer(props, ...children):抽屉,open 信号驱动侧滑面板,placement 左右可配、width 可调、footer 操作区,遮罩 / × / Esc 关闭",
"form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit", "form(props, items):表单容器,布局 + 聚合校验,全部通过才触发 onSubmit",
@@ -1015,6 +1016,42 @@
"clickable: true 时已完成步骤可点击回跳并写回信号,配合 onChange 同步业务状态" "clickable: true 时已完成步骤可点击回跳并写回信号,配合 onChange 同步业务状态"
] ]
}, },
{
"id": "rate",
"title": "评分 Rate",
"demo": "sec-rate",
"props": [
{
"n": "value",
"t": "Signal<number>",
"r": 1,
"d": "当前评分(1 基整数值)信号,双向绑定:点选/键盘写回、外部赋值同步"
},
{
"n": "max",
"t": "number",
"d": "星标总数;缺省 5",
"df": "5"
},
{
"n": "disabled",
"t": "boolean | Signal<boolean>",
"d": "禁用态:布尔直接置位,传信号则动态同步"
},
{
"n": "onChange",
"t": "(value: number) => void",
"k": 1,
"d": "评分变化回调"
}
],
"example": "const score = signal(0); rate({ value: score, max: 5, onChange: (v) => console.log(v) })",
"steps": [
"用 signal(0) 创建评分信号并传入 value;0 表示未评分",
"点击星标或聚焦后按 →/↑ 加一分、←/↓ 减一分;悬停高亮预览、移出还原",
"max 可调整星标总数;disabled 支持布尔或信号禁用"
]
},
{ {
"id": "pagination", "id": "pagination",
"title": "分页器 Pagination", "title": "分页器 Pagination",
+33 -1
View File
@@ -783,6 +783,37 @@ button.ua-step-dot:hover {
color: var(--ua-color-text-muted); color: var(--ua-color-text-muted);
} }
/* —— 评分 —— */
.ua-rate {
display: inline-flex;
gap: 2px;
}
.ua-rate-star {
padding: 0;
border: none;
background: none;
color: var(--ua-color-border); /* 未选中:弱化为边框色 */
font-size: 22px;
line-height: 1;
cursor: pointer;
transition: color 0.15s, transform 0.12s;
}
.ua-rate-star:hover {
transform: scale(1.15); /* 悬停微放大 */
}
.ua-rate-star.is-on {
color: var(--ua-color-warning); /* 选中:警示黄即星标金 */
}
.ua-rate-star:disabled {
cursor: not-allowed;
opacity: 0.45;
}
.ua-rate-star:focus-visible {
outline: none;
box-shadow: 0 0 0 3px color-mix(in srgb, var(--ua-color-warning) 25%, transparent);
border-radius: 4px;
}
/* —— 徽标 —— */ /* —— 徽标 —— */
.ua-badge { .ua-badge {
display: inline-block; display: inline-block;
@@ -1459,7 +1490,8 @@ button.ua-step-dot:hover {
.ua-modal-overlay, .ua-modal-overlay,
.ua-drawer, .ua-drawer,
.ua-drawer-overlay, .ua-drawer-overlay,
.ua-step-dot { .ua-step-dot,
.ua-rate-star {
animation: none !important; animation: none !important;
transition: none !important; transition: none !important;
} }
+38 -1
View File
@@ -638,6 +638,40 @@ function cmdVerify() {
console.log('verify OK (manifest ↔ docs ↔ demo 一致,皮肤无硬编码颜色,README 组件清单同步)'); console.log('verify OK (manifest ↔ docs ↔ demo 一致,皮肤无硬编码颜色,README 组件清单同步)');
} }
/*** 校验 git 提交信息是否符合 COMMITTING.md 规范(参数为 message 文件路径或直接 message 文本),违规退出码 1 ***/
function cmdCommitLint(args) {
// 输入来源:文件路径(commit-msg 钩子传参)或参数拼接
let msg = '';
if (args[0] && fs.existsSync(args[0])) msg = fs.readFileSync(args[0], 'utf8');
else msg = args.join(' ');
if (!msg.trim()) { console.error('commit-lint: 提交信息为空'); process.exit(1); }
const head = msg.split('\n')[0].trimEnd();
// git 自动生成的合并/回滚信息直接放行
if (/^(Merge |Revert |fixup!|squash!)/.test(head)) return console.log('commit-lint OK (git 自动信息,跳过校验)');
const TYPES = ['feat', 'fix', 'docs', 'style', 'refactor', 'test', 'chore', 'iter'];
const m = head.match(/^(\w+)(?:\(([^)]*)\))?: (.+)$/);
if (!m) { console.error('commit-lint: 首行须为 <type>(<scope>): <subject>,规范见 COMMITTING.md'); process.exit(1); }
const [, type, scope, subject] = m;
const problems = [];
// type 枚举
if (!TYPES.includes(type)) problems.push(`type「${type}」不在枚举:${TYPES.join('/')}`);
// iter 提交 scope 必须是 backlog 条目 id
if (type === 'iter' && !/^[a-z]\d{2,}$/.test(scope ?? '')) problems.push('iter 提交的 scope 必须是 backlog 条目 id(如 b02/e03)');
// 非 iter 提交 scope 仅允许小写字母与连字符
if (type !== 'iter' && scope && !/^[a-z][a-z-]*$/.test(scope)) problems.push(`scope「${scope}」仅允许小写字母与连字符`);
// subject 长度与标点
if ([...subject].length > 50) problems.push(`subject 超过 50 字符(当前 ${[...subject].length})`);
if (/[。..!!??]$/.test(subject.trim())) problems.push('subject 结尾不加句号');
// body 行宽
for (const line of msg.split('\n').slice(1)) {
if (line.length > 80) problems.push(`body 行超过 80 字符:${line.slice(0, 20)}…`);
}
if (problems.length) { for (const p of problems) console.error('commit-lint: ' + p); process.exit(1); }
console.log(`commit-lint OK (${type}${scope ? `(${scope})` : ''})`);
}
// ---- 入口 ---- // ---- 入口 ----
const [cmd, ...args] = process.argv.slice(2); const [cmd, ...args] = process.argv.slice(2);
@@ -664,10 +698,13 @@ switch (cmd) {
case 'verify': case 'verify':
cmdVerify(); cmdVerify();
break; break;
case 'commit-lint':
cmdCommitLint(args);
break;
case 'mcp': case 'mcp':
cmdMcp(); cmdMcp();
break; break;
default: default:
console.log('usage: ua <index|list|info <name>|docs|style|verify|mcp>'); console.log('usage: ua <index|list|info <name>|docs|style|verify|commit-lint|mcp>');
process.exit(cmd ? 1 : 0); process.exit(cmd ? 1 : 0);
} }
+2 -1
View File
@@ -12,11 +12,12 @@
"ua docs:生成人类文档站 apps/docs/index.html + demo.html 与 Agent 全量文档 llms-full.txt", "ua docs:生成人类文档站 apps/docs/index.html + demo.html 与 Agent 全量文档 llms-full.txt",
"ua style:注释规范门禁(导出必须 /*** ***/、接口字段行尾注释、行注释中文),违规退出码 1", "ua style:注释规范门禁(导出必须 /*** ***/、接口字段行尾注释、行注释中文),违规退出码 1",
"ua verify:清单一致性门禁(id 唯一 / exports 对应 / props 必带 n t d / steps≥3 / demo 锚点存在)", "ua verify:清单一致性门禁(id 唯一 / exports 对应 / props 必带 n t d / steps≥3 / demo 锚点存在)",
"ua commit-lint <文件|message>:提交信息门禁(type 枚举 / scope 规则 / subject 中文祈使 ≤50 字符),规范见 COMMITTING.md,违规退出码 1",
"ua mcp:零依赖 stdio MCP server,暴露 list_components / get_component / search_components" "ua mcp:零依赖 stdio MCP server,暴露 list_components / get_component / search_components"
], ],
"keyTypes": ["ua.manifest.json 清单结构", "MCP tool 入参 schema"] "keyTypes": ["ua.manifest.json 清单结构", "MCP tool 入参 schema"]
}, },
"usage": "node packages/tools/cli/bin/ua.js <index|list|info <name>|docs|style|verify|mcp>;仓库内等价于 npm run index / docs / style / verify", "usage": "node packages/tools/cli/bin/ua.js <index|list|info <name>|docs|style|verify|commit-lint|mcp>;仓库内等价于 npm run index / docs / style / verify",
"conventions": [ "conventions": [
"零依赖:只用 node 标准库,Node >= 18", "零依赖:只用 node 标准库,Node >= 18",
"清单是单一来源:代码注释、文档站、llms-full.txt、MCP 全部从 ua.manifest.json 派生", "清单是单一来源:代码注释、文档站、llms-full.txt、MCP 全部从 ua.manifest.json 派生",