From b9e8fb89fa2711999619e6ae376cedd8147835c1 Mon Sep 17 00:00:00 2001
From: raajkumars <raajkumars@google.com>
Date: Mon, 7 Nov 2022 17:11:19 +0000
Subject: [PATCH] [Tokens][M3][Button] Integrate M3 Tokens.

PiperOrigin-RevId: 486679417
---
 .../m3_text_button_ripple_color_selector.xml  | 53 ++++++++++---
 .../material/button/res/values/dimens.xml     |  2 +-
 .../material/button/res/values/styles.xml     | 30 ++++----
 .../material/button/res/values/tokens.xml     | 77 +++++++++++++++++++
 4 files changed, 134 insertions(+), 28 deletions(-)
 create mode 100644 lib/java/com/google/android/material/button/res/values/tokens.xml

diff --git a/lib/java/com/google/android/material/button/res/color/m3_text_button_ripple_color_selector.xml b/lib/java/com/google/android/material/button/res/color/m3_text_button_ripple_color_selector.xml
index 9243befc5cd..2927bb1c723 100644
--- a/lib/java/com/google/android/material/button/res/color/m3_text_button_ripple_color_selector.xml
+++ b/lib/java/com/google/android/material/button/res/color/m3_text_button_ripple_color_selector.xml
@@ -16,27 +16,56 @@
 -->
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
   <!-- Uncheckable -->
-  <item android:alpha="@dimen/m3_ripple_pressed_alpha" android:color="?attr/colorOnContainer" android:state_checkable="false" android:state_pressed="true" />
-  <item android:alpha="@dimen/m3_ripple_focused_alpha" android:color="?attr/colorOnContainer" android:state_checkable="false" android:state_focused="true" />
-  <item android:alpha="@dimen/m3_ripple_hovered_alpha" android:color="?attr/colorOnContainer" android:state_checkable="false" android:state_hovered="true" />
-  <item android:alpha="@dimen/m3_ripple_default_alpha" android:color="?attr/colorOnContainer" android:state_checkable="false" />
+  <item android:alpha="@dimen/m3_comp_text_button_pressed_state_layer_opacity"
+        android:color="?attr/colorOnContainer"
+        android:state_checkable="false"
+        android:state_pressed="true" />
+  <item android:alpha="@dimen/m3_comp_text_button_focus_state_layer_opacity"
+        android:color="?attr/colorOnContainer"
+        android:state_checkable="false"
+        android:state_focused="true" />
+  <item android:alpha="@dimen/m3_comp_text_button_hover_state_layer_opacity"
+        android:color="?attr/colorOnContainer"
+        android:state_checkable="false"
+        android:state_hovered="true" />
+  <item android:alpha="@dimen/m3_ripple_default_alpha"
+        android:color="?attr/colorOnContainer"
+        android:state_checkable="false" />
 
   <!-- Checked -->
   <!-- The ripple color matches the color of the text / iconography on the element it's applied to.
        If the text / iconography changes color during a state change, the ripple color matches the end state's color.
        Pressing on a checked button will return it to the unchecked state at which point the text -->
-  <item android:alpha="@dimen/m3_ripple_selectable_pressed_alpha" android:color="?attr/colorOnSurface" android:state_checked="true" android:state_pressed="true" />
-  <item android:alpha="@dimen/m3_ripple_focused_alpha" android:color="?attr/colorOnSecondaryContainer" android:state_checked="true" android:state_focused="true" />
-  <item android:alpha="@dimen/m3_ripple_hovered_alpha" android:color="?attr/colorOnSecondaryContainer" android:state_checked="true" android:state_hovered="true" />
-  <item android:alpha="@dimen/m3_ripple_default_alpha" android:color="?attr/colorOnSecondaryContainer" android:state_checked="true" />
+  <item android:alpha="@dimen/m3_comp_text_button_pressed_state_layer_opacity"
+        android:color="?attr/colorOnSurface"
+        android:state_checked="true"
+        android:state_pressed="true" />
+  <item android:alpha="@dimen/m3_comp_text_button_focus_state_layer_opacity"
+        android:color="?attr/colorOnSecondaryContainer"
+        android:state_checked="true"
+        android:state_focused="true" />
+  <item android:alpha="@dimen/m3_comp_text_button_hover_state_layer_opacity"
+        android:color="?attr/colorOnSecondaryContainer"
+        android:state_checked="true"
+        android:state_hovered="true" />
+  <item android:alpha="@dimen/m3_ripple_default_alpha"
+        android:color="?attr/colorOnSecondaryContainer"
+        android:state_checked="true" />
 
   <!-- Unchecked -->
   <!-- Pressing on an unchecked, checkable chip will check it at which point the text / iconography
        will use "colorOnSecondaryContainer". Therefore, the ripple color for the pressed, checkable state is
        based on "colorOnSecondaryContainer". -->
