From 7efa3b7ad2aa442e38308128eb1b4ed99f1febc0 Mon Sep 17 00:00:00 2001
From: Valentin Mihai <Valentin-Gabriel.Mihai.ext@knecon.com>
Date: Tue, 4 Jul 2023 16:25:14 +0300
Subject: [PATCH] RED-6801 - added active style to icon button

---
 src/assets/styles/common-buttons.scss                | 8 ++++++++
 src/lib/buttons/icon-button/icon-button.component.ts | 2 ++
 2 files changed, 10 insertions(+)

diff --git a/src/assets/styles/common-buttons.scss b/src/assets/styles/common-buttons.scss
index 926cd36..073d129 100644
--- a/src/assets/styles/common-buttons.scss
+++ b/src/assets/styles/common-buttons.scss
@@ -90,6 +90,14 @@ iqser-icon-button {
         &.dark {
             background: var(--iqser-btn-bg);
         }
+
+        &.active {
+            background: #fcebeb;
+            font-weight: 600;
+            color: var(--iqser-primary);
+            cursor: default;
+            pointer-events: none;
+        }
     }
 }
 
diff --git a/src/lib/buttons/icon-button/icon-button.component.ts b/src/lib/buttons/icon-button/icon-button.component.ts
index d7d91e3..6f2c018 100644
--- a/src/lib/buttons/icon-button/icon-button.component.ts
+++ b/src/lib/buttons/icon-button/icon-button.component.ts
@@ -19,6 +19,7 @@ export class IconButtonComponent {
     @Input() buttonId = `${randomString()}-icon-button`;
     @Input() icon?: string;
     @Input() showDot = false;
+    @Input() active = false;
     @Input() disabled = false;
     @Input() submit = false;
     @Input() type: IconButtonType = IconButtonTypes.default;
@@ -30,6 +31,7 @@ export class IconButtonComponent {
             overlay: this.showDot,
             [this.type]: true,
             'has-icon': !!this.icon,
+            active: this.active,
         };
     }
 }