Files
webstudio/apps/builder/package.json
T
Oleg IsonenandClaude Fable 5 071a4d9a85 feat: MCP update 3 (#5864)
## Summary

This update adds new MCP and CLI capabilities for project auditing,
structured data, project-specific agent instructions, focused project
search, safer bulk editing, image descriptions, font discovery, visual
verification, and external registry inspection.

## New Capabilities

### Audit projects

- Run a single `audit` command across accessibility, SEO, security,
assets, styles, and performance.
- Limit an audit to selected scopes, pages, or severity levels.
- Receive stable findings with locations and suggested fixes.
- Run rendered audits across desktop, mobile, and Builder breakpoint
widths.
- Detect horizontal overflow, broken images, oversized images, eager
below-fold images, render-blocking resources, and legacy font formats.
- Identify unused assets, tokens, CSS variables, local styles, and
breakpoints.
- Identify duplicate token declarations.
- Detect accessibility issues involving names, labels, headings,
landmarks, IDs, keyboard focus, ARIA, iframes, and autoplaying media.
- Detect SEO issues involving titles, descriptions, language, social
images, and structured data.
- Detect unsafe new-tab links and write resources exposed during page
rendering.

### Search an entire project

- Search project text, labels, props, resources, assets, and styles
through `search-project`.
- Find relevant records without downloading and reparsing the full
project snapshot.
- Scope searches to the relevant project-data areas.

### Add validated JSON-LD

- Add structured data with a dedicated JSON-LD component.
- Place JSON-LD inside the page Head Slot.
- Edit JSON in a purpose-built code editor.
- Prevent structurally invalid JSON-LD from being saved.
- Validate Schema.org types, properties, and values.
- Find invalid, missing, unknown, deprecated, or incompatible structured
data through the SEO audit.
- Let agents discover the correct JSON-LD workflow without using page
custom metadata or a generic HTML embed.

### Configure project-specific agent instructions

- Add AI-agent instructions from the new **Agents** section in Project
Settings.
- Synchronize those instructions into a managed root `AGENTS.md`.
- Update or remove the managed file automatically during project sync.
- Protect existing user-owned `AGENTS.md` files from being overwritten.
- Share the instructions with authenticated CLI and MCP agents.
- Keep agent instructions out of publicly readable production bundles.

### Generate and manage image descriptions

- Audit image assets for missing descriptions.
- Let a vision-capable agent inspect each image in its rendered context.
- Save generated descriptions to multiple image assets in one operation.
- Mark images as intentionally decorative.
- Reuse the saved asset description wherever the image is used.
- Re-run the audit to verify that missing-description findings are
resolved.

### Perform bounded bulk replacements

- Replace matching literal text across selected pages with
`replace-text`.
- Replace matching fixed prop text with `replace-prop-text`.
- Replace matching resource names or URLs with `replace-resource-text`.
- Restrict replacements by page, instance, prop, resource, field, match
mode, and maximum change count.
- Leave dynamic expressions unchanged.

### Inspect element ancestry

- Return an element’s direct parent in instance listings.
- Request the complete ancestor chain when inspecting an element.
- Understand tree placement without rebuilding the instance hierarchy
from raw project data.

### Discover available fonts

- List uploaded font families through `list-fonts`.
- Discover available system font stacks.
- Inspect font family, style, weight, format, and associated asset
information before applying typography.

### Inspect external component registries

- Inspect a local or remote shadcn-style registry item.
- Read its description, files, dependencies, targets, and documentation.
- Receive an explicit Webstudio compatibility report.
- Inspect registry metadata without installing or executing external
code.

### Capture generated project routes directly

- Run `webstudio screenshot --path /route` against the configured
project.
- Generate a temporary production-style preview automatically.
- Capture the requested route.
- Stop the temporary preview after capture.
- Avoid manually building and starting a preview for a single
screenshot.

### Assert visual changes

- Add expected text to screenshot comparisons.
- Set maximum pixel mismatch limits.
- Set minimum or maximum changed-region counts.
- Assert whether overall brightness or a color channel moved in the
expected direction.
- Use these assertions as pass/fail evidence for visual changes.

### Require compatible CLI versions

- Send the project-bundle contract version with CLI synchronization
requests.
- Stop incompatible CLI versions before they receive incomplete project
data.
- Tell users exactly how to update the CLI or run the latest version
once.
- Prevent older clients from silently dropping project settings.

## Upgrade Note

This branch introduces a new synchronized project-bundle contract. Older
CLI versions must update before synchronizing against the new API.

```sh
npm install -g webstudio@latest
```

Or run the latest version once:

```sh
npx webstudio@latest <command>
```

---------

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
2026-07-12 11:27:58 +02:00

166 lines
6.6 KiB
JSON

{
"name": "@webstudio-is/builder",
"version": "0.0.0",
"private": true,
"description": "Webstudio Builder UI as a service",
"type": "module",
"scripts": {
"prebuild": "pnpm --filter=@webstudio-is/http-client... build && which remix",
"build": "remix vite:build",
"css-to-ws": "tsx --conditions=webstudio ../../packages/css-data/bin/css-to-ws.ts",
"build:webflow-presets": "pnpm css-to-ws ./app/shared/copy-paste/plugin-webflow/style-presets.css ./app/shared/copy-paste/plugin-webflow/__generated__/style-presets.ts",
"build:tailwind-preflight": "tsx --conditions=webstudio ./app/shared/tailwind/preflight-bin.ts && oxfmt ./app/shared/tailwind/__generated__/preflight.ts",
"generate-server-only-api-metadata": "tsx --conditions=webstudio --tsconfig tsconfig.json --import ../../scripts/register-react-global.ts ./scripts/generate-server-only-api-metadata.ts && (cd ../../packages/protocol && oxfmt src/builder-api/__generated__/server-only-router-operation-metadata.ts)",
"start": "remix-serve build/server/index.js",
"dev": "remix vite:dev",
"dev:auth": "DEBUG=ws:* remix vite:dev",
"e2e:ci": "tsx --env-file .env --env-file-if-exists .env.development --conditions=webstudio ./e2e/run.ts",
"e2e:local": "bash ./e2e/run-local.sh",
"e2e:dev:backend": "E2E_SKIP_CLEANUP=true E2E_RUN_TESTS=false E2E_START_POSTGREST=true E2E_DB_BOOTSTRAP=if-empty E2E_INSTALL_PLAYWRIGHT=false bash ./e2e/run-local.sh",
"e2e:dev": "E2E_SKIP_CLEANUP=true E2E_DB_BOOTSTRAP=if-empty E2E_INSTALL_PLAYWRIGHT=false E2E_BUILDER_URL=${E2E_BUILDER_URL:-https://127.0.0.1:3000} bash ./e2e/run-local.sh",
"typecheck": "tsc --noEmit --emitDeclarationOnly false",
"test": "vitest run"
},
"dependencies": {
"@atlaskit/pragmatic-drag-and-drop": "^1.7.4",
"@bomb.sh/args": "^0.3.1",
"@codemirror/autocomplete": "^6.18.6",
"@codemirror/commands": "^6.8.0",
"@codemirror/lang-css": "^6.3.1",
"@codemirror/lang-html": "^6.4.9",
"@codemirror/lang-javascript": "^6.2.3",
"@codemirror/lang-markdown": "^6.3.2",
"@codemirror/language": "^6.11.0",
"@codemirror/lint": "^6.8.5",
"@codemirror/state": "^6.5.2",
"@codemirror/view": "^6.36.4",
"@emotion/hash": "^0.9.2",
"@floating-ui/dom": "^1.6.13",
"@fontsource-variable/inter": "^5.0.20",
"@fontsource-variable/manrope": "^5.0.20",
"@fontsource/roboto-mono": "^5.0.18",
"@lexical/headless": "^0.21.0",
"@lexical/link": "^0.21.0",
"@lexical/react": "^0.21.0",
"@lexical/selection": "^0.21.0",
"@lexical/utils": "^0.21.0",
"@lezer/common": "^1.2.3",
"@lezer/css": "^1.1.11",
"@lezer/highlight": "^1.2.1",
"@nanostores/react": "^0.8.0",
"@nkzw/use-relative-time": "^1.1.0",
"@radix-ui/react-select": "^2.2.2",
"@radix-ui/react-tooltip": "^1.2.4",
"@react-aria/interactions": "^3.23.0",
"@react-aria/utils": "^3.27.0",
"@remix-run/express": "^2.16.5",
"@remix-run/node": "^2.16.5",
"@remix-run/react": "^2.16.5",
"@remix-run/serve": "^2.16.5",
"@remix-run/server-runtime": "^2.16.5",
"@trpc/client": "^10.45.2",
"@trpc/server": "^10.45.2",
"@tsndr/cloudflare-worker-jwt": "^2.5.3",
"@tus/file-store": "^2.1.0",
"@tus/s3-store": "^2.0.4",
"@tus/server": "^2.4.1",
"@unocss/core": "66.6.8",
"@vercel/remix": "2.15.3",
"@webstudio-is/asset-uploader": "workspace:*",
"@webstudio-is/authorization-token": "workspace:*",
"@webstudio-is/css-data": "workspace:*",
"@webstudio-is/css-engine": "workspace:*",
"@webstudio-is/dashboard": "workspace:*",
"@webstudio-is/design-system": "workspace:*",
"@webstudio-is/domain": "workspace:*",
"@webstudio-is/feature-flags": "workspace:*",
"@webstudio-is/fonts": "workspace:*",
"@webstudio-is/html-data": "workspace:*",
"@webstudio-is/http-client": "workspace:*",
"@webstudio-is/icons": "workspace:*",
"@webstudio-is/image": "workspace:*",
"@webstudio-is/plans": "workspace:*",
"@webstudio-is/postgrest": "workspace:*",
"@webstudio-is/project": "workspace:*",
"@webstudio-is/project-build": "workspace:*",
"@webstudio-is/project-migrations": "workspace:*",
"@webstudio-is/protocol": "workspace:*",
"@webstudio-is/react-sdk": "workspace:*",
"@webstudio-is/sdk": "workspace:*",
"@webstudio-is/sdk-components-animation": "workspace:*",
"@webstudio-is/sdk-components-react": "workspace:*",
"@webstudio-is/sdk-components-react-radix": "workspace:*",
"@webstudio-is/sdk-components-registry": "workspace:*",
"@webstudio-is/sync-client": "workspace:*",
"@webstudio-is/template": "workspace:*",
"@webstudio-is/trpc-interface": "workspace:*",
"@webstudio-is/wsauth": "workspace:*",
"args-tokenizer": "^0.3.0",
"bcp-47": "^2.1.0",
"change-case": "^5.4.4",
"colorjs.io": "^0.6.1",
"cookie": "^1.0.1",
"css-tree": "^3.1.0",
"debug": "^4.3.7",
"downshift": "^6.1.7",
"entrijs": "^0.0.11",
"express": "^4.21.1",
"fast-deep-equal": "^3.1.3",
"immer": "^10.1.1",
"immerhin": "^0.10.0",
"isbot": "^5.1.25",
"lexical": "^0.21.0",
"match-sorter": "^8.0.0",
"micromark": "^4.0.2",
"micromark-extension-gfm": "^3.0.0",
"nanoevents": "^9.1.0",
"nanoid": "^5.1.5",
"nanostores": "^0.11.3",
"picocolors": "^1.1.1",
"pretty-bytes": "^6.1.1",
"react": "18.3.0-canary-14898b6a9-20240318",
"react-dom": "18.3.0-canary-14898b6a9-20240318",
"react-error-boundary": "^5.0.0",
"remix-auth": "^3.7.0",
"remix-auth-form": "^1.5.0",
"remix-auth-github": "^1.7.0",
"remix-auth-google": "^2.0.0",
"remix-auth-oauth2": "^2.3.0",
"shallow-equal": "^3.1.0",
"slugify": "^1.6.6",
"strip-indent": "^4.0.0",
"tiny-invariant": "^1.3.3",
"title-case": "^4.3.2",
"urlpattern-polyfill": "^10.1.0",
"use-debounce": "^10.0.4",
"valid-filename": "^4.0.0",
"warn-once": "^0.1.1",
"zod": "^4.4.3",
"zod-validation-error": "^5.0.0"
},
"devDependencies": {
"@remix-run/dev": "^2.16.5",
"@types/debug": "^4.1.12",
"@types/dom-navigation": "^1.0.5",
"@types/express": "^4.17.21",
"@types/react": "^18.2.70",
"@types/react-dom": "^18.2.25",
"@unocss/preset-wind4": "^66.6.8",
"@vitest/coverage-v8": "3.1.2",
"@webstudio-is/tsconfig": "workspace:*",
"css.escape": "^1.5.1",
"fast-glob": "^3.3.2",
"html-tags": "^4.0.0",
"msw": "^2.13.2",
"playwright": "^1.50.1",
"react-router-dom": "^6.30.0",
"react-test-renderer": "18.3.0-canary-14898b6a9-20240318",
"type-fest": "^4.37.0",
"typescript": "7.0.2",
"vite": "^6.3.4",
"vitest": "^3.1.2"
},
"sideEffects": false,
"license": "AGPL-3.0-or-later"
}