Skip to main content
Glama

Add a design you authored as a variation

import_design_variation

Append a design YOU author as a NEW variation on an existing site — for offering an alternative layout alongside the current one. WHETHER IT BECOMES ACTIVE: on a site still choosing between designs it is made the active design (pass make_active: false to only add it); on a BUILT site it is only added — the site keeps its chosen design, because that is what publish ships — unless you pass make_active: true, which you should do only when the user has explicitly asked to switch to it. The response says which happened (made_active). This is a WHOLE-SITE design: to try a different version of ONE page (the home page included) without touching the live page, use create_page_draft instead. Same payload shape as create_site_from_design, plus site_id. The site must already have a design. Same authoring contract: brand colors as var(--color-) CSS variables (theme-swappable), and prefer @/components/Runtime components over hand-built ones (workflow components need owner activation — add those via refine_site). To change ONE file of an existing design, use update_variation_file instead, and to add ONE new page you wrote, use add_page with code — this tool burns a variation slot. The import is recorded in version history and the previous active design stays intact, so it can be undone with restore_version or switch_variation. To instead have MONDOVO generate an alternative variation, use generate_design_variation.

Input Schema

NameRequiredDescriptionDefault
filesYesSelf-contained component files; one page with slug "/"
contentYesStructured content keyed by section; code reads content.X by exact key
site_idYesThe existing site to add the variation to
businessNoBusiness context — REQUIRED for good catalog detail-page copy
user_goalNoOptional: the user's goal behind this call, in one short sentence of plain words (e.g. "add a page so customers can book tables"). No names, emails or other personal details.
collectionsNoDeclared catalog collections (menu/products/etc.) with sampleItems
make_activeNoMake the imported design the site's active design. Default: true while the site is still choosing between designs; false on a built site, where the active design is what gets published — pass true there only when the user asked to switch.
idempotency_keyNoStable key for this creation attempt. Pass the same value when retrying after a timeout or network error and you get the ORIGINAL site back instead of a duplicate. Use a fresh key for a genuinely new site.

Schema Changelog

