v0.5.3

v0.5.3 — 2026-10-15

English

Added

• mobile-vant includes the same ECharts set as admin-desktop: line, bar, donut, mixed, funnel, gauge, heatmap, and map. Open either pack on the sketch board and place those charts.
• Chart source lives in .html-prototype/pack-plugins/echarts/ and is stamped into each host pack with node skills/ui-pack-maintain/scripts/stamp-chart-plugin.mjs. The plugin is not a third installable pack.

Changed

• ui-pack-maintain finds installed packs the same way prototype generation does: --pack-root / HTML_PROTOTYPE_PACK_ROOT, then .html-prototype/packs/ upward from the working directory, then ~/.html-prototype/packs/. list-packs.mjs prints that list.
• Sketch charts load scripts from the open pack and use that pack's class prefix and theme tokens. Mobile charts use mv- and a phone width; desktop charts stay on ui- and can still sit in data.card.
• Pack install registry pins ref: v0.5.3.

Install / update

Re-install or update both skills, then reinstall both official packs so sketch and resolve-pack see the chart components:

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop
node <skill-root>/scripts/install-pack.mjs --pack=mobile-vant

中文

新增

• mobile-vant 带上与 admin-desktop 相同的 ECharts 图表：折线、柱、环、组合、漏斗、仪表、热力、地图。草图板打开任一包即可把这些图拖到画布上。
• 图表源在 .html-prototype/pack-plugins/echarts/，用 node skills/ui-pack-maintain/scripts/stamp-chart-plugin.mjs 打进宿主包。这个插件不能单独安装。

变更

• ui-pack-maintain 与原型生成使用同一套包查找：--pack-root / HTML_PROTOTYPE_PACK_ROOT，然后从工作目录向上找 .html-prototype/packs/，再找 ~/.html-prototype/packs/。list-packs.mjs 列出这些包。
• 草图板按当前打开的包加载图表脚本，并使用该包的类名前缀和主题色。移动端用 mv- 和手机宽度；桌面端仍用 ui-，图表仍可放进 data.card。
• 安装 registry 固定 ref: v0.5.3。

安装 / 更新

请重新安装或更新两个 Skill，并重新安装两个官方包，草图板和 resolve-pack 才会看到图表组件：

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop
node <skill-root>/scripts/install-pack.mjs --pack=mobile-vant

v0.5.2

v0.5.2 — 2026-10-12

English

Removed

• The standalone sketch server is gone. Open the sketch board from Author Tools; the author server serves /sketch/.

Changed

• The author page shows a Stop button that shuts the local server down immediately. Closing the last tab waits 3 minutes. With no requests for 2 hours, the process exits on its own. Starting the server again while the same page is already running reuses that process.
• Pack install registry pins ref: v0.5.2.

Install / update

Re-install or update the skill copy so the author server and sketch board pick up this release:

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

中文

移除

• 去掉草图板的独立服务。从 Author Tools 打开草图板，由作者服务提供 /sketch/。

变更

• 作者页面提供「停止」按钮，立即关掉本机服务。关掉最后一个标签后等待 3 分钟。连续 2 小时没有任何请求时，进程自行退出。同一页面已经在运行时，再次启动会复用该进程。
• 安装 registry 固定 ref: v0.5.2。

安装 / 更新

请重新安装或更新本地 Skill 副本，作者服务和草图板才会用到本版：

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

v0.5.1

v0.5.1 — 2026-10-12

English

Changed

• The sketch board lives in runtime/author/sketch/ with the other authoring tools. It is not copied into a prototype delivery. Open it from Author Tools, or with node <skill-root>/runtime/author/sketch/serve.mjs (replacing node <skill-root>/sketch/serve.mjs from v0.5.0).
• Drag palette components onto the canvas. Resize handles appear only on the selected stamp.
• Click text on a selected stamp to edit that sentence inline, including radio and checkbox captions. Edits stay on the stamp only and are not written back to the UI pack.
• A floating toolbar holds draw tools, then undo, send back, bring forward, delete, and leave. Shortcut hints appear when you hover those buttons.
• Pack install registry pins ref: v0.5.1.

Fixed

• Layer shortcuts and underlay handling after the sketch board boot guard.

Install / update

Re-install or update the skill copy so Author Tools and the sketch board pick up this release:

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

中文

变更

• 草图板放到 runtime/author/sketch/，和其他作者工具放在一起，不进入原型交付目录。可从 Author Tools 打开，或运行 node <skill-root>/runtime/author/sketch/serve.mjs（取代 v0.5.0 的 node <skill-root>/sketch/serve.mjs）。
• 组件面板支持拖到画布上。只有选中的图章才显示拉伸锚点。
• 选中图章后，可点击命中的文字就地改字，含单选、复选说明；改动只留在当前图章，不会写回 UI pack。
• 画布上方悬浮工具栏：绘图工具，以及撤销、后移、前移、删除、退出；悬停按钮时显示快捷键提示。
• 安装 registry 固定 ref: v0.5.1。

修复

• 草图板启动守卫之后，层级快捷键与底图处理恢复正常。

