From 969cd2453956d103ee1516cdcfa51c7c78bda42d Mon Sep 17 00:00:00 2001
From: Elizabeth Mitchell <lizmitchell@google.com>
Date: Wed, 26 Apr 2023 13:30:02 -0700
Subject: [PATCH] chore(button): remove shape resolver

PiperOrigin-RevId: 527359555
---
 button/lib/_elevated-button.scss         | 41 ++++++++++++++++++++----
 button/lib/_filled-button.scss           | 38 ++++++++++++++++++++--
 button/lib/_outlined-button.scss         | 41 ++++++++++++++++++++----
 button/lib/_text-button.scss             | 41 ++++++++++++++++++++----
 button/lib/_tonal-button.scss            | 41 ++++++++++++++++++++----
 tokens/_md-comp-elevated-button.scss     |  9 ------
 tokens/_md-comp-filled-button.scss       | 10 ------
 tokens/_md-comp-filled-tonal-button.scss | 11 -------
 tokens/_md-comp-outlined-button.scss     | 10 ------
 tokens/_md-comp-text-button.scss         | 10 ------
 10 files changed, 174 insertions(+), 78 deletions(-)

diff --git a/button/lib/_elevated-button.scss b/button/lib/_elevated-button.scss
index a4ce89be3e..839aa4e688 100644
--- a/button/lib/_elevated-button.scss
+++ b/button/lib/_elevated-button.scss
@@ -4,21 +4,32 @@
 //
 
 // go/keep-sorted start
+@use 'sass:list';
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../../sass/theme';
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $tokens: theme.validate-theme(
-    tokens.md-comp-elevated-button-values(),
-    $tokens
+  $supported-tokens: list.join(
+    tokens.$md-comp-elevated-button-supported-tokens,
+    (
+      'container-shape-start-start',
+      'container-shape-start-end',
+      'container-shape-end-end',
+      'container-shape-end-start'
+    )
   );
 
   @each $token, $value in $tokens {
-    --md-elevated-button-#{$token}: #{$value};
+    @if list.index($supported-tokens, $token) {
+      @error 'Token `#{$token}` is not a supported token.';
+    }
+
+    @if $value {
+      --md-elevated-button-#{$token}: #{$value};
+    }
   }
 }
 
@@ -27,7 +38,25 @@
 
   :host {
     @each $token, $value in $tokens {
-      --_#{$token}: #{$value};
+      --_#{$token}: var(--md-elevated-button-#{$token}, #{$value});
     }
+
+    // Support logical shape properties
+    --_container-shape-start-start: var(
+      --md-elevated-button-container-shape-start-start,
+      var(--_container-shape)
+    );
+    --_container-shape-start-end: var(
+      --md-elevated-button-container-shape-start-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-end: var(
+      --md-elevated-button-container-shape-end-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-start: var(
+      --md-elevated-button-container-shape-end-start,
+      var(--_container-shape)
+    );
   }
 }
diff --git a/button/lib/_filled-button.scss b/button/lib/_filled-button.scss
index 3cc0e3b267..5436cab9b8 100644
--- a/button/lib/_filled-button.scss
+++ b/button/lib/_filled-button.scss
@@ -12,10 +12,24 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $tokens: theme.validate-theme(tokens.md-comp-filled-button-values(), $tokens);
+  $supported-tokens: list.join(
+    tokens.$md-comp-filled-button-supported-tokens,
+    (
+      'container-shape-start-start',
+      'container-shape-start-end',
+      'container-shape-end-end',
+      'container-shape-end-start'
+    )
+  );
 
   @each $token, $value in $tokens {
-    --md-filled-button-#{$token}: #{$value};
+    @if list.index($supported-tokens, $token) {
+      @error 'Token `#{$token}` is not a supported token.';
+    }
+
+    @if $value {
+      --md-filled-button-#{$token}: #{$value};
+    }
   }
 }
 
