SDC Extras

SDC Extras adds declarative directives to your Single Directory Component (SDC) definitions that control how each prop is presented in the Drupal Canvas editing UI, with no JavaScript and no per-component form alters.

Canvas automatically builds an editing form from a component's prop schema. SDC Extras lets you refine that form directly in your *.component.yml file by adding custom x-* keys to individual props:

• x-no-ui hides a prop from the Canvas UI while keeping its stored value and default, so the value still renders in your template. Ideal for developer-controlled or derived props that authors shouldn't edit.
• x-visible-when shows a prop only when another prop has a given value, e.g. reveal "CTA label" and "CTA URL" only when a "Show call to action" toggle is on. Built on Drupal's Form API #states.

Because these keys live on the prop schema (which SDC validates against the full JSON Schema meta-schema, permitting custom x-* keywords), they require no patches and follow the same convention Canvas core already uses for keys like x-translation-context and x-formatting-context.

Example

props:
  type: object
  properties:
    internal_ref:
      type: string
      x-no-ui: true
    show_cta:
      type: boolean
      title: 'Show call to action'
    cta_label:
      type: string
      title: 'CTA label'
      x-visible-when: show_cta

Requirements: Drupal 11.2+ and the Canvas module.