This PR expands Webstudio MCP and CLI into a more complete agent
authoring interface. Agents can discover project capabilities, edit real
Webstudio content, use data/resources, verify visual output, and report
useful issues when workflows fail.
## MCP User Capabilities
- Create, update, duplicate, reorder, and delete pages.
- Create pages from templates and manage reusable page templates.
- Inspect project pages, instances, props, styles, assets, variables,
resources, and metadata.
- Insert Webstudio components and authored JSX fragments into pages.
- Edit text, props, styles, breakpoints, design tokens, and CSS
variables.
- Update page metadata, SEO fields, redirects, marketplace metadata, and
project settings.
- Create and use static data variables.
- Create and use dynamic resources fetched over HTTP.
- Use REST, GraphQL, and built-in system resources in authored pages.
- Bind data variables and resources to visible page content.
- Create resource-backed pages such as sitemap XML, structured SEO data,
and API-driven content sections.
- Preview current project state without requiring a publish step.
- Capture screenshots for visual verification.
- Verify responsive designs across desktop, tablet, and mobile
breakpoints.
- Use screenshot diff and OCR-style checks to inspect rendered output.
- Reset and refresh local MCP project state when needed.
- Discover available CLI/MCP commands from generated manuals.
- Use clearer examples for resources, data variables, JSX authoring,
previewing, and visual checks.
- Read marketplace product metadata without requiring a full project
snapshot.
- Get safer guidance when using low-level patch tools.
- Get a ready-to-copy Discord report template when MCP/CLI behavior is
confusing or broken.
Here moved our utility polyfill for Map.groupBy into shims module we are
using for all stuff we will replace with native methods.
Used it in marketplace to group by category.
Ref https://github.com/webstudio-is/webstudio/issues/2532
Here refactored props values computing to reuse in both canvas and
settings panel and support future collections which need to provide
different values for same variables.
Grouped whole logic and covered with tests.
## Testing
- check image src is working
- check link switch page in preview
Here a little refactored copy paste instance plugin.
Now we copy all data including slots and tokens though paste write them
as is or do not write at all if already exist.
This let us to not do unnecessary patches for copy paste within project
while still have whole UI pasted in different project.
There is still a problem with pasting styles which always have different
breakpoint ids in each project. We will need to implement merging in
other PR.
Oleg Isonen