Component | Quail Pages

Documentation

Persisted reusable Quail Pages component content. Components are conventionally stored beneath the site's components/ directory and are referenced from pages or other supported authored structures. They are not rendered as standalone pages. A component may contain either: - one complete page section for section-level reuse, or - an ordered list of page elements for element-level reuse. At render time, a section-level component must be a complete standard or region-based section with an id and exactly one of elements or regions. Element-level component content must remain an array, including when it contains only one element. Components are a single level of persisted reuse. Component content may not contain ComponentRef values, so components cannot compose, recursively reference themselves, or participate in indirect reference cycles.

Kind

Custom Content

Required fields

None

Authoring guidance

Use when

Use when the same section or element group should appear in multiple places, such as shared endcaps, disclosures, navigation blocks, or calls to action.

Avoid when

The content is unique to one page, should be independently addressable as a page, or belongs globally in the site header or footer.

Can be one of:

PageSection

Any authored item allowed directly in a page's sections array. Modal may be placed here or inside a normal Section because its authored position does not affect its runtime presentation.

List of Element

Element[]

Example

Required

{ "elements": [], "id": "shared-endcap", "title": "Keep Exploring" }

Full

{ "appearance": "default", "class": "example", "elements": [ { "type": "paragraph", "text": "Explore more resources." }, { "type": "cta", "link": { "href": "/resources/" }, "text": "View Resources", "ariaLabel": "View more resources" } ], "id": "shared-endcap", "subtitle": "example", "title": "Keep Exploring", "titleSrOnly": true, "type": "section", "width": "default" }

examples are generated from the schema.