📦 deps(thirdparty): update snapshots

2026-07-20 00:03:02 +00:00
parent 47ce7f78dc
commit 2c00adccd5
1216 changed files with 10376 additions and 90058 deletions
@@ -0,0 +1,82 @@
+# Setup
+
+## Prerequisites
+
+- **Node 18+** and **Python 3.x**
+- **Claude Code** with plugins enabled (run `/plugin` once to enable)
+
+## 1. One-shot setup
+
+```bash
+./scripts/setup.sh
+```
+
+This installs the audit dependencies (Playwright + Chromium) and the `ui-ux-pro-max` skill,
+then prints the two steps that must happen inside Claude Code.
+
+## 2. Install the taste plugin (inside Claude Code)
+
+```
+/plugin install frontend-design@anthropics/claude-code
+```
+
+## 3. Approve the MCP servers
+
+Open Claude Code in this directory. It reads `.mcp.json` and prompts you to approve the project
+MCP servers (**playwright**, **chrome-devtools**, **shadcn**). Approve them. `.claude/settings.json`
+already sets `enableAllProjectMcpServers: true`, so they load on start. Verify with `/mcp`.
+
+That's it — `CLAUDE.md` defines the design loop and loads automatically.
+
+## Verify it works
+
+```
+> /design-plan portfolio site for a photographer, editorial and minimal
+> Build the hero, then screenshot it at 375px and 1440px and fix anything that breaks.
+> /design-review http://localhost:3000
+```
+
+You should see Claude pull tokens from `ui-ux-pro-max`, open a browser, screenshot, and return
+ranked findings.
+
+## Standalone audit (no Claude needed)
+
+```bash
+npm run audit -- --url http://localhost:3000
+npm run audit -- --file ./index.html
+```
+
+Outputs `audit-output/report.md` + per-viewport screenshots. Exit code is non-zero when there
+are high-severity findings (useful for CI — see `.github/workflows/design-review.yml`).
+
+---
+
+## Optional add-ons
+
+### Figma Dev Mode MCP
+Requires the Figma desktop app. Enable Dev Mode → toggle the MCP server on. Then add to
+`.mcp.json`:
+
+```json
+"figma": { "url": "http://127.0.0.1:3845/mcp" }
+```
+
+Guide: <https://help.figma.com/hc/en-us/articles/39888612464151-Claude-Code-and-Figma-Set-up-the-MCP-server>
+
+### 21st.dev Magic MCP
+Generates React components from a prompt. Get an API key at <https://21st.dev>, then add:
+
+```json
+"magic": { "command": "npx", "args": ["-y", "@21st-dev/magic@latest"], "env": { "API_KEY": "<your-key>" } }
+```
+
+Keep keys out of git — prefer `.claude/settings.local.json` or your shell env, both gitignored.
+
+## Troubleshooting
+
+- **`/mcp` shows a server failed** — run its command manually to see the error, e.g.
+  `npx -y @playwright/mcp@latest`. Usually a Node version or network/proxy issue.
+- **Audit can't find Chromium** — run `npx playwright install chromium`, or set
+  `PW_EXECUTABLE_PATH` to your Chromium binary.
+- **ui-ux-pro-max command not found** — re-run `npx ui-ux-pro-max-cli init --ai claude` and
+  check the printed skill path; use that path in the `python3 …/search.py` commands.