fix(paletts): color function with passed palette always returns the s…

…ame color
IgniteUI · Oct 23, 2024 · 529e561 · 529e561
1 parent 9f4e985
commit 529e561
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 6 deletions.
diff --git a/sass/color/_functions.scss b/sass/color/_functions.scss
@@ -109,7 +109,7 @@ $_enhanced-accessibility: false;
                         $background: map.get($shade, 'raw'),
                         $contrast: 'AA',
                     ),
-                raw: map.get($shade, 'raw'),
+                #{$variant}-raw: map.get($shade, 'raw'),
             )
         );
     }
@@ -195,7 +195,7 @@ $_enhanced-accessibility: false;
     @if $palette and not($contrast) {
         $s: map.get($palette, $color);
         $base: map.get($s, $variant);
-        $raw: map.get($s, raw);
+        $raw: map.get($s, #{$variant}-raw);
 
         @return if($raw and $variant != 500, rgba($raw, $_alpha), rgba($base, $_alpha));
     }

diff --git a/sass/color/_mixins.scss b/sass/color/_mixins.scss
@@ -43,8 +43,10 @@ $_added: () !default;
 
     #{$scope} {
         @each $color, $shades in map.remove($palette, '_meta') {
-            @each $shade, $value in map.remove($shades, 'raw') {
-                @include _shade($color, $shade, $value, $contrast);
+            @each $shade, $value in $shades {
+                @if not(string.index(to-string($shade), raw)) {
+                    @include _shade($color, $shade, $value, $contrast);
+                }
             }
         }
     }

diff --git a/test/_color.spec.scss b/test/_color.spec.scss
@@ -114,9 +114,11 @@ $_palette: palette(
         }
 
         @include it('should return a shade of type string w/ all arguments passed') {
-            $value: color($_palette, secondary, 500);
+            $value-500: color($_palette, secondary, 500);
+            $value-800: color($_palette, secondary, 800);
 
-            @include assert-equal($value, $_secondary);
+            @include assert-equal($value-500, $_secondary);
+            @include assert-unequal($value-500, $value-800);
         }
 
         @include it('should return a shade as CSS variable w/o arguments') {