fix(select): Add missing mixin (#3435)

Add missing `mdc-select-corner-radius` mixin for styling the corners of the `--box` variant.

(cherry picked from commit e654526)

Author: williamernest

packages/mdc-select/README.md

@@ -215,6 +215,7 @@ Mixin | Description
 `mdc-select-focused-label-color($color)` | Customizes the label color of the select when focused.
 `mdc-select-bottom-line-color($color)` | Customizes the color of the default bottom line of the select.
 `mdc-select-focused-bottom-line-color($color)` | Customizes the color of the bottom line of the select when focused.
+`mdc-select-corner-radius($radius)` | Customizes the corner radius of the box variant of the select.
 `mdc-select-hover-bottom-line-color($color)` | Customizes the color of the bottom line when the select is hovered.
 `mdc-select-outline-color($color)` | Customizes the color of the notched outline.
 `mdc-select-outline-corner-radius($radius)` | Sets the border radius of of the outlined select variant.

packages/mdc-select/_mixins.scss

@@ -89,6 +89,24 @@
   }
 }
 
+@mixin mdc-select-corner-radius($radius) {
+  border-radius: $radius $radius 0 0;
+}
+
+@mixin mdc-select-outline-corner-radius($radius) {
+  // NOTE: idle and notched state border radius mixins
+  // are broken into 2 different mixins, otherwise
+  // we would be overly specific (big no, no). The cause of
+  // this is because .mdc-notched-outline and .mdc-notched-outline__idle
+  // are siblings. .mdc-notched-outline__idle needs to be a child of
+  // .mdc-notched-outline in order to remedy this issue.
+  .mdc-notched-outline {
+    @include mdc-notched-outline-corner-radius($radius);
+  }
+
+  @include mdc-notched-outline-idle-corner-radius($radius);
+}
+
 // Private
 @mixin mdc-select-focused-line-ripple_ {
   .mdc-select__native-control:focus ~ .mdc-line-ripple {
@@ -133,20 +151,6 @@
   background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23#{$fill-hex-number}%22%20fill-rule%3D%22evenodd%22%20opacity%3D%22#{$opacity}%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E");
 }
 
-@mixin mdc-select-outline-corner-radius($radius) {
-  // NOTE: idle and notched state border radius mixins
-  // are broken into 2 different mixins, otherwise
-  // we would be overly specific (big no, no). The cause of
-  // this is because .mdc-notched-outline and .mdc-notched-outline__idle
-  // are siblings. .mdc-notched-outline__idle needs to be a child of
-  // .mdc-notched-outline in order to remedy this issue.
-  .mdc-notched-outline {
-    @include mdc-notched-outline-corner-radius($radius);
-  }
-
-  @include mdc-notched-outline-idle-corner-radius($radius);
-}
-
 @mixin mdc-select-outline-color_($color) {
   // NOTE: outlined version of select wants the "idle" and
   // "notched" outline to have the same color. This covers two cases: