Contract backed
Schemas, manifest metadata, editor fields, accessibility, and i18n remain attached to the block type.
- 1 registered contract
- Ensemble schema id
- Editor category metadata
Explore theme-preview-matrix as a composable block: contract metadata, multiple configuration defaults, and every theme recipe rendered against the same sample content.
Schemas, manifest metadata, editor fields, accessibility, and i18n remain attached to the block type.
The documentation route renders through native, alias, wrapped, or nonvisual runtime support without generic fallback UI.
Default, media, background, gradient, colorway, dense, and editorial configurations are all visible.
Every Theme Studio recipe has a focused page and an inline preview for this block.
CMS authors can lift structured payload recipes for default, media, operator, and stress contexts.
Default, empty, pending, active, invalid, and disabled states are documented for every cloneable block recipe.
Media replacement, long copy, and awkward content tolerance are represented in the documented defaults.
Baseline contract props with the selected recipe and standard system preset.
A compact matrix configuration for documenting this governed operator block.
Shows the block alongside Cloud Elephants placeholder media so image, card, and media spacing are visible.

A compact matrix configuration for documenting this governed operator block.
Places the component on a Cloud Elephants image-backed documentation frame for hero, CTA, and overlay-style review.
A compact matrix configuration for documenting this governed operator block.
Uses a strong gradient shell to prove contrast, buttons, and panels in energetic brand treatments.
A compact matrix configuration for documenting this governed operator block.
Electric blue, coral, and deep navy for launch and high-contrast hero treatments.
A compact matrix configuration for documenting this governed operator block.
Aqua, white, ink, and operator blue for service, contact, and listing pages.

A compact matrix configuration for documenting this governed operator block.
Coral, magenta, electric blue, and warm white for announcements and campaign pages.

