feat: add declarative Figma canvas authoring

.claude-plugin/marketplace.json

@@ -3,12 +3,12 @@
   "owner": {
     "name": "TemPad Dev"
   },
-  "description": "Agent plugins for using TemPad Dev design evidence in coding workflows.",
+  "description": "Agent plugins for reading Figma evidence and authoring native designs with TemPad Dev.",
   "plugins": [
     {
       "name": "tempad-dev",
       "source": "./agent-plugins/tempad-dev",
-      "description": "Use selected Figma nodes as agent-ready evidence for project-consistent UI implementation.",
+      "description": "Connect your coding agent to Figma. Create and edit native designs, inspect existing designs, and implement UI in your codebase.",
       "category": "Design"
     }
   ]

.github/workflows/build.yml

@@ -33,6 +33,14 @@ jobs:
       - name: Install browser runtime
         run: pnpm --filter @tempad-dev/extension test:setup
 
+      - name: Check agent plugin
+        run: >-
+          pnpm agent-plugin:dev &&
+          test -z "$(git status --porcelain --untracked-files=all --
+          agent-plugins/tempad-dev
+          .agents/plugins/marketplace.json
+          .claude-plugin/marketplace.json)"
+
       - name: Type check
         run: pnpm typecheck
 

.github/workflows/publish-mcp.yml

@@ -2,6 +2,16 @@ name: publish-mcp
 
 on:
   workflow_dispatch:
+    inputs:
+      tag:
+        description: npm dist-tag
+        required: true
+        default: latest
+        type: choice
+        options:
+          - latest
+          - next
+          - alpha
 
 permissions:
   contents: read
@@ -35,4 +45,8 @@ jobs:
 
       - name: Publish
         working-directory: packages/mcp-server
-        run: npm publish --access public
+        run: npm publish --access public --tag "${{ inputs.tag }}"
+
+      - name: Verify published version
+        working-directory: packages/mcp-server
+        run: npm view "@tempad-dev/mcp@$(node -p "require('./package.json').version")" version

.gitignore

@@ -14,8 +14,10 @@ stats-*.json
 .wxt
 web-ext.config.ts
 dist
+.dev/
 coverage
 .artifacts/
+.vitest-attachments/
 packages/*/coverage
 packages/extension/tests/**/__screenshots__/
 

.lefthook.yml

@@ -5,10 +5,6 @@ pre-commit:
       group:
         piped: true
         jobs:
-          - name: sync-agent-plugin
-            glob: '{skill/SKILL.md,agent-plugins/tempad-dev/skills/figma-design-to-code/SKILL.md}'
-            run: pnpm sync:agent-plugin
-            stage_fixed: true
           - name: lint
             glob: '*.{ts,js,mjs,cjs,mts,cts,vue}'
             run: pnpm exec eslint --fix {staged_files}

AGENTS.md

@@ -2,121 +2,102 @@
 
 ## Purpose
 
