HTML Artifacts 是一个用于生成独立 HTML 文档的技能，适用于用户要求创建、生成、可视化或将材料转化为自包含或单文件 .html 报告的场景。它默认输出本地离线文档，而非网站、仪表盘或幻灯片。
用途
该技能旨在生成一份视觉文档，使结果比纯文本更易于查看、比较或操作。默认生成自包含的本地 .html 文档，而非网站、仪表盘或幻灯片。
主要能力
- 支持文档模式（默认）、可探索文档和演示模式。
- 文档模式适用于代码库、功能、PR、计划、事件或研究解释，具有可滚动、可略读、完整散文、稳定锚点、引用和打印友好等特点。
- 可探索文档适用于因果机制、参数权衡、前后状态、耦合表示，提供完整默认状态加上少量本地控件和即时反馈。
- 演示模式适用于现场讲解，每视图一个想法，支持键盘导航、明确进度、演讲者备注或字幕。
- 强调交互必须回答具体问题：读者问题 → 操作 → 立即可见答案。
- 默认生成一个真正的离线文件，内联 CSS、JavaScript、SVG、数据和必要资源，不依赖 CDN、远程字体、fetch 或服务器。
- 除非明确要求，否则保持本地，不发布、上传或创建公共 URL。
- 最终文件需在浏览器中验证，不能仅通过源代码检查就认为完成。
使用方式
工作流程包括以下步骤：
-
框定解释：确定读者、主导问题、范围、模式和保留方式。对于临时产物，使用系统临时目录中的唯一文件；除非用户要求保留，否则不要将生成的报告添加到仓库。
-
构建证据台账：在编写 HTML 之前，检查确切的源身份和修订版本，完整阅读相关文件以理解其作用，追踪代表性入口点、状态变化、副作用和失败路径，收集稳定的定位符，区分观察、推断和建议的材料，记录重要未知项。对于 PR 或差异产物，检查每个更改的文件以及验证行为、契约、测试和风险所需的周围路径。
-
规划阅读路径：在编写 HTML 之前，先写出产物的论点，以答案、变化或主导问题开头，提供解释所需的最小上下文，展示主要空间模型，走查一个具体示例，呈现风险、限制、未知项或决策点，最后以源索引和下一步有用操作结束。根据读者的动词选择表示方式。
-
针对主题设计：如果源项目有视觉语言，则使用它；否则根据主题选择安静的编辑方向。选择一个主导的解释性构图，并让页面其余部分支持它。避免生成“演示垃圾”，如巨大的渐变英雄区、玻璃态、发光球体、装饰性网格、假浏览器边框、无源证据的假 KPI 等。
-
实现最小合适产物：优先使用纯语义 HTML、CSS、内联 SVG 和少量原生 JavaScript。仅在状态复杂性合理时使用框架，并将最终结果打包回一个离线 HTML 文件。加载组件契约，添加 <style id="html-artifacts-components"></style>，然后运行 python scripts/inline-components.py /absolute/path/to/artifact.html 来内联 assets/artifact-components.css。使用规范标记和类，而不是重新创建。步进器必须使用契约的内联 SVG 线和标记。覆盖主题令牌，不要分叉连接器几何、响应式状态布局或交互机制。仅在提供的组件不适合主导问题时构建自定义视觉。
-
验证打包结果：使用可用的浏览器自动化，测试实际的最终 .html 文件。至少打开产物并等待稳定，检查控制台错误、页面错误、失败请求和意外网络访问，捕获并检查桌面和 320–390 px 移动截图，运行视觉润色门，使用指针和键盘操作每个控件，验证焦点可见性、标题顺序、文本替代、对比度和非颜色线索，检查减少运动行为，检查打印预览或打印 CSS，验证引用、源身份、数字和可见未知项与证据台账。修复问题并在最终文件上重复检查。如果浏览器自动化不可用，执行可执行的检查并明确报告视觉和交互 QA 仍未验证。
-
交付：验证后，使用 xdg-open /absolute/path/to/artifact.html 打开最终产物。将 xdg-open 作为最后一个产物操作运行，以便用户看到通过验证的同一文件。如果 xdg-open 不可用或失败，报告该情况，而不是声称产物已打开。不要替代发布或上传。然后报告确切文件路径、模式和主导问题（一句话）、已验证内容、任何已知遗漏或未验证行为。除非要求，否则不要将完整 HTML 粘贴到聊天中。
适用场景
适用于需要将代码库、功能、PR、计划、事件或研究解释转化为独立 HTML 文档的场景。也适用于需要因果机制、参数权衡、前后状态、耦合表示的可探索文档，以及现场讲解的演示模式。
限制
- 默认生成自包含的本地 .html 文档，而非网站、仪表盘或幻灯片。
- 除非明确要求，否则保持本地，不发布、上传或创建公共 URL。
- 最终文件需在浏览器中验证，不能仅通过源代码检查就认为完成。
- 如果浏览器自动化不可用，视觉和交互 QA 可能未验证。
- 如果 HTML 没有增加有用的空间比较、图表或交互，应说明这一点。如果用户明确要求 HTML，则尊重请求并制作一个克制的文档，而不是发明奇观。
- 该技能提供内容模式、组件契约、质量与验证等参考，但具体细节需加载相应部分。
- 官方文本未提供，因此以上信息基于提供的资料。