Architecture

Architecture

Two skills, one repo

html-prototype-build (consumer)	ui-pack-maintain (author)
consumer pack lookup, install-pack.mjs, resolve-pack.mjs --list/--select, deliver[] copy-out	pack contract, schemaVersion, validate-pack.mjs, generate-registry.mjs, list-packs.mjs, in-pack resolve-pack.mjs --entry
prototype generation, annotations, authoring, screenshots	pack lifecycle: create → validate → version → publish

html-prototype-build layout

Path	Role
SKILL.md	Task router to references/*.md
references/	generation contract, ui-generation, pack-install, product-annotations, local-authoring, sketch-board, review-mark, screenshots, delivery, delivery-checklist
scripts/	Deterministic agent tools: install-pack.mjs, resolve-pack.mjs
runtime/client/	Formal browser runtime — the only runtime copied into a prototype
runtime/author/	Browser authoring tools (shell, Direct edit, Mark, Notes editor, Inspector, sketch board)
runtime/server/	Local Node author service
runtime/cli/	Standalone CLI (screenshot.mjs)
templates/AGENTS.md	Copied verbatim into every prototype
ui/	Consumer pack catalog, consumer contract, bundled registry fallback
addons/annotations/	Annotation addon reference page
agents/openai.yaml	Agent metadata

Runtime boundaries

runtime/client/core/display-mode.js   product-only mode + overlay rules
runtime/client/core/state.js          single PrototypeViewers state source, ?scene sync
runtime/client/notes/model.js         scenario metadata + pure `when` matching
runtime/client/notes/viewer.js        Notes Viewer DOM + SVG connectors

These four are copied verbatim into prototype/ and must not be merged. Everything under author/, server/, cli/ stays in the skill and never enters the deliverable; the server injects author/bootstrap.js at request time only.

Author browser code: author/core/ (modes.js, picker.js, platform.js, selector.js), author/shell/ (Author Tools panel), author/tools/{direct-edit,mark,notes-editor,inspector}/, author/sketch/.

Server modules: index.mjs (HTTP), session.mjs (lifetime), snapshot.mjs (schema check + write), source-editor.mjs (Direct edit write-back, trusted-request check), inspector.mjs (source targets, IDE launch), packs.mjs (pack asset lookup for the sketch board). See Author Server.