From 5e40a1bcec29c3083403fb43bab9f68d1d534d63 Mon Sep 17 00:00:00 2001
From: Elizabeth Mitchell <lizmitchell@google.com>
Date: Fri, 26 Jan 2024 09:13:19 -0800
Subject: [PATCH] chore: create shape logical tokens in Sass component token
 files

Adds `@material/web/tokens/internal/shape` to take a shape token and create 4 logical tokens from its value.

All components' logical shape tokens are now generated by the token files themselves, rather than added in each component's styles.

PiperOrigin-RevId: 601783846
---
 button/internal/_elevated-button.scss         | 31 +------
 button/internal/_filled-button.scss           | 31 +------
 button/internal/_filled-tonal-button.scss     | 31 +------
 button/internal/_outlined-button.scss         | 31 +------
 button/internal/_text-button.scss             | 31 +------
 checkbox/internal/_checkbox.scss              | 27 +-----
 chips/internal/_assist-chip.scss              | 32 +------
 chips/internal/_filter-chip.scss              | 32 +------
 chips/internal/_input-chip.scss               | 32 +------
 chips/internal/_suggestion-chip.scss          | 32 +------
 dialog/internal/_dialog.scss                  | 38 +-------
 fab/internal/_fab-branded.scss                | 52 +----------
 fab/internal/_fab.scss                        | 77 ++-------------
 field/internal/_filled-field.scss             | 34 +------
 field/internal/_outlined-field.scss           | 20 +---
 focus/internal/_focus-ring.scss               | 24 +----
 iconbutton/internal/_filled-icon-button.scss  | 31 +------
 .../internal/_filled-tonal-icon-button.scss   | 31 +------
 .../internal/_outlined-icon-button.scss       | 31 +------
 .../_outlined-segmented-button-set.scss       | 23 +----
 select/internal/_filled-select.scss           | 58 +-----------
 select/internal/_outlined-select.scss         | 31 +------
 switch/internal/_switch.scss                  | 50 +---------
 tabs/internal/_primary-tab.scss               | 32 +------
 tabs/internal/_secondary-tab.scss             | 32 +------
 textfield/internal/_filled-text-field.scss    | 45 +--------
 textfield/internal/_outlined-text-field.scss  | 31 +------
 tokens/_md-comp-assist-chip.scss              | 29 ++++--
 tokens/_md-comp-checkbox.scss                 | 13 +++
 tokens/_md-comp-dialog.scss                   | 16 +++-
 tokens/_md-comp-elevated-button.scss          | 29 ++++--
 tokens/_md-comp-fab-branded.scss              | 34 ++++++-
 tokens/_md-comp-fab.scss                      | 43 ++++++++-
 tokens/_md-comp-filled-button.scss            | 29 ++++--
 tokens/_md-comp-filled-field.scss             | 18 +++-
 tokens/_md-comp-filled-icon-button.scss       | 16 +++-
 tokens/_md-comp-filled-select.scss            | 19 +++-
 tokens/_md-comp-filled-text-field.scss        | 27 +++++-
 tokens/_md-comp-filled-tonal-button.scss      | 29 ++++--
 tokens/_md-comp-filled-tonal-icon-button.scss | 20 +++-
 tokens/_md-comp-filter-chip.scss              | 29 ++++--
 tokens/_md-comp-focus-ring.scss               | 18 +++-
 tokens/_md-comp-input-chip.scss               | 29 ++++--
 tokens/_md-comp-outlined-button.scss          | 29 ++++--
 tokens/_md-comp-outlined-field.scss           | 18 +++-
 tokens/_md-comp-outlined-icon-button.scss     | 20 +++-
 .../_md-comp-outlined-segmented-button.scss   | 20 +++-
 tokens/_md-comp-outlined-select.scss          | 22 ++++-
 tokens/_md-comp-outlined-text-field.scss      | 27 +++++-
 tokens/_md-comp-primary-tab.scss              | 13 +++
 tokens/_md-comp-secondary-tab.scss            | 13 +++
 tokens/_md-comp-suggestion-chip.scss          | 29 ++++--
 tokens/_md-comp-switch.scss                   | 28 +++++-
 tokens/_md-comp-text-button.scss              | 29 ++++--
 tokens/internal/_shape.scss                   | 93 +++++++++++++++++++
 55 files changed, 753 insertions(+), 936 deletions(-)
 create mode 100644 tokens/internal/_shape.scss

