Components collection
Reusable content components and the Component block.
On this page
The Components collection stores reusable content bands. Reference a document with a Component block to render the same content on several pages.
Turning it on or offLink to this section
Components are enabled by default. Set components: false to remove the collection and its insertion option from page editors. Turning it off does not convert existing references into independent page content.
Fields and stored contentLink to this section
Each document has a required title and a content Lexical state. Its content uses rootLexicalEditor({ withComponent: false }), so it can contain page-level layout blocks but cannot reference another Component through the built-in picker. The title identifies the document in Admin; the converter renders the content without adding that title to the page.
The collection supports ordering, trash, drafts, scheduled publishing and 15 retained versions per document. Autosave waits 800 ms after a change.
The Component blockLink to this section
The Component block stores a relationship to the reusable document. The default page content offers it through rootLexicalEditor({ withComponent: true }). Other root editors must enable that option explicitly.
Selecting Customize content enables isOverwritten and the page-local overwriteContent editor. The frontend uses that state instead of the shared content. This is useful for a one-off variation, but later edits to the shared document no longer supply that instance's rendered content. The original relationship remains stored.
Access and previewLink to this section
Public reads expose published components. Authenticated operations require the corresponding components.read, components.create, components.update or components.delete capability. Preview uses the document ID, rather than a page slug. See Live preview for server and client behavior.
RenderingLink to this section
Resolve the component relationship to a document before conversion. componentConverter reads its content.root.children, or overwriteContent.root.children when enabled, and calls nodesToJSX. An unresolved ID has no content to render. Nested blocks therefore use the same converters as page content.
RevalidationLink to this section
The collection installs change and delete hooks intended to revalidate referencing pages. See Revalidation for cache configuration and manual invalidation. Verify shared-component updates on your project's cached routes as part of integration testing.