用途
pi-tui-design 用于在 pi 中创建有设计感、精心打磨的 TUI（终端用户界面）组件，基于 @mariozechner/pi-tui 和 @mariozechner/pi-coding-agent 两个包。资料将终端视为一种有约束的设计媒介：固定宽度的字符网格、仅键盘输入、依赖主题的颜色，并把这些约束作为设计特性而非缺陷。
主要能力与内容
设计思考
编码前先确定方向：基调（极简精确、密集信息、活泼或工业风）、范围（全屏接管、浮层、常驻部件、状态栏、工具渲染）、差异化（让设计显得有意为之的细节，如盲文精度进度条、带强调表头的对齐列）。
终端美学词汇
终端没有字体选择，字符集本身就是排版：制表符（细线、圆角、粗线、双线）用于边框和表格；方块元素（█▓▒░▀▄▌▐）用于进度条与密度填充；盲文用于高分辨率图案、迷你图和图表；符号用于状态指示与选择；数学/箭头字符用于导航提示。用字符重量（█→▓→▒→░→空）表达视觉密度梯度。终端单元格宽高比约为 2:1，两个方块字符读起来近似正方形。
色彩纪律
始终使用 pi 的主题令牌（如 theme.fg("accent", ...)、theme.fg("success", ...)），避免硬编码 ANSI 转义（主题切换时会失效）。色彩层级包含 accent、text、muted、dim、success/error/warning、border 系列、toolTitle 以及各类背景色。规则是一个强调色为主，次要内容用 muted/dim，滥用颜色会压平层级。
空间构成
width 参数是画布边界，render() 的每一行都不得超过它。一致的水平内边距（paddingX=1 为基准）、数字右对齐/标签左对齐、用 visibleWidth() 计算 ANSI 感知列宽、用空格而非制表符填充、用 Spacer 留白而非分隔线、用 Container>Box>children 组合而非扁平渲染函数。
动效与动画
没有 CSS 过渡，依靠 setInterval + tui.requestRender() 定时更新。示例：盲文旋转器帧序列每 80ms 更新。常见模式包括盲文旋转器、方块进度条、错落列表出现、打字机文本、脉冲指示器。必须在 dispose() 中清理定时器，避免组件移除后仍在渲染。
键盘交互设计
键盘是唯一输入，需可发现且一致。标准约定：↑↓ 或 j/k 导航、Enter 确认、Escape 取消、Tab 下一字段、/ 或直接输入搜索过滤。始终显示按键提示（如页面底部的提示行），使用 matchesKey() 处理终端转义序列差异。
组件契约
每个组件实现 render(width): string[]（每行不超过 width）、handleInput?(data: string)、wantsKeyRelease?、invalidate()。关键规则：每行用 truncateToWidth() 截断、状态变化时调用 invalidate() 再触发重新渲染、缓存渲染输出、每行重新应用样式（ANSI 在行边界重置）。
缓存与主题失效
通过 cachedWidth/cachedLines/version 缓存渲染结果，仅在状态或宽度变化时重算。若将主题颜色预先烘焙进子组件，需在 invalidate() 中重建内容以应用当前主题。
可用组件
来自 pi-tui：Text、TruncatedText、Box、Container、Spacer、Markdown、Image、SelectList、SettingsList、Loader、CancellableLoader、Input、Editor。来自 pi-coding-agent：DynamicBorder、BorderedLoader、CustomEditor。
工具函数
visibleWidth、truncateToWidth、wrapTextWithAnsi、matchesKey/Key、getMarkdownTheme、keyHint。
交付界面
全屏 ctx.ui.custom(component)、浮层 ctx.ui.custom(factory, { overlay: true })、部件 ctx.ui.setWidget、状态栏 ctx.ui.setStatus、工具渲染 renderCall/renderResult、页脚 ctx.ui.setFooter。
适用场景
需要在 pi 中构建交互式终端界面时使用，例如面板、游戏、多步向导、快速选择/确认浮层、状态与进度部件、工具调用展示、完整状态栏。
限制
资料未提供该技能的安装命令、收费信息与具体授权条款；具体版本兼容性、平台支持范围暂未提供。