Added primary varient in IconButton

Signed-off-by: Ajay Bura <ajbura@gmail.com>

diff --git a/src/app/atoms/button/IconButton.jsx b/src/app/atoms/button/IconButton.jsx
index f249f1b0cef03a29e448053b5905ad2ac7ec6fc4..c81c3b10f048663c342f0a19dc15854da8e9a00f 100644 (file)
--- a/src/app/atoms/button/IconButton.jsx
+++ b/src/app/atoms/button/IconButton.jsx
@@ -44,7 +44,7 @@ IconButton.defaultProps = {
 };
 
 IconButton.propTypes = {
-  variant: PropTypes.oneOf(['surface', 'positive', 'caution', 'danger']),
+  variant: PropTypes.oneOf(['surface', 'primary', 'positive', 'caution', 'danger']),
   size: PropTypes.oneOf(['normal', 'small', 'extra-small']),
   type: PropTypes.oneOf(['button', 'submit', 'reset']),
   tooltip: PropTypes.string,

diff --git a/src/app/atoms/button/IconButton.scss b/src/app/atoms/button/IconButton.scss
index 9b83c089907c2a2f9ca3ca49b6ddc2a1c4a6837c..aa6480c03bb662aacb164e22152431971c913042 100644 (file)
--- a/src/app/atoms/button/IconButton.scss
+++ b/src/app/atoms/button/IconButton.scss
@@ -29,6 +29,13 @@
   @include focus(var(--bg-surface-hover));
   @include state.active(var(--bg-surface-active));
 }
+.ic-btn-primary {
+  @include color(var(--ic-primary-normal));
+  @include state.hover(var(--bg-primary-hover));
+  @include focus(var(--bg-primary-hover));
+  @include state.active(var(--bg-primary-active));
+  background-color: var(--bg-primary);
+}
 .ic-btn-positive {
   @include color(var(--ic-positive-normal));
   @include state.hover(var(--bg-positive-hover));