Allow each component to have its own colors and default to the global set

sass/elements/button.sass

@@ -33,6 +33,8 @@ $button-static-color: $text-light !default
 $button-static-background-color: $scheme-main-ter !default
 $button-static-border-color: $border !default
 
+$button-colors: $colors !default
+
 // The button sizes use mixins so they can be used at different breakpoints
 =button-small
   border-radius: $radius-small
@@ -115,7 +117,7 @@ $button-static-border-color: $border !default
       background-color: transparent
       border-color: transparent
       box-shadow: none
-  @each $name, $pair in $colors
+  @each $name, $pair in $button-colors
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}

sass/elements/notification.sass

@@ -5,6 +5,8 @@ $notification-padding: 1.25rem 2.5rem 1.25rem 1.5rem !default
 $notification-padding-ltr: 1.25rem 2.5rem 1.25rem 1.5rem !default
 $notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default
 
+$notification-colors: $colors !default
+
 .notification
   @extend %block
   background-color: $notification-background-color
@@ -33,7 +35,7 @@ $notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default
   .content
     color: currentColor
   // Colors
-  @each $name, $pair in $colors
+  @each $name, $pair in $notification-colors
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}

sass/elements/progress.sass

@@ -4,6 +4,8 @@ $progress-border-radius: $radius-rounded !default
 
 $progress-indeterminate-duration: 1.5s !default
 
+$progress-colors: $colors !default
+
 .progress
   @extend %block
   -moz-appearance: none
@@ -25,7 +27,7 @@ $progress-indeterminate-duration: 1.5s !default
     background-color: $progress-value-background-color
     border: none
   // Colors
-  @each $name, $pair in $colors
+  @each $name, $pair in $progress-colors
     $color: nth($pair, 1)
     &.is-#{$name}
       &::-webkit-progress-value

sass/elements/table.sass

@@ -23,6 +23,8 @@ $table-row-active-color: $primary-invert !default
 $table-striped-row-even-background-color: $scheme-main-bis !default
 $table-striped-row-even-hover-background-color: $scheme-main-ter !default
 
+$table-colors: $colors !default
+
 .table
   @extend %block
   background-color: $table-background-color
@@ -34,7 +36,7 @@ $table-striped-row-even-hover-background-color: $scheme-main-ter !default
     padding: $table-cell-padding
     vertical-align: top
     // Colors
-    @each $name, $pair in $colors
+    @each $name, $pair in $table-colors
       $color: nth($pair, 1)
       $color-invert: nth($pair, 2)
       &.is-#{$name}

sass/elements/tag.sass

@@ -3,6 +3,8 @@ $tag-color: $text !default
 $tag-radius: $radius !default
 $tag-delete-margin: 1px !default
 
+$tag-colors: $colors !default
+
 .tags
   align-items: center
   display: flex
@@ -71,7 +73,7 @@ $tag-delete-margin: 1px !default
     +ltr-property("margin", 0.25rem, false)
     +ltr-property("margin", -0.375rem)
   // Colors
-  @each $name, $pair in $colors
+  @each $name, $pair in $tag-colors
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}