A compact matrix configuration for documenting this governed operator block.
Mist, ink, slate, blue, and coral for editorial and proof-heavy surfaces.
A compact matrix configuration for documenting this governed operator block.
Compact operator layout with dashboard-style controls and tighter spacing.
A compact matrix configuration for documenting this governed operator block.
Roomier narrative treatment for content, FAQ, testimonials, and feature blocks.
A compact matrix configuration for documenting this governed operator block.
Smallest useful CMS payload with the block type, stable id, editable props, and recipe-aware appearance.
theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable.
background, panel, panelElevated, borderCopy fields map to primary and muted text roles so editors can change words without restyling the block.
text, textMutedMedia fields stay isolated from copy and action regions so replacement assets preserve the recipe layout.
panelElevated, borderAction regions use recipe button and accent tokens while preserving href or event payloads.
button, buttonText, signal, uplinkCollection regions define repeatable item boundaries for add, remove, reorder, and nested editing.
panel, panelElevated, border, badgeFeedback regions tie state-readiness evidence to visible recipe status treatments.
badge, badgeText, signalUse when a theme-preview-matrix block should land quickly with balanced Polished SaaS defaults.
Minimal Default is a high-complexity quick-start recipe with 6 documented composition slots.
3 required regions, 3 optional regions.
theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages.
6 page types mapped for theme-preview-matrix.Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.theme-preview-matrix can act as collection, media, content within a composed page.
6 anatomy regions produce 4 section roles.Place the block where its required anatomy regions have enough room before compressing it into dense page slots.Minimal Default composition passport is copy-led, media-led, cta-led, repeatable for CMS composition.
29/29 fields are editable across 4 content models.Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.theme-preview-matrix is compatible with noninteractive content sections.
0 action surfaces and 0 control surfaces mapped.Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.theme-preview-matrix uses quick-start authoring with high complexity.
29 default provenance items with 0 high-care replacements.Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages.
3 responsive behavior maps cover phone, tablet, and desktop composition.Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers.
default treatment uses comfortable density and 14px radius base.background, panel, panelElevated, borderPrimary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text.
6/6 contrast checks pass the AA target.text, textMuted, badgeTextNo unexpected interactive surface is introduced for this noninteractive recipe.
0 action surfaces and 0 control surfaces mapped.button, buttonText, control, controlText, signal, uplinkReplaceable media stays framed separately from copy and action regions so asset swaps preserve the layout.
Media region is isolated with replaceable fields.panelElevated, border, textMutedFeedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning.
6 state-readiness entries include default, empty, pending, active, invalid, disabled.badge, badgeText, signalPhone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe.
single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.panel, border, controlCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadKeep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.
Polished SaaS recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.
Polished SaaS recipe tokensKeep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.
Polished SaaS recipe tokensKeep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.
Polished SaaS recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.
Polished SaaS recipe tokensReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
CMS route, URL, or canonical postEvent pathCopy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish.
CMS route, URL, or canonical postEvent pathReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
Polished SaaS recipe tokensKeep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.
cloneable block recipe payloadMedia should use a replaceable URL plus meaningful alt, label, or title fallback.
Cloud Elephants placeholder media or CMS media libraryActions should resolve to a URL or event name with a human-readable label.
CMS route, URL, or canonical postEvent pathCollections should support add, remove, reorder, and item-level editing without changing block shape.
cloneable block recipe payloadStyle fields should prefer recipe or appearance tokens over one-off inline values.
Polished SaaS recipe tokensContent should remain serializable JSON and preserve the documented block contract.
cloneable block recipe payloadPolished SaaS tokens with default documentation treatment
The Polished SaaS recipe renders a contract-safe primary state for theme-preview-matrix.Reserved panel space with fallback copy or placeholder media
Repeatable fields are documented for add, remove, reorder, and item-level editing.Neutral reserved frame with status copy and no layout shift
Static recipe payloads reserve the same documented frame while content is loading.Signal/uplink emphasis with visible selected-state chips
Recipe and block selection evidence is rendered in the documentation chrome.Warning/danger status treatment while preserving the block frame
Media guidance requires URL plus accessible fallback text for invalid or missing assets.Muted affordance with preserved label, spacing, and hit-area rhythm
Noninteractive blocks retain evidence labels without pretending to be clickable.No public action surface is needed for this payload.
No input control is needed for this payload.
theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview.
runtime block sections, cards, lists, and headingsThe payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances.
static content has no hidden focus trapMedia-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders.
media fields include alt/label/title fallbacksNo input controls are present, so there are no unlabeled fields to remediate.
no input controls in this payloadRecipe defaults avoid motion-only meaning and keep status text inspectable when state is present.
runtime evidence avoids hidden status-only contentPolished SaaS stacks theme-preview-matrix into one phone column with comfortable spacing and bounded content.
min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.Polished SaaS adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout.
tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.Polished SaaS gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing.
desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.A compact matrix configuration for documenting this governed operator block.
{
"id": "block-doc-theme-preview-matrix-data-minimal-default",
"block_type": "theme-preview-matrix",
"props": {
"title": "Theme preview matrix sample",
"description": "A compact matrix configuration for documenting this governed operator block.",
"presets": [
"shadcn"
],
"recipes": [
"polished-saas"
],
"block_types": [
"hero"
],
"block_collections": [
{
"id": "single-block",
"label": "Single Block",
"description": "Compact documentation preview.",
"block_types": [
"hero"
]
}
],
"preview_layout": "flow",
"default_theme": "ensemble-daylight",
"default_preset": "shadcn",
"default_recipe": "polished-saas",
"default_block_collection": "single-block",
"default_design_configuration": "base",
"default_media_placeholder": "block-doc-preview-media",
"design_configurations": [
{
"id": "base",
"label": "Default",
"description": "Baseline contract props with the selected recipe and standard system preset.",
"theme": {}
}
],
"media_placeholders": [
{
"id": "block-doc-preview-media",
"label": "Essential CTO",
"src": "https://storage.googleapis.com/msgsndr/T3RhpcTQAq7Qb47kPQAB/media/677815b8c290c684d5bf3fbd.png",
"alt": "Cloud Elephants Essential CTO service visual.",
"aspect_ratio": "16 / 9",
"source_url": "https://go.cloudelephants.com/a-la-carte"
}
]
},
"block_order": 1,
"metadata": {
"composition_recipe": {
"id": "minimal-default",
"intent": "default",
"label": "Minimal Default",
"recipe": "polished-saas",
"source": "block-explorer",
"quality_proof": [
"composition"
],
"composition_passport": {
"id": "minimal-default",
"label": "Minimal Default composition passport",
"intent": "default",
"recipe": "polished-saas",
"authoring_mode": "quick-start",
"complexity": "high",
"fit": "Use when a theme-preview-matrix block should land quickly with balanced Polished SaaS defaults.",
"required_regions": [
"surface",
"copy",
"feedback"
],
"optional_regions": [
"media",
"actions",
"collection"
],
"slots": [
{
"id": "surface",
"label": "Surface",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"required": true,
"field_count": 7,
"editable_count": 7,
"token_roles": [
"text",
"textMuted"
],
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"required": false,
"field_count": 6,
"editable_count": 6,
"token_roles": [
"panelElevated",
"border"
],
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"required": false,
"field_count": 1,
"editable_count": 1,
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"required": false,
"field_count": 5,
"editable_count": 5,
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"badge",
"badgeText",
"signal"
],
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"builder_field_count": 29,
"editable_field_count": 29,
"action_count": 0,
"control_count": 0,
"replacement_guidance": [
"Keep Polished SaaS recipe tokens as the source of visual styling for the surface, text, controls, and actions.",
"Replace media URLs through the CMS media library and preserve alt, title, provider, or label fallbacks.",
"No action wiring is required for this recipe; avoid inventing clickable surfaces in content.",
"No input controls are required; keep the recipe focused on its documented display regions.",
"Treat collection regions as repeatable slots that support add, remove, reorder, and item-level editing."
],
"publish_checklist": [
"Validate theme-preview-matrix against its block contract before publishing.",
"3 required anatomy regions remain present: surface, copy, feedback.",
"29/29 builder fields are CMS-editable or intentionally locked.",
"Noninteractive presentation has no unexpected action or control surfaces.",
"Phone, tablet, and desktop responsive behavior maps have been reviewed for wrapping and overflow.",
"Contrast checks meet the AA recipe target."
],
"agent_notes": [
"Prefer editing props fields described by the builder field map; metadata is evidence, not primary content.",
"Preserve recipe_alignment token roles unless the page theme or recipe changes intentionally.",
"Use the anatomy slots to compose or replace content without changing the block type."
],
"summary": "Minimal Default is a high-complexity quick-start recipe with 6 documented composition slots."
},
"composition_passport_complexity": "high",
"composition_passport_authoring_mode": "quick-start",
"composition_passport_slots": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"composition_passport_check_count": 6,
"visual_polish_check_count": 6,
"visual_polish_pass_count": 6,
"visual_polish_checks": [
{
"id": "surface-rhythm",
"label": "Surface rhythm",
"axis": "layout",
"status": "ready",
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"evidence": "default treatment uses comfortable density and 14px radius base.",
"summary": "theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers."
},
{
"id": "type-hierarchy",
"label": "Type hierarchy",
"axis": "typography",
"status": "ready",
"token_roles": [
"text",
"textMuted",
"badgeText"
],
"evidence": "6/6 contrast checks pass the AA target.",
"summary": "Primary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text."
},
{
"id": "action-clarity",
"label": "Action clarity",
"axis": "interaction",
"status": "ready",
"token_roles": [
"button",
"buttonText",
"control",
"controlText",
"signal",
"uplink"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"summary": "No unexpected interactive surface is introduced for this noninteractive recipe."
},
{
"id": "media-treatment",
"label": "Media treatment",
"axis": "media",
"status": "ready",
"token_roles": [
"panelElevated",
"border",
"textMuted"
],
"evidence": "Media region is isolated with replaceable fields.",
"summary": "Replaceable media stays framed separately from copy and action regions so asset swaps preserve the layout."
},
{
"id": "state-feedback",
"label": "State feedback",
"axis": "state",
"status": "ready",
"token_roles": [
"badge",
"badgeText",
"signal"
],
"evidence": "6 state-readiness entries include default, empty, pending, active, invalid, disabled.",
"summary": "Feedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning."
},
{
"id": "responsive-balance",
"label": "Responsive balance",
"axis": "responsive",
"status": "ready",
"token_roles": [
"panel",
"border",
"control"
],
"evidence": "single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.",
"summary": "Phone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe."
}
],
"visual_polish_axes": [
"layout",
"typography",
"interaction",
"media",
"state",
"responsive"
],
"default_provenance_count": 29,
"default_provenance_map": [
{
"path": "title",
"label": "Title",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Title defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "description",
"label": "Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Description defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "presets",
"label": "Presets",
"field_role": "style",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Presets defaults from Polished SaaS recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "recipes",
"label": "Recipes",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Recipes defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "block_types",
"label": "Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections",
"label": "Block Collections",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Preview Layout defaults from Polished SaaS recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_theme",
"label": "Default Theme",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Theme defaults from Polished SaaS recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_preset",
"label": "Default Preset",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Preset defaults from Polished SaaS recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Recipe defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Default Block Collection defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Design Configuration defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Default Media Placeholder defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"field_role": "style",
"value_type": "object",
"editable": true,
"repeated": true,
"default_source": "Polished SaaS recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Design Configurations Item Theme defaults from Polished SaaS recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"field_role": "media",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Id defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Media Placeholders Item Label defaults from cloneable block recipe payload; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Src defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Alt defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Aspect Ratio defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"field_role": "action",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "CMS route, URL, or canonical postEvent path",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"summary": "Media Placeholders Item Source Url defaults from CMS route, URL, or canonical postEvent path; replacement is medium risk with requires-alt-text policy."
}
],
"default_replacement_policies": [
"collection-item",
"locked-token",
"requires-alt-text",
"safe-to-edit"
],
"default_replacement_risks": [
"low",
"medium"
],
"default_replacement_high_risk_count": 0,
"content_edit_bundle_count": 6,
"content_edit_bundles": [
{
"id": "copy",
"label": "Copy bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"type hierarchy",
"mobile wrapping"
],
"summary": "Copy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "media",
"label": "Media bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"default_sources": [
"Cloud Elephants placeholder media or CMS media library"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy alt text",
"responsive fit"
],
"summary": "Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "actions",
"label": "Action bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"media_placeholders[].source_url"
],
"default_sources": [
"CMS route, URL, or canonical postEvent path"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy labels"
],
"summary": "Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish."
},
{
"id": "collections",
"label": "Collection bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"item shape",
"responsive wrapping"
],
"summary": "Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "style",
"label": "Style bundle",
"intent": "guarded",
"edit_mode": "guarded-system",
"field_paths": [
"default_preset",
"default_theme",
"design_configurations[].theme",
"presets",
"preview_layout"
],
"default_sources": [
"Polished SaaS recipe tokens"
],
"guardrails": [
"Keep visual styling aligned to Polished SaaS recipe tokens unless the recipe itself changes."
],
"depends_on": [
"theme recipe tokens",
"contrast proof"
],
"summary": "Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "content",
"label": "Content bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"default_design_configuration",
"default_recipe",
"design_configurations",
"design_configurations[].id",
"recipes"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"contract-safe JSON"
],
"summary": "Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
}
],
"content_edit_bundle_ids": [
"copy",
"media",
"actions",
"collections",
"style",
"content"
],
"content_edit_bundle_modes": [
"guarded-system",
"repeatable-items"
],
"content_edit_bundle_required_count": 2,
"content_edit_bundle_guarded_count": 1,
"recipe_compatibility_count": 6,
"recipe_compatibility_map": [
{
"id": "page-context",
"label": "Page context",
"axis": "page",
"fit": "primary",
"values": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"evidence": "6 page types mapped for theme-preview-matrix.",
"guardrail": "Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.",
"summary": "theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages."
},
{
"id": "section-role",
"label": "Section role",
"axis": "layout",
"fit": "supporting",
"values": [
"collection",
"media",
"content",
"metadata"
],
"evidence": "6 anatomy regions produce 4 section roles.",
"guardrail": "Place the block where its required anatomy regions have enough room before compressing it into dense page slots.",
"summary": "theme-preview-matrix can act as collection, media, content within a composed page."
},
{
"id": "content-model",
"label": "Content model",
"axis": "content",
"fit": "specialized",
"values": [
"copy-led",
"media-led",
"cta-led",
"repeatable"
],
"evidence": "29/29 fields are editable across 4 content models.",
"guardrail": "Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.",
"summary": "Minimal Default composition passport is copy-led, media-led, cta-led, repeatable for CMS composition."
},
{
"id": "interaction-model",
"label": "Interaction model",
"axis": "interaction",
"fit": "supporting",
"values": [
"noninteractive"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"guardrail": "Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.",
"summary": "theme-preview-matrix is compatible with noninteractive content sections."
},
{
"id": "authoring-fit",
"label": "Authoring fit",
"axis": "authoring",
"fit": "specialized",
"values": [
"quick-start",
"high-complexity",
"0-high-care-replacements"
],
"evidence": "29 default provenance items with 0 high-care replacements.",
"guardrail": "Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.",
"summary": "theme-preview-matrix uses quick-start authoring with high complexity."
},
{
"id": "responsive-fit",
"label": "Responsive fit",
"axis": "responsive",
"fit": "primary",
"values": [
"single-column stack",
"two-column adaptive grid",
"responsive composition grid",
"min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke."
],
"evidence": "3 responsive behavior maps cover phone, tablet, and desktop composition.",
"guardrail": "Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.",
"summary": "theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages."
}
],
"recipe_compatibility_axes": [
"page",
"layout",
"content",
"interaction",
"authoring",
"responsive"
],
"recipe_compatibility_page_types": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"recipe_compatibility_section_roles": [
"collection",
"media",
"content",
"metadata"
],
"recipe_compatibility_fits": [
"primary",
"specialized",
"supporting"
],
"builder_field_count": 29,
"builder_field_map": [
{
"path": "title",
"label": "Title",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Title is a string field used for copy."
},
{
"path": "description",
"label": "Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Description is a string field used for copy."
},
{
"path": "presets",
"label": "Presets",
"value_type": "array",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Presets is a array field used for style."
},
{
"path": "recipes",
"label": "Recipes",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Recipes is a array field used for content."
},
{
"path": "block_types",
"label": "Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Types is a array field used for collection."
},
{
"path": "block_collections",
"label": "Block Collections",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Collections is a array field used for collection."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Id is a string collection field used for collection."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Label is a string collection field used for copy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Description is a string collection field used for copy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Block Types is a array collection field used for collection."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Preview Layout is a string field used for style."
},
{
"path": "default_theme",
"label": "Default Theme",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Theme is a string field used for style."
},
{
"path": "default_preset",
"label": "Default Preset",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Preset is a string field used for style."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Recipe is a string field used for content."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Default Block Collection is a string field used for collection."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Design Configuration is a string field used for content."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Default Media Placeholder is a string field used for media."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Design Configurations is a array field used for content."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Id is a string collection field used for content."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Label is a string collection field used for copy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Description is a string collection field used for copy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"value_type": "object",
"role": "style",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Theme is a object collection field used for style."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"value_type": "array",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Media Placeholders is a array field used for media."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Id is a string collection field used for media."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Label is a string collection field used for copy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Src is a string collection field used for media."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Alt is a string collection field used for media."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Aspect Ratio is a string collection field used for media."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"value_type": "string",
"role": "action",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Source Url is a string collection field used for action."
}
],
"editor_guidance_count": 6,
"editor_guidance_map": [
{
"id": "copy",
"label": "Copy",
"field_role": "copy",
"field_count": 7,
"editable_count": 7,
"editor_widget": "text/rich-text editor",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"default_source": "cloneable block recipe payload",
"summary": "Copy fields use the text/rich-text editor across 7/7 editable fields."
},
{
"id": "media",
"label": "Media",
"field_role": "media",
"field_count": 6,
"editable_count": 6,
"editor_widget": "media picker with alt text",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"default_source": "Cloud Elephants placeholder media or CMS media library",
"summary": "Media fields use the media picker with alt text across 6/6 editable fields."
},
{
"id": "action",
"label": "Action",
"field_role": "action",
"field_count": 1,
"editable_count": 1,
"editor_widget": "link or event action editor",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"default_source": "CMS route, URL, or canonical postEvent path",
"summary": "Action fields use the link or event action editor across 1/1 editable field."
},
{
"id": "collection",
"label": "Collection",
"field_role": "collection",
"field_count": 5,
"editable_count": 5,
"editor_widget": "repeatable item editor",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"default_source": "cloneable block recipe payload",
"summary": "Collection fields use the repeatable item editor across 5/5 editable fields."
},
{
"id": "style",
"label": "Style",
"field_role": "style",
"field_count": 5,
"editable_count": 5,
"editor_widget": "appearance preset selector",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"default_source": "Polished SaaS recipe tokens",
"summary": "Style fields use the appearance preset selector across 5/5 editable fields."
},
{
"id": "content",
"label": "Content",
"field_role": "content",
"field_count": 5,
"editable_count": 5,
"editor_widget": "plain content field",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"default_source": "cloneable block recipe payload",
"summary": "Content fields use the plain content field across 5/5 editable fields."
}
],
"editor_field_roles": [
"copy",
"media",
"action",
"collection",
"style",
"content"
],
"editor_editable_field_count": 29,
"state_readiness_count": 6,
"state_readiness_map": [
{
"id": "default",
"label": "Default",
"status": "covered",
"trigger": "Initial render with the cloneable recipe payload",
"visual_treatment": "Polished SaaS tokens with default documentation treatment",
"token_roles": [
"surface",
"panel",
"text",
"button"
],
"proof": "The Polished SaaS recipe renders a contract-safe primary state for theme-preview-matrix.",
"summary": "Default state uses the recipe surface, text, and action tokens without one-off styling."
},
{
"id": "empty",
"label": "Empty",
"status": "covered",
"trigger": "Repeatable collections have zero items",
"visual_treatment": "Reserved panel space with fallback copy or placeholder media",
"token_roles": [
"panel",
"textMuted",
"badge",
"border"
],
"proof": "Repeatable fields are documented for add, remove, reorder, and item-level editing.",
"summary": "Empty-state guidance preserves layout rhythm instead of collapsing the block surface."
},
{
"id": "pending",
"label": "Pending",
"status": "covered",
"trigger": "Deferred content or preview loading",
"visual_treatment": "Neutral reserved frame with status copy and no layout shift",
"token_roles": [
"control",
"textMuted",
"progressTrack",
"border"
],
"proof": "Static recipe payloads reserve the same documented frame while content is loading.",
"summary": "Pending state keeps dimensions stable while using muted control/status tokens."
},
{
"id": "active",
"label": "Active",
"status": "covered",
"trigger": "Current block and recipe preview are selected",
"visual_treatment": "Signal/uplink emphasis with visible selected-state chips",
"token_roles": [
"signal",
"uplink",
"button",
"badge"
],
"proof": "Recipe and block selection evidence is rendered in the documentation chrome.",
"summary": "Active state is represented with recipe accent tokens and visible state labels."
},
{
"id": "invalid",
"label": "Invalid",
"status": "covered",
"trigger": "Media URL or provider data is invalid",
"visual_treatment": "Warning/danger status treatment while preserving the block frame",
"token_roles": [
"warning",
"danger",
"border",
"text"
],
"proof": "Media guidance requires URL plus accessible fallback text for invalid or missing assets.",
"summary": "Invalid state guidance favors explicit status evidence over ambiguous visual collapse."
},
{
"id": "disabled",
"label": "Disabled",
"status": "covered",
"trigger": "Noninteractive metadata or held preview state",
"visual_treatment": "Muted affordance with preserved label, spacing, and hit-area rhythm",
"token_roles": [
"control",
"textMuted",
"border",
"panel"
],
"proof": "Noninteractive blocks retain evidence labels without pretending to be clickable.",
"summary": "Disabled state keeps the block readable and spatially stable when interaction is unavailable."
}
],
"state_readiness_states": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"state_readiness_statuses": [
"covered",
"covered",
"covered",
"covered",
"covered",
"covered"
],
"anatomy_region_count": 6,
"anatomy_map": [
{
"id": "surface",
"label": "Surface",
"region_role": "outer layout and background",
"field_paths": [],
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"region_role": "headings, body copy, labels, and supporting text",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"token_roles": [
"text",
"textMuted"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"region_role": "replaceable image, iframe, embed, avatar, logo, or gallery area",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"token_roles": [
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"region_role": "CTA, link, event, and navigation affordances",
"field_paths": [
"media_placeholders[].source_url"
],
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"region_role": "repeatable cards, steps, metrics, logos, links, or nested blocks",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"region_role": "status, validation, selected, loading, and disabled evidence",
"field_paths": [],
"token_roles": [
"badge",
"badgeText",
"signal"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"anatomy_regions": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"anatomy_token_roles": [
"background",
"badge",
"badgeText",
"border",
"button",
"buttonText",
"panel",
"panelElevated",
"signal",
"text",
"textMuted",
"uplink"
],
"action_count": 0,
"action_map": [],
"control_count": 0,
"control_map": [],
"style_token_count": 15,
"style_token_map": [
{
"role": "background",
"label": "Page background",
"value": "#f7fbff",
"token_type": "color",
"summary": "Page background uses the background recipe token."
},
{
"role": "panel",
"label": "Panel surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Panel surface uses the panel recipe token."
},
{
"role": "panelElevated",
"label": "Elevated surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Elevated surface uses the panelElevated recipe token."
},
{
"role": "text",
"label": "Primary text",
"value": "#142033",
"token_type": "color",
"summary": "Primary text uses the text recipe token."
},
{
"role": "textMuted",
"label": "Muted text",
"value": "#526174",
"token_type": "color",
"summary": "Muted text uses the textMuted recipe token."
},
{
"role": "signal",
"label": "Signal accent",
"value": "#166bff",
"token_type": "color",
"summary": "Signal accent uses the signal recipe token."
},
{
"role": "uplink",
"label": "Secondary accent",
"value": "#00a6a6",
"token_type": "color",
"summary": "Secondary accent uses the uplink recipe token."
},
{
"role": "border",
"label": "Border",
"value": "#d6dee8",
"token_type": "color",
"summary": "Border uses the border recipe token."
},
{
"role": "control",
"label": "Control surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Control surface uses the control recipe token."
},
{
"role": "controlText",
"label": "Control text",
"value": "#142033",
"token_type": "color",
"summary": "Control text uses the controlText recipe token."
},
{
"role": "button",
"label": "Button surface",
"value": "#166bff",
"token_type": "color",
"summary": "Button surface uses the button recipe token."
},
{
"role": "buttonText",
"label": "Button text",
"value": "#ffffff",
"token_type": "color",
"summary": "Button text uses the buttonText recipe token."
},
{
"role": "badge",
"label": "Badge surface",
"value": "#eef5ff",
"token_type": "color",
"summary": "Badge surface uses the badge recipe token."
},
{
"role": "badgeText",
"label": "Badge text",
"value": "#174ea6",
"token_type": "color",
"summary": "Badge text uses the badgeText recipe token."
},
{
"role": "fontFamily",
"label": "Font family",
"value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif",
"token_type": "font",
"summary": "Font family comes from the active recipe theme tokens."
}
],
"style_token_roles": [
"background",
"panel",
"panelElevated",
"text",
"textMuted",
"signal",
"uplink",
"border",
"control",
"controlText",
"button",
"buttonText",
"badge",
"badgeText",
"fontFamily"
],
"contrast_check_count": 6,
"contrast_pass_count": 6,
"contrast_checks": [
{
"id": "text-on-background",
"label": "Text on background",
"foreground_role": "text",
"background_role": "background",
"foreground": "#142033",
"background": "#f7fbff",
"ratio": 15.73,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on background is AAA at 15.73:1 against a 4.5:1 requirement."
},
{
"id": "text-on-panel",
"label": "Text on panel",
"foreground_role": "text",
"background_role": "panel",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on panel is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "muted-text-on-panel",
"label": "Muted text on panel",
"foreground_role": "textMuted",
"background_role": "panel",
"foreground": "#526174",
"background": "#ffffff",
"ratio": 6.32,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Muted text on panel is AA at 6.32:1 against a 4.5:1 requirement."
},
{
"id": "button-text-on-button",
"label": "Button text on button",
"foreground_role": "buttonText",
"background_role": "button",
"foreground": "#ffffff",
"background": "#166bff",
"ratio": 4.58,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Button text on button is AA at 4.58:1 against a 4.5:1 requirement."
},
{
"id": "control-text-on-control",
"label": "Control text on control",
"foreground_role": "controlText",
"background_role": "control",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Control text on control is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "badge-text-on-badge",
"label": "Badge text on badge",
"foreground_role": "badgeText",
"background_role": "badge",
"foreground": "#174ea6",
"background": "#eef5ff",
"ratio": 7.15,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Badge text on badge is AAA at 7.15:1 against a 4.5:1 requirement."
}
],
"contrast_target": "AA",
"accessibility_standard": "WCAG_2_2_AA",
"accessibility_check_count": 5,
"accessibility_checks": [
{
"id": "semantic-structure",
"label": "Semantic structure",
"category": "semantics",
"status": "covered",
"required": true,
"proof": "runtime block sections, cards, lists, and headings",
"summary": "theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview."
},
{
"id": "keyboard-and-tap-targets",
"label": "Keyboard and tap targets",
"category": "keyboard",
"status": "covered",
"required": false,
"proof": "static content has no hidden focus trap",
"summary": "The payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances."
},
{
"id": "text-alternatives",
"label": "Text alternatives",
"category": "media",
"status": "covered",
"required": true,
"proof": "media fields include alt/label/title fallbacks",
"summary": "Media-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders."
},
{
"id": "control-labels",
"label": "Control labels",
"category": "forms",
"status": "covered",
"required": false,
"proof": "no input controls in this payload",
"summary": "No input controls are present, so there are no unlabeled fields to remediate."
},
{
"id": "status-and-motion",
"label": "Status and motion",
"category": "state",
"status": "covered",
"required": true,
"proof": "runtime evidence avoids hidden status-only content",
"summary": "Recipe defaults avoid motion-only meaning and keep status text inspectable when state is present."
}
],
"responsive_behavior_count": 3,
"responsive_behavior_map": [
{
"id": "phone",
"label": "Phone",
"viewport_width": 390,
"layout_mode": "single-column stack",
"column_count": 1,
"spacing_density": "comfortable",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-phone",
"summary": "Polished SaaS stacks theme-preview-matrix into one phone column with comfortable spacing and bounded content."
},
{
"id": "tablet",
"label": "Tablet",
"viewport_width": 768,
"layout_mode": "two-column adaptive grid",
"column_count": 2,
"spacing_density": "comfortable",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-tablet",
"summary": "Polished SaaS adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout."
},
{
"id": "desktop",
"label": "Desktop",
"viewport_width": 1366,
"layout_mode": "responsive composition grid",
"column_count": 3,
"spacing_density": "comfortable",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-desktop",
"summary": "Polished SaaS gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing."
}
],
"responsive_viewports": [
"phone",
"tablet",
"desktop"
],
"responsive_proof": [
"npm run test:static:block-catalog all-blocks-phone",
"npm run test:static:block-catalog all-blocks-tablet",
"npm run test:static:block-catalog all-blocks-desktop"
],
"interactive_roles": [],
"recipe_alignment": {
"action_token": "button",
"control_token": "control",
"surface_token": "panel",
"text_token": "text",
"source": "theme recipe tokens"
}
},
"cloneable": true
}
}A brandable payload that includes placeholder media where the block can express imagery, previews, or visual proof.
theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable.
background, panel, panelElevated, borderCopy fields map to primary and muted text roles so editors can change words without restyling the block.
text, textMutedMedia fields stay isolated from copy and action regions so replacement assets preserve the recipe layout.
panelElevated, borderAction regions use recipe button and accent tokens while preserving href or event payloads.
button, buttonText, signal, uplinkCollection regions define repeatable item boundaries for add, remove, reorder, and nested editing.
panel, panelElevated, border, badgeFeedback regions tie state-readiness evidence to visible recipe status treatments.
badge, badgeText, signalUse when the theme-preview-matrix story depends on replaceable imagery, embeds, logos, or visual proof.
Media Ready is a high-complexity media-led recipe with 6 documented composition slots.
3 required regions, 3 optional regions.
theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages.
6 page types mapped for theme-preview-matrix.Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.theme-preview-matrix can act as collection, media, content within a composed page.
6 anatomy regions produce 4 section roles.Place the block where its required anatomy regions have enough room before compressing it into dense page slots.Media Ready composition passport is copy-led, media-led, cta-led, repeatable for CMS composition.
29/29 fields are editable across 4 content models.Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.theme-preview-matrix is compatible with noninteractive content sections.
0 action surfaces and 0 control surfaces mapped.Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.theme-preview-matrix uses media-led authoring with high complexity.
29 default provenance items with 0 high-care replacements.Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages.
3 responsive behavior maps cover phone, tablet, and desktop composition.Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers.
image treatment uses spacious density and 18px radius base.background, panel, panelElevated, borderPrimary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text.
6/6 contrast checks pass the AA target.text, textMuted, badgeTextNo unexpected interactive surface is introduced for this noninteractive recipe.
0 action surfaces and 0 control surfaces mapped.button, buttonText, control, controlText, signal, uplinkReplaceable media stays framed separately from copy and action regions so asset swaps preserve the layout.
Media region is isolated with replaceable fields.panelElevated, border, textMutedFeedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning.
6 state-readiness entries include default, empty, pending, active, invalid, disabled.badge, badgeText, signalPhone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe.
single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.panel, border, controlCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadKeep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.
Polished SaaS Growth recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.
Polished SaaS Growth recipe tokensKeep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.
Polished SaaS Growth recipe tokensKeep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.
Polished SaaS Growth recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.
Polished SaaS Growth recipe tokensReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
CMS route, URL, or canonical postEvent pathCopy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish.
CMS route, URL, or canonical postEvent pathReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
Polished SaaS Growth recipe tokensKeep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.
cloneable block recipe payloadMedia should use a replaceable URL plus meaningful alt, label, or title fallback.
Cloud Elephants placeholder media or CMS media libraryActions should resolve to a URL or event name with a human-readable label.
CMS route, URL, or canonical postEvent pathCollections should support add, remove, reorder, and item-level editing without changing block shape.
cloneable block recipe payloadStyle fields should prefer recipe or appearance tokens over one-off inline values.
Polished SaaS Growth recipe tokensContent should remain serializable JSON and preserve the documented block contract.
cloneable block recipe payloadPolished SaaS Growth tokens with image documentation treatment
The Polished SaaS Growth recipe renders a contract-safe primary state for theme-preview-matrix.Reserved panel space with fallback copy or placeholder media
Repeatable fields are documented for add, remove, reorder, and item-level editing.Neutral reserved frame with status copy and no layout shift
Static recipe payloads reserve the same documented frame while content is loading.Signal/uplink emphasis with visible selected-state chips
Recipe and block selection evidence is rendered in the documentation chrome.Warning/danger status treatment while preserving the block frame
Media guidance requires URL plus accessible fallback text for invalid or missing assets.Muted affordance with preserved label, spacing, and hit-area rhythm
Noninteractive blocks retain evidence labels without pretending to be clickable.No public action surface is needed for this payload.
No input control is needed for this payload.
theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview.
runtime block sections, cards, lists, and headingsThe payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances.
static content has no hidden focus trapMedia-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders.
media fields include alt/label/title fallbacksNo input controls are present, so there are no unlabeled fields to remediate.
no input controls in this payloadRecipe defaults avoid motion-only meaning and keep status text inspectable when state is present.
runtime evidence avoids hidden status-only contentPolished SaaS Growth stacks theme-preview-matrix into one phone column with spacious spacing and bounded content.
min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.Polished SaaS Growth adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout.
tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.Polished SaaS Growth gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing.
desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.A compact matrix configuration for documenting this governed operator block.
{
"id": "block-doc-theme-preview-matrix-data-media-ready",
"block_type": "theme-preview-matrix",
"props": {
"title": "Theme preview matrix sample",
"description": "A compact matrix configuration for documenting this governed operator block.",
"presets": [
"bento"
],
"recipes": [
"polished-saas-growth"
],
"block_types": [
"hero"
],
"block_collections": [
{
"id": "single-block",
"label": "Single Block",
"description": "Compact documentation preview.",
"block_types": [
"hero"
]
}
],
"preview_layout": "flow",
"default_theme": "ensemble-daylight",
"default_preset": "bento",
"default_recipe": "polished-saas-growth",
"default_block_collection": "single-block",
"default_design_configuration": "base",
"default_media_placeholder": "block-doc-preview-media",
"design_configurations": [
{
"id": "base",
"label": "Default",
"description": "Baseline contract props with the selected recipe and standard system preset.",
"theme": {}
}
],
"media_placeholders": [
{
"id": "block-doc-preview-media",
"label": "Essential CTO",
"src": "https://storage.googleapis.com/msgsndr/T3RhpcTQAq7Qb47kPQAB/media/677815b8c290c684d5bf3fbd.png",
"alt": "Cloud Elephants Essential CTO service visual.",
"aspect_ratio": "16 / 9",
"source_url": "https://go.cloudelephants.com/a-la-carte"
}
]
},
"block_order": 2,
"metadata": {
"composition_recipe": {
"id": "media-ready",
"intent": "media",
"label": "Media Ready",
"recipe": "polished-saas-growth",
"source": "block-explorer",
"quality_proof": [
"composition"
],
"composition_passport": {
"id": "media-ready",
"label": "Media Ready composition passport",
"intent": "media",
"recipe": "polished-saas-growth",
"authoring_mode": "media-led",
"complexity": "high",
"fit": "Use when the theme-preview-matrix story depends on replaceable imagery, embeds, logos, or visual proof.",
"required_regions": [
"surface",
"copy",
"feedback"
],
"optional_regions": [
"media",
"actions",
"collection"
],
"slots": [
{
"id": "surface",
"label": "Surface",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"required": true,
"field_count": 7,
"editable_count": 7,
"token_roles": [
"text",
"textMuted"
],
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"required": false,
"field_count": 6,
"editable_count": 6,
"token_roles": [
"panelElevated",
"border"
],
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"required": false,
"field_count": 1,
"editable_count": 1,
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"required": false,
"field_count": 5,
"editable_count": 5,
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"badge",
"badgeText",
"signal"
],
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"builder_field_count": 29,
"editable_field_count": 29,
"action_count": 0,
"control_count": 0,
"replacement_guidance": [
"Keep Polished SaaS Growth recipe tokens as the source of visual styling for the surface, text, controls, and actions.",
"Replace media URLs through the CMS media library and preserve alt, title, provider, or label fallbacks.",
"No action wiring is required for this recipe; avoid inventing clickable surfaces in content.",
"No input controls are required; keep the recipe focused on its documented display regions.",
"Treat collection regions as repeatable slots that support add, remove, reorder, and item-level editing."
],
"publish_checklist": [
"Validate theme-preview-matrix against its block contract before publishing.",
"3 required anatomy regions remain present: surface, copy, feedback.",
"29/29 builder fields are CMS-editable or intentionally locked.",
"Noninteractive presentation has no unexpected action or control surfaces.",
"Phone, tablet, and desktop responsive behavior maps have been reviewed for wrapping and overflow.",
"Contrast checks meet the AA recipe target."
],
"agent_notes": [
"Prefer editing props fields described by the builder field map; metadata is evidence, not primary content.",
"Preserve recipe_alignment token roles unless the page theme or recipe changes intentionally.",
"Use the anatomy slots to compose or replace content without changing the block type."
],
"summary": "Media Ready is a high-complexity media-led recipe with 6 documented composition slots."
},
"composition_passport_complexity": "high",
"composition_passport_authoring_mode": "media-led",
"composition_passport_slots": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"composition_passport_check_count": 6,
"visual_polish_check_count": 6,
"visual_polish_pass_count": 6,
"visual_polish_checks": [
{
"id": "surface-rhythm",
"label": "Surface rhythm",
"axis": "layout",
"status": "ready",
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"evidence": "image treatment uses spacious density and 18px radius base.",
"summary": "theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers."
},
{
"id": "type-hierarchy",
"label": "Type hierarchy",
"axis": "typography",
"status": "ready",
"token_roles": [
"text",
"textMuted",
"badgeText"
],
"evidence": "6/6 contrast checks pass the AA target.",
"summary": "Primary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text."
},
{
"id": "action-clarity",
"label": "Action clarity",
"axis": "interaction",
"status": "ready",
"token_roles": [
"button",
"buttonText",
"control",
"controlText",
"signal",
"uplink"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"summary": "No unexpected interactive surface is introduced for this noninteractive recipe."
},
{
"id": "media-treatment",
"label": "Media treatment",
"axis": "media",
"status": "ready",
"token_roles": [
"panelElevated",
"border",
"textMuted"
],
"evidence": "Media region is isolated with replaceable fields.",
"summary": "Replaceable media stays framed separately from copy and action regions so asset swaps preserve the layout."
},
{
"id": "state-feedback",
"label": "State feedback",
"axis": "state",
"status": "ready",
"token_roles": [
"badge",
"badgeText",
"signal"
],
"evidence": "6 state-readiness entries include default, empty, pending, active, invalid, disabled.",
"summary": "Feedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning."
},
{
"id": "responsive-balance",
"label": "Responsive balance",
"axis": "responsive",
"status": "ready",
"token_roles": [
"panel",
"border",
"control"
],
"evidence": "single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.",
"summary": "Phone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe."
}
],
"visual_polish_axes": [
"layout",
"typography",
"interaction",
"media",
"state",
"responsive"
],
"default_provenance_count": 29,
"default_provenance_map": [
{
"path": "title",
"label": "Title",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Title defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "description",
"label": "Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Description defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "presets",
"label": "Presets",
"field_role": "style",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS Growth recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Presets defaults from Polished SaaS Growth recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "recipes",
"label": "Recipes",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Recipes defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "block_types",
"label": "Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections",
"label": "Block Collections",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS Growth recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Preview Layout defaults from Polished SaaS Growth recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_theme",
"label": "Default Theme",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS Growth recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Theme defaults from Polished SaaS Growth recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_preset",
"label": "Default Preset",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Polished SaaS Growth recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Preset defaults from Polished SaaS Growth recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Recipe defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Default Block Collection defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Design Configuration defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Default Media Placeholder defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"field_role": "style",
"value_type": "object",
"editable": true,
"repeated": true,
"default_source": "Polished SaaS Growth recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Design Configurations Item Theme defaults from Polished SaaS Growth recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"field_role": "media",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Id defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Media Placeholders Item Label defaults from cloneable block recipe payload; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Src defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Alt defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Aspect Ratio defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"field_role": "action",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "CMS route, URL, or canonical postEvent path",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"summary": "Media Placeholders Item Source Url defaults from CMS route, URL, or canonical postEvent path; replacement is medium risk with requires-alt-text policy."
}
],
"default_replacement_policies": [
"collection-item",
"locked-token",
"requires-alt-text",
"safe-to-edit"
],
"default_replacement_risks": [
"low",
"medium"
],
"default_replacement_high_risk_count": 0,
"content_edit_bundle_count": 6,
"content_edit_bundles": [
{
"id": "copy",
"label": "Copy bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"type hierarchy",
"mobile wrapping"
],
"summary": "Copy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "media",
"label": "Media bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"default_sources": [
"Cloud Elephants placeholder media or CMS media library"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy alt text",
"responsive fit"
],
"summary": "Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "actions",
"label": "Action bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"media_placeholders[].source_url"
],
"default_sources": [
"CMS route, URL, or canonical postEvent path"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy labels"
],
"summary": "Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish."
},
{
"id": "collections",
"label": "Collection bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"item shape",
"responsive wrapping"
],
"summary": "Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "style",
"label": "Style bundle",
"intent": "guarded",
"edit_mode": "guarded-system",
"field_paths": [
"default_preset",
"default_theme",
"design_configurations[].theme",
"presets",
"preview_layout"
],
"default_sources": [
"Polished SaaS Growth recipe tokens"
],
"guardrails": [
"Keep visual styling aligned to Polished SaaS Growth recipe tokens unless the recipe itself changes."
],
"depends_on": [
"theme recipe tokens",
"contrast proof"
],
"summary": "Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "content",
"label": "Content bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"default_design_configuration",
"default_recipe",
"design_configurations",
"design_configurations[].id",
"recipes"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"contract-safe JSON"
],
"summary": "Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
}
],
"content_edit_bundle_ids": [
"copy",
"media",
"actions",
"collections",
"style",
"content"
],
"content_edit_bundle_modes": [
"guarded-system",
"repeatable-items"
],
"content_edit_bundle_required_count": 2,
"content_edit_bundle_guarded_count": 1,
"recipe_compatibility_count": 6,
"recipe_compatibility_map": [
{
"id": "page-context",
"label": "Page context",
"axis": "page",
"fit": "primary",
"values": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"evidence": "6 page types mapped for theme-preview-matrix.",
"guardrail": "Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.",
"summary": "theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages."
},
{
"id": "section-role",
"label": "Section role",
"axis": "layout",
"fit": "supporting",
"values": [
"collection",
"media",
"content",
"metadata"
],
"evidence": "6 anatomy regions produce 4 section roles.",
"guardrail": "Place the block where its required anatomy regions have enough room before compressing it into dense page slots.",
"summary": "theme-preview-matrix can act as collection, media, content within a composed page."
},
{
"id": "content-model",
"label": "Content model",
"axis": "content",
"fit": "specialized",
"values": [
"copy-led",
"media-led",
"cta-led",
"repeatable"
],
"evidence": "29/29 fields are editable across 4 content models.",
"guardrail": "Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.",
"summary": "Media Ready composition passport is copy-led, media-led, cta-led, repeatable for CMS composition."
},
{
"id": "interaction-model",
"label": "Interaction model",
"axis": "interaction",
"fit": "supporting",
"values": [
"noninteractive"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"guardrail": "Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.",
"summary": "theme-preview-matrix is compatible with noninteractive content sections."
},
{
"id": "authoring-fit",
"label": "Authoring fit",
"axis": "authoring",
"fit": "specialized",
"values": [
"media-led",
"high-complexity",
"0-high-care-replacements"
],
"evidence": "29 default provenance items with 0 high-care replacements.",
"guardrail": "Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.",
"summary": "theme-preview-matrix uses media-led authoring with high complexity."
},
{
"id": "responsive-fit",
"label": "Responsive fit",
"axis": "responsive",
"fit": "primary",
"values": [
"single-column stack",
"two-column adaptive grid",
"responsive composition grid",
"min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke."
],
"evidence": "3 responsive behavior maps cover phone, tablet, and desktop composition.",
"guardrail": "Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.",
"summary": "theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages."
}
],
"recipe_compatibility_axes": [
"page",
"layout",
"content",
"interaction",
"authoring",
"responsive"
],
"recipe_compatibility_page_types": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"recipe_compatibility_section_roles": [
"collection",
"media",
"content",
"metadata"
],
"recipe_compatibility_fits": [
"primary",
"specialized",
"supporting"
],
"builder_field_count": 29,
"builder_field_map": [
{
"path": "title",
"label": "Title",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Title is a string field used for copy."
},
{
"path": "description",
"label": "Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Description is a string field used for copy."
},
{
"path": "presets",
"label": "Presets",
"value_type": "array",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Presets is a array field used for style."
},
{
"path": "recipes",
"label": "Recipes",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Recipes is a array field used for content."
},
{
"path": "block_types",
"label": "Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Types is a array field used for collection."
},
{
"path": "block_collections",
"label": "Block Collections",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Collections is a array field used for collection."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Id is a string collection field used for collection."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Label is a string collection field used for copy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Description is a string collection field used for copy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Block Types is a array collection field used for collection."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Preview Layout is a string field used for style."
},
{
"path": "default_theme",
"label": "Default Theme",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Theme is a string field used for style."
},
{
"path": "default_preset",
"label": "Default Preset",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Preset is a string field used for style."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Recipe is a string field used for content."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Default Block Collection is a string field used for collection."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Design Configuration is a string field used for content."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Default Media Placeholder is a string field used for media."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Design Configurations is a array field used for content."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Id is a string collection field used for content."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Label is a string collection field used for copy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Description is a string collection field used for copy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"value_type": "object",
"role": "style",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Theme is a object collection field used for style."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"value_type": "array",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Media Placeholders is a array field used for media."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Id is a string collection field used for media."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Label is a string collection field used for copy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Src is a string collection field used for media."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Alt is a string collection field used for media."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Aspect Ratio is a string collection field used for media."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"value_type": "string",
"role": "action",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Source Url is a string collection field used for action."
}
],
"editor_guidance_count": 6,
"editor_guidance_map": [
{
"id": "copy",
"label": "Copy",
"field_role": "copy",
"field_count": 7,
"editable_count": 7,
"editor_widget": "text/rich-text editor",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"default_source": "cloneable block recipe payload",
"summary": "Copy fields use the text/rich-text editor across 7/7 editable fields."
},
{
"id": "media",
"label": "Media",
"field_role": "media",
"field_count": 6,
"editable_count": 6,
"editor_widget": "media picker with alt text",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"default_source": "Cloud Elephants placeholder media or CMS media library",
"summary": "Media fields use the media picker with alt text across 6/6 editable fields."
},
{
"id": "action",
"label": "Action",
"field_role": "action",
"field_count": 1,
"editable_count": 1,
"editor_widget": "link or event action editor",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"default_source": "CMS route, URL, or canonical postEvent path",
"summary": "Action fields use the link or event action editor across 1/1 editable field."
},
{
"id": "collection",
"label": "Collection",
"field_role": "collection",
"field_count": 5,
"editable_count": 5,
"editor_widget": "repeatable item editor",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"default_source": "cloneable block recipe payload",
"summary": "Collection fields use the repeatable item editor across 5/5 editable fields."
},
{
"id": "style",
"label": "Style",
"field_role": "style",
"field_count": 5,
"editable_count": 5,
"editor_widget": "appearance preset selector",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"default_source": "Polished SaaS Growth recipe tokens",
"summary": "Style fields use the appearance preset selector across 5/5 editable fields."
},
{
"id": "content",
"label": "Content",
"field_role": "content",
"field_count": 5,
"editable_count": 5,
"editor_widget": "plain content field",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"default_source": "cloneable block recipe payload",
"summary": "Content fields use the plain content field across 5/5 editable fields."
}
],
"editor_field_roles": [
"copy",
"media",
"action",
"collection",
"style",
"content"
],
"editor_editable_field_count": 29,
"state_readiness_count": 6,
"state_readiness_map": [
{
"id": "default",
"label": "Default",
"status": "covered",
"trigger": "Initial render with the cloneable recipe payload",
"visual_treatment": "Polished SaaS Growth tokens with image documentation treatment",
"token_roles": [
"surface",
"panel",
"text",
"button"
],
"proof": "The Polished SaaS Growth recipe renders a contract-safe primary state for theme-preview-matrix.",
"summary": "Default state uses the recipe surface, text, and action tokens without one-off styling."
},
{
"id": "empty",
"label": "Empty",
"status": "covered",
"trigger": "Repeatable collections have zero items",
"visual_treatment": "Reserved panel space with fallback copy or placeholder media",
"token_roles": [
"panel",
"textMuted",
"badge",
"border"
],
"proof": "Repeatable fields are documented for add, remove, reorder, and item-level editing.",
"summary": "Empty-state guidance preserves layout rhythm instead of collapsing the block surface."
},
{
"id": "pending",
"label": "Pending",
"status": "covered",
"trigger": "Deferred content or preview loading",
"visual_treatment": "Neutral reserved frame with status copy and no layout shift",
"token_roles": [
"control",
"textMuted",
"progressTrack",
"border"
],
"proof": "Static recipe payloads reserve the same documented frame while content is loading.",
"summary": "Pending state keeps dimensions stable while using muted control/status tokens."
},
{
"id": "active",
"label": "Active",
"status": "covered",
"trigger": "Current block and recipe preview are selected",
"visual_treatment": "Signal/uplink emphasis with visible selected-state chips",
"token_roles": [
"signal",
"uplink",
"button",
"badge"
],
"proof": "Recipe and block selection evidence is rendered in the documentation chrome.",
"summary": "Active state is represented with recipe accent tokens and visible state labels."
},
{
"id": "invalid",
"label": "Invalid",
"status": "covered",
"trigger": "Media URL or provider data is invalid",
"visual_treatment": "Warning/danger status treatment while preserving the block frame",
"token_roles": [
"warning",
"danger",
"border",
"text"
],
"proof": "Media guidance requires URL plus accessible fallback text for invalid or missing assets.",
"summary": "Invalid state guidance favors explicit status evidence over ambiguous visual collapse."
},
{
"id": "disabled",
"label": "Disabled",
"status": "covered",
"trigger": "Noninteractive metadata or held preview state",
"visual_treatment": "Muted affordance with preserved label, spacing, and hit-area rhythm",
"token_roles": [
"control",
"textMuted",
"border",
"panel"
],
"proof": "Noninteractive blocks retain evidence labels without pretending to be clickable.",
"summary": "Disabled state keeps the block readable and spatially stable when interaction is unavailable."
}
],
"state_readiness_states": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"state_readiness_statuses": [
"covered",
"covered",
"covered",
"covered",
"covered",
"covered"
],
"anatomy_region_count": 6,
"anatomy_map": [
{
"id": "surface",
"label": "Surface",
"region_role": "outer layout and background",
"field_paths": [],
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"region_role": "headings, body copy, labels, and supporting text",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"token_roles": [
"text",
"textMuted"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"region_role": "replaceable image, iframe, embed, avatar, logo, or gallery area",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"token_roles": [
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"region_role": "CTA, link, event, and navigation affordances",
"field_paths": [
"media_placeholders[].source_url"
],
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"region_role": "repeatable cards, steps, metrics, logos, links, or nested blocks",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"region_role": "status, validation, selected, loading, and disabled evidence",
"field_paths": [],
"token_roles": [
"badge",
"badgeText",
"signal"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"anatomy_regions": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"anatomy_token_roles": [
"background",
"badge",
"badgeText",
"border",
"button",
"buttonText",
"panel",
"panelElevated",
"signal",
"text",
"textMuted",
"uplink"
],
"action_count": 0,
"action_map": [],
"control_count": 0,
"control_map": [],
"style_token_count": 15,
"style_token_map": [
{
"role": "background",
"label": "Page background",
"value": "#f7fbff",
"token_type": "color",
"summary": "Page background uses the background recipe token."
},
{
"role": "panel",
"label": "Panel surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Panel surface uses the panel recipe token."
},
{
"role": "panelElevated",
"label": "Elevated surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Elevated surface uses the panelElevated recipe token."
},
{
"role": "text",
"label": "Primary text",
"value": "#142033",
"token_type": "color",
"summary": "Primary text uses the text recipe token."
},
{
"role": "textMuted",
"label": "Muted text",
"value": "#526174",
"token_type": "color",
"summary": "Muted text uses the textMuted recipe token."
},
{
"role": "signal",
"label": "Signal accent",
"value": "#166bff",
"token_type": "color",
"summary": "Signal accent uses the signal recipe token."
},
{
"role": "uplink",
"label": "Secondary accent",
"value": "#00a6a6",
"token_type": "color",
"summary": "Secondary accent uses the uplink recipe token."
},
{
"role": "border",
"label": "Border",
"value": "#d6dee8",
"token_type": "color",
"summary": "Border uses the border recipe token."
},
{
"role": "control",
"label": "Control surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Control surface uses the control recipe token."
},
{
"role": "controlText",
"label": "Control text",
"value": "#142033",
"token_type": "color",
"summary": "Control text uses the controlText recipe token."
},
{
"role": "button",
"label": "Button surface",
"value": "#166bff",
"token_type": "color",
"summary": "Button surface uses the button recipe token."
},
{
"role": "buttonText",
"label": "Button text",
"value": "#ffffff",
"token_type": "color",
"summary": "Button text uses the buttonText recipe token."
},
{
"role": "badge",
"label": "Badge surface",
"value": "#eef5ff",
"token_type": "color",
"summary": "Badge surface uses the badge recipe token."
},
{
"role": "badgeText",
"label": "Badge text",
"value": "#174ea6",
"token_type": "color",
"summary": "Badge text uses the badgeText recipe token."
},
{
"role": "fontFamily",
"label": "Font family",
"value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif",
"token_type": "font",
"summary": "Font family comes from the active recipe theme tokens."
}
],
"style_token_roles": [
"background",
"panel",
"panelElevated",
"text",
"textMuted",
"signal",
"uplink",
"border",
"control",
"controlText",
"button",
"buttonText",
"badge",
"badgeText",
"fontFamily"
],
"contrast_check_count": 6,
"contrast_pass_count": 6,
"contrast_checks": [
{
"id": "text-on-background",
"label": "Text on background",
"foreground_role": "text",
"background_role": "background",
"foreground": "#142033",
"background": "#f7fbff",
"ratio": 15.73,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on background is AAA at 15.73:1 against a 4.5:1 requirement."
},
{
"id": "text-on-panel",
"label": "Text on panel",
"foreground_role": "text",
"background_role": "panel",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on panel is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "muted-text-on-panel",
"label": "Muted text on panel",
"foreground_role": "textMuted",
"background_role": "panel",
"foreground": "#526174",
"background": "#ffffff",
"ratio": 6.32,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Muted text on panel is AA at 6.32:1 against a 4.5:1 requirement."
},
{
"id": "button-text-on-button",
"label": "Button text on button",
"foreground_role": "buttonText",
"background_role": "button",
"foreground": "#ffffff",
"background": "#166bff",
"ratio": 4.58,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Button text on button is AA at 4.58:1 against a 4.5:1 requirement."
},
{
"id": "control-text-on-control",
"label": "Control text on control",
"foreground_role": "controlText",
"background_role": "control",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Control text on control is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "badge-text-on-badge",
"label": "Badge text on badge",
"foreground_role": "badgeText",
"background_role": "badge",
"foreground": "#174ea6",
"background": "#eef5ff",
"ratio": 7.15,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Badge text on badge is AAA at 7.15:1 against a 4.5:1 requirement."
}
],
"contrast_target": "AA",
"accessibility_standard": "WCAG_2_2_AA",
"accessibility_check_count": 5,
"accessibility_checks": [
{
"id": "semantic-structure",
"label": "Semantic structure",
"category": "semantics",
"status": "covered",
"required": true,
"proof": "runtime block sections, cards, lists, and headings",
"summary": "theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview."
},
{
"id": "keyboard-and-tap-targets",
"label": "Keyboard and tap targets",
"category": "keyboard",
"status": "covered",
"required": false,
"proof": "static content has no hidden focus trap",
"summary": "The payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances."
},
{
"id": "text-alternatives",
"label": "Text alternatives",
"category": "media",
"status": "covered",
"required": true,
"proof": "media fields include alt/label/title fallbacks",
"summary": "Media-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders."
},
{
"id": "control-labels",
"label": "Control labels",
"category": "forms",
"status": "covered",
"required": false,
"proof": "no input controls in this payload",
"summary": "No input controls are present, so there are no unlabeled fields to remediate."
},
{
"id": "status-and-motion",
"label": "Status and motion",
"category": "state",
"status": "covered",
"required": true,
"proof": "runtime evidence avoids hidden status-only content",
"summary": "Recipe defaults avoid motion-only meaning and keep status text inspectable when state is present."
}
],
"responsive_behavior_count": 3,
"responsive_behavior_map": [
{
"id": "phone",
"label": "Phone",
"viewport_width": 390,
"layout_mode": "single-column stack",
"column_count": 1,
"spacing_density": "spacious",
"media_policy": "Inline media uses full-width phone framing, tablet-friendly aspect ratios, and stable desktop constraints.",
"overflow_policy": "min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-phone",
"summary": "Polished SaaS Growth stacks theme-preview-matrix into one phone column with spacious spacing and bounded content."
},
{
"id": "tablet",
"label": "Tablet",
"viewport_width": 768,
"layout_mode": "two-column adaptive grid",
"column_count": 2,
"spacing_density": "spacious",
"media_policy": "Inline media uses full-width phone framing, tablet-friendly aspect ratios, and stable desktop constraints.",
"overflow_policy": "tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-tablet",
"summary": "Polished SaaS Growth adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout."
},
{
"id": "desktop",
"label": "Desktop",
"viewport_width": 1366,
"layout_mode": "responsive composition grid",
"column_count": 3,
"spacing_density": "spacious",
"media_policy": "Inline media uses full-width phone framing, tablet-friendly aspect ratios, and stable desktop constraints.",
"overflow_policy": "desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-desktop",
"summary": "Polished SaaS Growth gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing."
}
],
"responsive_viewports": [
"phone",
"tablet",
"desktop"
],
"responsive_proof": [
"npm run test:static:block-catalog all-blocks-phone",
"npm run test:static:block-catalog all-blocks-tablet",
"npm run test:static:block-catalog all-blocks-desktop"
],
"interactive_roles": [],
"recipe_alignment": {
"action_token": "button",
"control_token": "control",
"surface_token": "panel",
"text_token": "text",
"source": "theme recipe tokens"
}
},
"cloneable": true
}
}A dense operator-friendly payload for dashboards, catalogs, forms, and internal review surfaces.
theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable.
background, panel, panelElevated, borderCopy fields map to primary and muted text roles so editors can change words without restyling the block.
text, textMutedMedia fields stay isolated from copy and action regions so replacement assets preserve the recipe layout.
panelElevated, borderAction regions use recipe button and accent tokens while preserving href or event payloads.
button, buttonText, signal, uplinkCollection regions define repeatable item boundaries for add, remove, reorder, and nested editing.
panel, panelElevated, border, badgeFeedback regions tie state-readiness evidence to visible recipe status treatments.
badge, badgeText, signalUse when editors need denser theme-preview-matrix controls, diagnostics, or internal review context.
Compact Ops is a high-complexity operator-review recipe with 6 documented composition slots.
3 required regions, 3 optional regions.
theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages.
6 page types mapped for theme-preview-matrix.Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.theme-preview-matrix can act as collection, media, content within a composed page.
6 anatomy regions produce 4 section roles.Place the block where its required anatomy regions have enough room before compressing it into dense page slots.Compact Ops composition passport is copy-led, media-led, cta-led, repeatable for CMS composition.
29/29 fields are editable across 4 content models.Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.theme-preview-matrix is compatible with noninteractive content sections.
0 action surfaces and 0 control surfaces mapped.Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.theme-preview-matrix uses operator-review authoring with high complexity.
29 default provenance items with 0 high-care replacements.Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages.
3 responsive behavior maps cover phone, tablet, and desktop composition.Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers.
dense treatment uses compact density and 8px radius base.background, panel, panelElevated, borderPrimary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text.
6/6 contrast checks pass the AA target.text, textMuted, badgeTextNo unexpected interactive surface is introduced for this noninteractive recipe.
0 action surfaces and 0 control surfaces mapped.button, buttonText, control, controlText, signal, uplinkReplaceable media stays framed separately from copy and action regions so asset swaps preserve the layout.
Media region is isolated with replaceable fields.panelElevated, border, textMutedFeedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning.
6 state-readiness entries include default, empty, pending, active, invalid, disabled.badge, badgeText, signalPhone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe.
single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.panel, border, controlCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadKeep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.
Compact Ops recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.
Compact Ops recipe tokensKeep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.
Compact Ops recipe tokensKeep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.
Compact Ops recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.
Compact Ops recipe tokensReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
CMS route, URL, or canonical postEvent pathCopy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish.
CMS route, URL, or canonical postEvent pathReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
Compact Ops recipe tokensKeep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.
cloneable block recipe payloadMedia should use a replaceable URL plus meaningful alt, label, or title fallback.
Cloud Elephants placeholder media or CMS media libraryActions should resolve to a URL or event name with a human-readable label.
CMS route, URL, or canonical postEvent pathCollections should support add, remove, reorder, and item-level editing without changing block shape.
cloneable block recipe payloadStyle fields should prefer recipe or appearance tokens over one-off inline values.
Compact Ops recipe tokensContent should remain serializable JSON and preserve the documented block contract.
cloneable block recipe payloadCompact Ops tokens with dense documentation treatment
The Compact Ops recipe renders a contract-safe primary state for theme-preview-matrix.Reserved panel space with fallback copy or placeholder media
Repeatable fields are documented for add, remove, reorder, and item-level editing.Neutral reserved frame with status copy and no layout shift
Static recipe payloads reserve the same documented frame while content is loading.Signal/uplink emphasis with visible selected-state chips
Recipe and block selection evidence is rendered in the documentation chrome.Warning/danger status treatment while preserving the block frame
Media guidance requires URL plus accessible fallback text for invalid or missing assets.Muted affordance with preserved label, spacing, and hit-area rhythm
Noninteractive blocks retain evidence labels without pretending to be clickable.No public action surface is needed for this payload.
No input control is needed for this payload.
theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview.
runtime block sections, cards, lists, and headingsThe payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances.
static content has no hidden focus trapMedia-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders.
media fields include alt/label/title fallbacksNo input controls are present, so there are no unlabeled fields to remediate.
no input controls in this payloadRecipe defaults avoid motion-only meaning and keep status text inspectable when state is present.
runtime evidence avoids hidden status-only contentCompact Ops stacks theme-preview-matrix into one phone column with compact spacing and bounded content.
min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.Compact Ops adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout.
tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.Compact Ops gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing.
desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.A compact matrix configuration for documenting this governed operator block.
{
"id": "block-doc-theme-preview-matrix-data-compact-ops",
"block_type": "theme-preview-matrix",
"props": {
"title": "Theme preview matrix sample",
"description": "A compact matrix configuration for documenting this governed operator block.",
"presets": [
"dashboard"
],
"recipes": [
"compact-ops"
],
"block_types": [
"hero"
],
"block_collections": [
{
"id": "single-block",
"label": "Single Block",
"description": "Compact documentation preview.",
"block_types": [
"hero"
]
}
],
"preview_layout": "flow",
"default_theme": "ensemble-daylight",
"default_preset": "dashboard",
"default_recipe": "compact-ops",
"default_block_collection": "single-block",
"default_design_configuration": "base",
"default_media_placeholder": "block-doc-preview-media",
"design_configurations": [
{
"id": "base",
"label": "Default",
"description": "Baseline contract props with the selected recipe and standard system preset.",
"theme": {}
}
],
"media_placeholders": [
{
"id": "block-doc-preview-media",
"label": "Essential CTO",
"src": "https://storage.googleapis.com/msgsndr/T3RhpcTQAq7Qb47kPQAB/media/677815b8c290c684d5bf3fbd.png",
"alt": "Cloud Elephants Essential CTO service visual.",
"aspect_ratio": "16 / 9",
"source_url": "https://go.cloudelephants.com/a-la-carte"
}
]
},
"block_order": 3,
"metadata": {
"composition_recipe": {
"id": "compact-ops",
"intent": "operator",
"label": "Compact Ops",
"recipe": "compact-ops",
"source": "block-explorer",
"quality_proof": [
"composition"
],
"composition_passport": {
"id": "compact-ops",
"label": "Compact Ops composition passport",
"intent": "operator",
"recipe": "compact-ops",
"authoring_mode": "operator-review",
"complexity": "high",
"fit": "Use when editors need denser theme-preview-matrix controls, diagnostics, or internal review context.",
"required_regions": [
"surface",
"copy",
"feedback"
],
"optional_regions": [
"media",
"actions",
"collection"
],
"slots": [
{
"id": "surface",
"label": "Surface",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"required": true,
"field_count": 7,
"editable_count": 7,
"token_roles": [
"text",
"textMuted"
],
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"required": false,
"field_count": 6,
"editable_count": 6,
"token_roles": [
"panelElevated",
"border"
],
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"required": false,
"field_count": 1,
"editable_count": 1,
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"required": false,
"field_count": 5,
"editable_count": 5,
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"badge",
"badgeText",
"signal"
],
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"builder_field_count": 29,
"editable_field_count": 29,
"action_count": 0,
"control_count": 0,
"replacement_guidance": [
"Keep Compact Ops recipe tokens as the source of visual styling for the surface, text, controls, and actions.",
"Replace media URLs through the CMS media library and preserve alt, title, provider, or label fallbacks.",
"No action wiring is required for this recipe; avoid inventing clickable surfaces in content.",
"No input controls are required; keep the recipe focused on its documented display regions.",
"Treat collection regions as repeatable slots that support add, remove, reorder, and item-level editing."
],
"publish_checklist": [
"Validate theme-preview-matrix against its block contract before publishing.",
"3 required anatomy regions remain present: surface, copy, feedback.",
"29/29 builder fields are CMS-editable or intentionally locked.",
"Noninteractive presentation has no unexpected action or control surfaces.",
"Phone, tablet, and desktop responsive behavior maps have been reviewed for wrapping and overflow.",
"Contrast checks meet the AA recipe target."
],
"agent_notes": [
"Prefer editing props fields described by the builder field map; metadata is evidence, not primary content.",
"Preserve recipe_alignment token roles unless the page theme or recipe changes intentionally.",
"Use the anatomy slots to compose or replace content without changing the block type."
],
"summary": "Compact Ops is a high-complexity operator-review recipe with 6 documented composition slots."
},
"composition_passport_complexity": "high",
"composition_passport_authoring_mode": "operator-review",
"composition_passport_slots": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"composition_passport_check_count": 6,
"visual_polish_check_count": 6,
"visual_polish_pass_count": 6,
"visual_polish_checks": [
{
"id": "surface-rhythm",
"label": "Surface rhythm",
"axis": "layout",
"status": "ready",
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"evidence": "dense treatment uses compact density and 8px radius base.",
"summary": "theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers."
},
{
"id": "type-hierarchy",
"label": "Type hierarchy",
"axis": "typography",
"status": "ready",
"token_roles": [
"text",
"textMuted",
"badgeText"
],
"evidence": "6/6 contrast checks pass the AA target.",
"summary": "Primary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text."
},
{
"id": "action-clarity",
"label": "Action clarity",
"axis": "interaction",
"status": "ready",
"token_roles": [
"button",
"buttonText",
"control",
"controlText",
"signal",
"uplink"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"summary": "No unexpected interactive surface is introduced for this noninteractive recipe."
},
{
"id": "media-treatment",
"label": "Media treatment",
"axis": "media",
"status": "ready",
"token_roles": [
"panelElevated",
"border",
"textMuted"
],
"evidence": "Media region is isolated with replaceable fields.",
"summary": "Replaceable media stays framed separately from copy and action regions so asset swaps preserve the layout."
},
{
"id": "state-feedback",
"label": "State feedback",
"axis": "state",
"status": "ready",
"token_roles": [
"badge",
"badgeText",
"signal"
],
"evidence": "6 state-readiness entries include default, empty, pending, active, invalid, disabled.",
"summary": "Feedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning."
},
{
"id": "responsive-balance",
"label": "Responsive balance",
"axis": "responsive",
"status": "ready",
"token_roles": [
"panel",
"border",
"control"
],
"evidence": "single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.",
"summary": "Phone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe."
}
],
"visual_polish_axes": [
"layout",
"typography",
"interaction",
"media",
"state",
"responsive"
],
"default_provenance_count": 29,
"default_provenance_map": [
{
"path": "title",
"label": "Title",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Title defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "description",
"label": "Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Description defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "presets",
"label": "Presets",
"field_role": "style",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Compact Ops recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Presets defaults from Compact Ops recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "recipes",
"label": "Recipes",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Recipes defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "block_types",
"label": "Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections",
"label": "Block Collections",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Compact Ops recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Preview Layout defaults from Compact Ops recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_theme",
"label": "Default Theme",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Compact Ops recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Theme defaults from Compact Ops recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_preset",
"label": "Default Preset",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Compact Ops recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Preset defaults from Compact Ops recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Recipe defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Default Block Collection defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Design Configuration defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Default Media Placeholder defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"field_role": "style",
"value_type": "object",
"editable": true,
"repeated": true,
"default_source": "Compact Ops recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Design Configurations Item Theme defaults from Compact Ops recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"field_role": "media",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Id defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Media Placeholders Item Label defaults from cloneable block recipe payload; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Src defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Alt defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Aspect Ratio defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"field_role": "action",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "CMS route, URL, or canonical postEvent path",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"summary": "Media Placeholders Item Source Url defaults from CMS route, URL, or canonical postEvent path; replacement is medium risk with requires-alt-text policy."
}
],
"default_replacement_policies": [
"collection-item",
"locked-token",
"requires-alt-text",
"safe-to-edit"
],
"default_replacement_risks": [
"low",
"medium"
],
"default_replacement_high_risk_count": 0,
"content_edit_bundle_count": 6,
"content_edit_bundles": [
{
"id": "copy",
"label": "Copy bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"type hierarchy",
"mobile wrapping"
],
"summary": "Copy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "media",
"label": "Media bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"default_sources": [
"Cloud Elephants placeholder media or CMS media library"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy alt text",
"responsive fit"
],
"summary": "Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "actions",
"label": "Action bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"media_placeholders[].source_url"
],
"default_sources": [
"CMS route, URL, or canonical postEvent path"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy labels"
],
"summary": "Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish."
},
{
"id": "collections",
"label": "Collection bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"item shape",
"responsive wrapping"
],
"summary": "Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "style",
"label": "Style bundle",
"intent": "guarded",
"edit_mode": "guarded-system",
"field_paths": [
"default_preset",
"default_theme",
"design_configurations[].theme",
"presets",
"preview_layout"
],
"default_sources": [
"Compact Ops recipe tokens"
],
"guardrails": [
"Keep visual styling aligned to Compact Ops recipe tokens unless the recipe itself changes."
],
"depends_on": [
"theme recipe tokens",
"contrast proof"
],
"summary": "Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "content",
"label": "Content bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"default_design_configuration",
"default_recipe",
"design_configurations",
"design_configurations[].id",
"recipes"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"contract-safe JSON"
],
"summary": "Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
}
],
"content_edit_bundle_ids": [
"copy",
"media",
"actions",
"collections",
"style",
"content"
],
"content_edit_bundle_modes": [
"guarded-system",
"repeatable-items"
],
"content_edit_bundle_required_count": 2,
"content_edit_bundle_guarded_count": 1,
"recipe_compatibility_count": 6,
"recipe_compatibility_map": [
{
"id": "page-context",
"label": "Page context",
"axis": "page",
"fit": "primary",
"values": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"evidence": "6 page types mapped for theme-preview-matrix.",
"guardrail": "Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.",
"summary": "theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages."
},
{
"id": "section-role",
"label": "Section role",
"axis": "layout",
"fit": "supporting",
"values": [
"collection",
"media",
"content",
"metadata"
],
"evidence": "6 anatomy regions produce 4 section roles.",
"guardrail": "Place the block where its required anatomy regions have enough room before compressing it into dense page slots.",
"summary": "theme-preview-matrix can act as collection, media, content within a composed page."
},
{
"id": "content-model",
"label": "Content model",
"axis": "content",
"fit": "specialized",
"values": [
"copy-led",
"media-led",
"cta-led",
"repeatable"
],
"evidence": "29/29 fields are editable across 4 content models.",
"guardrail": "Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.",
"summary": "Compact Ops composition passport is copy-led, media-led, cta-led, repeatable for CMS composition."
},
{
"id": "interaction-model",
"label": "Interaction model",
"axis": "interaction",
"fit": "supporting",
"values": [
"noninteractive"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"guardrail": "Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.",
"summary": "theme-preview-matrix is compatible with noninteractive content sections."
},
{
"id": "authoring-fit",
"label": "Authoring fit",
"axis": "authoring",
"fit": "specialized",
"values": [
"operator-review",
"high-complexity",
"0-high-care-replacements"
],
"evidence": "29 default provenance items with 0 high-care replacements.",
"guardrail": "Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.",
"summary": "theme-preview-matrix uses operator-review authoring with high complexity."
},
{
"id": "responsive-fit",
"label": "Responsive fit",
"axis": "responsive",
"fit": "primary",
"values": [
"single-column stack",
"two-column adaptive grid",
"responsive composition grid",
"min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke."
],
"evidence": "3 responsive behavior maps cover phone, tablet, and desktop composition.",
"guardrail": "Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.",
"summary": "theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages."
}
],
"recipe_compatibility_axes": [
"page",
"layout",
"content",
"interaction",
"authoring",
"responsive"
],
"recipe_compatibility_page_types": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"recipe_compatibility_section_roles": [
"collection",
"media",
"content",
"metadata"
],
"recipe_compatibility_fits": [
"primary",
"specialized",
"supporting"
],
"builder_field_count": 29,
"builder_field_map": [
{
"path": "title",
"label": "Title",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Title is a string field used for copy."
},
{
"path": "description",
"label": "Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Description is a string field used for copy."
},
{
"path": "presets",
"label": "Presets",
"value_type": "array",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Presets is a array field used for style."
},
{
"path": "recipes",
"label": "Recipes",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Recipes is a array field used for content."
},
{
"path": "block_types",
"label": "Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Types is a array field used for collection."
},
{
"path": "block_collections",
"label": "Block Collections",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Collections is a array field used for collection."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Id is a string collection field used for collection."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Label is a string collection field used for copy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Description is a string collection field used for copy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Block Types is a array collection field used for collection."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Preview Layout is a string field used for style."
},
{
"path": "default_theme",
"label": "Default Theme",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Theme is a string field used for style."
},
{
"path": "default_preset",
"label": "Default Preset",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Preset is a string field used for style."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Recipe is a string field used for content."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Default Block Collection is a string field used for collection."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Design Configuration is a string field used for content."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Default Media Placeholder is a string field used for media."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Design Configurations is a array field used for content."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Id is a string collection field used for content."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Label is a string collection field used for copy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Description is a string collection field used for copy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"value_type": "object",
"role": "style",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Theme is a object collection field used for style."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"value_type": "array",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Media Placeholders is a array field used for media."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Id is a string collection field used for media."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Label is a string collection field used for copy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Src is a string collection field used for media."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Alt is a string collection field used for media."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Aspect Ratio is a string collection field used for media."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"value_type": "string",
"role": "action",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Source Url is a string collection field used for action."
}
],
"editor_guidance_count": 6,
"editor_guidance_map": [
{
"id": "copy",
"label": "Copy",
"field_role": "copy",
"field_count": 7,
"editable_count": 7,
"editor_widget": "text/rich-text editor",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"default_source": "cloneable block recipe payload",
"summary": "Copy fields use the text/rich-text editor across 7/7 editable fields."
},
{
"id": "media",
"label": "Media",
"field_role": "media",
"field_count": 6,
"editable_count": 6,
"editor_widget": "media picker with alt text",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"default_source": "Cloud Elephants placeholder media or CMS media library",
"summary": "Media fields use the media picker with alt text across 6/6 editable fields."
},
{
"id": "action",
"label": "Action",
"field_role": "action",
"field_count": 1,
"editable_count": 1,
"editor_widget": "link or event action editor",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"default_source": "CMS route, URL, or canonical postEvent path",
"summary": "Action fields use the link or event action editor across 1/1 editable field."
},
{
"id": "collection",
"label": "Collection",
"field_role": "collection",
"field_count": 5,
"editable_count": 5,
"editor_widget": "repeatable item editor",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"default_source": "cloneable block recipe payload",
"summary": "Collection fields use the repeatable item editor across 5/5 editable fields."
},
{
"id": "style",
"label": "Style",
"field_role": "style",
"field_count": 5,
"editable_count": 5,
"editor_widget": "appearance preset selector",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"default_source": "Compact Ops recipe tokens",
"summary": "Style fields use the appearance preset selector across 5/5 editable fields."
},
{
"id": "content",
"label": "Content",
"field_role": "content",
"field_count": 5,
"editable_count": 5,
"editor_widget": "plain content field",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"default_source": "cloneable block recipe payload",
"summary": "Content fields use the plain content field across 5/5 editable fields."
}
],
"editor_field_roles": [
"copy",
"media",
"action",
"collection",
"style",
"content"
],
"editor_editable_field_count": 29,
"state_readiness_count": 6,
"state_readiness_map": [
{
"id": "default",
"label": "Default",
"status": "covered",
"trigger": "Initial render with the cloneable recipe payload",
"visual_treatment": "Compact Ops tokens with dense documentation treatment",
"token_roles": [
"surface",
"panel",
"text",
"button"
],
"proof": "The Compact Ops recipe renders a contract-safe primary state for theme-preview-matrix.",
"summary": "Default state uses the recipe surface, text, and action tokens without one-off styling."
},
{
"id": "empty",
"label": "Empty",
"status": "covered",
"trigger": "Repeatable collections have zero items",
"visual_treatment": "Reserved panel space with fallback copy or placeholder media",
"token_roles": [
"panel",
"textMuted",
"badge",
"border"
],
"proof": "Repeatable fields are documented for add, remove, reorder, and item-level editing.",
"summary": "Empty-state guidance preserves layout rhythm instead of collapsing the block surface."
},
{
"id": "pending",
"label": "Pending",
"status": "covered",
"trigger": "Deferred content or preview loading",
"visual_treatment": "Neutral reserved frame with status copy and no layout shift",
"token_roles": [
"control",
"textMuted",
"progressTrack",
"border"
],
"proof": "Static recipe payloads reserve the same documented frame while content is loading.",
"summary": "Pending state keeps dimensions stable while using muted control/status tokens."
},
{
"id": "active",
"label": "Active",
"status": "covered",
"trigger": "Current block and recipe preview are selected",
"visual_treatment": "Signal/uplink emphasis with visible selected-state chips",
"token_roles": [
"signal",
"uplink",
"button",
"badge"
],
"proof": "Recipe and block selection evidence is rendered in the documentation chrome.",
"summary": "Active state is represented with recipe accent tokens and visible state labels."
},
{
"id": "invalid",
"label": "Invalid",
"status": "covered",
"trigger": "Media URL or provider data is invalid",
"visual_treatment": "Warning/danger status treatment while preserving the block frame",
"token_roles": [
"warning",
"danger",
"border",
"text"
],
"proof": "Media guidance requires URL plus accessible fallback text for invalid or missing assets.",
"summary": "Invalid state guidance favors explicit status evidence over ambiguous visual collapse."
},
{
"id": "disabled",
"label": "Disabled",
"status": "covered",
"trigger": "Noninteractive metadata or held preview state",
"visual_treatment": "Muted affordance with preserved label, spacing, and hit-area rhythm",
"token_roles": [
"control",
"textMuted",
"border",
"panel"
],
"proof": "Noninteractive blocks retain evidence labels without pretending to be clickable.",
"summary": "Disabled state keeps the block readable and spatially stable when interaction is unavailable."
}
],
"state_readiness_states": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"state_readiness_statuses": [
"covered",
"covered",
"covered",
"covered",
"covered",
"covered"
],
"anatomy_region_count": 6,
"anatomy_map": [
{
"id": "surface",
"label": "Surface",
"region_role": "outer layout and background",
"field_paths": [],
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"region_role": "headings, body copy, labels, and supporting text",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"token_roles": [
"text",
"textMuted"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"region_role": "replaceable image, iframe, embed, avatar, logo, or gallery area",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"token_roles": [
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"region_role": "CTA, link, event, and navigation affordances",
"field_paths": [
"media_placeholders[].source_url"
],
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"region_role": "repeatable cards, steps, metrics, logos, links, or nested blocks",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"region_role": "status, validation, selected, loading, and disabled evidence",
"field_paths": [],
"token_roles": [
"badge",
"badgeText",
"signal"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"anatomy_regions": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"anatomy_token_roles": [
"background",
"badge",
"badgeText",
"border",
"button",
"buttonText",
"panel",
"panelElevated",
"signal",
"text",
"textMuted",
"uplink"
],
"action_count": 0,
"action_map": [],
"control_count": 0,
"control_map": [],
"style_token_count": 15,
"style_token_map": [
{
"role": "background",
"label": "Page background",
"value": "#f7fbff",
"token_type": "color",
"summary": "Page background uses the background recipe token."
},
{
"role": "panel",
"label": "Panel surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Panel surface uses the panel recipe token."
},
{
"role": "panelElevated",
"label": "Elevated surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Elevated surface uses the panelElevated recipe token."
},
{
"role": "text",
"label": "Primary text",
"value": "#142033",
"token_type": "color",
"summary": "Primary text uses the text recipe token."
},
{
"role": "textMuted",
"label": "Muted text",
"value": "#526174",
"token_type": "color",
"summary": "Muted text uses the textMuted recipe token."
},
{
"role": "signal",
"label": "Signal accent",
"value": "#166bff",
"token_type": "color",
"summary": "Signal accent uses the signal recipe token."
},
{
"role": "uplink",
"label": "Secondary accent",
"value": "#00a6a6",
"token_type": "color",
"summary": "Secondary accent uses the uplink recipe token."
},
{
"role": "border",
"label": "Border",
"value": "#d6dee8",
"token_type": "color",
"summary": "Border uses the border recipe token."
},
{
"role": "control",
"label": "Control surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Control surface uses the control recipe token."
},
{
"role": "controlText",
"label": "Control text",
"value": "#142033",
"token_type": "color",
"summary": "Control text uses the controlText recipe token."
},
{
"role": "button",
"label": "Button surface",
"value": "#166bff",
"token_type": "color",
"summary": "Button surface uses the button recipe token."
},
{
"role": "buttonText",
"label": "Button text",
"value": "#ffffff",
"token_type": "color",
"summary": "Button text uses the buttonText recipe token."
},
{
"role": "badge",
"label": "Badge surface",
"value": "#eef5ff",
"token_type": "color",
"summary": "Badge surface uses the badge recipe token."
},
{
"role": "badgeText",
"label": "Badge text",
"value": "#174ea6",
"token_type": "color",
"summary": "Badge text uses the badgeText recipe token."
},
{
"role": "fontFamily",
"label": "Font family",
"value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif",
"token_type": "font",
"summary": "Font family comes from the active recipe theme tokens."
}
],
"style_token_roles": [
"background",
"panel",
"panelElevated",
"text",
"textMuted",
"signal",
"uplink",
"border",
"control",
"controlText",
"button",
"buttonText",
"badge",
"badgeText",
"fontFamily"
],
"contrast_check_count": 6,
"contrast_pass_count": 6,
"contrast_checks": [
{
"id": "text-on-background",
"label": "Text on background",
"foreground_role": "text",
"background_role": "background",
"foreground": "#142033",
"background": "#f7fbff",
"ratio": 15.73,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on background is AAA at 15.73:1 against a 4.5:1 requirement."
},
{
"id": "text-on-panel",
"label": "Text on panel",
"foreground_role": "text",
"background_role": "panel",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on panel is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "muted-text-on-panel",
"label": "Muted text on panel",
"foreground_role": "textMuted",
"background_role": "panel",
"foreground": "#526174",
"background": "#ffffff",
"ratio": 6.32,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Muted text on panel is AA at 6.32:1 against a 4.5:1 requirement."
},
{
"id": "button-text-on-button",
"label": "Button text on button",
"foreground_role": "buttonText",
"background_role": "button",
"foreground": "#ffffff",
"background": "#166bff",
"ratio": 4.58,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Button text on button is AA at 4.58:1 against a 4.5:1 requirement."
},
{
"id": "control-text-on-control",
"label": "Control text on control",
"foreground_role": "controlText",
"background_role": "control",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Control text on control is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "badge-text-on-badge",
"label": "Badge text on badge",
"foreground_role": "badgeText",
"background_role": "badge",
"foreground": "#174ea6",
"background": "#eef5ff",
"ratio": 7.15,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Badge text on badge is AAA at 7.15:1 against a 4.5:1 requirement."
}
],
"contrast_target": "AA",
"accessibility_standard": "WCAG_2_2_AA",
"accessibility_check_count": 5,
"accessibility_checks": [
{
"id": "semantic-structure",
"label": "Semantic structure",
"category": "semantics",
"status": "covered",
"required": true,
"proof": "runtime block sections, cards, lists, and headings",
"summary": "theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview."
},
{
"id": "keyboard-and-tap-targets",
"label": "Keyboard and tap targets",
"category": "keyboard",
"status": "covered",
"required": false,
"proof": "static content has no hidden focus trap",
"summary": "The payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances."
},
{
"id": "text-alternatives",
"label": "Text alternatives",
"category": "media",
"status": "covered",
"required": true,
"proof": "media fields include alt/label/title fallbacks",
"summary": "Media-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders."
},
{
"id": "control-labels",
"label": "Control labels",
"category": "forms",
"status": "covered",
"required": false,
"proof": "no input controls in this payload",
"summary": "No input controls are present, so there are no unlabeled fields to remediate."
},
{
"id": "status-and-motion",
"label": "Status and motion",
"category": "state",
"status": "covered",
"required": true,
"proof": "runtime evidence avoids hidden status-only content",
"summary": "Recipe defaults avoid motion-only meaning and keep status text inspectable when state is present."
}
],
"responsive_behavior_count": 3,
"responsive_behavior_map": [
{
"id": "phone",
"label": "Phone",
"viewport_width": 390,
"layout_mode": "single-column stack",
"column_count": 1,
"spacing_density": "compact",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-phone",
"summary": "Compact Ops stacks theme-preview-matrix into one phone column with compact spacing and bounded content."
},
{
"id": "tablet",
"label": "Tablet",
"viewport_width": 768,
"layout_mode": "two-column adaptive grid",
"column_count": 2,
"spacing_density": "compact",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-tablet",
"summary": "Compact Ops adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout."
},
{
"id": "desktop",
"label": "Desktop",
"viewport_width": 1366,
"layout_mode": "responsive composition grid",
"column_count": 3,
"spacing_density": "compact",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-desktop",
"summary": "Compact Ops gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing."
}
],
"responsive_viewports": [
"phone",
"tablet",
"desktop"
],
"responsive_proof": [
"npm run test:static:block-catalog all-blocks-phone",
"npm run test:static:block-catalog all-blocks-tablet",
"npm run test:static:block-catalog all-blocks-desktop"
],
"interactive_roles": [],
"recipe_alignment": {
"action_token": "button",
"control_token": "control",
"surface_token": "panel",
"text_token": "text",
"source": "theme recipe tokens"
}
},
"cloneable": true
}
}A resilience payload with plausible long CMS copy, longer labels, and dense supporting metadata to prove wrapping and spacing.
theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable.
background, panel, panelElevated, borderCopy fields map to primary and muted text roles so editors can change words without restyling the block.
text, textMutedMedia fields stay isolated from copy and action regions so replacement assets preserve the recipe layout.
panelElevated, borderAction regions use recipe button and accent tokens while preserving href or event payloads.
button, buttonText, signal, uplinkCollection regions define repeatable item boundaries for add, remove, reorder, and nested editing.
panel, panelElevated, border, badgeFeedback regions tie state-readiness evidence to visible recipe status treatments.
badge, badgeText, signalUse to verify theme-preview-matrix long copy, awkward values, and wrapping before publishing customer pages.
Long Copy Stress is a high-complexity stress-test recipe with 6 documented composition slots.
3 required regions, 3 optional regions.
theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages.
6 page types mapped for theme-preview-matrix.Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.theme-preview-matrix can act as collection, media, content within a composed page.
6 anatomy regions produce 4 section roles.Place the block where its required anatomy regions have enough room before compressing it into dense page slots.Long Copy Stress composition passport is copy-led, media-led, cta-led, repeatable for CMS composition.
29/29 fields are editable across 4 content models.Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.theme-preview-matrix is compatible with noninteractive content sections.
0 action surfaces and 0 control surfaces mapped.Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.theme-preview-matrix uses stress-test authoring with high complexity.
29 default provenance items with 0 high-care replacements.Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages.
3 responsive behavior maps cover phone, tablet, and desktop composition.Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers.
editorial treatment uses spacious density and 8px radius base.background, panel, panelElevated, borderPrimary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text.
6/6 contrast checks pass the AA target.text, textMuted, badgeTextNo unexpected interactive surface is introduced for this noninteractive recipe.
0 action surfaces and 0 control surfaces mapped.button, buttonText, control, controlText, signal, uplinkReplaceable media stays framed separately from copy and action regions so asset swaps preserve the layout.
Media region is isolated with replaceable fields.panelElevated, border, textMutedFeedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning.
6 state-readiness entries include default, empty, pending, active, invalid, disabled.badge, badgeText, signalPhone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe.
single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.panel, border, controlCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadKeep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.
Editorial Block System recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.
Editorial Block System recipe tokensKeep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.
Editorial Block System recipe tokensKeep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.
Editorial Block System recipe tokensCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.
cloneable block recipe payloadKeep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.
Editorial Block System recipe tokensReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
cloneable block recipe payloadReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.
CMS route, URL, or canonical postEvent pathCopy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish.
Cloud Elephants placeholder media or CMS media libraryReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish.
CMS route, URL, or canonical postEvent pathReplace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadEdit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
Editorial Block System recipe tokensKeep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish.
cloneable block recipe payloadCopy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.
cloneable block recipe payloadMedia should use a replaceable URL plus meaningful alt, label, or title fallback.
Cloud Elephants placeholder media or CMS media libraryActions should resolve to a URL or event name with a human-readable label.
CMS route, URL, or canonical postEvent pathCollections should support add, remove, reorder, and item-level editing without changing block shape.
cloneable block recipe payloadStyle fields should prefer recipe or appearance tokens over one-off inline values.
Editorial Block System recipe tokensContent should remain serializable JSON and preserve the documented block contract.
cloneable block recipe payloadEditorial Block System tokens with editorial documentation treatment
The Editorial Block System recipe renders a contract-safe primary state for theme-preview-matrix.Reserved panel space with fallback copy or placeholder media
Repeatable fields are documented for add, remove, reorder, and item-level editing.Neutral reserved frame with status copy and no layout shift
Static recipe payloads reserve the same documented frame while content is loading.Signal/uplink emphasis with visible selected-state chips
Recipe and block selection evidence is rendered in the documentation chrome.Warning/danger status treatment while preserving the block frame
Media guidance requires URL plus accessible fallback text for invalid or missing assets.Muted affordance with preserved label, spacing, and hit-area rhythm
Noninteractive blocks retain evidence labels without pretending to be clickable.No public action surface is needed for this payload.
No input control is needed for this payload.
theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview.
runtime block sections, cards, lists, and headingsThe payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances.
static content has no hidden focus trapMedia-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders.
media fields include alt/label/title fallbacksNo input controls are present, so there are no unlabeled fields to remediate.
no input controls in this payloadRecipe defaults avoid motion-only meaning and keep status text inspectable when state is present.
runtime evidence avoids hidden status-only contentEditorial Block System stacks theme-preview-matrix into one phone column with spacious spacing and bounded content.
min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.Editorial Block System adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout.
tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.Editorial Block System gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing.
desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.This intentionally longer copy uses normal words, punctuation, and CMS-style details so the block proves it can remain polished with production-length titles, helper text, labels, badges, links, and nested content.
{
"id": "block-doc-theme-preview-matrix-data-long-copy-stress",
"block_type": "theme-preview-matrix",
"props": {
"title": "Theme Preview Matrix with a realistic CMS-authored headline that wraps cleanly across compact cards, mobile panels, and generated documentation frames",
"description": "This intentionally longer copy uses normal words, punctuation, and CMS-style details so the block proves it can remain polished with production-length titles, helper text, labels, badges, links, and nested content.",
"presets": [
"block"
],
"recipes": [
"editorial-block-system"
],
"block_types": [
"hero"
],
"block_collections": [
{
"id": "single-block",
"label": "Single Block",
"description": "Compact documentation preview.",
"block_types": [
"hero"
]
}
],
"preview_layout": "flow",
"default_theme": "ensemble-daylight",
"default_preset": "block",
"default_recipe": "editorial-block-system",
"default_block_collection": "single-block",
"default_design_configuration": "base",
"default_media_placeholder": "block-doc-preview-media",
"design_configurations": [
{
"id": "base",
"label": "Default",
"description": "Baseline contract props with the selected recipe and standard system preset.",
"theme": {}
}
],
"media_placeholders": [
{
"id": "block-doc-preview-media",
"label": "Essential CTO",
"src": "https://storage.googleapis.com/msgsndr/T3RhpcTQAq7Qb47kPQAB/media/677815b8c290c684d5bf3fbd.png",
"alt": "Cloud Elephants Essential CTO service visual.",
"aspect_ratio": "16 / 9",
"source_url": "https://go.cloudelephants.com/a-la-carte"
}
]
},
"metadata": {
"long_copy_tolerance": true,
"awkward_content_tolerance": true,
"composition_recipe": {
"id": "long-copy-stress",
"intent": "stress",
"label": "Long Copy Stress",
"recipe": "editorial-block-system",
"source": "block-explorer",
"quality_proof": [
"long_copy_tolerance",
"awkward_content_tolerance"
],
"composition_passport": {
"id": "long-copy-stress",
"label": "Long Copy Stress composition passport",
"intent": "stress",
"recipe": "editorial-block-system",
"authoring_mode": "stress-test",
"complexity": "high",
"fit": "Use to verify theme-preview-matrix long copy, awkward values, and wrapping before publishing customer pages.",
"required_regions": [
"surface",
"copy",
"feedback"
],
"optional_regions": [
"media",
"actions",
"collection"
],
"slots": [
{
"id": "surface",
"label": "Surface",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"required": true,
"field_count": 7,
"editable_count": 7,
"token_roles": [
"text",
"textMuted"
],
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"required": false,
"field_count": 6,
"editable_count": 6,
"token_roles": [
"panelElevated",
"border"
],
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"required": false,
"field_count": 1,
"editable_count": 1,
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"required": false,
"field_count": 5,
"editable_count": 5,
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"required": true,
"field_count": 0,
"editable_count": 0,
"token_roles": [
"badge",
"badgeText",
"signal"
],
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"builder_field_count": 29,
"editable_field_count": 29,
"action_count": 0,
"control_count": 0,
"replacement_guidance": [
"Keep Editorial Block System recipe tokens as the source of visual styling for the surface, text, controls, and actions.",
"Replace media URLs through the CMS media library and preserve alt, title, provider, or label fallbacks.",
"No action wiring is required for this recipe; avoid inventing clickable surfaces in content.",
"No input controls are required; keep the recipe focused on its documented display regions.",
"Treat collection regions as repeatable slots that support add, remove, reorder, and item-level editing."
],
"publish_checklist": [
"Validate theme-preview-matrix against its block contract before publishing.",
"3 required anatomy regions remain present: surface, copy, feedback.",
"29/29 builder fields are CMS-editable or intentionally locked.",
"Noninteractive presentation has no unexpected action or control surfaces.",
"Phone, tablet, and desktop responsive behavior maps have been reviewed for wrapping and overflow.",
"Contrast checks meet the AA recipe target."
],
"agent_notes": [
"Prefer editing props fields described by the builder field map; metadata is evidence, not primary content.",
"Preserve recipe_alignment token roles unless the page theme or recipe changes intentionally.",
"Use the anatomy slots to compose or replace content without changing the block type."
],
"summary": "Long Copy Stress is a high-complexity stress-test recipe with 6 documented composition slots."
},
"composition_passport_complexity": "high",
"composition_passport_authoring_mode": "stress-test",
"composition_passport_slots": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"composition_passport_check_count": 6,
"visual_polish_check_count": 6,
"visual_polish_pass_count": 6,
"visual_polish_checks": [
{
"id": "surface-rhythm",
"label": "Surface rhythm",
"axis": "layout",
"status": "ready",
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"evidence": "editorial treatment uses spacious density and 8px radius base.",
"summary": "theme-preview-matrix keeps a stable recipe surface with panel, border, and spacing roles instead of ad hoc wrappers."
},
{
"id": "type-hierarchy",
"label": "Type hierarchy",
"axis": "typography",
"status": "ready",
"token_roles": [
"text",
"textMuted",
"badgeText"
],
"evidence": "6/6 contrast checks pass the AA target.",
"summary": "Primary, muted, and badge text roles stay distinct enough for headings, body copy, metadata, and helper text."
},
{
"id": "action-clarity",
"label": "Action clarity",
"axis": "interaction",
"status": "ready",
"token_roles": [
"button",
"buttonText",
"control",
"controlText",
"signal",
"uplink"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"summary": "No unexpected interactive surface is introduced for this noninteractive recipe."
},
{
"id": "media-treatment",
"label": "Media treatment",
"axis": "media",
"status": "ready",
"token_roles": [
"panelElevated",
"border",
"textMuted"
],
"evidence": "Media region is isolated with replaceable fields.",
"summary": "Replaceable media stays framed separately from copy and action regions so asset swaps preserve the layout."
},
{
"id": "state-feedback",
"label": "State feedback",
"axis": "state",
"status": "ready",
"token_roles": [
"badge",
"badgeText",
"signal"
],
"evidence": "6 state-readiness entries include default, empty, pending, active, invalid, disabled.",
"summary": "Feedback, selected, loading, invalid, and disabled treatments use visible state evidence instead of color-only meaning."
},
{
"id": "responsive-balance",
"label": "Responsive balance",
"axis": "responsive",
"status": "ready",
"token_roles": [
"panel",
"border",
"control"
],
"evidence": "single-column stack phone behavior, two-column adaptive grid tablet behavior, and responsive composition grid desktop behavior documented.",
"summary": "Phone, tablet, and desktop defaults have explicit stack, wrap, media, and overflow policies for the recipe."
}
],
"visual_polish_axes": [
"layout",
"typography",
"interaction",
"media",
"state",
"responsive"
],
"default_provenance_count": 29,
"default_provenance_map": [
{
"path": "title",
"label": "Title",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Title defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "description",
"label": "Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Description defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "presets",
"label": "Presets",
"field_role": "style",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Editorial Block System recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Presets defaults from Editorial Block System recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "recipes",
"label": "Recipes",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Recipes defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "block_types",
"label": "Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections",
"label": "Block Collections",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Block Collections Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"field_role": "collection",
"value_type": "array",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Block Collections Item Block Types defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Editorial Block System recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Preview Layout defaults from Editorial Block System recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_theme",
"label": "Default Theme",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Editorial Block System recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Theme defaults from Editorial Block System recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_preset",
"label": "Default Preset",
"field_role": "style",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Editorial Block System recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Default Preset defaults from Editorial Block System recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Recipe defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"field_role": "collection",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"summary": "Default Block Collection defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Default Design Configuration defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Default Media Placeholder defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"field_role": "content",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "cloneable block recipe payload",
"replacement_policy": "safe-to-edit",
"replacement_risk": "low",
"guardrail": "Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations defaults from cloneable block recipe payload; replacement is low risk with safe-to-edit policy."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"field_role": "content",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"summary": "Design Configurations Item Id defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Label defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "collection-item",
"replacement_risk": "medium",
"guardrail": "Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Design Configurations Item Description defaults from cloneable block recipe payload; replacement is medium risk with collection-item policy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"field_role": "style",
"value_type": "object",
"editable": true,
"repeated": true,
"default_source": "Editorial Block System recipe tokens",
"replacement_policy": "locked-token",
"replacement_risk": "medium",
"guardrail": "Keep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes.",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"summary": "Design Configurations Item Theme defaults from Editorial Block System recipe tokens; replacement is medium risk with locked-token policy."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"field_role": "media",
"value_type": "array",
"editable": true,
"repeated": false,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Id defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"field_role": "copy",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "cloneable block recipe payload",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"summary": "Media Placeholders Item Label defaults from cloneable block recipe payload; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Src defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Alt defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"field_role": "media",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "Cloud Elephants placeholder media or CMS media library",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"summary": "Media Placeholders Item Aspect Ratio defaults from Cloud Elephants placeholder media or CMS media library; replacement is medium risk with requires-alt-text policy."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"field_role": "action",
"value_type": "string",
"editable": true,
"repeated": true,
"default_source": "CMS route, URL, or canonical postEvent path",
"replacement_policy": "requires-alt-text",
"replacement_risk": "medium",
"guardrail": "Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful.",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"summary": "Media Placeholders Item Source Url defaults from CMS route, URL, or canonical postEvent path; replacement is medium risk with requires-alt-text policy."
}
],
"default_replacement_policies": [
"collection-item",
"locked-token",
"requires-alt-text",
"safe-to-edit"
],
"default_replacement_risks": [
"low",
"medium"
],
"default_replacement_high_risk_count": 0,
"content_edit_bundle_count": 6,
"content_edit_bundles": [
{
"id": "copy",
"label": "Copy bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape.",
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"type hierarchy",
"mobile wrapping"
],
"summary": "Copy bundle groups 7 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "media",
"label": "Media bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"default_sources": [
"Cloud Elephants placeholder media or CMS media library"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy alt text",
"responsive fit"
],
"summary": "Media bundle groups 6 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "actions",
"label": "Action bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"media_placeholders[].source_url"
],
"default_sources": [
"CMS route, URL, or canonical postEvent path"
],
"guardrails": [
"Replace the asset through CMS media data and keep alt, title, provider, or label fallback text meaningful."
],
"depends_on": [
"copy labels"
],
"summary": "Action bundle groups 1 field so CMS edits preserve the recipe shape and default polish."
},
{
"id": "collections",
"label": "Collection bundle",
"intent": "recommended",
"edit_mode": "repeatable-items",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"item shape",
"responsive wrapping"
],
"summary": "Collection bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "style",
"label": "Style bundle",
"intent": "guarded",
"edit_mode": "guarded-system",
"field_paths": [
"default_preset",
"default_theme",
"design_configurations[].theme",
"presets",
"preview_layout"
],
"default_sources": [
"Editorial Block System recipe tokens"
],
"guardrails": [
"Keep visual styling aligned to Editorial Block System recipe tokens unless the recipe itself changes."
],
"depends_on": [
"theme recipe tokens",
"contrast proof"
],
"summary": "Style bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
},
{
"id": "content",
"label": "Content bundle",
"intent": "required",
"edit_mode": "repeatable-items",
"field_paths": [
"default_design_configuration",
"default_recipe",
"design_configurations",
"design_configurations[].id",
"recipes"
],
"default_sources": [
"cloneable block recipe payload"
],
"guardrails": [
"Copy can be edited directly when text remains trimmed, localizable, and safe to wrap at phone widths.",
"Edit repeatable items through collection controls so add, remove, reorder, and item-level updates preserve shape."
],
"depends_on": [
"contract-safe JSON"
],
"summary": "Content bundle groups 5 fields so CMS edits preserve the recipe shape and default polish."
}
],
"content_edit_bundle_ids": [
"copy",
"media",
"actions",
"collections",
"style",
"content"
],
"content_edit_bundle_modes": [
"guarded-system",
"repeatable-items"
],
"content_edit_bundle_required_count": 2,
"content_edit_bundle_guarded_count": 1,
"recipe_compatibility_count": 6,
"recipe_compatibility_map": [
{
"id": "page-context",
"label": "Page context",
"axis": "page",
"fit": "supporting",
"values": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"evidence": "6 page types mapped for theme-preview-matrix.",
"guardrail": "Choose the first matching page type before editing copy, media, or actions so the recipe starts in the right narrative context.",
"summary": "theme-preview-matrix is best composed into listing, product-page, product-announcement, and related pages."
},
{
"id": "section-role",
"label": "Section role",
"axis": "layout",
"fit": "supporting",
"values": [
"collection",
"media",
"content",
"metadata"
],
"evidence": "6 anatomy regions produce 4 section roles.",
"guardrail": "Place the block where its required anatomy regions have enough room before compressing it into dense page slots.",
"summary": "theme-preview-matrix can act as collection, media, content within a composed page."
},
{
"id": "content-model",
"label": "Content model",
"axis": "content",
"fit": "specialized",
"values": [
"copy-led",
"media-led",
"cta-led",
"repeatable"
],
"evidence": "29/29 fields are editable across 4 content models.",
"guardrail": "Keep the content model stable when replacing defaults; do not turn a repeatable or media-led recipe into unrelated ad hoc content.",
"summary": "Long Copy Stress composition passport is copy-led, media-led, cta-led, repeatable for CMS composition."
},
{
"id": "interaction-model",
"label": "Interaction model",
"axis": "interaction",
"fit": "supporting",
"values": [
"noninteractive"
],
"evidence": "0 action surfaces and 0 control surfaces mapped.",
"guardrail": "Review href, event, input, required, and disabled-state evidence before publishing an interactive recipe.",
"summary": "theme-preview-matrix is compatible with noninteractive content sections."
},
{
"id": "authoring-fit",
"label": "Authoring fit",
"axis": "authoring",
"fit": "specialized",
"values": [
"stress-test",
"high-complexity",
"0-high-care-replacements"
],
"evidence": "29 default provenance items with 0 high-care replacements.",
"guardrail": "Use the default provenance map before cloning the recipe into CMS content or agent-generated page data.",
"summary": "theme-preview-matrix uses stress-test authoring with high complexity."
},
{
"id": "responsive-fit",
"label": "Responsive fit",
"axis": "responsive",
"fit": "primary",
"values": [
"single-column stack",
"two-column adaptive grid",
"responsive composition grid",
"min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke."
],
"evidence": "3 responsive behavior maps cover phone, tablet, and desktop composition.",
"guardrail": "Review phone wrapping, tablet mid-width balance, and desktop density before adding nested content, longer labels, or extra media.",
"summary": "theme-preview-matrix has explicit phone, tablet, and desktop compatibility evidence for composed pages."
}
],
"recipe_compatibility_axes": [
"page",
"layout",
"content",
"interaction",
"authoring",
"responsive"
],
"recipe_compatibility_page_types": [
"listing",
"product-page",
"product-announcement",
"blog",
"event-promotion",
"partnership-announcement"
],
"recipe_compatibility_section_roles": [
"collection",
"media",
"content",
"metadata"
],
"recipe_compatibility_fits": [
"primary",
"specialized",
"supporting"
],
"builder_field_count": 29,
"builder_field_map": [
{
"path": "title",
"label": "Title",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Title is a string field used for copy."
},
{
"path": "description",
"label": "Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": false,
"summary": "Description is a string field used for copy."
},
{
"path": "presets",
"label": "Presets",
"value_type": "array",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Presets is a array field used for style."
},
{
"path": "recipes",
"label": "Recipes",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Recipes is a array field used for content."
},
{
"path": "block_types",
"label": "Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Types is a array field used for collection."
},
{
"path": "block_collections",
"label": "Block Collections",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Block Collections is a array field used for collection."
},
{
"path": "block_collections[].id",
"label": "Block Collections Item Id",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Id is a string collection field used for collection."
},
{
"path": "block_collections[].label",
"label": "Block Collections Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Label is a string collection field used for copy."
},
{
"path": "block_collections[].description",
"label": "Block Collections Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Description is a string collection field used for copy."
},
{
"path": "block_collections[].block_types",
"label": "Block Collections Item Block Types",
"value_type": "array",
"role": "collection",
"editable": true,
"repeated": true,
"summary": "Block Collections Item Block Types is a array collection field used for collection."
},
{
"path": "preview_layout",
"label": "Preview Layout",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Preview Layout is a string field used for style."
},
{
"path": "default_theme",
"label": "Default Theme",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Theme is a string field used for style."
},
{
"path": "default_preset",
"label": "Default Preset",
"value_type": "string",
"role": "style",
"editable": true,
"repeated": false,
"summary": "Default Preset is a string field used for style."
},
{
"path": "default_recipe",
"label": "Default Recipe",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Recipe is a string field used for content."
},
{
"path": "default_block_collection",
"label": "Default Block Collection",
"value_type": "string",
"role": "collection",
"editable": true,
"repeated": false,
"summary": "Default Block Collection is a string field used for collection."
},
{
"path": "default_design_configuration",
"label": "Default Design Configuration",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Default Design Configuration is a string field used for content."
},
{
"path": "default_media_placeholder",
"label": "Default Media Placeholder",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Default Media Placeholder is a string field used for media."
},
{
"path": "design_configurations",
"label": "Design Configurations",
"value_type": "array",
"role": "content",
"editable": true,
"repeated": false,
"summary": "Design Configurations is a array field used for content."
},
{
"path": "design_configurations[].id",
"label": "Design Configurations Item Id",
"value_type": "string",
"role": "content",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Id is a string collection field used for content."
},
{
"path": "design_configurations[].label",
"label": "Design Configurations Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Label is a string collection field used for copy."
},
{
"path": "design_configurations[].description",
"label": "Design Configurations Item Description",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Description is a string collection field used for copy."
},
{
"path": "design_configurations[].theme",
"label": "Design Configurations Item Theme",
"value_type": "object",
"role": "style",
"editable": true,
"repeated": true,
"summary": "Design Configurations Item Theme is a object collection field used for style."
},
{
"path": "media_placeholders",
"label": "Media Placeholders",
"value_type": "array",
"role": "media",
"editable": true,
"repeated": false,
"summary": "Media Placeholders is a array field used for media."
},
{
"path": "media_placeholders[].id",
"label": "Media Placeholders Item Id",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Id is a string collection field used for media."
},
{
"path": "media_placeholders[].label",
"label": "Media Placeholders Item Label",
"value_type": "string",
"role": "copy",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Label is a string collection field used for copy."
},
{
"path": "media_placeholders[].src",
"label": "Media Placeholders Item Src",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Src is a string collection field used for media."
},
{
"path": "media_placeholders[].alt",
"label": "Media Placeholders Item Alt",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Alt is a string collection field used for media."
},
{
"path": "media_placeholders[].aspect_ratio",
"label": "Media Placeholders Item Aspect Ratio",
"value_type": "string",
"role": "media",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Aspect Ratio is a string collection field used for media."
},
{
"path": "media_placeholders[].source_url",
"label": "Media Placeholders Item Source Url",
"value_type": "string",
"role": "action",
"editable": true,
"repeated": true,
"summary": "Media Placeholders Item Source Url is a string collection field used for action."
}
],
"editor_guidance_count": 6,
"editor_guidance_map": [
{
"id": "copy",
"label": "Copy",
"field_role": "copy",
"field_count": 7,
"editable_count": 7,
"editor_widget": "text/rich-text editor",
"validation": "Text should be editable, trimmed, localizable, and safe to wrap at mobile widths.",
"default_source": "cloneable block recipe payload",
"summary": "Copy fields use the text/rich-text editor across 7/7 editable fields."
},
{
"id": "media",
"label": "Media",
"field_role": "media",
"field_count": 6,
"editable_count": 6,
"editor_widget": "media picker with alt text",
"validation": "Media should use a replaceable URL plus meaningful alt, label, or title fallback.",
"default_source": "Cloud Elephants placeholder media or CMS media library",
"summary": "Media fields use the media picker with alt text across 6/6 editable fields."
},
{
"id": "action",
"label": "Action",
"field_role": "action",
"field_count": 1,
"editable_count": 1,
"editor_widget": "link or event action editor",
"validation": "Actions should resolve to a URL or event name with a human-readable label.",
"default_source": "CMS route, URL, or canonical postEvent path",
"summary": "Action fields use the link or event action editor across 1/1 editable field."
},
{
"id": "collection",
"label": "Collection",
"field_role": "collection",
"field_count": 5,
"editable_count": 5,
"editor_widget": "repeatable item editor",
"validation": "Collections should support add, remove, reorder, and item-level editing without changing block shape.",
"default_source": "cloneable block recipe payload",
"summary": "Collection fields use the repeatable item editor across 5/5 editable fields."
},
{
"id": "style",
"label": "Style",
"field_role": "style",
"field_count": 5,
"editable_count": 5,
"editor_widget": "appearance preset selector",
"validation": "Style fields should prefer recipe or appearance tokens over one-off inline values.",
"default_source": "Editorial Block System recipe tokens",
"summary": "Style fields use the appearance preset selector across 5/5 editable fields."
},
{
"id": "content",
"label": "Content",
"field_role": "content",
"field_count": 5,
"editable_count": 5,
"editor_widget": "plain content field",
"validation": "Content should remain serializable JSON and preserve the documented block contract.",
"default_source": "cloneable block recipe payload",
"summary": "Content fields use the plain content field across 5/5 editable fields."
}
],
"editor_field_roles": [
"copy",
"media",
"action",
"collection",
"style",
"content"
],
"editor_editable_field_count": 29,
"state_readiness_count": 6,
"state_readiness_map": [
{
"id": "default",
"label": "Default",
"status": "covered",
"trigger": "Initial render with the cloneable recipe payload",
"visual_treatment": "Editorial Block System tokens with editorial documentation treatment",
"token_roles": [
"surface",
"panel",
"text",
"button"
],
"proof": "The Editorial Block System recipe renders a contract-safe primary state for theme-preview-matrix.",
"summary": "Default state uses the recipe surface, text, and action tokens without one-off styling."
},
{
"id": "empty",
"label": "Empty",
"status": "covered",
"trigger": "Repeatable collections have zero items",
"visual_treatment": "Reserved panel space with fallback copy or placeholder media",
"token_roles": [
"panel",
"textMuted",
"badge",
"border"
],
"proof": "Repeatable fields are documented for add, remove, reorder, and item-level editing.",
"summary": "Empty-state guidance preserves layout rhythm instead of collapsing the block surface."
},
{
"id": "pending",
"label": "Pending",
"status": "covered",
"trigger": "Deferred content or preview loading",
"visual_treatment": "Neutral reserved frame with status copy and no layout shift",
"token_roles": [
"control",
"textMuted",
"progressTrack",
"border"
],
"proof": "Static recipe payloads reserve the same documented frame while content is loading.",
"summary": "Pending state keeps dimensions stable while using muted control/status tokens."
},
{
"id": "active",
"label": "Active",
"status": "covered",
"trigger": "Current block and recipe preview are selected",
"visual_treatment": "Signal/uplink emphasis with visible selected-state chips",
"token_roles": [
"signal",
"uplink",
"button",
"badge"
],
"proof": "Recipe and block selection evidence is rendered in the documentation chrome.",
"summary": "Active state is represented with recipe accent tokens and visible state labels."
},
{
"id": "invalid",
"label": "Invalid",
"status": "covered",
"trigger": "Media URL or provider data is invalid",
"visual_treatment": "Warning/danger status treatment while preserving the block frame",
"token_roles": [
"warning",
"danger",
"border",
"text"
],
"proof": "Media guidance requires URL plus accessible fallback text for invalid or missing assets.",
"summary": "Invalid state guidance favors explicit status evidence over ambiguous visual collapse."
},
{
"id": "disabled",
"label": "Disabled",
"status": "covered",
"trigger": "Noninteractive metadata or held preview state",
"visual_treatment": "Muted affordance with preserved label, spacing, and hit-area rhythm",
"token_roles": [
"control",
"textMuted",
"border",
"panel"
],
"proof": "Noninteractive blocks retain evidence labels without pretending to be clickable.",
"summary": "Disabled state keeps the block readable and spatially stable when interaction is unavailable."
}
],
"state_readiness_states": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"state_readiness_statuses": [
"covered",
"covered",
"covered",
"covered",
"covered",
"covered"
],
"anatomy_region_count": 6,
"anatomy_map": [
{
"id": "surface",
"label": "Surface",
"region_role": "outer layout and background",
"field_paths": [],
"token_roles": [
"background",
"panel",
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "theme-preview-matrix uses recipe surface tokens to keep the outer frame styled and composable."
},
{
"id": "copy",
"label": "Copy",
"region_role": "headings, body copy, labels, and supporting text",
"field_paths": [
"block_collections[].description",
"block_collections[].label",
"description",
"design_configurations[].description",
"design_configurations[].label",
"media_placeholders[].label",
"title"
],
"token_roles": [
"text",
"textMuted"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Copy fields map to primary and muted text roles so editors can change words without restyling the block."
},
{
"id": "media",
"label": "Media",
"region_role": "replaceable image, iframe, embed, avatar, logo, or gallery area",
"field_paths": [
"default_media_placeholder",
"media_placeholders",
"media_placeholders[].alt",
"media_placeholders[].aspect_ratio",
"media_placeholders[].id",
"media_placeholders[].src"
],
"token_roles": [
"panelElevated",
"border"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Media fields stay isolated from copy and action regions so replacement assets preserve the recipe layout."
},
{
"id": "actions",
"label": "Actions",
"region_role": "CTA, link, event, and navigation affordances",
"field_paths": [
"media_placeholders[].source_url"
],
"token_roles": [
"button",
"buttonText",
"signal",
"uplink"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Action regions use recipe button and accent tokens while preserving href or event payloads."
},
{
"id": "collection",
"label": "Collection",
"region_role": "repeatable cards, steps, metrics, logos, links, or nested blocks",
"field_paths": [
"block_collections",
"block_collections[].block_types",
"block_collections[].id",
"block_types",
"default_block_collection"
],
"token_roles": [
"panel",
"panelElevated",
"border",
"badge"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": false,
"summary": "Collection regions define repeatable item boundaries for add, remove, reorder, and nested editing."
},
{
"id": "feedback",
"label": "Feedback",
"region_role": "status, validation, selected, loading, and disabled evidence",
"field_paths": [],
"token_roles": [
"badge",
"badgeText",
"signal"
],
"state_ids": [
"default",
"empty",
"pending",
"active",
"invalid",
"disabled"
],
"required": true,
"summary": "Feedback regions tie state-readiness evidence to visible recipe status treatments."
}
],
"anatomy_regions": [
"surface",
"copy",
"media",
"actions",
"collection",
"feedback"
],
"anatomy_token_roles": [
"background",
"badge",
"badgeText",
"border",
"button",
"buttonText",
"panel",
"panelElevated",
"signal",
"text",
"textMuted",
"uplink"
],
"action_count": 0,
"action_map": [],
"control_count": 0,
"control_map": [],
"style_token_count": 15,
"style_token_map": [
{
"role": "background",
"label": "Page background",
"value": "#f7fbff",
"token_type": "color",
"summary": "Page background uses the background recipe token."
},
{
"role": "panel",
"label": "Panel surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Panel surface uses the panel recipe token."
},
{
"role": "panelElevated",
"label": "Elevated surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Elevated surface uses the panelElevated recipe token."
},
{
"role": "text",
"label": "Primary text",
"value": "#142033",
"token_type": "color",
"summary": "Primary text uses the text recipe token."
},
{
"role": "textMuted",
"label": "Muted text",
"value": "#526174",
"token_type": "color",
"summary": "Muted text uses the textMuted recipe token."
},
{
"role": "signal",
"label": "Signal accent",
"value": "#166bff",
"token_type": "color",
"summary": "Signal accent uses the signal recipe token."
},
{
"role": "uplink",
"label": "Secondary accent",
"value": "#00a6a6",
"token_type": "color",
"summary": "Secondary accent uses the uplink recipe token."
},
{
"role": "border",
"label": "Border",
"value": "#d6dee8",
"token_type": "color",
"summary": "Border uses the border recipe token."
},
{
"role": "control",
"label": "Control surface",
"value": "#ffffff",
"token_type": "color",
"summary": "Control surface uses the control recipe token."
},
{
"role": "controlText",
"label": "Control text",
"value": "#142033",
"token_type": "color",
"summary": "Control text uses the controlText recipe token."
},
{
"role": "button",
"label": "Button surface",
"value": "#166bff",
"token_type": "color",
"summary": "Button surface uses the button recipe token."
},
{
"role": "buttonText",
"label": "Button text",
"value": "#ffffff",
"token_type": "color",
"summary": "Button text uses the buttonText recipe token."
},
{
"role": "badge",
"label": "Badge surface",
"value": "#eef5ff",
"token_type": "color",
"summary": "Badge surface uses the badge recipe token."
},
{
"role": "badgeText",
"label": "Badge text",
"value": "#174ea6",
"token_type": "color",
"summary": "Badge text uses the badgeText recipe token."
},
{
"role": "fontFamily",
"label": "Font family",
"value": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif",
"token_type": "font",
"summary": "Font family comes from the active recipe theme tokens."
}
],
"style_token_roles": [
"background",
"panel",
"panelElevated",
"text",
"textMuted",
"signal",
"uplink",
"border",
"control",
"controlText",
"button",
"buttonText",
"badge",
"badgeText",
"fontFamily"
],
"contrast_check_count": 6,
"contrast_pass_count": 6,
"contrast_checks": [
{
"id": "text-on-background",
"label": "Text on background",
"foreground_role": "text",
"background_role": "background",
"foreground": "#142033",
"background": "#f7fbff",
"ratio": 15.73,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on background is AAA at 15.73:1 against a 4.5:1 requirement."
},
{
"id": "text-on-panel",
"label": "Text on panel",
"foreground_role": "text",
"background_role": "panel",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Text on panel is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "muted-text-on-panel",
"label": "Muted text on panel",
"foreground_role": "textMuted",
"background_role": "panel",
"foreground": "#526174",
"background": "#ffffff",
"ratio": 6.32,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Muted text on panel is AA at 6.32:1 against a 4.5:1 requirement."
},
{
"id": "button-text-on-button",
"label": "Button text on button",
"foreground_role": "buttonText",
"background_role": "button",
"foreground": "#ffffff",
"background": "#166bff",
"ratio": 4.58,
"required_ratio": 4.5,
"passes": true,
"level": "AA",
"summary": "Button text on button is AA at 4.58:1 against a 4.5:1 requirement."
},
{
"id": "control-text-on-control",
"label": "Control text on control",
"foreground_role": "controlText",
"background_role": "control",
"foreground": "#142033",
"background": "#ffffff",
"ratio": 16.35,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Control text on control is AAA at 16.35:1 against a 4.5:1 requirement."
},
{
"id": "badge-text-on-badge",
"label": "Badge text on badge",
"foreground_role": "badgeText",
"background_role": "badge",
"foreground": "#174ea6",
"background": "#eef5ff",
"ratio": 7.15,
"required_ratio": 4.5,
"passes": true,
"level": "AAA",
"summary": "Badge text on badge is AAA at 7.15:1 against a 4.5:1 requirement."
}
],
"contrast_target": "AA",
"accessibility_standard": "WCAG_2_2_AA",
"accessibility_check_count": 5,
"accessibility_checks": [
{
"id": "semantic-structure",
"label": "Semantic structure",
"category": "semantics",
"status": "covered",
"required": true,
"proof": "runtime block sections, cards, lists, and headings",
"summary": "theme-preview-matrix keeps semantic wrappers and readable heading/copy structure in the runtime preview."
},
{
"id": "keyboard-and-tap-targets",
"label": "Keyboard and tap targets",
"category": "keyboard",
"status": "covered",
"required": false,
"proof": "static content has no hidden focus trap",
"summary": "The payload is static content, so the accessibility contract is to avoid hidden or misleading interactive affordances."
},
{
"id": "text-alternatives",
"label": "Text alternatives",
"category": "media",
"status": "covered",
"required": true,
"proof": "media fields include alt/label/title fallbacks",
"summary": "Media-ready recipes expose replaceable alt text or accessible labels for images, logos, embeds, and placeholders."
},
{
"id": "control-labels",
"label": "Control labels",
"category": "forms",
"status": "covered",
"required": false,
"proof": "no input controls in this payload",
"summary": "No input controls are present, so there are no unlabeled fields to remediate."
},
{
"id": "status-and-motion",
"label": "Status and motion",
"category": "state",
"status": "covered",
"required": true,
"proof": "runtime evidence avoids hidden status-only content",
"summary": "Recipe defaults avoid motion-only meaning and keep status text inspectable when state is present."
}
],
"responsive_behavior_count": 3,
"responsive_behavior_map": [
{
"id": "phone",
"label": "Phone",
"viewport_width": 390,
"layout_mode": "single-column stack",
"column_count": 1,
"spacing_density": "spacious",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "min-width:0 surfaces, wrapping copy, and no horizontal overflow in the static catalog phone smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-phone",
"summary": "Editorial Block System stacks theme-preview-matrix into one phone column with spacious spacing and bounded content."
},
{
"id": "tablet",
"label": "Tablet",
"viewport_width": 768,
"layout_mode": "two-column adaptive grid",
"column_count": 2,
"spacing_density": "spacious",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "tablet preview frames keep mid-width composition, wrap controls, and avoid horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-tablet",
"summary": "Editorial Block System adapts theme-preview-matrix to 2 tablet columns before expanding to the desktop layout."
},
{
"id": "desktop",
"label": "Desktop",
"viewport_width": 1366,
"layout_mode": "responsive composition grid",
"column_count": 3,
"spacing_density": "spacious",
"media_policy": "Media slots remain optional and collapse without leaving empty chrome.",
"overflow_policy": "desktop preview frames keep constrained widths, stable cards, and no horizontal overflow in the static catalog smoke.",
"interaction_policy": "Static content keeps readable line lengths and avoids hidden interactive affordances.",
"proof": "npm run test:static:block-catalog all-blocks-desktop",
"summary": "Editorial Block System gives theme-preview-matrix up to 3 desktop columns while preserving recipe spacing."
}
],
"responsive_viewports": [
"phone",
"tablet",
"desktop"
],
"responsive_proof": [
"npm run test:static:block-catalog all-blocks-phone",
"npm run test:static:block-catalog all-blocks-tablet",
"npm run test:static:block-catalog all-blocks-desktop"
],
"interactive_roles": [],
"recipe_alignment": {
"action_token": "button",
"control_token": "control",
"surface_token": "panel",
"text_token": "text",
"source": "theme recipe tokens"
}
},
"cloneable": true
},
"block_order": 4
}Dense, scannable interfaces for dashboards, configuration, and internal operations.
A compact matrix configuration for documenting this governed operator block.
Compact product and service-operations rhythm for B2B tools, resource hubs, and trial-interest flows.
A compact matrix configuration for documenting this governed operator block.
A calm product-marketing baseline with balanced hierarchy, spacing, and rounded controls.
A compact matrix configuration for documenting this governed operator block.
A tighter SaaS treatment with crisp hierarchy, restrained spacing, and clean control rhythm.
A compact matrix configuration for documenting this governed operator block.
A roomier product-marketing recipe for conversion pages, feature launches, and trial funnels.
A compact matrix configuration for documenting this governed operator block.
A precise B2B SaaS recipe with compact density, strong readability, and restrained depth.
A compact matrix configuration for documenting this governed operator block.
Measured hierarchy, conservative spacing, and high-readability surfaces for advisory and regulated service pages.
A compact matrix configuration for documenting this governed operator block.
Generous type, cinematic spacing, and understated surfaces for premium narrative pages.
A compact matrix configuration for documenting this governed operator block.
Large type, decisive rhythm, and high contrast for announcements and campaign pages.
A compact matrix configuration for documenting this governed operator block.
Viewport-scale block rhythm with large editorial type, crisp radii, and expressive motion for premium brand and contact pages.
A compact matrix configuration for documenting this governed operator block.
A template-ready full-page block system for duplicable landing, brand, contact, campaign, and lead-generation page sets.
A compact matrix configuration for documenting this governed operator block.
Flat, sharp, restrained hierarchy for documentation, proof pages, and quiet brands.
A compact matrix configuration for documenting this governed operator block.
Clear service-page rhythm for residential and local businesses with pricing, FAQs, resources, and appointment requests.
A compact matrix configuration for documenting this governed operator block.
Tactile raised panels and ledger-like rhythm for recurring services, quote funnels, memberships, and field-service notes.
A compact matrix configuration for documenting this governed operator block.
Soft raised panels with lower visual noise for guided tools and onboarding flows.
A compact matrix configuration for documenting this governed operator block.
Layered translucent panels for demos, product storytelling, and immersive showcases.
A compact matrix configuration for documenting this governed operator block.
Chunky rhythm and nostalgic scale for playful campaigns without sacrificing contrast.
A compact matrix configuration for documenting this governed operator block.
Sharp edges, hard shadows, and assertive scale for high-emphasis conversion surfaces.
A compact matrix configuration for documenting this governed operator block.
High-contrast cards, chunky controls, and expressive spacing for modern playful brands.
A compact matrix configuration for documenting this governed operator block.
implemented · 0.1.0
No public prop fields are exposed for this block contract.