canvas-component-utils

Project type

Before applying this skill, check package.json for a dependency named @drupal-canvas/headless or starting with @drupal-canvas/headless-. If one is present, this is a Canvas Headless codebase — read canvas-headless first. Portable React components can use FormattedText and Image at their existing public import paths; FormattedText requires trusted or sanitized HTML. Native Vue, Astro and Angular components use framework-native alternatives instead of React utilities. If no such dependency is present, this is a Canvas-rendered React codebase: components are React (index.jsx/.tsx) and everything in this skill applies as written. These are the only two project types.

Import utilities from the drupal-canvas package:

import { FormattedText, Image } from 'drupal-canvas';