Contrib.social

Add noUI support for SDC props to hide attributes and utility-class fields from UI while preserving default values

Open on Drupal.org →
Created on 25 November 2025, about 1 month ago

Problem/Motivation

✨ Allow SDCs to be marked to be excluded from UI Active
In Drupal core SDC, the noUI flag works only at the component level.
There is no way to hide individual props, especially when those props represent:

  • attributes
  • classes
  • utility class overrides
  • internal structural props

Props meant to be filled automatically by defaults or by parent components

Today, these props still appear in the Component Canvas UI (and other UIs such as Layout Builder, Paragraphs UI, and third-party SDC editors).
This results in:

  • confusing UI for site builders
  • unnecessary (and sometimes dangerous) configuration options
  • exposing internal or structural props that should not be changed
  • inconsistent UX across SDC components

UI clutter when every component declares attributes or utility classes

Many SDC implementations, especially Bootstrap utilities, design systems, and UI Suite require attributes and class props to be internal-only while still being set automatically through defaults.

Steps to reproduce

  • Create a component defining props like attributes, classes, or utility_classes props.
  • Open the component in Component Canvas or any SDC-based UI.
  • All props appear as editable even ones that should be internal-only.
  • There is no mechanism to hide these props while still allowing default values to auto-fill.

Proposed resolution

Add prop-level noUI support so builders can explicitly hide internal structural props (attributes, classes, utility classes) while still using default values.

Example:

props:
  attributes:
    type: attributes
    noUI: true
    default: {}

  utility_classes:
    type: string[]
    noUI: true
    default:
      - "mt-3"
      - "mb-4"

Expected behavior:

  • The hidden props do not appear in Canvas or any component configuration UI.
  • Their default values are still auto-applied to the component.
  • The props remain fully functional in rendering, inheritance, and context passing.
  • Third-party systems relying on SDC (UI Suite, SDC themes, Layout Builder, etc.) automatically benefit from cleaner UIs.

By having this any SDC Based theme can work as Canvas Based Theme in no time

Use Cases

  • Utility-class props for Bootstrap, Tailwind, or custom design systems.
  • Semantic attribute props (aria-*, role, data-*).
  • Internal structural props such as wrappers, containers, suffix/prefix classes.
  • Preventing accidental modification of layout/structure.
  • Reducing Canvas clutter for design systems with many components.

Remaining tasks

User interface changes

Introduced terminology

Using readOnly (does not hide UI).

API changes

  • Add optional noUI boolean to SDC prop definitions.
  • Update SDC JSON Schema.
  • Update UI-rendering logic (Canvas, FormBuilder integration in core).
  • Ensure contrib SDC extensions inherit the correct behavior.

Data model changes

Release notes snippet

✨ Feature request
Status

Active

Version

11.3 🔥

Component

single-directory components

Created by

🇯🇴Jordan Rajab Natshah Jordan

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024