-Provide a single entry point for coding agents. This file links to package-level guides and highlights repo-wide constraints and workflows.
-
-## Repo map (high level)
-
-- `packages/extension/` — Figma plugin + MCP tools implementation
-- `packages/mcp-server/` — MCP server runtime
-- `packages/shared/` — shared types and contracts
-- `packages/plugins/` — plugin-side code and transforms
-- `agent-plugins/` — shared agent plugin bundles and platform manifests
-
-## Start here
-
-- `packages/extension/AGENTS.md`
-- `packages/mcp-server/AGENTS.md`
-- `packages/shared/AGENTS.md`
-- `packages/plugins/AGENTS.md`
-
-## Global conventions
-
-- Package manager: `pnpm`
-- Prefer repo-level scripts unless a package explicitly documents otherwise.
-- When creating commits, use Conventional Commits (for example: `feat: ...`, `fix: ...`, `docs: ...`, `chore: ...`).
-
-## Common commands
-
-- Typecheck: `pnpm typecheck`
-- Lint (and format): `pnpm lint:fix`
-- Test (watch): `pnpm test`
-- Test (run): `pnpm test:run`
-- Test (coverage): `pnpm test:coverage`
-- Extension node tests: `pnpm --filter @tempad-dev/extension test:node`
-- Extension browser tests: `pnpm --filter @tempad-dev/extension test:browser`
-- Extension browser setup: `pnpm --filter @tempad-dev/extension test:setup`
-
-## Doc index
-
-- `TESTING.md`
-- `docs/testing/architecture.md`
-- `docs/extension/mcp-get-code-requirements.md`
-- `docs/extension/mcp-get-code-design.md`
-- `docs/extension/mcp-browser-gateway-design.md`
-- `docs/marketing-screenshots.md`
-
-## Guardrails
-
-- Keep changes minimal and consistent with existing style.
-- Avoid adding new global dependencies unless explicitly requested or approved.
-- Keep pull request descriptions concise. Do not include a validation section unless explicitly requested.
-
-## Contributing & verification
-
-### Tech stack (repo-wide)
-
-- Package manager: `pnpm` (workspace scripts are commonly run as `pnpm -r ...`).
-- Language: TypeScript.
-- Extension: Vue 3 + WXT (Web Extension Toolkit).
-- MCP server: Node.js 18+ + `@modelcontextprotocol/sdk` + WebSocket transport.
-- Shared contracts: `zod` schemas.
-- Build tool (non-extension packages): `tsdown`.
-
-### Key scripts
-
-Run these at repo root unless noted.
-
-- Dev extension: `pnpm dev`
-- Dev site: `pnpm dev:site`
-- Build everything: `pnpm build`
-- Build site: `pnpm build:site`
-- Build extension: `pnpm build:ext`
-- Build plugins: `pnpm build:plugins`
-- Build MCP: `pnpm build:mcp`
-- Typecheck all packages: `pnpm typecheck`
-- Lint all packages: `pnpm lint` / auto-fix: `pnpm lint:fix`
-- Test all packages: `pnpm test:run`
-- Coverage report: `pnpm test:coverage`
-- Format: `pnpm format`
-- Zip extension artifact: `pnpm zip`
-
-### Verification checklist (agent-driven changes)
-
-Pick the checks that match your change.
-
-1. Always
-
-- `pnpm typecheck`
-- `pnpm lint` (or `pnpm lint:fix`)
-- `pnpm test:run`
-
-2. Extension UI / codegen
-
-- `pnpm dev`
-- In Figma, open TemPad Dev panel and validate the impacted section (e.g. “Inspect → Code”).
-
-3. Extension build / packaging
-
-- `pnpm build:ext`
-- `pnpm zip`
-
-4. Rewrite subsystem
-
-- `pnpm --filter @tempad-dev/extension build:rewrite`
-- Optional: `pnpm --filter @tempad-dev/extension tsx scripts/check-rewrite.ts`
-  - Requires `FIGMA_EMAIL`, `FIGMA_PASSWORD`, `FIGMA_FILE_KEY`.
-
-5. MCP schemas / tool behavior
-
-- If you change tool schemas/contracts: update `packages/shared` first, then `packages/mcp-server`, then `packages/extension`.
-- Re-check payload limits and omission rules; see `docs/extension/mcp-get-code-requirements.md` and `docs/extension/mcp-get-code-design.md`.
-
-## Testing notes
-
-- Testing runbook and required checks: `TESTING.md`.
-- Testing architecture and coverage model: `docs/testing/architecture.md`.
-- Root coverage scope is configured in `vitest.config.ts` as the single source of truth.
-- Root coverage excludes build artifacts (`**/dist/**`, `**/.output/**`) to avoid polluted reports.
-- Root coverage provider is `istanbul` to avoid V8 remap parse failures under Vite 8 dependency trees.
-- Extension browser tests run in Playwright via `packages/extension/vitest.browser.config.ts`.
-- Do not introduce jsdom-based tests in this repository.
+Use this file as the repo-wide router and source of global invariants. Read only
+the package guide and conditional runbook required by the task; do not preload
+every linked document.
+
+## Repository routing
+
+| Work area                     | Read next                       | Responsibility                                                                   |
+| ----------------------------- | ------------------------------- | -------------------------------------------------------------------------------- |
+| `packages/extension/`         | `packages/extension/AGENTS.md`  | Figma extension, UI, codegen, browser runtime, and MCP tool implementation       |
+| `packages/mcp-server/`        | `packages/mcp-server/AGENTS.md` | MCP server, Hub, transport, and tool exposure                                    |
+| `packages/shared/`            | `packages/shared/AGENTS.md`     | Shared schemas, types, and contracts                                             |
+| `packages/plugins/`           | `packages/plugins/AGENTS.md`    | Plugin transforms and sandboxed plugin-side code                                 |
+| `skill/` and `agent-plugins/` | This guide                      | Shared agent skills, manifests, compatibility wrappers, and marketplace metadata |
+
+For a cross-package change, read the guides for every affected package. For a
+repo-wide documentation, configuration, or release task, this root guide is the
+default authority unless a routed document says otherwise.
+
+## Repo-wide invariants
+
+- Package manager: `pnpm`. Prefer repo-level scripts unless a package guide
+  explicitly requires a filtered command.
+- Keep changes minimal and consistent with existing style. Do not add global
+  dependencies without explicit approval.
+- When a tool schema or shared contract changes, update `packages/shared` first,
+  then `packages/mcp-server`, then `packages/extension`.
+- Generated artifacts are not source. Follow the owning workflow and never edit
+  ignored or generated output to simulate a source change.
+- Do not create or amend commits unless explicitly requested. When creating a
+  commit, use Conventional Commits.
+- Keep pull request descriptions concise. Do not add a validation section unless
+  explicitly requested.
+
+## Agent plugin invariants
+
+- `agent-plugins/tempad-dev/` is the tracked release source shared by Codex and
+  Claude. The plugin is distributed through the Git marketplace, not npm.
+- Edit `skill/` for `figma-design-to-code`; the development generator copies it
+  into the tracked release plugin. Edit the tracked
+  `agent-plugins/tempad-dev/skills/figma-canvas-authoring/` source directly.
+- The portable `plugin.json` and `mcp.json` own shared manifest and MCP fields.
+  `pnpm agent-plugin:dev` synchronizes client compatibility wrappers, the copied
+  design-to-code skill, derived icons, and shared marketplace metadata; do not
+  hand-edit those derived fields or copies.
+- `.dev/plugins/tempad-dev-dev/` is the ignored local build. Generate it with
+  `pnpm agent-plugin:dev`; never edit it directly.
+- Run `pnpm agent-plugin:dev` after a change to any generator input, inspect all
+  tracked synchronized outputs, and include the intended release-source changes.
+  Ordinary `pnpm build` must not modify agent-plugin artifacts.
+- Keep Codex and Claude development support equivalent. Both manifests must
+  launch the same working-tree MCP runtime.
+- Release MCP configuration must use `@tempad-dev/mcp@latest`, never an alpha
+  tag, fixed version, or local path.
+- Before preparing, running, reviewing, or asking the user to test an end-to-end
+  Figma authoring task, read `docs/testing/agent-authoring-evolution.md`. It is
+  the sole detailed runbook for runtime refresh, plugin replacement, clean-task
+  identity, evidence review, fix placement, and candidate promotion.
+
+## Core commands
+
+Run these from the repo root:
+
+| Task                              | Command                       |
+| --------------------------------- | ----------------------------- |
+| Development                       | `pnpm dev`                    |
+| Build all packages                | `pnpm build`                  |
+| Typecheck                         | `pnpm typecheck`              |
+| Lint / auto-fix                   | `pnpm lint` / `pnpm lint:fix` |
+| Test once                         | `pnpm test:run`               |
+| Coverage                          | `pnpm test:coverage`          |
+| Format                            | `pnpm format`                 |
+| Generate development agent plugin | `pnpm agent-plugin:dev`       |
+
+Use package-owned commands from the applicable package guide when a narrower
+check is sufficient.
+
+## Conditional documentation
+
+| Task                                                    | Read first                                                      |
+| ------------------------------------------------------- | --------------------------------------------------------------- |
+| Test selection, required checks, or troubleshooting     | `TESTING.md`                                                    |
+| Test runtime or coverage architecture                   | `docs/testing/architecture.md`                                  |
+| End-to-end authoring evolution or live agent evaluation | `docs/testing/agent-authoring-evolution.md`                     |
+| Extension implementation or MCP behavior                | `packages/extension/AGENTS.md`, then its routed design document |
+| Public agent-plugin installation or usage documentation | `agent-plugins/tempad-dev/README.md`                            |
+| Marketing screenshot work                               | `docs/marketing-screenshots.md`                                 |
+
+## Verification
+
+Follow `TESTING.md` and every affected package guide. The default repository
+checks are:
+
+1. `pnpm typecheck`
+2. `pnpm lint`
+3. `pnpm test:run`
+
+Add build, browser, packaging, rewrite, coverage, or live Figma checks only when
+the routed guidance and change risk require them. Browser runtime tests must use
+Playwright; do not introduce jsdom-based tests.

CHANGELOG.md

@@ -2,4 +2,7 @@
 
 - Extension: [packages/extension/CHANGELOG.md](packages/extension/CHANGELOG.md)
 - MCP server: [packages/mcp-server/CHANGELOG.md](packages/mcp-server/CHANGELOG.md)
+- Agent Plugin: [agent-plugins/tempad-dev/CHANGELOG.md](agent-plugins/tempad-dev/CHANGELOG.md)
 - Plugins SDK: [packages/plugins/CHANGELOG.md](packages/plugins/CHANGELOG.md)
+
+For the coordinated publication process, see [Releasing](docs/releasing.md).