-  <item android:alpha="@dimen/m3_ripple_selectable_pressed_alpha" android:color="?attr/colorOnSecondaryContainer" android:state_pressed="true" />
-  <item android:alpha="@dimen/m3_ripple_focused_alpha" android:color="?attr/colorOnSurface" android:state_focused="true" />
-  <item android:alpha="@dimen/m3_ripple_hovered_alpha" android:color="?attr/colorOnSurface" android:state_hovered="true" />
-  <item android:alpha="@dimen/m3_ripple_default_alpha" android:color="?attr/colorOnSurface" />
+  <item android:alpha="@dimen/m3_comp_text_button_pressed_state_layer_opacity"
+        android:color="?attr/colorOnSecondaryContainer"
+        android:state_pressed="true" />
+  <item android:alpha="@dimen/m3_comp_text_button_focus_state_layer_opacity"
+        android:color="?attr/colorOnSurface"
+        android:state_focused="true" />
+  <item android:alpha="@dimen/m3_comp_text_button_hover_state_layer_opacity"
+        android:color="?attr/colorOnSurface"
+        android:state_hovered="true" />
+  <item android:alpha="@dimen/m3_ripple_default_alpha"
+        android:color="?attr/colorOnSurface" />
 
 </selector>
diff --git a/lib/java/com/google/android/material/button/res/values/dimens.xml b/lib/java/com/google/android/material/button/res/values/dimens.xml
index e2d2323e937..858a8eb91bb 100644
--- a/lib/java/com/google/android/material/button/res/values/dimens.xml
+++ b/lib/java/com/google/android/material/button/res/values/dimens.xml
@@ -68,7 +68,7 @@
   <!-- LINT.ThenChange(../../../dialog/res/values/dimens.xml) -->
 
   <dimen name="m3_btn_elevation">0dp</dimen>
-  <dimen name="m3_btn_elevated_btn_elevation">1dp</dimen>
+  <dimen name="m3_btn_elevated_btn_elevation">@dimen/m3_comp_elevated_button_container_elevation</dimen>
   <dimen name="m3_btn_icon_btn_padding_left">16dp</dimen>
   <dimen name="m3_btn_icon_btn_padding_right">24dp</dimen>
   <dimen name="m3_btn_text_btn_padding_left">12dp</dimen>
diff --git a/lib/java/com/google/android/material/button/res/values/styles.xml b/lib/java/com/google/android/material/button/res/values/styles.xml
index f9ad6b4f1ed..bf3388a4346 100644
--- a/lib/java/com/google/android/material/button/res/values/styles.xml
+++ b/lib/java/com/google/android/material/button/res/values/styles.xml
@@ -134,14 +134,14 @@
     <item name="android:paddingBottom">@dimen/m3_btn_padding_bottom</item>
     <item name="android:insetTop">@dimen/m3_btn_inset</item>
     <item name="android:insetBottom">@dimen/m3_btn_inset</item>
-    <item name="android:textAppearance">?attr/textAppearanceLabelLarge</item>
-    <item name="shapeAppearance">@style/ShapeAppearance.Material3.Corner.Full</item>
+    <item name="android:textAppearance">@macro/m3_comp_filled_button_label_text_type</item>
+    <item name="shapeAppearance">@style/ShapeAppearance.M3.Comp.FilledButton.Container.Shape</item>
     <item name="materialThemeOverlay">@style/ThemeOverlay.Material3.Button</item>
     <item name="android:stateListAnimator" tools:ignore="NewApi">@animator/m3_btn_state_list_anim</item>
-    <item name="elevation">@dimen/m3_btn_elevation</item>
+    <item name="elevation">@dimen/m3_comp_filled_button_container_elevation</item>
     <item name="android:textColor">@color/m3_button_foreground_color_selector</item>
     <item name="iconTint">@color/m3_button_foreground_color_selector</item>
-    <item name="iconSize">18dp</item>
+    <item name="iconSize">@dimen/m3_comp_filled_button_with_icon_icon_size</item>
     <item name="backgroundTint">@color/m3_button_background_color_selector</item>
     <item name="rippleColor">@color/m3_button_ripple_color_selector</item>
   </style>
@@ -160,13 +160,13 @@
     <item name="elevation">0dp</item>
   </style>
 