安装 / 更新

请重新安装或更新本地 Skill 副本，Author Tools 与草图板才会用到本版：

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

v0.5.0

v0.5.0 — 2026-10-11

English

Added

• Module sketch board: a free canvas for a rough reference screenshot. It ships inside html-prototype-build and opens from Author Tools, or on its own with node <skill-root>/sketch/serve.mjs. Place atoms from an installed UI pack, draw boxes for a phone frame, and copy the canvas to the clipboard. The button does not save a file.
• UI packs declare placeable atoms in components[<id>].atoms and mark them with data-pack-atom in component.html. ui-pack-maintain owns the field rules; validate-pack.mjs checks them. admin-desktop is v6 (40 atoms) and mobile-vant is v2 (12 atoms).

Changed

• The sketch static server exposes only the board and installed UI packs, and it accepts only 127.0.0.1 and localhost hosts. Pack files resolve from the project, then ~/.html-prototype/packs/.
• resolve-pack.mjs reads its schema allowlist from inside html-prototype-build, so it runs when that skill is installed on its own.
• Pack install registry pins ref: v0.5.0.
• Sketch board sidebar is 340px wide so Underlay, Copy image, and Clear sit on one row.

Install / update

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

中文

新增

• 模块草图板：用来摆一张粗参考图的自由画布。随 html-prototype-build 提供，可从 Author Tools 打开，或单独运行 node <skill-root>/sketch/serve.mjs。从已安装的 UI pack 放置原子、画手机外框，并把画布复制到剪贴板。按钮不会保存文件。
• UI pack 在 components[<id>].atoms 声明可放置原子，并在 component.html 用 data-pack-atom 标记。字段规则由 ui-pack-maintain 维护，validate-pack.mjs 负责检查。admin-desktop 为 v6（40 个原子），mobile-vant 为 v2（12 个原子）。

变更

• 草图静态服务只暴露画板和已安装的 UI pack，且只接受 127.0.0.1 与 localhost。Pack 文件先从项目目录解析，再从 ~/.html-prototype/packs/ 解析。
• resolve-pack.mjs 从 html-prototype-build 内部读取 schema 允许列表，因此只安装该 skill 时也能运行。
• 安装 registry 固定 ref: v0.5.0。
• 草图板侧栏加宽到 340px，Underlay、Copy image 和 Clear 排在同一行。

安装 / 更新

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

v0.4.1

v0.4.1 — 2026-09-15

English

Changed

• Official UI packs moved to .html-prototype/packs/; html-prototype-build shrinks to 50 skill files.
• Pack install registry pins ref: v0.4.1; install-pack.mjs downloads from the tagged layout and falls back to master when the tag tarball is missing.
• admin-desktop v5 is self-contained (ECharts vendor + chart runtime live inside the pack).
• resolve-pack.mjs outputs deliver[] as { from, to } pairs from manifest.delivery.

Added

• Pack install/discovery e2e tests with fixture packs and a local mock registry server.

Install / update

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

中文

变更

• 官方 UI pack 迁至 .html-prototype/packs/；html-prototype-build 缩减至 50 个 skill 文件。
• 安装 registry 固定 ref: v0.4.1；install-pack.mjs 优先从 tag 下载，tag 缺失时回退 master。
• admin-desktop v5 自包含（ECharts vendor 与 chart runtime 在 pack 内）。
• resolve-pack.mjs 通过 manifest.delivery 输出 deliver[]（{ from, to }）。

新增

• 基于 fixture pack 与本地 mock registry 的 pack 安装/发现端到端测试。

安装 / 更新

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain
node <skill-root>/scripts/install-pack.mjs --list-remote
node <skill-root>/scripts/install-pack.mjs --pack=admin-desktop

v0.4.0

v0.4.0 — 2026-09-14

English

Added

• New mobile-vant UI pack for phone-width H5 prototypes: foundation, 12 components, form/list/device-frame Patterns, and mobile-form/mobile-list Presets.
• New ui-pack-maintain Agent Skill with a self-contained pack contract, validator, resolver, and semantic-review workflow for creating or repairing UI Packs.
• New examples/mobile-work-order walkthrough: mobile work-order list and create flow with scenario screenshots and English annotations.

Changed

• Registered mobile-vant alongside admin-desktop in the UI pack catalog; device-frame pattern wraps mobile previews with desktop phone chrome.
• Localized all mobile-vant component placeholders and the mobile work-order example to English (lang="en").
• Merged bilingual release notes into a single CHANGELOG.md; removed CHANGELOG.zh-CN.md.

Fixed

• Mobile work-order overlays now respect [hidden] inside the product preview; dialog and toast no longer leak into unrelated scenarios.
• UI pack adapter calls in the mobile example now pass component roots correctly so scenario state projects to the DOM.

Install / update

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain

中文

新增

• 新增 mobile-vant 移动端 UI 包：Foundation、12 个组件、表单/列表/设备外框 Pattern，以及 mobile-form / mobile-list Preset。
• 新增 ui-pack-maintain Agent Skill：自包含 Pack 契约、校验器、解析器与语义审查流程，用于创建或维护 UI Pack。
• 新增 examples/mobile-work-order 可对照样例：移动端工单列表与新建流程，含场景截图与英文说明。