@@ -24,7 +38,25 @@
 
   :host {
     @each $token, $value in $tokens {
-      --_#{$token}: #{$value};
+      --_#{$token}: var(--md-filled-button-#{$token}, #{$value});
     }
+
+    // Support logical shape properties
+    --_container-shape-start-start: var(
+      --md-filled-button-container-shape-start-start,
+      var(--_container-shape)
+    );
+    --_container-shape-start-end: var(
+      --md-filled-button-container-shape-start-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-end: var(
+      --md-filled-button-container-shape-end-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-start: var(
+      --md-filled-button-container-shape-end-start,
+      var(--_container-shape)
+    );
   }
 }
diff --git a/button/lib/_outlined-button.scss b/button/lib/_outlined-button.scss
index 7715ca4017..2af1224790 100644
--- a/button/lib/_outlined-button.scss
+++ b/button/lib/_outlined-button.scss
@@ -4,10 +4,10 @@
 //
 
 // go/keep-sorted start
+@use 'sass:list';
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../../sass/theme';
 @use '../../tokens';
 // go/keep-sorted end
 
@@ -15,13 +15,24 @@
 // Selector '.md3-*' should only be used in this project.
 
 @mixin theme($tokens) {
-  $tokens: theme.validate-theme(
-    tokens.md-comp-outlined-button-values(),
-    $tokens
+  $supported-tokens: list.join(
+    tokens.$md-comp-outlined-button-supported-tokens,
+    (
+      'container-shape-start-start',
+      'container-shape-start-end',
+      'container-shape-end-end',
+      'container-shape-end-start'
+    )
   );
 
   @each $token, $value in $tokens {
-    --md-outlined-button-#{$token}: #{$value};
+    @if list.index($supported-tokens, $token) {
+      @error 'Token `#{$token}` is not a supported token.';
+    }
+
+    @if $value {
+      --md-outlined-button-#{$token}: #{$value};
+    }
   }
 }
 
@@ -30,8 +41,26 @@
 
   :host {
     @each $token, $value in $tokens {
-      --_#{$token}: #{$value};
+      --_#{$token}: var(--md-outlined-button-#{$token}, #{$value});
     }
+
+    // Support logical shape properties
+    --_container-shape-start-start: var(
+      --md-outlined-button-container-shape-start-start,
+      var(--_container-shape)
+    );
+    --_container-shape-start-end: var(
+      --md-outlined-button-container-shape-start-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-end: var(
+      --md-outlined-button-container-shape-end-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-start: var(
+      --md-outlined-button-container-shape-end-start,
+      var(--_container-shape)
+    );
   }
 
   .md3-button__outline {
diff --git a/button/lib/_text-button.scss b/button/lib/_text-button.scss
index 4c7d0396ac..00107a500a 100644
--- a/button/lib/_text-button.scss
+++ b/button/lib/_text-button.scss
@@ -7,17 +7,28 @@
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../../sass/theme';
 @use '../../tokens';
 // go/keep-sorted end
 
-$_custom-property-prefix: 'text-button';
-
 @mixin theme($tokens) {
-  $tokens: theme.validate-theme(tokens.md-comp-text-button-values(), $tokens);
+  $supported-tokens: list.join(
+    tokens.$md-comp-text-button-supported-tokens,
+    (
+      'container-shape-start-start',
+      'container-shape-start-end',
+      'container-shape-end-end',
+      'container-shape-end-start'
+    )
+  );
 
   @each $token, $value in $tokens {
-    --md-text-button-#{$token}: #{$value};
+    @if list.index($supported-tokens, $token) {
+      @error 'Token `#{$token}` is not a supported token.';
+    }
+
+    @if $value {
+      --md-text-button-#{$token}: #{$value};
+    }
   }
 }
 
@@ -26,11 +37,29 @@ $_custom-property-prefix: 'text-button';
 
   :host {
     @each $token, $value in $tokens {
-      --_#{$token}: #{$value};
+      --_#{$token}: var(--md-text-button-#{$token}, #{$value});
     }
 
     --_container-color: none;
     --_disabled-container-color: none;
     --_disabled-container-opacity: 0;
+
+    // Support logical shape properties
+    --_container-shape-start-start: var(
+      --md-text-button-container-shape-start-start,
+      var(--_container-shape)
+    );
+    --_container-shape-start-end: var(
+      --md-text-button-container-shape-start-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-end: var(
+      --md-text-button-container-shape-end-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-start: var(
+      --md-text-button-container-shape-end-start,
+      var(--_container-shape)
+    );
   }
 }
diff --git a/button/lib/_tonal-button.scss b/button/lib/_tonal-button.scss
index 4d5005a56a..1618918160 100644
--- a/button/lib/_tonal-button.scss
+++ b/button/lib/_tonal-button.scss
@@ -7,19 +7,28 @@
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../../sass/shape';
-@use '../../sass/theme';
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $tokens: theme.validate-theme(
-    tokens.md-comp-filled-tonal-button-values(),
-    $tokens
+  $supported-tokens: list.join(
+    tokens.$md-comp-filled-button-supported-tokens,
+    (
+      'container-shape-start-start',
+      'container-shape-start-end',
+      'container-shape-end-end',
+      'container-shape-end-start'
+    )
   );
 
   @each $token, $value in $tokens {
-    --md-tonal-button-#{$token}: #{$value};
+    @if list.index($supported-tokens, $token) {
+      @error 'Token `#{$token}` is not a supported token.';
+    }
+
+    @if $value {
+      --md-tonal-button-#{$token}: #{$value};
+    }
   }
 }
 
@@ -28,7 +37,25 @@
 
   :host {
     @each $token, $value in $tokens {
-      --_#{$token}: #{$value};
+      --_#{$token}: var(--md-tonal-button-#{$token}, #{$value});
     }
+
+    // Support logical shape properties
+    --_container-shape-start-start: var(
+      --md-tonal-button-container-shape-start-start,
+      var(--_container-shape)
+    );
+    --_container-shape-start-end: var(
+      --md-tonal-button-container-shape-start-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-end: var(
+      --md-tonal-button-container-shape-end-end,
+      var(--_container-shape)
+    );
+    --_container-shape-end-start: var(
+      --md-tonal-button-container-shape-end-start,
+      var(--_container-shape)
+    );
   }
 }
diff --git a/tokens/_md-comp-elevated-button.scss b/tokens/_md-comp-elevated-button.scss
index a4612125bf..b1239d8e7d 100644
--- a/tokens/_md-comp-elevated-button.scss
+++ b/tokens/_md-comp-elevated-button.scss
@@ -105,14 +105,5 @@ $_default: (
     )
   );
 
-  @each $token, $value in $tokens {
-    $tokens: map.set(
-      $tokens,
-      $token,
-      var(--md-elevated-button-#{$token}, #{$value})
-    );
-  }
-
-  $tokens: shape.resolve-tokens($tokens, 'container-shape');
   @return $tokens;
 }
diff --git a/tokens/_md-comp-filled-button.scss b/tokens/_md-comp-filled-button.scss
index 9f91b08803..7eb700f2ca 100644
--- a/tokens/_md-comp-filled-button.scss
+++ b/tokens/_md-comp-filled-button.scss
@@ -7,7 +7,6 @@
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../sass/shape';
 @use './md-sys-color';
 @use './md-sys-elevation';
 @use './md-sys-shape';
@@ -105,14 +104,5 @@ $_default: (
     )
   );
 
-  @each $token, $value in $tokens {
-    $tokens: map.set(
-      $tokens,
-      $token,
-      var(--md-filled-button-#{$token}, #{$value})
-    );
-  }
-
-  $tokens: shape.resolve-tokens($tokens, 'container-shape');
   @return $tokens;
 }
diff --git a/tokens/_md-comp-filled-tonal-button.scss b/tokens/_md-comp-filled-tonal-button.scss
index 0a7e58aaf0..93234dfdf1 100644
--- a/tokens/_md-comp-filled-tonal-button.scss
+++ b/tokens/_md-comp-filled-tonal-button.scss
@@ -7,7 +7,6 @@
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../sass/shape';
 @use './md-sys-color';
 @use './md-sys-elevation';
 @use './md-sys-shape';
@@ -105,15 +104,5 @@ $_default: (
     )
   );
 
-  @each $token, $value in $tokens {
-    // TODO: change to filled-tonal-button
-    $tokens: map.set(
-      $tokens,
-      $token,
-      var(--md-tonal-button-#{$token}, #{$value})
-    );
-  }
-
-  $tokens: shape.resolve-tokens($tokens, 'container-shape');
   @return $tokens;
 }
diff --git a/tokens/_md-comp-outlined-button.scss b/tokens/_md-comp-outlined-button.scss
index 715f3a113e..0f321ae607 100644
--- a/tokens/_md-comp-outlined-button.scss
+++ b/tokens/_md-comp-outlined-button.scss
@@ -7,7 +7,6 @@
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../sass/shape';
 @use './md-sys-color';
 @use './md-sys-shape';
 @use './md-sys-state';
@@ -101,14 +100,5 @@ $_default: (
     )
   );
 
-  @each $token, $value in $tokens {
-    $tokens: map.set(
-      $tokens,
-      $token,
-      var(--md-outlined-button-#{$token}, #{$value})
-    );
-  }
-
-  $tokens: shape.resolve-tokens($tokens, 'container-shape');
   @return $tokens;
 }
diff --git a/tokens/_md-comp-text-button.scss b/tokens/_md-comp-text-button.scss
index 3817d44183..aa17f26546 100644
--- a/tokens/_md-comp-text-button.scss
+++ b/tokens/_md-comp-text-button.scss
@@ -7,7 +7,6 @@
 @use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
-@use '../sass/shape';
 @use './md-sys-color';
 @use './md-sys-shape';
 @use './md-sys-state';
@@ -94,14 +93,5 @@ $_default: (
     )
   );
 
-  @each $token, $value in $tokens {
-    $tokens: map.set(
-      $tokens,
-      $token,
-      var(--md-text-button-#{$token}, #{$value})
-    );
-  }
-
-  $tokens: shape.resolve-tokens($tokens, 'container-shape');
   @return $tokens;
 }