-  <!-- M3 tonal button style. -->
+  <!-- M3 filled tonal button style. -->
   <style name="Widget.Material3.Button.TonalButton">
     <item name="rippleColor">@color/m3_tonal_button_ripple_color_selector</item>
     <item name="materialThemeOverlay">@style/ThemeOverlay.Material3.Button.TonalButton</item>
   </style>
 
-  <!-- M3 tonal button with a start-gravity icon style. This adjusts
+  <!-- M3 filled tonal button with a start-gravity icon style. This adjusts
        padding slightly to achieve a better visual balance. This style should only be used with a
        start-gravity icon button. If your icon is end-gravity, mirror the padding such that this
        adjustment happens to the other side. -->
@@ -185,8 +185,8 @@
     <item name="android:paddingBottom">@dimen/m3_btn_padding_bottom</item>
     <item name="android:insetTop">@dimen/m3_btn_inset</item>
     <item name="android:insetBottom">@dimen/m3_btn_inset</item>
-    <item name="android:textAppearance">?attr/textAppearanceLabelLarge</item>
-    <item name="shapeAppearance">@style/ShapeAppearance.Material3.Corner.Full</item>
+    <item name="android:textAppearance">@macro/m3_comp_text_button_label_text_type</item>
+    <item name="shapeAppearance">@style/ShapeAppearance.M3.Comp.TextButton.Container.Shape</item>
     <item name="materialThemeOverlay">@style/ThemeOverlay.Material3.Button.TextButton</item>
     <item name="android:textColor">@color/m3_text_button_foreground_color_selector</item>
     <item name="iconTint">@color/m3_text_button_foreground_color_selector</item>
@@ -231,7 +231,7 @@
     <item name="android:paddingLeft">@dimen/m3_btn_padding_left</item>
     <item name="android:paddingRight">@dimen/m3_btn_padding_right</item>
     <item name="strokeColor">@color/m3_button_outline_color_selector</item>
-    <item name="strokeWidth">@dimen/m3_btn_stroke_size</item>
+    <item name="strokeWidth">@dimen/m3_comp_outlined_button_outline_width</item>
   </style>
 
   <!-- M3 outlined button with a start-gravity icon style. -->
@@ -300,19 +300,19 @@
 
   <style name="ThemeOverlay.Material3.Button" parent="">
     <!-- The colors used by the color selectors -->
-    <item name="colorOnContainer">?attr/colorOnPrimary</item>
-    <item name="colorContainer">?attr/colorPrimary</item>
+    <item name="colorOnContainer">@macro/m3_comp_filled_button_label_text_color</item>
+    <item name="colorContainer">@macro/m3_comp_filled_button_container_color</item>
   </style>
 
   <style name="ThemeOverlay.Material3.Button.TonalButton">
     <!-- The colors used by the color selectors -->
-    <item name="colorOnContainer">?attr/colorOnSecondaryContainer</item>
-    <item name="colorContainer">?attr/colorSecondaryContainer</item>
+    <item name="colorOnContainer">@macro/m3_comp_filled_tonal_button_label_text_color</item>
+    <item name="colorContainer">@macro/m3_comp_filled_tonal_button_container_color</item>
   </style>
 
   <style name="ThemeOverlay.Material3.Button.TextButton" parent="">
     <!-- The colors used by the color selectors -->
-    <item name="colorOnContainer">?attr/colorPrimary</item>
+    <item name="colorOnContainer">@macro/m3_comp_text_button_label_text_color</item>
     <item name="colorContainer">@android:color/transparent</item>
   </style>
 
@@ -323,7 +323,7 @@
 
   <style name="ThemeOverlay.Material3.Button.ElevatedButton" parent="ThemeOverlay.Material3.Button.TextButton">
     <!-- The colors used by the color selectors -->
-    <item name="colorContainer">?attr/colorSurface</item>
+    <item name="colorContainer">@macro/m3_comp_elevated_button_container_color</item>
   </style>
 
   <style name="ThemeOverlay.Material3.Button.IconButton" parent="ThemeOverlay.Material3.Button.TextButton">