diff --git a/button/internal/_elevated-button.scss b/button/internal/_elevated-button.scss
index 6fd6fbccb..fd69a05b2 100644
--- a/button/internal/_elevated-button.scss
+++ b/button/internal/_elevated-button.scss
@@ -12,16 +12,7 @@
 // go/keep-sorted end
 
 @mixin theme($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'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-elevated-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -39,26 +30,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$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/internal/_filled-button.scss b/button/internal/_filled-button.scss
index 63278e82f..3ba5d6303 100644
--- a/button/internal/_filled-button.scss
+++ b/button/internal/_filled-button.scss
@@ -12,16 +12,7 @@
 // go/keep-sorted end
 
 @mixin theme($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'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-filled-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -39,26 +30,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$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/internal/_filled-tonal-button.scss b/button/internal/_filled-tonal-button.scss
index 95db46bba..ec222fffc 100644
--- a/button/internal/_filled-tonal-button.scss
+++ b/button/internal/_filled-tonal-button.scss
@@ -12,16 +12,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-filled-tonal-button-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-filled-tonal-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -39,26 +30,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-filled-tonal-button-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-filled-tonal-button-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-filled-tonal-button-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-filled-tonal-button-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 }
diff --git a/button/internal/_outlined-button.scss b/button/internal/_outlined-button.scss
index f9405a921..0cf7e0bcc 100644
--- a/button/internal/_outlined-button.scss
+++ b/button/internal/_outlined-button.scss
@@ -12,16 +12,7 @@
 // go/keep-sorted end
 
 @mixin theme($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'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-outlined-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -39,6 +30,8 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
@@ -46,24 +39,6 @@
     --_container-color: none;
     --_disabled-container-color: none;
     --_disabled-container-opacity: 0;
-
-    // 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)
-    );
   }
 
   .outline {
diff --git a/button/internal/_text-button.scss b/button/internal/_text-button.scss
index 5a3c84623..31a1eed25 100644
--- a/button/internal/_text-button.scss
+++ b/button/internal/_text-button.scss
@@ -12,16 +12,7 @@
 // go/keep-sorted end
 
 @mixin theme($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'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-text-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -39,6 +30,8 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
@@ -46,23 +39,5 @@
     --_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/checkbox/internal/_checkbox.scss b/checkbox/internal/_checkbox.scss
index 99752b200..71d039de7 100644
--- a/checkbox/internal/_checkbox.scss
+++ b/checkbox/internal/_checkbox.scss
@@ -25,16 +25,7 @@ $_indeterminate-bottom-left: 4px, -10px;
 $_checkmark-bottom-left: 7px, -14px;
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-checkbox-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: $md-comp-checkbox-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -51,22 +42,6 @@ $_checkmark-bottom-left: 7px, -14px;
     $exclude-custom-properties: false,
   );
 
-  // Support logical shape properties
-  $container-shape: map.get($tokens, 'container-shape');
-  $tokens: map.merge(
-    $tokens,
-    (
-      'container-shape-start-start':
-        var(--md-checkbox-container-shape-start-start, #{$container-shape}),
-      'container-shape-start-end':
-        var(--md-checkbox-container-shape-start-end, #{$container-shape}),
-      'container-shape-end-end':
-        var(--md-checkbox-container-shape-end-end, #{$container-shape}),
-      'container-shape-end-start':
-        var(--md-checkbox-container-shape-end-start, #{$container-shape}),
-    )
-  );
-
   :host {
     border-start-start-radius: map.get($tokens, 'container-shape-start-start');
     border-start-end-radius: map.get($tokens, 'container-shape-start-end');
diff --git a/chips/internal/_assist-chip.scss b/chips/internal/_assist-chip.scss
index aaff2a369..9578aa629 100644
--- a/chips/internal/_assist-chip.scss
+++ b/chips/internal/_assist-chip.scss
@@ -5,22 +5,14 @@
 
 // go/keep-sorted start
 @use 'sass:list';
+@use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-assist-chip-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-assist-chip-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -38,27 +30,11 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-assist-chip-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-assist-chip-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-assist-chip-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-assist-chip-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   @media (forced-colors: active) {
diff --git a/chips/internal/_filter-chip.scss b/chips/internal/_filter-chip.scss
index 279836c2e..8aa14374b 100644
--- a/chips/internal/_filter-chip.scss
+++ b/chips/internal/_filter-chip.scss
@@ -5,22 +5,14 @@
 
 // go/keep-sorted start
 @use 'sass:list';
+@use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-filter-chip-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-filter-chip-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -38,27 +30,11 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-filter-chip-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-filter-chip-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-filter-chip-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-filter-chip-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   .selected.elevated::before {
diff --git a/chips/internal/_input-chip.scss b/chips/internal/_input-chip.scss
index e78bf7078..96933f231 100644
--- a/chips/internal/_input-chip.scss
+++ b/chips/internal/_input-chip.scss
@@ -5,22 +5,14 @@
 
 // go/keep-sorted start
 @use 'sass:list';
+@use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-input-chip-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-input-chip-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -38,27 +30,11 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-input-chip-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-input-chip-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-input-chip-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-input-chip-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   :host([avatar]) {
diff --git a/chips/internal/_suggestion-chip.scss b/chips/internal/_suggestion-chip.scss
index 49f874877..1d5514fb8 100644
--- a/chips/internal/_suggestion-chip.scss
+++ b/chips/internal/_suggestion-chip.scss
@@ -5,22 +5,14 @@
 
 // go/keep-sorted start
 @use 'sass:list';
+@use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-suggestion-chip-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-suggestion-chip-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -38,27 +30,11 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-suggestion-chip-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-suggestion-chip-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-suggestion-chip-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-suggestion-chip-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   @media (forced-colors: active) {
diff --git a/dialog/internal/_dialog.scss b/dialog/internal/_dialog.scss
index 3f5bce42f..f1a5365f9 100644
--- a/dialog/internal/_dialog.scss
+++ b/dialog/internal/_dialog.scss
@@ -12,16 +12,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-dialog-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-dialog-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -40,33 +31,6 @@
     $exclude-custom-properties: false,
   );
 
-  // Support logical shape properties
-  $tokens: map.merge(
-    $tokens,
-    (
-      'container-shape-start-start':
-        var(
-          --md-dialog-container-shape-start-start,
-          map.get($tokens, 'container-shape')
-        ),
-      'container-shape-start-end':
-        var(
-          --md-dialog-container-shape-start-end,
-          map.get($tokens, 'container-shape')
-        ),
-      'container-shape-end-end':
-        var(
-          --md-dialog-container-shape-end-end,
-          map.get($tokens, 'container-shape')
-        ),
-      'container-shape-end-start':
-        var(
-          --md-dialog-container-shape-end-start,
-          map.get($tokens, 'container-shape')
-        ),
-    )
-  );
-
   :host {
     border-start-start-radius: map.get($tokens, 'container-shape-start-start');
     border-start-end-radius: map.get($tokens, 'container-shape-start-end');
diff --git a/fab/internal/_fab-branded.scss b/fab/internal/_fab-branded.scss
index d5ab34e14..7efd1ffd8 100644
--- a/fab/internal/_fab-branded.scss
+++ b/fab/internal/_fab-branded.scss
@@ -5,26 +5,14 @@
 
 // go/keep-sorted start
 @use 'sass:list';
+@use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-fab-branded-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start',
-      'large-container-shape-start-start',
-      'large-container-shape-start-end',
-      'large-container-shape-end-end',
-      'large-container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-fab-branded-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -42,42 +30,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape', 'large-container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-fab-branded-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-fab-branded-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-fab-branded-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-fab-branded-container-shape-end-start,
-      var(--_container-shape)
-    );
-    --_large-container-shape-start-start: var(
-      --md-fab-branded-large-container-shape-start-start,
-      var(--_large-container-shape)
-    );
-    --_large-container-shape-start-end: var(
-      --md-fab-branded-large-container-shape-start-end,
-      var(--_large-container-shape)
-    );
-    --_large-container-shape-end-end: var(
-      --md-fab-branded-large-container-shape-end-end,
-      var(--_large-container-shape)
-    );
-    --_large-container-shape-end-start: var(
-      --md-fab-branded-large-container-shape-end-start,
-      var(--_large-container-shape)
-    );
   }
 }
diff --git a/fab/internal/_fab.scss b/fab/internal/_fab.scss
index 1359fb37a..eb4357609 100644
--- a/fab/internal/_fab.scss
+++ b/fab/internal/_fab.scss
@@ -14,24 +14,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-fab-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start',
-      'large-container-shape-start-start',
-      'large-container-shape-start-end',
-      'large-container-shape-end-end',
-      'large-container-shape-end-start',
-      'small-container-shape-start-start',
-      'small-container-shape-start-end',
-      'small-container-shape-end-end',
-      'small-container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: ltokens.$md-comp-fab-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -49,60 +32,18 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove(
+      $tokens,
+      'container-shape',
+      'large-container-shape',
+      'small-container-shape'
+    );
+
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
 
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-fab-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-fab-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-fab-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-fab-container-shape-end-start,
-      var(--_container-shape)
-    );
-    --_large-container-shape-start-start: var(
-      --md-fab-large-container-shape-start-start,
-      var(--_large-container-shape)
-    );
-    --_large-container-shape-start-end: var(
-      --md-fab-large-container-shape-start-end,
-      var(--_large-container-shape)
-    );
-    --_large-container-shape-end-end: var(
-      --md-fab-large-container-shape-end-end,
-      var(--_large-container-shape)
-    );
-    --_large-container-shape-end-start: var(
-      --md-fab-large-container-shape-end-start,
-      var(--_large-container-shape)
-    );
-    --_small-container-shape-start-start: var(
-      --md-fab-small-container-shape-start-start,
-      var(--_small-container-shape)
-    );
-    --_small-container-shape-start-end: var(
-      --md-fab-small-container-shape-start-end,
-      var(--_small-container-shape)
-    );
-    --_small-container-shape-end-end: var(
-      --md-fab-small-container-shape-end-end,
-      var(--_small-container-shape)
-    );
-    --_small-container-shape-end-start: var(
-      --md-fab-small-container-shape-end-start,
-      var(--_small-container-shape)
-    );
-
     cursor: pointer;
   }
 
diff --git a/field/internal/_filled-field.scss b/field/internal/_filled-field.scss
index fffecccfb..6a2e13298 100644
--- a/field/internal/_filled-field.scss
+++ b/field/internal/_filled-field.scss
@@ -47,38 +47,10 @@ $_md-sys-motion: tokens.md-sys-motion-values();
 
   @layer styles {
     :host {
+      // Only use the logical properties.
+      $tokens: map.remove($tokens, 'container-shape');
       @each $token, $value in $tokens {
-        @if $token == 'container-shape' {
-          // Support logical shape properties. Filled field has a default oblong
-          // shape, which is why the fallback value is unique per corner.
-
-          // Get the raw value without the container-shape custom property.
-          $value: map.get(
-            tokens.md-comp-filled-field-values(
-              $exclude-custom-properties: true,
-            ),
-            'container-shape'
-          );
-
-          --_container-shape-start-start: var(
-            --md-filled-field-container-shape-start-start,
-            var(--md-filled-field-container-shape, #{list.nth($value, 1)})
-          );
-          --_container-shape-start-end: var(
-            --md-filled-field-container-shape-start-end,
-            var(--md-filled-field-container-shape, #{list.nth($value, 2)})
-          );
-          --_container-shape-end-end: var(
-            --md-filled-field-container-shape-end-end,
-            var(--md-filled-field-container-shape, #{list.nth($value, 3)})
-          );
-          --_container-shape-end-start: var(
-            --md-filled-field-container-shape-end-start,
-            var(--md-filled-field-container-shape, #{list.nth($value, 4)})
-          );
-        } @else {
-          --_#{$token}: #{$value};
-        }
+        --_#{$token}: #{$value};
       }
     }
 
diff --git a/field/internal/_outlined-field.scss b/field/internal/_outlined-field.scss
index a3ae7b6d3..dac42d682 100644
--- a/field/internal/_outlined-field.scss
+++ b/field/internal/_outlined-field.scss
@@ -42,27 +42,11 @@ $_md-sys-motion: tokens.md-sys-motion-values();
 
   @layer styles {
     :host {
+      // Only use the logical properties.
+      $tokens: map.remove($tokens, 'container-shape');
       @each $token, $value in $tokens {
         --_#{$token}: #{$value};
       }
-
-      // Support logical shape properties
-      --_container-shape-start-start: var(
-        --md-outlined-field-container-shape-start-start,
-        var(--_container-shape)
-      );
-      --_container-shape-start-end: var(
-        --md-outlined-field-container-shape-start-end,
-        var(--_container-shape)
-      );
-      --_container-shape-end-end: var(
-        --md-outlined-field-container-shape-end-end,
-        var(--_container-shape)
-      );
-      --_container-shape-end-start: var(
-        --md-outlined-field-container-shape-end-start,
-        var(--_container-shape)
-      );
     }
 
     .outline {
diff --git a/focus/internal/_focus-ring.scss b/focus/internal/_focus-ring.scss
index ebd839634..2e23d102a 100644
--- a/focus/internal/_focus-ring.scss
+++ b/focus/internal/_focus-ring.scss
@@ -14,11 +14,7 @@
 $_md-sys-motion: tokens.md-sys-motion-values();
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-focus-ring-supported-tokens,
-    ('shape-start-start', 'shape-start-end', 'shape-end-end', 'shape-end-start')
-  );
-
+  $supported-tokens: tokens.$md-comp-focus-ring-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -41,20 +37,10 @@ $_md-sys-motion: tokens.md-sys-motion-values();
   $width: map.get($tokens, 'width');
   $inward-offset: map.get($tokens, 'inward-offset');
   $outward-offset: map.get($tokens, 'outward-offset');
-  // Support logical shape properties
-  $start-start: var(
-    --md-focus-ring-shape-start-start,
-    #{map.get($tokens, 'shape')}
-  );
-  $start-end: var(
-    --md-focus-ring-shape-start-end,
-    #{map.get($tokens, 'shape')}
-  );
-  $end-end: var(--md-focus-ring-shape-end-end, #{map.get($tokens, 'shape')});
-  $end-start: var(
-    --md-focus-ring-shape-end-start,
-    #{map.get($tokens, 'shape')}
-  );
+  $start-start: map.get($tokens, 'shape-start-start');
+  $start-end: map.get($tokens, 'shape-start-end');
+  $end-end: map.get($tokens, 'shape-end-end');
+  $end-start: map.get($tokens, 'shape-end-start');
 
   :host {
     animation-delay: 0s, calc($duration * 0.25);
diff --git a/iconbutton/internal/_filled-icon-button.scss b/iconbutton/internal/_filled-icon-button.scss
index 7acff6475..7293798c2 100644
--- a/iconbutton/internal/_filled-icon-button.scss
+++ b/iconbutton/internal/_filled-icon-button.scss
@@ -13,16 +13,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-filled-icon-button-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-filled-icon-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -40,27 +31,11 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-filled-icon-button-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-filled-icon-button-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-filled-icon-button-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-filled-icon-button-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   .icon-button {
diff --git a/iconbutton/internal/_filled-tonal-icon-button.scss b/iconbutton/internal/_filled-tonal-icon-button.scss
index 1d18b2359..e50c65b06 100644
--- a/iconbutton/internal/_filled-tonal-icon-button.scss
+++ b/iconbutton/internal/_filled-tonal-icon-button.scss
@@ -15,16 +15,7 @@
 $_custom-property-prefix: 'filled-tonal-icon-button';
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-filled-tonal-icon-button-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-filled-tonal-icon-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -42,27 +33,11 @@ $_custom-property-prefix: 'filled-tonal-icon-button';
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-filled-tonal-icon-button-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-filled-tonal-icon-button-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-filled-tonal-icon-button-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-filled-tonal-icon-button-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   .icon-button {
diff --git a/iconbutton/internal/_outlined-icon-button.scss b/iconbutton/internal/_outlined-icon-button.scss
index f07b91d63..0ecc5f4c5 100644
--- a/iconbutton/internal/_outlined-icon-button.scss
+++ b/iconbutton/internal/_outlined-icon-button.scss
@@ -14,16 +14,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-outlined-icon-button-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-outlined-icon-button-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -41,27 +32,11 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-outlined-icon-button-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-outlined-icon-button-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-outlined-icon-button-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-outlined-icon-button-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   .outlined {
diff --git a/labs/segmentedbuttonset/internal/_outlined-segmented-button-set.scss b/labs/segmentedbuttonset/internal/_outlined-segmented-button-set.scss
index a21d3f7bd..8b0dad322 100644
--- a/labs/segmentedbuttonset/internal/_outlined-segmented-button-set.scss
+++ b/labs/segmentedbuttonset/internal/_outlined-segmented-button-set.scss
@@ -3,6 +3,9 @@
 // SPDX-License-Identifier: Apache-2.0
 //
 
+// go/keep-sorted start
+@use 'sass:map';
+// go/keep-sorted end
 // go/keep-sorted start
 @use '../../../tokens';
 // go/keep-sorted end
@@ -30,26 +33,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_shape-start-start: var(
-      --md-outlined-segmented-button-shape-start-start,
-      var(--_shape)
-    );
-    --_shape-start-end: var(
-      --md-outlined-segmented-button-shape-start-end,
-      var(--_shape)
-    );
-    --_shape-end-end: var(
-      --md-outlined-segmented-button-shape-end-end,
-      var(--_shape)
-    );
-    --_shape-end-start: var(
-      --md-outlined-segmented-button-shape-end-start,
-      var(--_shape)
-    );
   }
 }
diff --git a/select/internal/_filled-select.scss b/select/internal/_filled-select.scss
index 36a822e2f..7f1a49c16 100644
--- a/select/internal/_filled-select.scss
+++ b/select/internal/_filled-select.scss
@@ -14,16 +14,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-filled-select-supported-tokens,
-    (
-      'text-field-container-shape-start-start',
-      'text-field-container-shape-start-end',
-      'text-field-container-shape-end-end',
-      'text-field-container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-filled-select-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -49,51 +40,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'text-field-container-shape');
     @each $token, $value in $tokens {
-      @if $token == 'text-field-container-shape' {
-        // Support logical shape properties. Filled text field has a default
-        // oblong shape, which is why the fallback value is unique per corner.
-
-        // Get the raw value without the text-field-container-shape custom
-        // property.
-        $value: map.get(
-          tokens.md-comp-filled-select-values(
-            $exclude-custom-properties: true,
-          ),
-          'text-field-container-shape'
-        );
-
-        --_text-field-container-shape-start-start: var(
-          --md-filled-select-text-field-container-shape-start-start,
-          var(
-            --md-filled-select-text-field-container-shape,
-            #{list.nth($value, 1)}
-          )
-        );
-        --_text-field-container-shape-start-end: var(
-          --md-filled-select-text-field-container-shape-start-end,
-          var(
-            --md-filled-select-text-field-container-shape,
-            #{list.nth($value, 2)}
-          )
-        );
-        --_text-field-container-shape-end-end: var(
-          --md-filled-select-text-field-container-shape-end-end,
-          var(
-            --md-filled-select-text-field-container-shape,
-            #{list.nth($value, 3)}
-          )
-        );
-        --_text-field-container-shape-end-start: var(
-          --md-filled-select-text-field-container-shape-end-start,
-          var(
-            --md-filled-select-text-field-container-shape,
-            #{list.nth($value, 4)}
-          )
-        );
-      } @else {
-        --_#{$token}: #{$value};
-      }
+      --_#{$token}: #{$value};
     }
 
     @include filled-field.theme(
diff --git a/select/internal/_outlined-select.scss b/select/internal/_outlined-select.scss
index 130587f10..ce937f9b7 100644
--- a/select/internal/_outlined-select.scss
+++ b/select/internal/_outlined-select.scss
@@ -14,16 +14,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-outlined-select-supported-tokens,
-    (
-      'text-field-container-shape-start-start',
-      'text-field-container-shape-start-end',
-      'text-field-container-shape-end-end',
-      'text-field-container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-outlined-select-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -41,28 +32,12 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'text-field-container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
 
-    // Support logical shape properties
-    --_text-field-container-shape-start-start: var(
-      --md-outlined-select-text-field-container-shape-start-start,
-      var(--_text-field-container-shape)
-    );
-    --_text-field-container-shape-start-end: var(
-      --md-outlined-select-text-field-container-shape-start-end,
-      var(--_text-field-container-shape)
-    );
-    --_text-field-container-shape-end-end: var(
-      --md-outlined-select-text-field-container-shape-end-end,
-      var(--_text-field-container-shape)
-    );
-    --_text-field-container-shape-end-start: var(
-      --md-outlined-select-text-field-container-shape-end-start,
-      var(--_text-field-container-shape)
-    );
-
     @include outlined-field.theme(
       (
         // go/keep-sorted start
diff --git a/switch/internal/_switch.scss b/switch/internal/_switch.scss
index c3589767d..4148fd585 100644
--- a/switch/internal/_switch.scss
+++ b/switch/internal/_switch.scss
@@ -16,20 +16,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-switch-supported-tokens,
-    (
-      'handle-shape-start-start',
-      'handle-shape-start-end',
-      'handle-shape-end-end',
-      'handle-shape-end-start',
-      'track-shape-start-start',
-      'track-shape-start-end',
-      'track-shape-end-end',
-      'track-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-switch-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -46,41 +33,6 @@
     $exclude-custom-properties: false,
   );
 
-  // Support logical shape properties
-  $tokens: map.merge(
-    $tokens,
-    (
-      'handle-shape-start-start':
-        var(
-          --md-switch-handle-shape-start-start,
-          map.get($tokens, 'handle-shape')
-        ),
-      'handle-shape-start-end':
-        var(
-          --md-switch-handle-shape-start-end,
-          map.get($tokens, 'handle-shape')
-        ),
-      'handle-shape-end-end':
-        var(--md-switch-handle-shape-end-end, map.get($tokens, 'handle-shape')),
-      'handle-shape-end-start':
-        var(
-          --md-switch-handle-shape-end-start,
-          map.get($tokens, 'handle-shape')
-        ),
-      'track-shape-start-start':
-        var(
-          --md-switch-track-shape-start-start,
-          map.get($tokens, 'track-shape')
-        ),
-      'track-shape-start-end':
-        var(--md-switch-track-shape-start-end, map.get($tokens, 'track-shape')),
-      'track-shape-end-end':
-        var(--md-switch-track-shape-end-end, map.get($tokens, 'track-shape')),
-      'track-shape-end-start':
-        var(--md-switch-track-shape-end-start, map.get($tokens, 'track-shape')),
-    )
-  );
-
   @layer styles, hcm;
   @layer styles {
     :host {
diff --git a/tabs/internal/_primary-tab.scss b/tabs/internal/_primary-tab.scss
index 2906242a1..e4006784c 100644
--- a/tabs/internal/_primary-tab.scss
+++ b/tabs/internal/_primary-tab.scss
@@ -5,22 +5,14 @@
 
 // go/keep-sorted start
 @use 'sass:list';
+@use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-primary-tab-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-primary-tab-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -38,27 +30,11 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-primary-tab-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-primary-tab-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-primary-tab-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-primary-tab-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 
   .content.stacked {
diff --git a/tabs/internal/_secondary-tab.scss b/tabs/internal/_secondary-tab.scss
index aa1801ab9..1d4970c7a 100644
--- a/tabs/internal/_secondary-tab.scss
+++ b/tabs/internal/_secondary-tab.scss
@@ -5,22 +5,14 @@
 
 // go/keep-sorted start
 @use 'sass:list';
+@use 'sass:map';
 // go/keep-sorted end
 // go/keep-sorted start
 @use '../../tokens';
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-secondary-tab-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-secondary-tab-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -38,26 +30,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-secondary-tab-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-secondary-tab-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-secondary-tab-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-secondary-tab-container-shape-end-start,
-      var(--_container-shape)
-    );
   }
 }
diff --git a/textfield/internal/_filled-text-field.scss b/textfield/internal/_filled-text-field.scss
index ad872b5e0..b9bfc6155 100644
--- a/textfield/internal/_filled-text-field.scss
+++ b/textfield/internal/_filled-text-field.scss
@@ -14,16 +14,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-filled-text-field-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-filled-text-field-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -45,38 +36,10 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
-      @if $token == 'container-shape' {
-        // Support logical shape properties. Filled text field has a default
-        // oblong shape, which is why the fallback value is unique per corner.
-
-        // Get the raw value without the container-shape custom property.
-        $value: map.get(
-          tokens.md-comp-filled-text-field-values(
-            $exclude-custom-properties: true,
-          ),
-          'container-shape'
-        );
-
-        --_container-shape-start-start: var(
-          --md-filled-text-field-container-shape-start-start,
-          var(--md-filled-text-field-container-shape, #{list.nth($value, 1)})
-        );
-        --_container-shape-start-end: var(
-          --md-filled-text-field-container-shape-start-end,
-          var(--md-filled-text-field-container-shape, #{list.nth($value, 2)})
-        );
-        --_container-shape-end-end: var(
-          --md-filled-text-field-container-shape-end-end,
-          var(--md-filled-text-field-container-shape, #{list.nth($value, 3)})
-        );
-        --_container-shape-end-start: var(
-          --md-filled-text-field-container-shape-end-start,
-          var(--md-filled-text-field-container-shape, #{list.nth($value, 4)})
-        );
-      } @else {
-        --_#{$token}: #{$value};
-      }
+      --_#{$token}: #{$value};
     }
 
     @include filled-field.theme(
diff --git a/textfield/internal/_outlined-text-field.scss b/textfield/internal/_outlined-text-field.scss
index 193f1fe97..3e1418357 100644
--- a/textfield/internal/_outlined-text-field.scss
+++ b/textfield/internal/_outlined-text-field.scss
@@ -13,16 +13,7 @@
 // go/keep-sorted end
 
 @mixin theme($tokens) {
-  $supported-tokens: list.join(
-    tokens.$md-comp-outlined-text-field-supported-tokens,
-    (
-      'container-shape-start-start',
-      'container-shape-start-end',
-      'container-shape-end-end',
-      'container-shape-end-start'
-    )
-  );
-
+  $supported-tokens: tokens.$md-comp-outlined-text-field-supported-tokens;
   @each $token, $value in $tokens {
     @if list.index($supported-tokens, $token) == null {
       @error 'Token `#{$token}` is not a supported token.';
@@ -40,28 +31,12 @@
   );
 
   :host {
+    // Only use the logical properties.
+    $tokens: map.remove($tokens, 'container-shape');
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
 
-    // Support logical shape properties
-    --_container-shape-start-start: var(
-      --md-outlined-text-field-container-shape-start-start,
-      var(--_container-shape)
-    );
-    --_container-shape-start-end: var(
-      --md-outlined-text-field-container-shape-start-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-end: var(
-      --md-outlined-text-field-container-shape-end-end,
-      var(--_container-shape)
-    );
-    --_container-shape-end-start: var(
-      --md-outlined-text-field-container-shape-end-start,
-      var(--_container-shape)
-    );
-
     @include outlined-field.theme(
       (
         // go/keep-sorted start
diff --git a/tokens/_md-comp-assist-chip.scss b/tokens/_md-comp-assist-chip.scss
index 3c8b91896..cd17a95ff 100644
--- a/tokens/_md-comp-assist-chip.scss
+++ b/tokens/_md-comp-assist-chip.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -20,6 +22,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-label-text-color',
   'disabled-label-text-opacity',
   'disabled-leading-icon-color',
@@ -90,17 +96,23 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-assist-chip.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-assist-chip.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       'leading-space': if($exclude-hardcoded-values, null, 16px),
       'trailing-space': if($exclude-hardcoded-values, null, 16px),
       'icon-label-space': if($exclude-hardcoded-values, null, 8px),
       'with-leading-icon-leading-space':
         if($exclude-hardcoded-values, null, 8px),
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "flat-*" prefix (b/275577569)
       'flat-container-elevation': 'container-elevation',
@@ -126,6 +138,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-assist-chip-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-checkbox.scss b/tokens/_md-comp-checkbox.scss
index 4bed53476..5133446dd 100644
--- a/tokens/_md-comp-checkbox.scss
+++ b/tokens/_md-comp-checkbox.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -17,6 +19,10 @@
 $supported-tokens: (
   // go/keep-sorted start
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'container-size',
   'disabled-container-opacity',
   'disabled-outline-color',
@@ -98,11 +104,13 @@ $_default: (
   $exclude-custom-properties: true
 ) {
   $tokens: md-comp-checkbox.values($deps, $exclude-hardcoded-values);
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
 
   $tokens: validate.values(
     $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove default "unselected" prefix (b/292244480)
       'unselected-disabled-container-opacity': 'disabled-container-opacity',
@@ -133,6 +141,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-checkbox-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-dialog.scss b/tokens/_md-comp-dialog.scss
index 6bea1119a..866fa5870 100644
--- a/tokens/_md-comp-dialog.scss
+++ b/tokens/_md-comp-dialog.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -20,6 +22,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'container-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'headline-color',
   'headline-font',
   'headline-line-height',
@@ -77,10 +83,13 @@ $unsupported-tokens: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-dialog.values($deps, $exclude-hardcoded-values);
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
   $tokens: validate.values(
-    md-comp-dialog.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "with-*" prefixes (b/273534858)
       'with-icon-icon-color': 'icon-color',
@@ -92,6 +101,11 @@ $unsupported-tokens: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-dialog-container-shape, #{$value});
+      }
+
       $tokens: map.set($tokens, $token, var(--md-dialog-#{$token}, #{$value}));
     }
   }
diff --git a/tokens/_md-comp-elevated-button.scss b/tokens/_md-comp-elevated-button.scss
index b1a7071d0..ed0b3e887 100644
--- a/tokens/_md-comp-elevated-button.scss
+++ b/tokens/_md-comp-elevated-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -23,6 +25,10 @@ $supported-tokens: (
   'container-height',
   'container-shadow-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-container-color',
   'disabled-container-elevation',
   'disabled-container-opacity',
@@ -81,11 +87,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-elevated-button.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-elevated-button.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       // b/198759625 - Remove once spacing tokens are formally added
       // go/keep-sorted start
       'leading-space': if($exclude-hardcoded-values, null, 24px),
@@ -99,7 +104,14 @@ $_default: (
       'with-trailing-icon-trailing-space':
         if($exclude-hardcoded-values, null, 16px),
       // go/keep-sorted end
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "with-*" prefixes (b/273534858)
       'with-icon-disabled-icon-color': 'disabled-icon-color',
@@ -116,6 +128,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-elevated-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-fab-branded.scss b/tokens/_md-comp-fab-branded.scss
index 2ed3a6894..92d1073fa 100644
--- a/tokens/_md-comp-fab-branded.scss
+++ b/tokens/_md-comp-fab-branded.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -25,6 +27,10 @@ $supported-tokens: (
   'container-height',
   'container-shadow-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'container-width',
   'focus-container-elevation',
   'focus-label-text-color',
@@ -40,6 +46,10 @@ $supported-tokens: (
   'label-text-weight',
   'large-container-height',
   'large-container-shape',
+  'large-container-shape-end-end',
+  'large-container-shape-end-start',
+  'large-container-shape-start-end',
+  'large-container-shape-start-start',
   'large-container-width',
   'large-icon-size',
   'lowered-container-color',
@@ -104,17 +114,37 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-fab-branded.values($deps, $exclude-hardcoded-values);
+  $new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    $new-tokens,
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape')
+  );
+
+  $new-tokens: map.merge(
+    $new-tokens,
+    shape.get-new-logical-shape-tokens($new-tokens, 'large-container-shape')
+  );
+
   $tokens: validate.values(
-    md-comp-fab-branded.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values)
+    $new-tokens: $new-tokens
   );
 
   // Default to `$exclude-custom-properties: false` in the next breaking change.
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      $shape-tokens: ('container-shape', 'large-container-shape');
+      @each $shape-token in $shape-tokens {
+        @if string.index($token, '#{$shape-token}-') == 1 {
+          // Add fallback to shorthand for logical shape properties.
+          $value: var(--md-fab-branded-#{$shape-token}, #{$value});
+        }
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-fab.scss b/tokens/_md-comp-fab.scss
index 3d7e7dbc7..4f1a008e2 100644
--- a/tokens/_md-comp-fab.scss
+++ b/tokens/_md-comp-fab.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -32,6 +34,10 @@ $supported-tokens: (
   'container-height',
   'container-shadow-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'container-width',
   'focus-container-elevation',
   'focus-icon-color',
@@ -50,6 +56,10 @@ $supported-tokens: (
   'label-text-weight',
   'large-container-height',
   'large-container-shape',
+  'large-container-shape-end-end',
+  'large-container-shape-end-start',
+  'large-container-shape-start-end',
+  'large-container-shape-start-start',
   'large-container-width',
   'large-icon-size',
   'lowered-container-color',
@@ -86,6 +96,10 @@ $supported-tokens: (
   'secondary-pressed-state-layer-color',
   'small-container-height',
   'small-container-shape',
+  'small-container-shape-end-end',
+  'small-container-shape-end-start',
+  'small-container-shape-start-end',
+  'small-container-shape-start-start',
   'small-container-width',
   'small-icon-size',
   'tertiary-container-color',
@@ -237,18 +251,45 @@ $_default: (
   $exclude-custom-properties: true
 ) {
   $tokens: md-comp-fab-surface.values($deps, $exclude-hardcoded-values);
+  $new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    $new-tokens,
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape')
+  );
+
+  $new-tokens: map.merge(
+    $new-tokens,
+    shape.get-new-logical-shape-tokens(
+      $new-tokens,
+      'large-container-shape',
+      'small-container-shape'
+    )
+  );
 
   $tokens: validate.values(
     $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values)
+    $new-tokens: $new-tokens
   );
 
   // Default to `$exclude-custom-properties: false` in the next breaking change.
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      $shape-tokens: (
+        'container-shape',
+        'large-container-shape',
+        'small-container-shape'
+      );
+
+      @each $shape-token in $shape-tokens {
+        @if string.index($token, '#{$shape-token}-') == 1 {
+          // Add fallback to shorthand for logical shape properties.
+          $value: var(--md-fab-#{$shape-token}, #{$value});
+        }
+      }
+
       $tokens: map.set($tokens, $token, var(--md-fab-#{$token}, #{$value}));
     }
   }
diff --git a/tokens/_md-comp-filled-button.scss b/tokens/_md-comp-filled-button.scss
index 2d7a9b46d..5990ced89 100644
--- a/tokens/_md-comp-filled-button.scss
+++ b/tokens/_md-comp-filled-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -23,6 +25,10 @@ $supported-tokens: (
   'container-height',
   'container-shadow-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-container-color',
   'disabled-container-elevation',
   'disabled-container-opacity',
@@ -81,11 +87,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-filled-button.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-filled-button.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       // b/198759625 - Remove once spacing tokens are formally added
       // go/keep-sorted start
       'leading-space': if($exclude-hardcoded-values, null, 24px),
@@ -99,7 +104,14 @@ $_default: (
       'with-trailing-icon-trailing-space':
         if($exclude-hardcoded-values, null, 16px),
       // go/keep-sorted end
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "with-*" prefixes (b/273534858)
       'with-icon-disabled-icon-color': 'disabled-icon-color',
@@ -116,6 +128,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filled-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-filled-field.scss b/tokens/_md-comp-filled-field.scss
index 19c49e260..7f99af8a8 100644
--- a/tokens/_md-comp-filled-field.scss
+++ b/tokens/_md-comp-filled-field.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -22,6 +24,10 @@ $supported-tokens: (
   'bottom-space',
   'container-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'content-color',
   'content-font',
   'content-line-height',
@@ -253,12 +259,22 @@ $_default: (
     // go/keep-sorted end
   );
 
-  $tokens: validate.values($tokens, $supported-tokens: $supported-tokens);
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $new-tokens: $new-tokens
+  );
 
   // Default to `$exclude-custom-properties: false` in the next breaking change.
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filled-field-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-filled-icon-button.scss b/tokens/_md-comp-filled-icon-button.scss
index f3b3caad9..66c19571f 100644
--- a/tokens/_md-comp-filled-icon-button.scss
+++ b/tokens/_md-comp-filled-icon-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -19,6 +21,10 @@ $supported-tokens: (
   'container-color',
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'container-width',
   'disabled-container-color',
   'disabled-container-opacity',
@@ -72,10 +78,13 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-filled-icon-button.values($deps, $exclude-hardcoded-values);
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
   $tokens: validate.values(
-    md-comp-filled-icon-button.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // TODO(b/292244480): remove default unselected prefix
       'toggle-unselected-focus-icon-color': 'toggle-focus-icon-color',
@@ -95,6 +104,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filled-icon-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-filled-select.scss b/tokens/_md-comp-filled-select.scss
index 04e2379d9..c8dd9efec 100644
--- a/tokens/_md-comp-filled-select.scss
+++ b/tokens/_md-comp-filled-select.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -22,6 +24,10 @@ $supported-tokens: (
   'text-field-active-indicator-height',
   'text-field-container-color',
   'text-field-container-shape',
+  'text-field-container-shape-end-end',
+  'text-field-container-shape-end-start',
+  'text-field-container-shape-start-end',
+  'text-field-container-shape-start-start',
   'text-field-disabled-active-indicator-color',
   'text-field-disabled-active-indicator-height',
   'text-field-disabled-active-indicator-opacity',
@@ -163,16 +169,27 @@ $_default: (
     $original-tokens,
     _get-override-tokens($exclude-hardcoded-values)
   );
+  $new-tokens: shape.get-new-logical-shape-tokens(
+    $original-tokens,
+    'text-field-container-shape'
+  );
+
   $tokens: validate.values(
     $original-tokens,
     $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens
   );
 
   // Default to `$exclude-custom-properties: false` in the next breaking change.
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'text-field-container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filled-select-text-field-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-filled-text-field.scss b/tokens/_md-comp-filled-text-field.scss
index aa7db4ca3..c47199fd9 100644
--- a/tokens/_md-comp-filled-text-field.scss
+++ b/tokens/_md-comp-filled-text-field.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -23,6 +25,10 @@ $supported-tokens: (
   'caret-color',
   'container-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-active-indicator-color',
   'disabled-active-indicator-height',
   'disabled-active-indicator-opacity',
@@ -133,11 +139,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-filled-text-field.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-filled-text-field.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       'leading-space': if($exclude-hardcoded-values, null, 16px),
       'trailing-space': if($exclude-hardcoded-values, null, 16px),
       'top-space': if($exclude-hardcoded-values, null, 16px),
@@ -153,6 +158,13 @@ $_default: (
     )
   );
 
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens
+  );
+
   $tokens: map.merge(
     $tokens,
     (
@@ -165,6 +177,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filled-text-field-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-filled-tonal-button.scss b/tokens/_md-comp-filled-tonal-button.scss
index 860f0b764..73280d067 100644
--- a/tokens/_md-comp-filled-tonal-button.scss
+++ b/tokens/_md-comp-filled-tonal-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -23,6 +25,10 @@ $supported-tokens: (
   'container-height',
   'container-shadow-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-container-color',
   'disabled-container-elevation',
   'disabled-container-opacity',
@@ -81,11 +87,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-filled-tonal-button.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-filled-tonal-button.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       // b/198759625 - Remove once spacing tokens are formally added
       // go/keep-sorted start
       'leading-space': if($exclude-hardcoded-values, null, 24px),
@@ -99,7 +104,14 @@ $_default: (
       'with-trailing-icon-trailing-space':
         if($exclude-hardcoded-values, null, 16px),
       // go/keep-sorted end
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "with-*" prefixes (b/273534858)
       'with-icon-disabled-icon-color': 'disabled-icon-color',
@@ -116,6 +128,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filled-tonal-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-filled-tonal-icon-button.scss b/tokens/_md-comp-filled-tonal-icon-button.scss
index 653076328..34ac041ab 100644
--- a/tokens/_md-comp-filled-tonal-icon-button.scss
+++ b/tokens/_md-comp-filled-tonal-icon-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -19,6 +21,10 @@ $supported-tokens: (
   'container-color',
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'container-width',
   'disabled-container-color',
   'disabled-container-opacity',
@@ -72,10 +78,17 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-filled-tonal-icon-button.values(
+    $deps,
+    $exclude-hardcoded-values
+  );
+
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
   $tokens: validate.values(
-    md-comp-filled-tonal-icon-button.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // TODO(b/292244480): remove default unselected prefix
       'toggle-unselected-focus-icon-color': 'toggle-focus-icon-color',
@@ -95,6 +108,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filled-tonal-icon-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-filter-chip.scss b/tokens/_md-comp-filter-chip.scss
index 15c86fd99..a612e4856 100644
--- a/tokens/_md-comp-filter-chip.scss
+++ b/tokens/_md-comp-filter-chip.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -20,6 +22,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-label-text-color',
   'disabled-label-text-opacity',
   'disabled-leading-icon-color',
@@ -132,11 +138,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-filter-chip.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-filter-chip.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       'leading-space': if($exclude-hardcoded-values, null, 16px),
       'trailing-space': if($exclude-hardcoded-values, null, 16px),
       'icon-label-space': if($exclude-hardcoded-values, null, 8px),
@@ -144,7 +149,14 @@ $_default: (
         if($exclude-hardcoded-values, null, 8px),
       'with-trailing-icon-trailing-space':
         if($exclude-hardcoded-values, null, 8px),
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "unselected-*" and "flat-*" prefix (b/275577569)
       'elevated-unselected-container-color': 'elevated-container-color',
@@ -238,6 +250,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-filter-chip-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-focus-ring.scss b/tokens/_md-comp-focus-ring.scss
index 4f8e761e2..5e87f29d3 100644
--- a/tokens/_md-comp-focus-ring.scss
+++ b/tokens/_md-comp-focus-ring.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-motion';
@@ -21,6 +23,10 @@ $supported-tokens: (
   'inward-offset',
   'outward-offset',
   'shape',
+  'shape-end-end',
+  'shape-end-start',
+  'shape-start-end',
+  'shape-start-start',
   'width',
   // go/keep-sorted end
 );
@@ -46,12 +52,22 @@ $_default: (
     'width': if($exclude-hardcoded-values, null, 3px),
   );
 
-  $tokens: validate.values($tokens, $supported-tokens: $supported-tokens);
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'shape');
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $new-tokens: $new-tokens
+  );
 
   // Default to `$exclude-custom-properties: false` in the next breaking change.
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-focus-ring-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-input-chip.scss b/tokens/_md-comp-input-chip.scss
index 30905177d..d24d49f9f 100644
--- a/tokens/_md-comp-input-chip.scss
+++ b/tokens/_md-comp-input-chip.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -22,6 +24,10 @@ $supported-tokens: (
   'avatar-size',
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-avatar-opacity',
   'disabled-label-text-color',
   'disabled-label-text-opacity',
@@ -120,11 +126,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-input-chip.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-input-chip.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       'leading-space': if($exclude-hardcoded-values, null, 16px),
       'trailing-space': if($exclude-hardcoded-values, null, 16px),
       'icon-label-space': if($exclude-hardcoded-values, null, 8px),
@@ -132,7 +137,14 @@ $_default: (
         if($exclude-hardcoded-values, null, 8px),
       'with-trailing-icon-trailing-space':
         if($exclude-hardcoded-values, null, 8px),
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "unselected-*" prefix (b/275577569)
       'disabled-unselected-outline-color': 'disabled-outline-color',
@@ -220,6 +232,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-input-chip-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-outlined-button.scss b/tokens/_md-comp-outlined-button.scss
index 2602d20a4..6cb8da3e2 100644
--- a/tokens/_md-comp-outlined-button.scss
+++ b/tokens/_md-comp-outlined-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -19,6 +21,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-icon-color',
   'disabled-icon-opacity',
   'disabled-label-text-color',
@@ -77,11 +83,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-outlined-button.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-outlined-button.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       // b/198759625 - Remove once spacing tokens are formally added
       // go/keep-sorted start
       'leading-space': if($exclude-hardcoded-values, null, 24px),
@@ -95,7 +100,14 @@ $_default: (
       'with-trailing-icon-trailing-space':
         if($exclude-hardcoded-values, null, 16px),
       // go/keep-sorted end
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "with-*" prefixes (b/273534858)
       'with-icon-disabled-icon-color': 'disabled-icon-color',
@@ -112,6 +124,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-outlined-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-outlined-field.scss b/tokens/_md-comp-outlined-field.scss
index ecc1e369e..d912cbf83 100644
--- a/tokens/_md-comp-outlined-field.scss
+++ b/tokens/_md-comp-outlined-field.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -19,6 +21,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'bottom-space',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'content-color',
   'content-font',
   'content-line-height',
@@ -228,12 +234,22 @@ $_default: (
     // go/keep-sorted end
   );
 
-  $tokens: validate.values($tokens, $supported-tokens: $supported-tokens);
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $new-tokens: $new-tokens
+  );
 
   // Default to `$exclude-custom-properties: false` in the next breaking change.
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-outlined-field-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-outlined-icon-button.scss b/tokens/_md-comp-outlined-icon-button.scss
index e8ab66b0e..7c92f21ad 100644
--- a/tokens/_md-comp-outlined-icon-button.scss
+++ b/tokens/_md-comp-outlined-icon-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -18,6 +20,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'container-width',
   'disabled-icon-color',
   'disabled-icon-opacity',
@@ -65,10 +71,17 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-outlined-icon-button.values(
+    $deps,
+    $exclude-hardcoded-values
+  );
+
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
   $tokens: validate.values(
-    md-comp-outlined-icon-button.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // TODO(b/292244480): remove default unselected prefix
       'disabled-unselected-outline-color': 'disabled-outline-color',
@@ -89,6 +102,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-outlined-icon-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-outlined-segmented-button.scss b/tokens/_md-comp-outlined-segmented-button.scss
index 50f7f6fad..6fe54ff9e 100644
--- a/tokens/_md-comp-outlined-segmented-button.scss
+++ b/tokens/_md-comp-outlined-segmented-button.scss
@@ -4,8 +4,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -40,6 +42,10 @@ $supported-tokens: (
   'selected-pressed-label-text-color',
   'selected-pressed-state-layer-color',
   'shape',
+  'shape-end-end',
+  'shape-end-start',
+  'shape-start-end',
+  'shape-start-start',
   'unselected-focus-icon-color',
   'unselected-focus-label-text-color',
   'unselected-hover-icon-color',
@@ -79,10 +85,17 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-outlined-segmented-button.values(
+    $deps,
+    $exclude-hardcoded-values
+  );
+
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'shape');
   $tokens: validate.values(
-    md-comp-outlined-segmented-button.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "with-*" prefixes (b/273534858)
       'with-icon-icon-size': 'icon-size',
@@ -95,6 +108,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-outlined-segmented-button-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-outlined-select.scss b/tokens/_md-comp-outlined-select.scss
index 232a283b6..1b5224ed6 100644
--- a/tokens/_md-comp-outlined-select.scss
+++ b/tokens/_md-comp-outlined-select.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -19,6 +21,10 @@
 $supported-tokens: (
   // go/keep-sorted start
   'text-field-container-shape',
+  'text-field-container-shape-end-end',
+  'text-field-container-shape-end-start',
+  'text-field-container-shape-start-end',
+  'text-field-container-shape-start-start',
   'text-field-disabled-input-text-color',
   'text-field-disabled-input-text-opacity',
   'text-field-disabled-label-text-color',
@@ -140,10 +146,17 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-outlined-select.values($deps, $exclude-hardcoded-values);
+  $new-tokens: shape.get-new-logical-shape-tokens(
+    $tokens,
+    'text-field-container-shape'
+  );
+
   $tokens: validate.values(
-    md-comp-outlined-select.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens
   );
 
   $tokens: map.merge(
@@ -158,6 +171,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'text-field-container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-outlined-select-text-field-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-outlined-text-field.scss b/tokens/_md-comp-outlined-text-field.scss
index 4553bf27a..20501feb7 100644
--- a/tokens/_md-comp-outlined-text-field.scss
+++ b/tokens/_md-comp-outlined-text-field.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -19,6 +21,10 @@ $supported-tokens: (
   'bottom-space',
   'caret-color',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-input-text-color',
   'disabled-input-text-opacity',
   'disabled-label-text-color',
@@ -122,11 +128,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-outlined-text-field.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-outlined-text-field.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       'leading-space': if($exclude-hardcoded-values, null, 16px),
       'trailing-space': if($exclude-hardcoded-values, null, 16px),
       'top-space': if($exclude-hardcoded-values, null, 16px),
@@ -140,6 +145,13 @@ $_default: (
     )
   );
 
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens
+  );
+
   $tokens: map.merge(
     $tokens,
     (
@@ -152,6 +164,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-outlined-text-field-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-primary-tab.scss b/tokens/_md-comp-primary-tab.scss
index afd92280d..7190a3835 100644
--- a/tokens/_md-comp-primary-tab.scss
+++ b/tokens/_md-comp-primary-tab.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -37,6 +39,10 @@ $supported-tokens: (
   'container-elevation',
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'focus-icon-color',
   'focus-label-text-color',
   'hover-icon-color',
@@ -87,10 +93,12 @@ $_default: (
     $exclude-hardcoded-values: $exclude-hardcoded-values
   );
 
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
   $tokens: validate.values(
     $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // rename inactive-
       'inactive-focus-state-layer-color': 'focus-state-layer-color',
@@ -137,6 +145,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-primary-tab-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-secondary-tab.scss b/tokens/_md-comp-secondary-tab.scss
index c82cc1eba..2cb9a15f7 100644
--- a/tokens/_md-comp-secondary-tab.scss
+++ b/tokens/_md-comp-secondary-tab.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -37,6 +39,10 @@ $supported-tokens: (
   'container-elevation',
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'focus-icon-color',
   'focus-label-text-color',
   'hover-icon-color',
@@ -86,11 +92,13 @@ $_default: (
   );
 
   $tokens: _add-missing-secondary-tokens($tokens);
+  $new-tokens: shape.get-new-logical-shape-tokens($tokens, 'container-shape');
 
   $tokens: validate.values(
     $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       'inactive-label-text-color': 'label-text-color',
       'with-icon-active-icon-color': 'active-icon-color',
@@ -106,6 +114,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-secondary-tab-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-suggestion-chip.scss b/tokens/_md-comp-suggestion-chip.scss
index f1f59d635..b682deff6 100644
--- a/tokens/_md-comp-suggestion-chip.scss
+++ b/tokens/_md-comp-suggestion-chip.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-elevation';
@@ -20,6 +22,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-label-text-color',
   'disabled-label-text-opacity',
   'disabled-leading-icon-color',
@@ -90,17 +96,23 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-suggestion-chip.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-suggestion-chip.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       'leading-space': if($exclude-hardcoded-values, null, 16px),
       'trailing-space': if($exclude-hardcoded-values, null, 16px),
       'icon-label-space': if($exclude-hardcoded-values, null, 8px),
       'with-leading-icon-leading-space':
         if($exclude-hardcoded-values, null, 8px),
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "flat-*" prefix (b/275577569)
       'flat-container-elevation': 'container-elevation',
@@ -130,6 +142,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-suggestion-chip-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/_md-comp-switch.scss b/tokens/_md-comp-switch.scss
index e47d6f7bf..ef962a502 100644
--- a/tokens/_md-comp-switch.scss
+++ b/tokens/_md-comp-switch.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -35,6 +37,10 @@ $supported-tokens: (
   'handle-color',
   'handle-height',
   'handle-shape',
+  'handle-shape-end-end',
+  'handle-shape-end-start',
+  'handle-shape-start-end',
+  'handle-shape-start-start',
   'handle-width',
   'hover-handle-color',
   'hover-icon-color',
@@ -78,6 +84,10 @@ $supported-tokens: (
   'track-outline-color',
   'track-outline-width',
   'track-shape',
+  'track-shape-end-end',
+  'track-shape-end-start',
+  'track-shape-start-end',
+  'track-shape-start-start',
   'track-width',
   'with-icon-handle-height',
   'with-icon-handle-width',
@@ -104,10 +114,18 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
+  $tokens: md-comp-switch.values($deps, $exclude-hardcoded-values);
+  $new-tokens: shape.get-new-logical-shape-tokens(
+    $tokens,
+    'handle-shape',
+    'track-shape'
+  );
+
   $tokens: validate.values(
-    md-comp-switch.values($deps, $exclude-hardcoded-values),
+    $tokens,
     $supported-tokens: $supported-tokens,
     $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove default "unselected" prefix (b/292244480)
       'disabled-unselected-handle-color': 'disabled-handle-color',
@@ -148,6 +166,14 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      $shape-tokens: ('handle-shape', 'track-shape');
+      @each $shape-token in $shape-tokens {
+        @if string.index($token, '#{$shape-token}-') == 1 {
+          // Add fallback to shorthand for logical shape properties.
+          $value: var(--md-switch-#{$shape-token}, #{$value});
+        }
+      }
+
       $tokens: map.set($tokens, $token, var(--md-switch-#{$token}, #{$value}));
     }
   }
diff --git a/tokens/_md-comp-text-button.scss b/tokens/_md-comp-text-button.scss
index f3c38d061..1f3d81026 100644
--- a/tokens/_md-comp-text-button.scss
+++ b/tokens/_md-comp-text-button.scss
@@ -5,8 +5,10 @@
 
 // go/keep-sorted start
 @use 'sass:map';
+@use 'sass:string';
 // go/keep-sorted end
 // go/keep-sorted start
+@use './internal/shape';
 @use './internal/validate';
 @use './md-sys-color';
 @use './md-sys-shape';
@@ -19,6 +21,10 @@ $supported-tokens: (
   // go/keep-sorted start
   'container-height',
   'container-shape',
+  'container-shape-end-end',
+  'container-shape-end-start',
+  'container-shape-start-end',
+  'container-shape-start-start',
   'disabled-icon-color',
   'disabled-icon-opacity',
   'disabled-label-text-color',
@@ -70,11 +76,10 @@ $_default: (
   $exclude-hardcoded-values: false,
   $exclude-custom-properties: true
 ) {
-  $tokens: validate.values(
-    md-comp-text-button.values($deps, $exclude-hardcoded-values),
-    $supported-tokens: $supported-tokens,
-    $unsupported-tokens: $unsupported-tokens,
-    $new-tokens: (
+  $tokens: md-comp-text-button.values($deps, $exclude-hardcoded-values);
+  $new-tokens: map.merge(
+    shape.get-new-logical-shape-tokens($tokens, 'container-shape'),
+    (
       // b/198759625 - Remove once spacing tokens are formally added
       // go/keep-sorted start
       'leading-space': if($exclude-hardcoded-values, null, 12px),
@@ -88,7 +93,14 @@ $_default: (
       'with-trailing-icon-trailing-space':
         if($exclude-hardcoded-values, null, 12px),
       // go/keep-sorted end
-    ),
+    )
+  );
+
+  $tokens: validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens,
+    $new-tokens: $new-tokens,
     $renamed-tokens: (
       // Remove "with-*" prefixes (b/273534858)
       'with-icon-disabled-icon-color': 'disabled-icon-color',
@@ -105,6 +117,11 @@ $_default: (
   // See b/321816473.
   @if not $exclude-custom-properties {
     @each $token, $value in $tokens {
+      @if string.index($token, 'container-shape-') == 1 {
+        // Add fallback to shorthand for logical shape properties.
+        $value: var(--md-text-button-container-shape, #{$value});
+      }
+
       $tokens: map.set(
         $tokens,
         $token,
diff --git a/tokens/internal/_shape.scss b/tokens/internal/_shape.scss
new file mode 100644
index 000000000..fec8638bf
--- /dev/null
+++ b/tokens/internal/_shape.scss
@@ -0,0 +1,93 @@
+//
+// Copyright 2024 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use 'sass:list';
+@use 'sass:map';
+@use 'sass:meta';
+// go/keep-sorted end
+
+/// Returns a map of 4 logical tokens (start-start, start-end, end-end,
+/// and end-start) for each of the given shape tokens in the provided token
+/// map.
+///
+/// @example scss
+///   $tokens: ('container-shape': 16px 16px 0px 0px);
+///   $new-tokens: shape.get-new-logical-shape-tokens(
+///     $tokens,
+///     'container-shape'
+///   );
+///   // (
+///   //   'container-shape-start-start': 16px,
+///   //   'container-shape-start-end': 16px,
+///   //   'container-shape-end-end': 0px,
+///   //   'container-shape-end-start': 0px,
+///   // )
+///
+/// @param $tokens A Map of tokens.
+/// @param $shape-tokens One or more shape tokens in the provided map. Each
+///     shape token will add 4 logical shape tokens to the returned map.
+/// @return A map with 4 logical tokens for each provided shape token.
+@function get-new-logical-shape-tokens($tokens, $shape-tokens...) {
+  $new-logical-tokens: ();
+  $logical-suffixes: (
+    // top-left
+    'start-start',
+    // top-right
+    'start-end',
+    // bottom-right
+    'end-end',
+    // bottom-left
+    'end-start'
+  );
+
+  @each $shape-token in $shape-tokens {
+    $shorthand-value: _expand-shorthand-to-list(map.get($tokens, $shape-token));
+
+    @each $logical-suffix in $logical-suffixes {
+      $logical-token: '#{$shape-token}-#{$logical-suffix}';
+      $logical-index: list.index($logical-suffixes, $logical-suffix);
+
+      $new-logical-tokens: map.set(
+        $new-logical-tokens,
+        $logical-token,
+        list.nth($shorthand-value, $logical-index)
+      );
+    }
+  }
+
+  @return $new-logical-tokens;
+}
+
+@function _expand-shorthand-to-list($shorthand) {
+  @if meta.type-of($shorthand) != 'list' or list.length($shorthand) == 1 {
+    @return ($shorthand, $shorthand, $shorthand, $shorthand);
+  }
+
+  @if list.length($shorthand) == 2 {
+    $top-left-and-bottom-right: list.nth($shorthand, 1);
+    $top-right-and-bottom-left: list.nth($shorthand, 2);
+    @return (
+      $top-left-and-bottom-right,
+      $top-right-and-bottom-left,
+      $top-left-and-bottom-right,
+      $top-right-and-bottom-left
+    );
+  }
+
+  @if list.length($shorthand) == 3 {
+    $top-left: list.nth($shorthand, 1);
+    $top-right-and-bottom-left: list.nth($shorthand, 2);
+    $bottom-right: list.nth($shorthand, 3);
+    @return (
+      $top-left,
+      $top-right-and-bottom-left,
+      $bottom-right,
+      $top-right-and-bottom-left
+    );
+  }
+
+  @return $shorthand;
+}