chore: refactor for tokens update

PiperOrigin-RevId: 437353265

Author: asyncliz

packages/mdc-banner/_banner-theme.scss

@@ -82,8 +82,7 @@ $light-theme: (
 );
 
 @mixin theme($theme, $resolvers: resolvers.$material) {
-  @include theme.validate-theme($light-theme, $theme);
-
+  @include theme.validate-theme-keys($light-theme, $theme);
   $theme: _resolve-theme($theme, $resolvers);
   @include keys.declare-custom-properties($theme, banner);
 }
@@ -124,8 +123,7 @@ $light-theme: (
   $resolver: resolvers.$material,
   $query: feature-targeting.all()
 ) {
-  @include theme.validate-theme($light-theme, $theme);
-
+  @include theme.validate-theme-keys($light-theme, $theme);
   @include text-color(map.get($theme, supporting-text-color), $query: $query);
   @include _supporting-text-typography(
     (

packages/mdc-banner/test/feature-targeting-any.test.scss

@@ -91,7 +91,7 @@ $light-theme: (
   $resolver: resolvers.$material,
   $query: feature-targeting.all()
 ) {
-  @include theme.validate-theme($light-theme, $theme);
+  @include theme.validate-theme-keys($light-theme, $theme);
   $theme: keys.create-theme-properties(
     $theme,
     $prefix: $_custom-property-prefix

packages/mdc-banner/test/mdc-banner.scss.test.ts

@@ -76,7 +76,7 @@ $light-theme: (
   $resolver: resolvers.$material,
   $query: feature-targeting.all()
 ) {
-  @include theme.validate-theme($light-theme, $theme);
+  @include theme.validate-theme-keys($light-theme, $theme);
   $theme: keys.create-theme-properties(
     $theme,
     $prefix: $_custom-property-prefix

packages/mdc-button/_button-outlined-theme.scss

@@ -117,7 +117,7 @@ $forced-colors-theme: (
 );
 
 @mixin theme($theme) {
-  @include theme.validate-theme($light-theme, $theme);
+  @include theme.validate-theme-keys($light-theme, $theme);
   @include keys.declare-custom-properties(
     $theme,
     $prefix: $custom-property-prefix

packages/mdc-button/_button-text-theme.scss

@@ -74,7 +74,7 @@ $light-theme: (
 $custom-property-prefix: 'dialog';
 
 @mixin theme($theme, $resolvers: resolvers.$material) {
-  @include theme.validate-theme($light-theme, $theme);
+  @include theme.validate-theme-keys($light-theme, $theme);
   $theme: _resolve-elevation($theme, map.get($resolvers, elevation));
   @include keys.declare-custom-properties(
     $theme,
@@ -83,7 +83,7 @@ $custom-property-prefix: 'dialog';
 }
 
 @mixin theme-styles($theme, $resolvers: resolvers.$material) {
-  @include theme.validate-theme($light-theme, $theme);
+  @include theme.validate-theme-keys($light-theme, $theme);
   $theme: keys.create-theme-properties(
     $theme,
     $prefix: $custom-property-prefix

packages/mdc-checkbox/_checkbox-theme.scss

@@ -63,6 +63,11 @@
     @return $color;
   }
 
+  @if meta.type-of($color) != 'color' {
+    @warn '#{$color} is not a color. Falling back to "dark" tone.';
+    @return 'dark';
+  }
+
   $minimumContrast: 3.1;
 
   $lightContrast: contrast($color, white);
@@ -329,7 +334,10 @@ $_property-values-copy: $property-values;
 ///   => #fff
 ///
 @function get-custom-property($color) {
+  $is-tokens-custom-prop: meta.type-of($color) == 'string' and
+    string.index($color, '--') != null;
   @if custom-properties.is-custom-prop($color) or
+    $is-tokens-custom-prop or
     is-valid-theme-prop-value_($color)
   {
     @return $color;
@@ -348,6 +356,6 @@ $_property-values-copy: $property-values;
 
     @return $custom-prop;
   } @else {
-    @error "Invalid theme property: '#{$style}'. Choose one of: #{get-theme-keys()}";
+    @error "Invalid theme property: '#{$color}'. Choose one of: #{get-theme-keys()}";
   }
 }