Insights / Structured content

Canvas ExtJS: connect the React catalogue

Drupal node · Without Canvas

Properties, examples and slots registered in Canvas for composition with frontend components.

The catalogue as a meeting point

catalog.ts defines an explicit TypeScript schema published as component-index.json. Canvas ExtJS imports definitions, properties and slots as a Canvas component source.

One visual implementation

A custom React preview provider loads the bundle and styles in Canvas. Hero, Section, Card and CTA share code with Next.js, without duplicate editorial Twig templates.

Compose, publish, present

Canvas stores structure. CE API delivers it. The renderer registry resolves components by name and traverses slots. ExtJS is not required for classic node CE displays.

Limits worth knowing

We do not automatically extract every React prop. Breaking changes require migration. Component previews tested here are not equivalent to authenticated full-page Next.js previews.

Explore the explanation and real example

Back to insights ↗