Be more explicit about API surface for SASS module

Only `@forward` specific mixins and create a function to retrieve
color settings out of the `_config` partial

src/styles/shared/components/buttons/_config.scss

@@ -108,3 +108,42 @@ $LinkButton-colors--dark: (
   'active-foreground': $color-g7,
   'disabled-foreground': $color-gmid,
 );
+
+$-IconButton: (
+  'normal': $IconButton-colors,
+  'primary': $IconButton-colors--primary,
+  'dark': $IconButton-colors--dark,
+  'light': $IconButton-colors--light,
+);
+
+$-LabeledButton: (
+  'normal': $LabeledButton-colors,
+  'primary': $LabeledButton-colors--primary,
+  'dark': $LabeledButton-colors--dark,
+  'light': $LabeledButton-colors--light,
+);
+
+$-LinkButton: (
+  'normal': $LinkButton-colors,
+  'primary': $LinkButton-colors--primary,
+  'dark': $LinkButton-colors--dark,
+  'light': $LinkButton-colors--light,
+);
+
+// Return a color map corresponding to a button component-variant combination
+// Defaults to `LabeledButton--normal`
+@function colors-for($button-type: 'LabeledButton', $variant: 'normal') {
+  $colors: map.get($-LabeledButton, 'normal');
+
+  @if $button-type == 'IconButton' {
+    $colors: map.get($-IconButton, $variant);
+  }
+  @if $button-type == 'LabeledButton' {
+    $colors: map.get($-LabeledButton, $variant);
+  }
+  @if $button-type == 'LinkButton' {
+    $colors: map.get($-LinkButton, $variant);
+  }
+
+  @return $colors;
+}

src/styles/shared/components/buttons/_index.scss

-@forward 'config';
-@forward 'mixins';
+@forward 'config' show colors-for;
+@forward 'mixins' show reset, Button, IconButton, LabeledButton, LinkButton;

src/styles/sidebar/buttons.scss

@@ -51,7 +51,7 @@
 // both the input and the buttons. At some point this pattern should be
 // consolidated.
 $input-button-colors: map.merge(
-  buttons.$IconButton-colors,
+  buttons.colors-for('IconButton'),
   (
     'background': var.$grey-1,
     'hover-background': var.$grey-2,