wangjia
208d0cda12
真相源整固： - design/index.html 登记簿：token 色板（var() 实时渲染）/ 组件登记卡 / 图标与跨端映射 / guidelines / ui_kits 单一入口，check-ds 强制登记 - design/icons.js 图标单源（Lucide 线条）+ icon-map.json 跨端映射表 （web/iOS/Android 三列，iOS 12 个 SF Symbol 全部收编登记） - components/core/Icon.jsx 单源图标渲染器；MicBar/RecognitionOverlay 接入 - tokens 新增 --brand-wechat(-press)（微信官方绿）与 --overlay-wave - fonts.css 弃 Google Fonts CDN，Outfit 可变字体自托管 （assets/outfit-latin.woff2，40KB；中国网络下 CDN 不可用会卡字体） - design/serve.mjs 零依赖预览服务器（登记簿与原型评审入口） codegen 强化（export-tokens.mjs）： - 产物直写消费位置：ios/dudu/Shared/DuduTheme.swift、 android/.../design/DuduTheme.kt——删除 design-pipeline/generated/ 中间拷贝层（此前 app 内是手工拷贝，--check 守不到真实消费文件已漂移） - 新增 web/tokens.css 产物（custom props 透传 + Outfit data URI 内嵌） - tokens 文件遍历排序，产物确定性 存量收编： - desktop：三个窗口内联 SVG → Icon 组件；tray 裸 rgba → token+opacity - Android：LoginScreen 微信绿常量 → DuduPalette.brandWechat(Press)， Color.White → textOnAccent - 官网 web/index.html：接入 tokens.css，34 处硬编码 hex 全部 var() 化； 深色板块（metrics/cta/footer）改挂 data-theme="dark" 复用 dark 令牌； 移除 Google Fonts CDN - design 包内 8 处裸色：微信绿 token 化、装饰色 ds-ignore 白名单、 同值色改 var() 引用 防漂移闸（零依赖 Node）： - design-pipeline/check-ds.mjs：真相源自检 7 道（dark⊆light / var 链 / 裸色∈tokens 值集 / 组件登记 / icons 唯一 / icon-map 双向同集 / 禁 emoji） - design-pipeline/check-code.mjs：代码侧单源（desktop 禁字面色+内联 path / iOS 禁字面色+SF Symbol 同集 / Android 禁 Color(0x / web 禁字面色）， ds-ignore 行级豁免制 - .githooks/pre-commit（启用：git config core.hooksPath .githooks） - CI design job 扩展为三道闸全绿 - 反向验证通过：注入裸色/孤儿 token/未登记组件/未登记 symbol 均被拦截 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
dudu 移动端 UI Kit
移动端（iOS / Android 原生键盘扩展 + 主 App）高保真交互演示，对应 MVP 设计方案 §8.2–8.3。
左：键盘扩展
微信聊天宿主上下文 + 以语音为主的键盘：
- 工具条（dudu 标识 + 余额/试用/计时状态）
- 功能键行：切换键盘 / ，/ 。/ 退格 / 发送（语音为主，不做 26 键）
- 大麦克风条（
MicBar，56px 胶囊）：按住说话 → partial 文本条流式刷新 → 松开 final 上屏到宿主输入框；录音中显示"上滑取消" - 顶部状态 chips 切换四态：有余额 / 试用中（每天免费 3 分钟）/ 未登录（按键置灰）/ 试用已用完（橙色引导购买时长）
右：主 App 四屏
- 启用引导：三步卡片（添加键盘 → 完全访问 → 试一试），点主按钮推进
- 登录：logo + 微信一键登录（微信品牌绿 #07C160）
- 购买时长：时长余额卡 + 时长包（100/500/2000 分钟，不过期）+ 微信支付
- 我的：账号卡（时长余额）+ 今日免费试用 ProgressBar + 权限自检（异常红色"去开启"）
右上角切换 Light / Dark。键盘面板与 App 均随主题；键帽用 --surface-card + --shadow-key 底边。
文件
index.html— 入口（两台手机并排 + 状态 chips + 主题）MobileShared.jsx— Lucide 图标子集 · DuduMLogo · PhoneFrameKeyboardScreen.jsx— 键盘扩展全态AppScreens.jsx— Onboarding / Login / Paywall / Profile
注：微信图标为简化气泡占位，正式包请使用微信官方资源。