Repository navigation
Conversation
- Textarea engage="hover":悬停也显示激活边框,仅用于外观与原内容一致的原位编辑框 - Textarea surface="brand-tint" 与 --field-edge-brand-tint:画在品牌色底上的输入框,激活边框浅色为近黑、深色为 --brand - InfoHint:只负责解释的 12px ⓘ,非按钮、可键盘聚焦,Tooltip 默认向上 - AGENTS.md 与 showcase 同步记录 Refs: MEMOH-222
Refs: MEMOH-222
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
|
配套 Memoh PR:felinics/Memoh#1665( |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 7e452bacc3
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| data-slot="info-hint" | ||
| tabindex="0" | ||
| role="img" | ||
| :aria-label="props.text" |
There was a problem hiding this comment.
Avoid announcing the hint text twice
When a screen-reader user focuses this trigger, Reka's TooltipTrigger adds an aria-describedby reference to TooltipContent; assigning the identical text as aria-label therefore exposes the sentence as both the accessible name and description, which can cause it to be announced twice. Keep the required accessible name, but prevent the tooltip body from redundantly describing the trigger or provide separate label and explanation values.
AGENTS.md reference: AGENTS.md:L233-L234
Useful? React with 👍 / 👎.
Summary
让聊天里「原位编辑提问」的输入框高亮和说明图标走组件库契约,不再由 Memoh 手写:
rest="bare":未聚焦时不画边框,原位编辑框在聚焦前与被替换的内容渲染得完全一样;聚焦和报错仍照常显示边框,悬停不改变任何东西。其余输入框保持默认rest="edge"(静止时的淡细边)。surface="brand-tint"+ token--field-edge-brand-tint:声明输入框画在品牌色底上,激活边框改用这个 token:浅色为近黑(与--field-edge-solid相同,品牌色边框在浅色淡紫底上发闷),深色为--brand(中性灰边会糊在深紫底上)。静止与报错状态不变,底色仍由调用方负责。open在轻点时切换);点别处、失焦或滚动关闭。图标 14px:细线圆圈在同样高度下看起来比实心文字小,所以比文字档(12px)高一档,以视觉上与旁边文字等高为准,而不是对齐大写字母高度。触控区域用::after向外扩 6px,达到 26px。bg-brand-soft便于对照;新增 InfoHint 规格);skills/ui-owners登记 InfoHint。起因:Memoh 把用户消息改成原位编辑(MEMOH-214),之前在 Memoh 侧用自定义紫色边框和手写 Tooltip 实现,不符合组件库契约。
影响面
默认行为不变:
rest默认edge,surface默认plain,现有 Textarea 渲染不变;新 token 只在surface="brand-tint"时生效。InfoHint 是新组件,暂时只有 Memoh 的编辑行使用。Related
packages/ui指针指向本分支提交7e452ba,本 PR 合并后需改指合并后的提交)Validation
vue-tsc --build:在 Memoh 仓库内(packages/ui指向本分支)通过。单独的 ui worktree 中有 4 条@memohai/icon/ui没有导出ErrorIcon的报错,来自未改动的文件和那边的依赖版本,与本 PR 无关scripts/check-ui-contract.mjs通过oklch(0 0 0 / 0.78),深色oklch(0.72 0.16 290)(即--brand),静止状态不变;InfoHint 鼠标悬停和 Tab 聚焦都向上弹出,图标 12×12rest="bare"、ⓘ 14px 与触屏轻点打开只跑了 typecheck 和 eslint,尚未在浏览器或真机上看过,等 Human QArest="bare"的使用范围目前只靠文档约束)Screenshots
浅色:聚焦时的编辑框与 InfoHint
以上截图来自旧版本(ⓘ 为 12px);悬停描边已删除,对应截图已移除。
Human QA