@mozaic-ds/vue 0.19.1-beta.0 → 0.19.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mozaic-ds/vue",
-  "version": "0.19.1-beta.0",
+  "version": "0.19.1",
   "description": "Vue.js implementation of Mozaic Design System",
   "author": "Adeo - Mozaic Design System",
   "scripts": {
@@ -23,10 +23,10 @@
     "postinstall.js"
   ],
   "dependencies": {
-    "@mozaic-ds/css-dev-tools": "^1.29.1",
-    "@mozaic-ds/icons": "^1.30.0",
-    "@mozaic-ds/styles": "^1.30.0",
-    "@mozaic-ds/web-fonts": "^1.22.0",
+    "@mozaic-ds/css-dev-tools": "1.29.1",
+    "@mozaic-ds/icons": "1.34.0",
+    "@mozaic-ds/styles": "1.33.0",
+    "@mozaic-ds/web-fonts": "1.22.0",
     "core-js": "^3.18.3",
     "libphonenumber-js": "1.9.50",
     "postcss-scss": "^4.0.1",

package/src/components/datatable/MDataTable.vue

@@ -49,7 +49,11 @@
                 allowRowClick && onRowClick({ event: $event, item: item })
               "
             >
-              <slot :name="`item.${header.dataFieldExpr}`" :item="item" :index="rowIndex">
+              <slot
+                :name="`item.${header.dataFieldExpr}`"
+                :item="item"
+                :index="rowIndex"
+              >
                 {{ getItemValue(item, header.dataFieldExpr) }}
               </slot>
             </td>
@@ -62,7 +66,10 @@
         </tbody>
       </table>
     </div>
-    <div v-if="pagingOptions.enabled && total != null" class="mc-data-table__footer">
+    <div
+      v-if="pagingOptions.enabled && total != null"
+      class="mc-data-table__footer"
+    >
       <div class="mc-data-table__footer__item-per-page">
         <m-select
           :id="'itemPerPage'"
@@ -704,8 +711,6 @@ $local-config: (
     @include set-border-radius('m', 'bottom');
 
     &__item-per-page {
-      min-width: 100px;
-
       & select {
         width: auto;
         font-size: 0.875rem;

package/src/components/icon/MIcon.vue

@@ -37,8 +37,7 @@ export default {
       return () =>
         import(
           /* webpackMode: 'eager' */
-          // '@mozaic-ds/icons/js/icons.js'
-          './icons.js' // <= example file
+          '@mozaic-ds/icons/js/icons.js'
         );
     },
 

package/src/tokens/adeo/android/colors.xml

@@ -73,24 +73,24 @@
   <color name="color_secondary_purple_700">#ff393879</color>
   <color name="color_secondary_purple_800">#ff282863</color>
   <color name="color_secondary_purple_900">#ff1a1a4b</color>
-  <color name="color_secondary_red_100">#fffeedee</color>
-  <color name="color_secondary_red_200">#fffab9bc</color>
-  <color name="color_secondary_red_300">#fff38789</color>
-  <color name="color_secondary_red_400">#ffea5d58</color>
-  <color name="color_secondary_red_500">#ffdf382b</color>
-  <color name="color_secondary_red_600">#ffb42a27</color>
-  <color name="color_secondary_red_700">#ff8b2226</color>
-  <color name="color_secondary_red_800">#ff641b21</color>
-  <color name="color_secondary_red_900">#ff3e1219</color>
-  <color name="color_secondary_orange_100">#fffff5eb</color>
-  <color name="color_secondary_orange_200">#ffffdab2</color>
-  <color name="color_secondary_orange_300">#ffffc17d</color>
-  <color name="color_secondary_orange_400">#ffffab4b</color>
-  <color name="color_secondary_orange_500">#fffc961e</color>
-  <color name="color_secondary_orange_600">#ffc86f21</color>
-  <color name="color_secondary_orange_700">#ff974f20</color>
-  <color name="color_secondary_orange_800">#ff6a351c</color>
-  <color name="color_secondary_orange_900">#ff401f15</color>
+  <color name="color_secondary_red_100">#fffdeaea</color>
+  <color name="color_secondary_red_200">#fff8bcbb</color>
+  <color name="color_secondary_red_300">#fff38d8c</color>
+  <color name="color_secondary_red_400">#ffef5f5c</color>
+  <color name="color_secondary_red_500">#ffea302d</color>
+  <color name="color_secondary_red_600">#ffc61112</color>
+  <color name="color_secondary_red_700">#ff8c0003</color>
+  <color name="color_secondary_red_800">#ff530000</color>
+  <color name="color_secondary_red_900">#ff2d0000</color>
+  <color name="color_secondary_orange_100">#fffdf1e8</color>
+  <color name="color_secondary_orange_200">#fff8d2b3</color>
+  <color name="color_secondary_orange_300">#fff4b27e</color>
+  <color name="color_secondary_orange_400">#ffef934a</color>
+  <color name="color_secondary_orange_500">#ffea7315</color>
+  <color name="color_secondary_orange_600">#ffc65200</color>
+  <color name="color_secondary_orange_700">#ff8c3500</color>
+  <color name="color_secondary_orange_800">#ff531b00</color>
+  <color name="color_secondary_orange_900">#ff360e00</color>
   <color name="color_secondary_yellow_100">#fffff8e2</color>
   <color name="color_secondary_yellow_200">#ffffebaf</color>
   <color name="color_secondary_yellow_300">#fffee07d</color>
@@ -160,7 +160,7 @@
   <color name="color_button_solid_neutral_active_background">#ff3a3936</color>
   <color name="color_button_solid_neutral_hover_background">#ff1e1e1c</color>
   <color name="color_button_solid_neutral_hover_font">#ffffffff</color>
-  <color name="color_button_solid_danger_background">#ffb42a27</color>
+  <color name="color_button_solid_danger_background">#ffc61112</color>
   <color name="color_button_solid_danger_font">#ffffffff</color>
   <color name="color_button_solid_danger_focus_border">#ff8c0003</color>
   <color name="color_button_solid_danger_disabled_background">#ffdddcd5</color>
@@ -193,13 +193,13 @@
   <color name="color_button_bordered_neutral_active_background">#ffdddcd5</color>
   <color name="color_button_bordered_neutral_hover_background">#ffeeedea</color>
   <color name="color_button_bordered_danger_background">#ffffffff</color>
-  <color name="color_button_bordered_danger_border">#ffb42a27</color>
-  <color name="color_button_bordered_danger_font">#ffb42a27</color>
-  <color name="color_button_bordered_danger_focus_border">#ff8b2226</color>
+  <color name="color_button_bordered_danger_border">#ffc61112</color>
+  <color name="color_button_bordered_danger_font">#ffc61112</color>
+  <color name="color_button_bordered_danger_focus_border">#ff8c0003</color>
   <color name="color_button_bordered_danger_disabled_background">#ffdddcd5</color>
   <color name="color_button_bordered_danger_disabled_font">#ff71706b</color>
-  <color name="color_button_bordered_danger_active_background">#fffab9bc</color>
-  <color name="color_button_bordered_danger_hover_background">#fffeedee</color>
+  <color name="color_button_bordered_danger_active_background">#fff8bcbb</color>
+  <color name="color_button_bordered_danger_hover_background">#fffdeaea</color>
   <color name="color_divider_lightest">#ffffffff</color>
   <color name="color_divider_light">#ffc2c1ba</color>
   <color name="color_divider_default">#ff71706b</color>
@@ -225,8 +225,8 @@
   <color name="color_flag_solid_light_background">#ffffffff</color>
   <color name="color_flag_solid_light_border">#ffffffff</color>
   <color name="color_flag_solid_light_text">#ff000000</color>
-  <color name="color_flag_solid_danger_background">#ffb42a27</color>
-  <color name="color_flag_solid_danger_border">#ffb42a27</color>
+  <color name="color_flag_solid_danger_background">#ffc61112</color>
+  <color name="color_flag_solid_danger_border">#ffc61112</color>
   <color name="color_flag_solid_danger_text">#ffffffff</color>
   <color name="color_flag_bordered_background">#ffffffff</color>
   <color name="color_flag_bordered_border">#ff007f8c</color>
@@ -241,11 +241,11 @@
   <color name="color_flag_bordered_light_border">#ffffffff</color>
   <color name="color_flag_bordered_light_text">#ffffffff</color>
   <color name="color_flag_bordered_danger_background">#ffffffff</color>
-  <color name="color_flag_bordered_danger_border">#ffb42a27</color>
-  <color name="color_flag_bordered_danger_text">#ffb42a27</color>
+  <color name="color_flag_bordered_danger_border">#ffc61112</color>
+  <color name="color_flag_bordered_danger_text">#ffc61112</color>
   <color name="color_focus_gap">#ffffffff</color>
   <color name="color_focus_border">#ff758992</color>
-  <color name="color_font_primary_01">#ff00919f</color>
+  <color name="color_font_primary_01">#ff007f8c</color>
   <color name="color_font_primary_02">#ff007574</color>
   <color name="color_font_darkest">#ff000000</color>
   <color name="color_font_darker">#ff1e1e1c</color>
@@ -287,26 +287,30 @@
   <color name="color_link_primary_visited">#ff006974</color>
   <color name="color_link_primary_active">#ff006974</color>
   <color name="color_link_primary_disabled">#ffeeedea</color>
-  <color name="color_link_primary_hover">#ff002e33</color>
+  <color name="color_link_primary_hover">#ff004e57</color>
   <color name="color_link_primary_02_base">#ff035f64</color>
   <color name="color_link_primary_02_visited">#ff044c53</color>
   <color name="color_link_primary_02_active">#ff044c53</color>
   <color name="color_link_primary_02_disabled">#ffeeedea</color>
   <color name="color_link_primary_02_hover">#ff062b35</color>
-  <color name="color_link_danger_base">#ffb42a27</color>
-  <color name="color_link_danger_visited">#ff8b2226</color>
-  <color name="color_link_danger_active">#ff8b2226</color>
+  <color name="color_link_danger_base">#ffc61112</color>
+  <color name="color_link_danger_visited">#ff8c0003</color>
+  <color name="color_link_danger_active">#ff8c0003</color>
   <color name="color_link_danger_disabled">#ffeeedea</color>
-  <color name="color_link_danger_hover">#ff3e1219</color>
+  <color name="color_link_danger_hover">#ff530000</color>
   <color name="color_notification_font">#ff000000</color>
   <color name="color_notification_information_background">#ffdaeff7</color>
   <color name="color_notification_information_border">#ff0b96cc</color>
+  <color name="color_notification_information_icon">#ff007bb4</color>
   <color name="color_notification_success_background">#ffebf5de</color>
   <color name="color_notification_success_border">#ff46a610</color>
+  <color name="color_notification_success_icon">#ff188803</color>
   <color name="color_notification_warning_background">#fffdf1e8</color>
   <color name="color_notification_warning_border">#ffea7315</color>
+  <color name="color_notification_warning_icon">#ffc65200</color>
   <color name="color_notification_danger_background">#fffdeaea</color>
   <color name="color_notification_danger_border">#ffea302d</color>
+  <color name="color_notification_danger_icon">#ffc61112</color>
   <color name="color_progress_background">#ffdddcd5</color>
   <color name="color_progress_indicator">#ff007bb4</color>
   <color name="color_progress_percentage_default">#ff1e1e1c</color>
@@ -314,14 +318,14 @@
   <color name="color_progress_branded_indicator">#ff00919f</color>
   <color name="color_star_empty">#ffdddcd5</color>
   <color name="color_star_focus">#ff758992</color>
-  <color name="color_star_full">#fffc961e</color>
-  <color name="color_star_hover">#ffffc17d</color>
+  <color name="color_star_full">#ffea7315</color>
+  <color name="color_star_hover">#fff4b27e</color>
   <color name="color_tabs_background">#ffffffff</color>
   <color name="color_tabs_shadow">#ff000000</color>
   <color name="color_tabs_default">#ff1e1e1c</color>
-  <color name="color_tabs_hover">#ff007f8c</color>
+  <color name="color_tabs_hover">#ff004e57</color>
   <color name="color_tabs_disabled">#ff71706b</color>
-  <color name="color_tabs_active">#ff00919f</color>
+  <color name="color_tabs_active">#ff007f8c</color>
   <color name="color_tabs_active_disabled">#ff91d5db</color>
   <color name="color_tag_text_light_background">#ffffffff</color>
   <color name="color_tag_text_light_border">#ff8c8b85</color>

package/src/tokens/adeo/css/_variables.scss

@@ -69,24 +69,24 @@ $color-secondary-purple-600: var(--color-secondary-purple-600, #4b4a8c);
 $color-secondary-purple-700: var(--color-secondary-purple-700, #393879);
 $color-secondary-purple-800: var(--color-secondary-purple-800, #282863);
 $color-secondary-purple-900: var(--color-secondary-purple-900, #1a1a4b);
-$color-secondary-red-100: var(--color-secondary-red-100, #feedee);
-$color-secondary-red-200: var(--color-secondary-red-200, #fab9bc);
-$color-secondary-red-300: var(--color-secondary-red-300, #f38789);
-$color-secondary-red-400: var(--color-secondary-red-400, #ea5d58);
-$color-secondary-red-500: var(--color-secondary-red-500, #df382b);
-$color-secondary-red-600: var(--color-secondary-red-600, #b42a27);
-$color-secondary-red-700: var(--color-secondary-red-700, #8b2226);
-$color-secondary-red-800: var(--color-secondary-red-800, #641b21);
-$color-secondary-red-900: var(--color-secondary-red-900, #3e1219);
-$color-secondary-orange-100: var(--color-secondary-orange-100, #fff5eb);
-$color-secondary-orange-200: var(--color-secondary-orange-200, #ffdab2);
-$color-secondary-orange-300: var(--color-secondary-orange-300, #ffc17d);
-$color-secondary-orange-400: var(--color-secondary-orange-400, #ffab4b);
-$color-secondary-orange-500: var(--color-secondary-orange-500, #fc961e);
-$color-secondary-orange-600: var(--color-secondary-orange-600, #c86f21);
-$color-secondary-orange-700: var(--color-secondary-orange-700, #974f20);
-$color-secondary-orange-800: var(--color-secondary-orange-800, #6a351c);
-$color-secondary-orange-900: var(--color-secondary-orange-900, #401f15);
+$color-secondary-red-100: var(--color-secondary-red-100, #fdeaea);
+$color-secondary-red-200: var(--color-secondary-red-200, #f8bcbb);
+$color-secondary-red-300: var(--color-secondary-red-300, #f38d8c);
+$color-secondary-red-400: var(--color-secondary-red-400, #ef5f5c);
+$color-secondary-red-500: var(--color-secondary-red-500, #ea302d);
+$color-secondary-red-600: var(--color-secondary-red-600, #c61112);
+$color-secondary-red-700: var(--color-secondary-red-700, #8c0003);
+$color-secondary-red-800: var(--color-secondary-red-800, #530000);
+$color-secondary-red-900: var(--color-secondary-red-900, #2d0000);
+$color-secondary-orange-100: var(--color-secondary-orange-100, #fdf1e8);
+$color-secondary-orange-200: var(--color-secondary-orange-200, #f8d2b3);
+$color-secondary-orange-300: var(--color-secondary-orange-300, #f4b27e);
+$color-secondary-orange-400: var(--color-secondary-orange-400, #ef934a);
+$color-secondary-orange-500: var(--color-secondary-orange-500, #ea7315);
+$color-secondary-orange-600: var(--color-secondary-orange-600, #c65200);
+$color-secondary-orange-700: var(--color-secondary-orange-700, #8c3500);
+$color-secondary-orange-800: var(--color-secondary-orange-800, #531b00);
+$color-secondary-orange-900: var(--color-secondary-orange-900, #360e00);
 $color-secondary-yellow-100: var(--color-secondary-yellow-100, #fff8e2);
 $color-secondary-yellow-200: var(--color-secondary-yellow-200, #ffebaf);
 $color-secondary-yellow-300: var(--color-secondary-yellow-300, #fee07d);
@@ -156,7 +156,7 @@ $color-button-solid-neutral-disabled-font: var(--color-button-solid-neutral-disa
 $color-button-solid-neutral-active-background: var(--color-button-solid-neutral-active-background, #3a3936);
 $color-button-solid-neutral-hover-background: var(--color-button-solid-neutral-hover-background, #1e1e1c);
 $color-button-solid-neutral-hover-font: var(--color-button-solid-neutral-hover-font, #ffffff);
-$color-button-solid-danger-background: var(--color-button-solid-danger-background, #b42a27);
+$color-button-solid-danger-background: var(--color-button-solid-danger-background, #c61112);
 $color-button-solid-danger-font: var(--color-button-solid-danger-font, #ffffff);
 $color-button-solid-danger-focus-border: var(--color-button-solid-danger-focus-border, #8c0003);
 $color-button-solid-danger-disabled-background: var(--color-button-solid-danger-disabled-background, #dddcd5);
@@ -189,13 +189,13 @@ $color-button-bordered-neutral-disabled-font: var(--color-button-bordered-neutra
 $color-button-bordered-neutral-active-background: var(--color-button-bordered-neutral-active-background, #dddcd5);
 $color-button-bordered-neutral-hover-background: var(--color-button-bordered-neutral-hover-background, #eeedea);
 $color-button-bordered-danger-background: var(--color-button-bordered-danger-background, #ffffff);
-$color-button-bordered-danger-border: var(--color-button-bordered-danger-border, #b42a27);
-$color-button-bordered-danger-font: var(--color-button-bordered-danger-font, #b42a27);
-$color-button-bordered-danger-focus-border: var(--color-button-bordered-danger-focus-border, #8b2226);
+$color-button-bordered-danger-border: var(--color-button-bordered-danger-border, #c61112);
+$color-button-bordered-danger-font: var(--color-button-bordered-danger-font, #c61112);
+$color-button-bordered-danger-focus-border: var(--color-button-bordered-danger-focus-border, #8c0003);
 $color-button-bordered-danger-disabled-background: var(--color-button-bordered-danger-disabled-background, #dddcd5);
 $color-button-bordered-danger-disabled-font: var(--color-button-bordered-danger-disabled-font, #71706b);
-$color-button-bordered-danger-active-background: var(--color-button-bordered-danger-active-background, #fab9bc);
-$color-button-bordered-danger-hover-background: var(--color-button-bordered-danger-hover-background, #feedee);
+$color-button-bordered-danger-active-background: var(--color-button-bordered-danger-active-background, #f8bcbb);
+$color-button-bordered-danger-hover-background: var(--color-button-bordered-danger-hover-background, #fdeaea);
 $color-divider-lightest: var(--color-divider-lightest, #ffffff);
 $color-divider-light: var(--color-divider-light, #c2c1ba);
 $color-divider-default: var(--color-divider-default, #71706b);
@@ -221,8 +221,8 @@ $color-flag-solid-dark-text: var(--color-flag-solid-dark-text, #ffffff);
 $color-flag-solid-light-background: var(--color-flag-solid-light-background, #ffffff);
 $color-flag-solid-light-border: var(--color-flag-solid-light-border, #ffffff);
 $color-flag-solid-light-text: var(--color-flag-solid-light-text, #000000);
-$color-flag-solid-danger-background: var(--color-flag-solid-danger-background, #b42a27);
-$color-flag-solid-danger-border: var(--color-flag-solid-danger-border, #b42a27);
+$color-flag-solid-danger-background: var(--color-flag-solid-danger-background, #c61112);
+$color-flag-solid-danger-border: var(--color-flag-solid-danger-border, #c61112);
 $color-flag-solid-danger-text: var(--color-flag-solid-danger-text, #ffffff);
 $color-flag-bordered-background: var(--color-flag-bordered-background, #ffffff);
 $color-flag-bordered-border: var(--color-flag-bordered-border, #007f8c);
@@ -237,11 +237,11 @@ $color-flag-bordered-light-background: var(--color-flag-bordered-light-backgroun
 $color-flag-bordered-light-border: var(--color-flag-bordered-light-border, #ffffff);
 $color-flag-bordered-light-text: var(--color-flag-bordered-light-text, #ffffff);
 $color-flag-bordered-danger-background: var(--color-flag-bordered-danger-background, #ffffff);
-$color-flag-bordered-danger-border: var(--color-flag-bordered-danger-border, #b42a27);
-$color-flag-bordered-danger-text: var(--color-flag-bordered-danger-text, #b42a27);
+$color-flag-bordered-danger-border: var(--color-flag-bordered-danger-border, #c61112);
+$color-flag-bordered-danger-text: var(--color-flag-bordered-danger-text, #c61112);
 $color-focus-gap: var(--color-focus-gap, #ffffff);
 $color-focus-border: var(--color-focus-border, #758992);
-$color-font-primary-01: var(--color-font-primary-01, #00919f);
+$color-font-primary-01: var(--color-font-primary-01, #007f8c);
 $color-font-primary-02: var(--color-font-primary-02, #007574);
 $color-font-darkest: var(--color-font-darkest, #000000);
 $color-font-darker: var(--color-font-darker, #1e1e1c);
@@ -283,26 +283,30 @@ $color-link-primary-base: var(--color-link-primary-base, #007f8c);
 $color-link-primary-visited: var(--color-link-primary-visited, #006974);
 $color-link-primary-active: var(--color-link-primary-active, #006974);
 $color-link-primary-disabled: var(--color-link-primary-disabled, #eeedea);
-$color-link-primary-hover: var(--color-link-primary-hover, #002e33);
+$color-link-primary-hover: var(--color-link-primary-hover, #004e57);
 $color-link-primary-02-base: var(--color-link-primary-02-base, #035f64);
 $color-link-primary-02-visited: var(--color-link-primary-02-visited, #044c53);
 $color-link-primary-02-active: var(--color-link-primary-02-active, #044c53);
 $color-link-primary-02-disabled: var(--color-link-primary-02-disabled, #eeedea);
 $color-link-primary-02-hover: var(--color-link-primary-02-hover, #062b35);
-$color-link-danger-base: var(--color-link-danger-base, #b42a27);
-$color-link-danger-visited: var(--color-link-danger-visited, #8b2226);
-$color-link-danger-active: var(--color-link-danger-active, #8b2226);
+$color-link-danger-base: var(--color-link-danger-base, #c61112);
+$color-link-danger-visited: var(--color-link-danger-visited, #8c0003);
+$color-link-danger-active: var(--color-link-danger-active, #8c0003);
 $color-link-danger-disabled: var(--color-link-danger-disabled, #eeedea);
-$color-link-danger-hover: var(--color-link-danger-hover, #3e1219);
+$color-link-danger-hover: var(--color-link-danger-hover, #530000);
 $color-notification-font: var(--color-notification-font, #000000);
 $color-notification-information-background: var(--color-notification-information-background, #daeff7);
 $color-notification-information-border: var(--color-notification-information-border, #0b96cc);
+$color-notification-information-icon: var(--color-notification-information-icon, #007bb4);
 $color-notification-success-background: var(--color-notification-success-background, #ebf5de);
 $color-notification-success-border: var(--color-notification-success-border, #46a610);
+$color-notification-success-icon: var(--color-notification-success-icon, #188803);
 $color-notification-warning-background: var(--color-notification-warning-background, #fdf1e8);
 $color-notification-warning-border: var(--color-notification-warning-border, #ea7315);
+$color-notification-warning-icon: var(--color-notification-warning-icon, #c65200);
 $color-notification-danger-background: var(--color-notification-danger-background, #fdeaea);
 $color-notification-danger-border: var(--color-notification-danger-border, #ea302d);
+$color-notification-danger-icon: var(--color-notification-danger-icon, #c61112);
 $color-progress-background: var(--color-progress-background, #dddcd5);
 $color-progress-indicator: var(--color-progress-indicator, #007bb4);
 $color-progress-percentage-default: var(--color-progress-percentage-default, #1e1e1c);
@@ -310,14 +314,14 @@ $color-progress-percentage-half: var(--color-progress-percentage-half, #ffffff);
 $color-progress-branded-indicator: var(--color-progress-branded-indicator, #00919f);
 $color-star-empty: var(--color-star-empty, #dddcd5);
 $color-star-focus: var(--color-star-focus, #758992);
-$color-star-full: var(--color-star-full, #fc961e);
-$color-star-hover: var(--color-star-hover, #ffc17d);
+$color-star-full: var(--color-star-full, #ea7315);
+$color-star-hover: var(--color-star-hover, #f4b27e);
 $color-tabs-background: var(--color-tabs-background, #ffffff);
 $color-tabs-shadow: var(--color-tabs-shadow, #000000);
 $color-tabs-default: var(--color-tabs-default, #1e1e1c);
-$color-tabs-hover: var(--color-tabs-hover, #007f8c);
+$color-tabs-hover: var(--color-tabs-hover, #004e57);
 $color-tabs-disabled: var(--color-tabs-disabled, #71706b);
-$color-tabs-active: var(--color-tabs-active, #00919f);
+$color-tabs-active: var(--color-tabs-active, #007f8c);
 $color-tabs-active-disabled: var(--color-tabs-active-disabled, #91d5db);
 $color-tag-text-light-background: var(--color-tag-text-light-background, #ffffff);
 $color-tag-text-light-border: var(--color-tag-text-light-border, #8c8b85);

package/src/tokens/adeo/css/root.scss

@@ -44,24 +44,24 @@
   --color-secondary-yellow-300: #fee07d;
   --color-secondary-yellow-200: #ffebaf;
   --color-secondary-yellow-100: #fff8e2;
-  --color-secondary-orange-900: #401f15;
-  --color-secondary-orange-800: #6a351c;
-  --color-secondary-orange-700: #974f20;
-  --color-secondary-orange-600: #c86f21;
-  --color-secondary-orange-500: #fc961e;
-  --color-secondary-orange-400: #ffab4b;
-  --color-secondary-orange-300: #ffc17d;
-  --color-secondary-orange-200: #ffdab2;
-  --color-secondary-orange-100: #fff5eb;
-  --color-secondary-red-900: #3e1219;
-  --color-secondary-red-800: #641b21;
-  --color-secondary-red-700: #8b2226;
-  --color-secondary-red-600: #b42a27;
-  --color-secondary-red-500: #df382b;
-  --color-secondary-red-400: #ea5d58;
-  --color-secondary-red-300: #f38789;
-  --color-secondary-red-200: #fab9bc;
-  --color-secondary-red-100: #feedee;
+  --color-secondary-orange-900: #360e00;
+  --color-secondary-orange-800: #531b00;
+  --color-secondary-orange-700: #8c3500;
+  --color-secondary-orange-600: #c65200;
+  --color-secondary-orange-500: #ea7315;
+  --color-secondary-orange-400: #ef934a;
+  --color-secondary-orange-300: #f4b27e;
+  --color-secondary-orange-200: #f8d2b3;
+  --color-secondary-orange-100: #fdf1e8;
+  --color-secondary-red-900: #2d0000;
+  --color-secondary-red-800: #530000;
+  --color-secondary-red-700: #8c0003;
+  --color-secondary-red-600: #c61112;
+  --color-secondary-red-500: #ea302d;
+  --color-secondary-red-400: #ef5f5c;
+  --color-secondary-red-300: #f38d8c;
+  --color-secondary-red-200: #f8bcbb;
+  --color-secondary-red-100: #fdeaea;
   --color-secondary-purple-900: #1a1a4b;
   --color-secondary-purple-800: #282863;
   --color-secondary-purple-700: #393879;
@@ -170,7 +170,7 @@
   --color-tag-text-light-border: var(--color-grey-500);
   --color-tag-text-light-background: var(--color-grey-000);
   --color-tabs-active-disabled: var(--color-primary-01-200);
-  --color-tabs-hover: var(--color-primary-01-600);
+  --color-tabs-hover: var(--color-primary-01-800);
   --color-tabs-shadow: var(--color-grey-999);
   --color-tabs-background: var(--color-grey-000);
   --color-star-hover: var(--color-secondary-orange-300);
@@ -182,16 +182,20 @@
   --color-progress-percentage-default: var(--color-grey-900);
   --color-progress-indicator: var(--color-info-600);
   --color-progress-background: var(--color-grey-200);
+  --color-notification-danger-icon: var(--color-danger-600);
   --color-notification-danger-border: var(--color-danger-500);
   --color-notification-danger-background: var(--color-danger-100);
+  --color-notification-warning-icon: var(--color-warning-600);
   --color-notification-warning-border: var(--color-warning-500);
   --color-notification-warning-background: var(--color-warning-100);
+  --color-notification-success-icon: var(--color-success-600);
   --color-notification-success-border: var(--color-success-500);
   --color-notification-success-background: var(--color-success-100);
+  --color-notification-information-icon: var(--color-info-600);
   --color-notification-information-border: var(--color-info-500);
   --color-notification-information-background: var(--color-info-100);
   --color-notification-font: var(--color-grey-999);
-  --color-link-danger-hover: var(--color-secondary-red-900);
+  --color-link-danger-hover: var(--color-secondary-red-800);
   --color-link-danger-disabled: var(--color-grey-100);
   --color-link-danger-active: var(--color-secondary-red-700);
   --color-link-danger-visited: var(--color-secondary-red-700);
@@ -201,7 +205,7 @@
   --color-link-primary-02-active: var(--color-primary-02-700);
   --color-link-primary-02-visited: var(--color-primary-02-700);
   --color-link-primary-02-base: var(--color-primary-02-600);
-  --color-link-primary-hover: var(--color-primary-01-900);
+  --color-link-primary-hover: var(--color-primary-01-800);
   --color-link-primary-disabled: var(--color-grey-100);
   --color-link-primary-active: var(--color-primary-01-700);
   --color-link-primary-visited: var(--color-primary-01-700);
@@ -243,7 +247,7 @@
   --color-font-darker: var(--color-grey-900);
   --color-font-darkest: var(--color-grey-999);
   --color-font-primary-02: var(--color-primary-02-500);
-  --color-font-primary-01: var(--color-primary-01-500);
+  --color-font-primary-01: var(--color-primary-01-600);
   --color-focus-border: var(--color-secondary-blue-500);
   --color-focus-gap: var(--color-grey-000);
   --color-flag-bordered-danger-text: var(--color-secondary-red-600);

package/src/tokens/adeo/ios/StyleDictionaryColor.h

@@ -305,12 +305,16 @@ ColorLinkDangerHover,
 ColorNotificationFont,
 ColorNotificationInformationBackground,
 ColorNotificationInformationBorder,
+ColorNotificationInformationIcon,
 ColorNotificationSuccessBackground,
 ColorNotificationSuccessBorder,
+ColorNotificationSuccessIcon,
 ColorNotificationWarningBackground,
 ColorNotificationWarningBorder,
+ColorNotificationWarningIcon,
 ColorNotificationDangerBackground,
 ColorNotificationDangerBorder,
+ColorNotificationDangerIcon,
 ColorProgressBackground,
 ColorProgressIndicator,
 ColorProgressPercentageDefault,