From 0972bbe1f1a71fde0930240a106bf08f65ef7052 Mon Sep 17 00:00:00 2001 From: literat Date: Fri, 23 Feb 2024 15:20:02 +0100 Subject: [PATCH] Feat(web-twig): Deprecate icon for `danger` color in Alert component * the `warning` icon for the `danger` color is marked as deprecated * the `danger` icon for the `danger` color will be used as default in the next major version refs #DS-1156 --- .../web-twig/src/Resources/components/Alert/Alert.twig | 7 +++++++ packages/web-twig/src/Resources/components/Alert/README.md | 7 ++++++- 2 files changed, 13 insertions(+), 1 deletion(-) diff --git a/packages/web-twig/src/Resources/components/Alert/Alert.twig b/packages/web-twig/src/Resources/components/Alert/Alert.twig index 378459db01..7e88cc22b3 100644 --- a/packages/web-twig/src/Resources/components/Alert/Alert.twig +++ b/packages/web-twig/src/Resources/components/Alert/Alert.twig @@ -19,10 +19,17 @@ {% elseif _color == 'warning' %} {%- set _iconNameByColor = 'warning' -%} {% elseif _color == 'danger' %} + {# @TODO: set the value to the `danger` in https://jira.almacareer.tech/browse/DS-1177 #} {%- set _iconNameByColor = 'warning' -%} {% endif %} {%- set _iconNameValue = _iconName | default(_iconNameByColor) -%} +{# Deprecations #} +{% if _color == 'danger' %} + {% deprecated 'Alert: The "warning" icon for the "danger" color is deprecated. Make sure you have the "danger" icon in your assets. + The fallback to the "warning" icon will be removed in favor of the "danger" icon in the next major version.' %} +{% endif %} + <{{ _elementType }} {{ mainProps(props) }} {{ styleProp(_styleProps) }} {{ classProp(_classNames) }} role="alert">
diff --git a/packages/web-twig/src/Resources/components/Alert/README.md b/packages/web-twig/src/Resources/components/Alert/README.md index d02e4bde37..7fb66f32ab 100644 --- a/packages/web-twig/src/Resources/components/Alert/README.md +++ b/packages/web-twig/src/Resources/components/Alert/README.md @@ -31,12 +31,16 @@ Without lexer: | Color name | Icon name | | ------------- | ------------- | -| `danger` | `warning` | +| `danger` | `warning`\* | | `default` | `info` | | `informative` | `info` | | `success` | `check-plain` | | `warning` | `warning` | +(\*) The `warning` icon for the `danger` color has been marked as [deprecated]. +Please make sure you have the `danger` icon in your project assets. +The `warning` icon for the `danger` color will be removed in favor of the `danger` icon in the next major version. + ## API | Name | Type | Default | Required | Description | @@ -55,6 +59,7 @@ If you need more control over the styling of a component, you can use [style pro and [escape hatches][readme-escape-hatches]. [alert]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web/src/scss/components/Alert +[deprecated]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web-twig/README.md#deprecations [dictionary-color]: https://github.com/lmc-eu/spirit-design-system/tree/main/docs/DICTIONARIES.md#color [icon-package]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/icons [readme-additional-attributes]: https://github.com/lmc-eu/spirit-design-system/blob/main/packages/web-twig/README.md#additional-attributes