From e8a6e4248a4f7cbe58c83a46a60c77c79315e508 Mon Sep 17 00:00:00 2001
From: dlohvinov <nsblnr@gmail.com>
Date: Mon, 16 Oct 2023 12:47:27 +0300
Subject: [PATCH] 23.12.17: wt-icon active color [WTEL-3912]

---
 package-lock.json                      | 4 ++--
 package.json                           | 2 +-
 src/components/wt-icon/Readme.md       | 2 +-
 src/components/wt-icon/_variables.scss | 2 ++
 src/components/wt-icon/wt-icon.vue     | 5 ++++-
 5 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 71cc2b51..b2832e08 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "23.12.4",
+  "version": "23.12.16",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@webitel/ui-sdk",
-      "version": "23.12.4",
+      "version": "23.12.16",
       "dependencies": {
         "@floating-ui/vue": "^1.0.1",
         "@vue/compat": "^3.2.47",
diff --git a/package.json b/package.json
index c3cc141e..bfa6cef9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "23.12.16",
+  "version": "23.12.17",
   "private": false,
   "scripts": {
     "build": "vue-cli-service build --target lib --name ui-sdk ./src/install.js",
diff --git a/src/components/wt-icon/Readme.md b/src/components/wt-icon/Readme.md
index b6632762..b386881c 100644
--- a/src/components/wt-icon/Readme.md
+++ b/src/components/wt-icon/Readme.md
@@ -5,7 +5,7 @@
 
 Different color icons:
 ```vue
-const colors = ['default', 'disabled', 'primary', 'error', 'success', 'warning', 'on-dark', 'on-light', 'on-primary', 'info', 'chat', 'transfer', 'job'];
+const colors = ['default', 'active', 'disabled', 'primary', 'error', 'success', 'warning', 'on-dark', 'on-light', 'on-primary', 'info', 'chat', 'transfer', 'job'];
 
 <div
   style="display: flex; align-items: center; gap: 5px;"
diff --git a/src/components/wt-icon/_variables.scss b/src/components/wt-icon/_variables.scss
index f1b536f9..98deb05a 100644
--- a/src/components/wt-icon/_variables.scss
+++ b/src/components/wt-icon/_variables.scss
@@ -9,6 +9,7 @@
   --icon-xs-size: 8px;
 
   --icon-color: var(--grey-darken-2);
+  --icon-active-color: var(--grey-darken-4);
   --icon-primary-color: var(--primary-color);
   --icon-error-color: var(--error-color);
   --icon-success-color: var(--success-color);
@@ -25,5 +26,6 @@
 
 :root.theme--dark {
   --icon-color: var(--grey-lighten-2);
+  --icon-active-color: var(--grey-lighten-4);
   --icon-disabled-color: var(--grey-darken-2);
 }
diff --git a/src/components/wt-icon/wt-icon.vue b/src/components/wt-icon/wt-icon.vue
index 85bfebe5..ad538fbb 100644
--- a/src/components/wt-icon/wt-icon.vue
+++ b/src/components/wt-icon/wt-icon.vue
@@ -35,7 +35,7 @@ const props = defineProps({
     default: 'md',
   },
   /**
-   * @values 'default', 'disabled', 'primary', 'error', 'success', 'warning', 'on-dark', 'on-light', 'on-primary', 'info', 'chat', 'transfer', 'job'
+   * @values 'default', 'active', 'disabled', 'primary', 'error', 'success', 'warning', 'on-dark', 'on-light', 'on-primary', 'info', 'chat', 'transfer', 'job'
    */
   color: {
     type: String,
@@ -88,6 +88,9 @@ svg {
   &-default .wt-icon__icon {
     fill: var(--icon-color);
   }
+  &-active .wt-icon__icon {
+    fill: var(--icon-active-color);
+  }
   &-primary .wt-icon__icon {
     fill: var(--icon-primary-color);
   }