变更

• 在 UI 包目录中注册 mobile-vant，与 admin-desktop 并列；device-frame Pattern 为桌面预览提供手机外框。
• 将 mobile-vant 组件占位文案与移动端案例界面统一为英文（lang="en"）。
• 中英文更新说明合并至单一 CHANGELOG.md，删除 CHANGELOG.zh-CN.md。

修复

• 移动端案例的弹窗与 Toast 在产品预览区内正确受 [hidden] 控制，不再污染其他场景截图。
• 修正移动端案例中 UI Pack adapter 的根节点传参，场景状态可正确投影到 DOM。

安装 / 更新

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build
npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill ui-pack-maintain

v0.3.1

v0.3.1 — 2026-09-10

Changed

• Localized Viewer, Author Tools, and the minimal example UI copy to English (lang="en"): scenario switching, note rails, Direct Edit, and Mark labels, hints, toasts, and error messages.
• The minimal example annotations and scenario labels now use English copy, staying synchronized with the Skill template.

Fixed

• Synced the Viewer contract test with the localized runtime error messages.

Install / update

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build

v0.3.0

Added

• Final prototype deliveries now use a self-contained named parent directory with \AGENTS.md, the runnable HTML, supporting files, and scenario screenshots.
• A concise Coding Agent handoff template directs implementation work to product annotations and screenshots, with anchor-scoped HTML lookup only when necessary.

Changed

• The delivery contract and checklist now require copying the handoff template into every final prototype package.
• The minimal example includes the same handoff file and verifies it stays synchronized with the Skill template.

v0.2.1

Changelog

All notable changes to AI HTML Annotation will be documented in this file.

v0.2.1 — 2026-09-08

Fixed

• macOS shortcut compatibility across Author Tools: shared author/core/platform.js for ⌘ vs Ctrl labels and modifier detection.
• Notes Editor multiline save now accepts ⌘ + Enter (and Control + Enter) on macOS, not only Ctrl + Enter.

Changed

• Direct Edit and Mark empty-state hints show ⌘ on macOS instead of always Ctrl.
• Root README and Skill references document macOS shortcuts for Edit, Mark, and Notes Editor.

Install / update

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build

v0.2.0 — 2026-09-08

Added

• Author Tools shell with Edit and Mark tabs in one panel.
• Direct Edit for in-browser style and copy changes that save back to prototype.html through the localhost authoring server.
• Mark review pins with macOS ⌘+click support and Copy all → For AI export.
• Claude Code plugin marketplace entry (.claude-plugin/marketplace.json).
• skills.sh and Claude Code install paths in the root README.
• GitHub Pages landing page (index.html).
• Chinese README (README.zh-CN.md) and delivery checklist reference.
• Runtime unit and contract tests across client/, author/, server/, and cli/.

Changed

• Runtime reorganized by execution boundary: client/, author/, server/, cli/.
• PrototypeViewers state model v2 with split display-mode.js, state.js, model.js, and viewer.js.
• Authoring server moved to runtime/server/index.mjs; screenshot CLI to runtime/cli/screenshot.mjs.
• IDE config (.env) moved to the Skill root (skills/html-prototype-build/.env).
• Skill references split by task (local authoring, review mark, screenshots, delivery).
• Viewer action area: fixed scene switch / add note / author tools order; solid primary scene buttons.
• Root README demo GIFs updated for Viewer and Author Tools (Direct Edit + Mark).

Fixed

• Direct Edit source writes hardened with atomic patches and selector validation.
• Notes Editor toolbar pinned to the left of the action area.
• Example snapshot anchors aligned with DOM ids.

Migration

• Update local Skill copies or reinstall:

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build

• Replace old runtime paths:
  • runtime/serve.mjs → runtime/server/index.mjs
  • runtime/shoot.mjs → runtime/cli/screenshot.mjs
  • runtime/html-mark.js → runtime/author/tools/mark/

v0.1.0 — Initial public release

AI HTML Annotation introduces a native-HTML workflow for building, reviewing, annotating, and iterating UI prototypes with coding agents.

Highlights

• Reusable UI packs for stable HTML prototype generation.
• DOM-bound product annotations with grouped notes and SVG connectors.
• Review pins that export selectors, element HTML snapshots, and AI-ready feedback context.
• Local Inspector workflow for locking a live element and jumping back to source.
• Explicit prototype state handling through PrototypeViewers.
• Scenario-based clean screenshots for create, edit, empty, linked, and other declared UI states.
• Local authoring tools kept separate from the final HTML deliverable.
• Agent Skill packaging under skills/html-prototype-build/.
• Zero npm runtime dependencies.

Install the Agent Skill

npx skills add https://github.com/Lisuiwen/ai-html-annotation --skill html-prototype-build

Status

This is an experimental 0.x release. APIs, file layout, and authoring workflows may change while the project evolves.