diff --git a/functions/_colors.scss b/functions/_colors.scss index 95c5943..ce6ce86 100644 --- a/functions/_colors.scss +++ b/functions/_colors.scss @@ -3,6 +3,11 @@ @use "sass:math"; @use "sass:string"; +@use './type-checking' as check; + +@use '../node_modules/sass-true/sass/throw' as throw; +$_is-test: false !default; + /// Convert HEX colors to R, G, B values /// @param {Color} $color /// @return {String} @@ -106,11 +111,26 @@ $steps: 20, $color2-peak: 11, ) { + @if(check.is-color($color1) == false) { + @return throw.error("❌ ===> The color1 parameter must be a color.", $catch: $_is-test); + } + @if(check.is-color($color2) == false) { + @return throw.error("❌ ===> The color2 parameter must be a color.", $catch: $_is-test); + } + @if(check.is-color($color3) == false) { + @return throw.error("❌ ===> The color3 parameter must be a color.", $catch: $_is-test); + } + @if(check.is-integer($steps) == false) { + @return throw.error("❌ ===> The steps parameter must be an integer.", $catch: $_is-test); + } + @if(check.is-integer($color2-peak) == false) { + @return throw.error("❌ ===> The color2-peak parameter must be an integer.", $catch: $_is-test); + } @if ($color2-peak > $steps) { - @error "The peak point for color2 must be less than or equal to the number of steps."; + @return throw.error("❌ ===> The peak point for color2 must be less than or equal to the number of steps.", $catch: $_is-test); } @if ($color2-peak < 1) { - @error "The peak point for color2 must be greater than or equal to 1."; + @return throw.error("❌ ===> The peak point for color2 must be greater than or equal to 1.", $catch: $_is-test); } $colorMap: (1: $color1); diff --git a/functions/_type-checking.scss b/functions/_type-checking.scss index 176f0ca..83ce00b 100644 --- a/functions/_type-checking.scss +++ b/functions/_type-checking.scss @@ -126,3 +126,12 @@ @return is-length($value) or is-percentage($value) or list.index('top' 'right' 'bottom' 'left' 'center', $value) != null; } + +/// Check if its a color value +/// @param {Void} $value - Value to check +/// @group Type-Checking +/// @author https://github.com/red-freak +/// @since v2.5.0 +@function is-color($value) { + @return meta.type-of($value) == 'color'; +} diff --git a/tests/colors-generate-mixed-colors.spec.scss b/tests/colors-generate-mixed-colors.spec.scss new file mode 100644 index 0000000..c8433c7 --- /dev/null +++ b/tests/colors-generate-mixed-colors.spec.scss @@ -0,0 +1,48 @@ +//@use 'true'; +$_is-test: true; +@use '../node_modules/sass-true/sass/true' as true; +@import '../functions/_colors.scss'; + + +@include true.describe('generate-mixed-colors()') { + @include true.it('should throw an error if the step and peak parameters are wrong') { + @include true.assert-equal( + generate-mixed-colors(1, 1, 1), 'ERROR: ❌ ===> The color1 parameter must be a color.' + ); + @include true.assert-equal( + generate-mixed-colors(green, 1, 1), 'ERROR: ❌ ===> The color2 parameter must be a color.' + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, 1), 'ERROR: ❌ ===> The color3 parameter must be a color.' + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, "hallo"), 'ERROR: ❌ ===> The steps parameter must be an integer.' + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, 10, "welt"), 'ERROR: ❌ ===> The color2-peak parameter must be an integer.' + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, 0, 2), 'ERROR: ❌ ===> The peak point for color2 must be less than or equal to the number of steps.' + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, 0, 0), 'ERROR: ❌ ===> The peak point for color2 must be greater than or equal to 1.' + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, -1, -1), 'ERROR: ❌ ===> The peak point for color2 must be greater than or equal to 1.' + ); + } + @include true.it('should return expected color maps') { + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, 1, 1), (1: yellow) + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, 3, 2), (1: green, 2: yellow, 3: red) + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red, 2, 1), (1: yellow, 2: red) + ); + @include true.assert-equal( + generate-mixed-colors(green, yellow, red), (1: green, 2: #2e9700, 3: #46a300, 4: #5dae00, 5: #74ba00, 6: #8bc500, 7: #a2d100, 8: #b9dc00, 9: #d1e800, 10: #e8f300, 11: yellow, 12: #ffe300, 13: #ffc600, 14: #ffaa00, 15: #ff8e00, 16: #ff7100, 17: #ff5500, 18: #ff3900, 19: #ff1c00, 20: red) + ); + } +} \ No newline at end of file