Changes observed during successful MCP inspections.

  1. Changed1 schema field changed
    • addedInput schema / properties / user_goal
      Added value: +{
      +  "description": "Optional: the user's goal behind this call, in one short sentence of plain words (e.g. \"add a page so customers can book tables\"). No names, emails or other personal details.",
      +  "type": "string"
      +}
  2. Changed1 schema field changed
    • changedInput schema / properties / files / items / properties / code / description
      Previous value: -"Complete self-contained TSX. Sections receive { content }. Allowed imports: react, react-dom, lucide-react, framer-motion, clsx, tailwind-merge, embla-carousel-react; relative chrome (pages only); AND platform components via \"@/components/Runtime*\" (see PLATFORM COMPONENTS). Anything else fails validation. COLORS (so the design is theme-swappable in the editor): define your brand palette as CSS variables in a theme block (\":root { --color-primary; --color-secondary; --color-accent; + shades }\") and reference them as var(--color-primary) everywhere brand color appears. Neutrals (white/black/greys) may be literal Tailwind classes. Do NOT hardcode brand hues as bg-indigo-600 or #hex — they will not be recolorable and defeat the palette switcher. PLATFORM COMPONENTS: prefer \"@/components/Runtime*\" over hand-building. Self-wiring (safe to use directly in an authored import): RuntimeOwnedVideo (Owned video with required src, poster and title; mode=\"hero\" for a muted loop, mode=\"testimonial\" for click-to-play. Respects reduced motion.), RuntimeForm (Site form; write its field config to content.forms[]), RuntimeInquiryForm (Enquiry form; field config in content.forms[]), RuntimeQuoteForm (Quote-request form; field config in content.forms[]), RuntimeDataView (renders rows a section is bound to; pass items={content.<section>?.items} — it makes no requests of its own), RuntimeCategoryListing (category listing over the site catalog), RuntimeQuiz (multi-step quiz), RuntimeDirectorySearch (hero search that takes visitors to the directory, filtered), RuntimeDirectoryListingDetail (the page for one business in a directory), RuntimeDirectoryRankedPage (a \"Best {niche} in {area}\" page, ranked from the directory), RuntimeAreaLinks (links to the \"Best in <area>\" pages a directory publishes), RuntimeFacetedCatalog (faceted catalog browse + filter), RuntimeGallery (image gallery + optional screenshot tour + lightbox), RuntimeAccordion (accordion / FAQ), RuntimeCarousel (carousel / slider), RuntimeTabs (tabbed panels), RuntimeMap (embedded map). Owner-setup-required (these render but stay INERT on import until the owner activates the feature — do NOT rely on them in authored code; add them through refine_site instead, which runs the activation pipeline): RuntimeBookingWidget, RuntimeBookingDirectory (Team or branches cards from Appointments, each with a Book button), RuntimePaymentButton, RuntimeCart, RuntimeProductDetail, RuntimeCheckout, RuntimeFunnelCheckout, RuntimeFunnelOptin, RuntimeFunnelUpsell, RuntimeListingClaim (\"is this your business?\" claim + report form for a directory listing), RuntimeListingUpgrade (paid placement picker for a directory listing), RuntimeListingSubmit (public \"add your business\" form for a directory), RuntimeCustomerPortal, RuntimePortalCollection."New value: +"Complete self-contained TSX. Sections receive { content }. Allowed imports: react, react-dom, lucide-react, framer-motion, clsx, tailwind-merge, embla-carousel-react; relative chrome (pages only); AND platform components via \"@/components/Runtime*\" (see PLATFORM COMPONENTS). Anything else fails validation. COLORS (so the design is theme-swappable in the editor): define your brand palette as CSS variables in a theme block (\":root { --color-primary; --color-secondary; --color-accent; + shades }\") and reference them as var(--color-primary) everywhere brand color appears. Neutrals (white/black/greys) may be literal Tailwind classes. Do NOT hardcode brand hues as bg-indigo-600 or #hex — they will not be recolorable and defeat the palette switcher. PLATFORM COMPONENTS: prefer \"@/components/Runtime*\" over hand-building. Self-wiring (safe to use directly in an authored import): RuntimeOwnedVideo (Owned video with required src, poster and title; mode=\"hero\" for a muted loop, mode=\"testimonial\" for click-to-play. Respects reduced motion.), RuntimeForm (Site form; write its field config to content.forms[]), RuntimeInquiryForm (Enquiry form; field config in content.forms[]), RuntimeQuoteForm (Quote-request form; field config in content.forms[]), RuntimeDataView (renders rows a section is bound to; pass items={content.<section>?.items} — it makes no requests of its own), RuntimeCategoryListing (category listing over the site catalog), RuntimeQuiz (multi-step quiz), RuntimeDirectorySearch (hero search that takes visitors to the directory, filtered), RuntimeDirectoryListingDetail (the page for one business in a directory), RuntimeDirectoryRankedPage (a \"Best {niche} in {area}\" page, ranked from the directory), RuntimeAreaLinks (links to the \"Best in <area>\" pages a directory publishes), RuntimeFacetedCatalog (faceted catalog browse + filter), RuntimeGallery (image gallery + optional screenshot tour + lightbox), RuntimeAccordion (accordion / FAQ), RuntimeCarousel (carousel / slider), RuntimeTabs (tabbed panels), RuntimeMap (embedded map), RuntimeBrandIcon (Brand logos in brand colours (Instagram, Facebook, X, LinkedIn, TikTok, Pinterest, WhatsApp, YouTube, Google, Yelp…): <RuntimeBrandIcon brand=\"pinterest\" className=\"h-5 w-5\" />.). Owner-setup-required (these render but stay INERT on import until the owner activates the feature — do NOT rely on them in authored code; add them through refine_site instead, which runs the activation pipeline): RuntimeBookingWidget, RuntimeBookingDirectory (Team or branches cards from Appointments, each with a Book button), RuntimePaymentButton, RuntimeCart, RuntimeProductDetail, RuntimeCheckout, RuntimeFunnelCheckout, RuntimeFunnelOptin, RuntimeFunnelUpsell, RuntimeListingClaim (\"is this your business?\" claim + report form for a directory listing), RuntimeListingUpgrade (paid placement picker for a directory listing), RuntimeListingSubmit (public \"add your business\" form for a directory), RuntimeCustomerPortal, RuntimePortalCollection."
  3. First observed

TDQS

A4.7/5.0
Behavior5/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

It discloses behavior beyond the annotations: conditional activation on built vs. still-choosing sites, the make_active escape hatches, that the response reports made_active, that a variation slot is consumed, that the previous active design stays intact and can be undone with restore_version/switch_variation. That is meaningful consequence-of-call information the annotations only hint at.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The activation rule is front-loaded and every clause is substantive, though long run-on sentences and heavy capitalization make it dense to parse. The brand-color/Runtime* restatement duplicates the schema's `code` description, which is the one clearly redundant passage.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For an 8-param, nested-schema mutation tool with no output schema, the description covers the decision-relevant behavior (activation, undo path, slot cost, authoring contract reference). It does not describe what the returned variation object contains beyond made_active, nor retry/idempotency behavior, which leaves a small gap.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

With 100% schema coverage the baseline is 3, and the description earns a point by explaining the make_active default logic and its site-state dependency far beyond the schema text, plus "same payload shape as create_site_from_design, plus site_id." It adds little on files/content/collections/idempotency_key, which the schema already covers well.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

"Append a design YOU author as a NEW variation on an existing site" gives a specific verb, resource and scope (whole-site, not per-page). It explicitly names the near-miss siblings (create_page_draft, update_variation_file, add_page, generate_design_variation) so an agent can separate this from them without opening schemas.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines5/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

It states when to use it and when not to, with alternatives named for each case: one page → create_page_draft, one file → update_variation_file, one new page with code → add_page, generated alternative → generate_design_variation. It also adds a prerequisite ("The site must already have a design").

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Try in Browser

Glama MCP Gateway

Add one secure layer between your agents and this server.

Resources