feat(ui5-avatar-badge): add colorScheme property for extended color palette - #14009
Open
plamenivanov91 wants to merge 5 commits into
Open
feat(ui5-avatar-badge): add colorScheme property for extended color palette#14009plamenivanov91 wants to merge 5 commits into
plamenivanov91 wants to merge 5 commits into
Conversation
…alette Adds a new `colorScheme` property accepting `Accent1` through `Accent10`, matching the color scheme values available on `ui5-avatar`. The semantic `state` property takes precedence over `colorScheme` when set to any value other than `None`. CSS custom properties inherited from the parent Avatar are reused so the badge background and icon color stay in sync with the avatar across all themes without duplicating theme token mappings. Fixes: #13925
plamenivanov91
temporarily deployed
to
netlify-preview
August 31, 2026 15:52 — with 
GitHub Actions
Inactive
GitHub Actions
Inactive
|
🚀 Deployed on https://pr-14009--ui5-webcomponents-preview.netlify.app |
plamenivanov91
temporarily deployed
to
netlify-preview
September 1, 2026 08:07 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
plamenivanov91
temporarily deployed
to
netlify-preview
September 1, 2026 08:17 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
Replace the AccentN color scheme values with numeric "1"-"10" values backed by sapIndicationColor_N_* tokens, matching the ui5-tag pattern. Each color scheme gets its own per-rule declaration (no catch-all), adds a box-shadow via sapContent_Shadow1, and uses dedicated border color tokens instead of reusing the text color token. Update test page, website sample (HTML + React), docs description, and Cypress visual tests to reflect the new values.
plamenivanov91
temporarily deployed
to
netlify-preview
September 1, 2026 11:40 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
plamenivanov91
temporarily deployed
to
netlify-preview
September 1, 2026 13:14 — with
GitHub Actions
Inactive
GitHub Actions
Inactive
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds a new
colorSchemeproperty accepting values"1"through"10",backed by the SAP indication color tokens (
sapIndicationColor_N_*).This follows the same pattern used by
ui5-tagand avoids introducinga new enum, keeping the API intentionally loose to match established
conventions.
Each value maps directly to its own CSS rule setting background,
border-color, and text color from the indication palette, plus a
box-shadow via
sapContent_Shadow1for visual depth. The semanticstateproperty takes precedence overcolorSchemewhen set to anyvalue other than
None.Fixes: #13925
JIRA: BGSOFUIPIRIN-7121