[Bug]: Breaking change in minor release [v11.116.0] - Removal/blocking of interactive elements in `labelText` and label-like props
Package
@carbon/react
Browser
Chrome
Package version
v11.116.0
React version
v18
Description
A recent minor release (https://github.com/carbon-design-system/carbon/releases/tag/v11.116.0) introduced a breaking change by strictly disallowing and removing support for interactive elements (such as Toggletip, Tooltip, buttons, and links) passed into labelText, titleText, legendText, and related props.
While we understand this was intended as an accessibility/HTML validation fix (moving interactive content outside native <label> / <legend> elements), this change broke existing production implementations that were built according to prior Carbon examples.
Because this was shipped in a minor release without a deprecation cycle, fallback mechanism, or clear migration path, it violates Semantic Versioning (SemVer) and causes runtime warnings/errors and broken UI layouts.
Reproduction/example
https://stackblitz.com/edit/github-k9m8dvhl?file=src%2FApp.jsx
Steps to reproduce
- Render any form component (e.g.
TextInput,Dropdown,Checkbox) on the latest Carbon release. - Pass an interactive element (such as an
<a href="...">link or<Link>) insidelabelText:
<TextInput
id="terms-input"
labelText={
<span>
I agree to the <a href="https://example.com/terms">Terms & Conditions</a>
</span>
}
/>Suggested Severity
Critical (Severity 1) = Must be fixed ASAP. The response must be swift. Someone from the team must drop all current work and be immediately reassigned to address the issue.
Project name
Zen
Code of Conduct
- I agree to follow this project's Code of Conduct
- I checked the current issues for duplicate problems
Source: carbon-design-system/carbon