diff --git a/lib/java/com/google/android/material/button/res/values/tokens.xml b/lib/java/com/google/android/material/button/res/values/tokens.xml
new file mode 100644
index 00000000000..01297e9b840
--- /dev/null
+++ b/lib/java/com/google/android/material/button/res/values/tokens.xml
@@ -0,0 +1,77 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+  ~ Copyright (C) 2022 The Android Open Source Project
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~      http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+-->
+<!-- AUTOGENERATED FILE. DO NOT MODIFY. -->
+<!-- Version: v0.126 -->
+
+<resources>
+  <!-- Generated from token set (md.comp.filled-button) in default context. -->
+  <!-- Enabled - Container -->
+  <style name="ShapeAppearance.M3.Comp.FilledButton.Container.Shape" parent="ShapeAppearance.M3.Sys.Shape.Corner.Full"/>
+  <dimen name="m3_comp_filled_button_container_elevation">@dimen/m3_sys_elevation_level0</dimen>
+  <!-- Ignore (md.comp.filled-button.container.shadow-color) due to no theme attribute for (md.sys.color.shadow). -->
+  <macro name="m3_comp_filled_button_container_color">?attr/colorPrimary</macro>
+  <!-- Enabled - Label text -->
+  <macro name="m3_comp_filled_button_label_text_type">?attr/textAppearanceLabelLarge</macro>
+  <macro name="m3_comp_filled_button_label_text_color">?attr/colorOnPrimary</macro>
+  <!-- Enabled - Icon -->
+  <dimen name="m3_comp_filled_button_with_icon_icon_size">18dp</dimen>
+
+  <!-- Generated from token set (md.comp.filled-tonal-button) in default context. -->
+  <!-- Enabled - Container -->
+  <macro name="m3_comp_filled_tonal_button_container_color">?attr/colorSecondaryContainer</macro>
+  <!-- Ignore (md.comp.filled-tonal-button.container.shadow-color) due to no theme attribute for (md.sys.color.shadow). -->
+  <!-- Enabled - Label text -->
+  <macro name="m3_comp_filled_tonal_button_label_text_color">?attr/colorOnSecondaryContainer</macro>
+
+  <!-- Generated from token set (md.comp.text-button) in default context. -->
+  <!-- Enabled - Container -->
+  <style name="ShapeAppearance.M3.Comp.TextButton.Container.Shape" parent="ShapeAppearance.M3.Sys.Shape.Corner.Full"/>
+  <!-- Enabled - Label text -->
+  <macro name="m3_comp_text_button_label_text_type">?attr/textAppearanceLabelLarge</macro>
+  <macro name="m3_comp_text_button_label_text_color">?attr/colorPrimary</macro>
+  <!-- Hovered - State layer -->
+  <macro name="m3_comp_text_button_hover_state_layer_color">?attr/colorPrimary</macro>
+  <dimen name="m3_comp_text_button_hover_state_layer_opacity">@dimen/m3_sys_state_hover_state_layer_opacity</dimen>
+  <!-- Focused - State layer -->
+  <macro name="m3_comp_text_button_focus_state_layer_color">?attr/colorPrimary</macro>
+  <dimen name="m3_comp_text_button_focus_state_layer_opacity">@dimen/m3_sys_state_focus_state_layer_opacity</dimen>
+  <!-- Pressed (rippple) - State layer -->
+  <macro name="m3_comp_text_button_pressed_state_layer_color">?attr/colorPrimary</macro>
+  <dimen name="m3_comp_text_button_pressed_state_layer_opacity">@dimen/m3_sys_state_pressed_state_layer_opacity</dimen>
+
+  <!-- Generated from token set (md.comp.outlined-button) in default context. -->
+  <!-- Enabled - Outline -->
+  <macro name="m3_comp_outlined_button_outline_color">?attr/colorOutline</macro>
+  <dimen name="m3_comp_outlined_button_outline_width">1dp</dimen>
+  <!-- Disabled - Outline -->
+  <macro name="m3_comp_outlined_button_disabled_outline_color">?attr/colorOnSurface</macro>
+  <item name="m3_comp_outlined_button_disabled_outline_opacity" format="float" type="dimen">0.12</item>
+  <!-- Hovered - Outline -->
+  <macro name="m3_comp_outlined_button_hover_outline_color">?attr/colorOutline</macro>
+  <!-- Focused - Outline -->
+  <macro name="m3_comp_outlined_button_focus_outline_color">?attr/colorPrimary</macro>
+  <!-- Pressed (rippple) - Outline -->
+  <macro name="m3_comp_outlined_button_pressed_outline_color">?attr/colorOutline</macro>
+
+  <!-- Generated from token set (md.comp.elevated-button) in default context. -->
+  <!-- Enabled - Container -->
+  <dimen name="m3_comp_elevated_button_container_elevation">@dimen/m3_sys_elevation_level1</dimen>
+  <!-- Ignore (md.comp.elevated-button.container.shadow-color) due to no theme attribute for (md.sys.color.shadow). -->
+  <macro name="m3_comp_elevated_button_container_color">?attr/colorSurface</macro>
+  <!-- Disabled - Container -->
+  <dimen name="m3_comp_elevated_button_disabled_container_elevation">@dimen/m3_sys_elevation_level0</dimen>
+</resources>