fix: Removing Tint Color (#1307)

doc/material-controls-extensions.md

@@ -53,25 +53,13 @@ It's control specific and for now, you can only use it with the `ToggleButton` c
 
 This feature allows to set the level of elevation to depict on the supported control.
 
-Setting the elevation on [supported controls](#supported-controls) can result in changes to both the shadow and the [surface tint](#surface-tint).
+Setting the elevation on [supported controls](#supported-controls) can result in changes to shadow.
 
 [Material Design Elevation Guidance](https://m3.material.io/styles/elevation/overview)
 
-## Surface Tint
-
-The surface tint properties allow for customization of how elevation can be depicted on certain controls. While the Background of a control remains static, the surface color can change based on the level of elevation.
-
-### TintedBackground
-
-This is a readonly property that will provide a SolidColorBrush depicting the control's current background color overlayed with the surface tint color at a certain opacity based on the elevation of the control.
-
-### IsTintEnabled
-
-This feature allows for enabling or disabling the surface tint that may be applied to an elevated control. When `IsTintEnabled` is `false`, the `TintedBackground` property will remain the same value as the control's background color.
-
 ### Example Usage for `Button`
 
-The `ElevatedButtonStyle` in Uno Material supports elevation and surface tints through the use of the `TintedBackground`, `IsTintEnabled`, and `Elevation` attached properties.
+The `ElevatedButtonStyle` in Uno Material supports elevation through the use of the `Elevation` attached property.
 
 `ElevatedButtonStyle` contains the following `Setter`s:
 
@@ -80,22 +68,10 @@ The `ElevatedButtonStyle` in Uno Material supports elevation and surface tints t
 
 <Setter Property="um:ControlExtensions.Elevation"
         Value="1" />
-<Setter Property="um:ControlExtensions.IsTintEnabled"
-        Value="True" />
 ...
 ```
 
-Within the `ControlTemplate` of the `ElevatedButtonStyle`, instead of performing a `TemplateBinding` to the `Background` property of the `Button`, we instead bind to the `TintedBackground` attached property:
-
-```xml
-<Grid x:Name="Root"
-      ...
-      Background="{Binding Path=(um:ControlExtensions.TintedBackground), RelativeSource={RelativeSource TemplatedParent}}">
-      <!-- Remaining content omitted for brevity -->
-</Grid>
-```
-
-Applying the surface tint for elevated controls is optional and must be explicitly enabled through the use of the `IsTintEnabled` attached property. Below is an example of how an elevated control may appear  with or without a surface tint:
+Below is an example of how an elevated control may appear:
 
 ```xml
 <StackPanel Spacing="8">
@@ -122,16 +98,13 @@ Applying the surface tint for elevated controls is optional and must be explicit
 
 The above XAML will produce the following result:
 
-![Uno Material Elevation Buttons with Tint Enabled](assets/material-elevation-buttons.png)
-
-If we were to alter the XAML above and set `um:ControlExtensions.IsTintEnabled="False"` on each of the buttons, we would see elevated buttons without tints:
-
-![Uno Material Elevation Buttons with Tint Disabled](assets/material-elevation-buttons-shadow-only.png)
+![Uno Material Elevation Buttons](assets/material-elevation-buttons-shadow-only.png)
 
 ### Supported Controls
 
-The following control styles have support for surface tint:
+The following control styles have support for elevation:
 
 | Control  | Supporting Styles     |
 |----------|-----------------------|
 | `Button` | `ElevatedButtonStyle` |
+|----------|-----------------------|

src/library/Uno.Material/Extensions/ControlExtensions.cs

@@ -82,58 +82,19 @@ public static class ControlExtensions
 		#region DependencyProperty: Elevation
 
 		/// <summary>
-		/// Gets or sets the level of elevation to depict for the attached view. In Material, elevation can be used to drive both the shadow and the surface tint color (https://m3.material.io/styles/elevation/overview)
+		/// Gets or sets the level of elevation to depict for the attached view.
 		/// </summary>
 		public static DependencyProperty ElevationProperty { [DynamicDependency(nameof(ElevationProperty))] get; } = DependencyProperty.RegisterAttached(
 			"Elevation",
 			typeof(int),
 			typeof(ControlExtensions),
-			new PropertyMetadata(0, OnElevationChanged));
+			new PropertyMetadata(0));
 
 		[DynamicDependency(nameof(SetElevation))]
 		public static int GetElevation(Control obj) => (int)obj.GetValue(ElevationProperty);
 		[DynamicDependency(nameof(GetElevation))]
 		public static void SetElevation(Control obj, int value) => obj.SetValue(ElevationProperty, value);
 
 		#endregion
-
-		#region DependencyProperty: TintedBackground
-		/// <summary>
-		/// Gets or sets the SolidColorBrush to use when depicting a surface tint on an elevated view.
-		/// </summary>
-		public static DependencyProperty TintedBackgroundProperty { [DynamicDependency(nameof(GetTintedBackground))] get; } = DependencyProperty.RegisterAttached(
-			"TintedBackground",
-			typeof(SolidColorBrush),
-			typeof(ControlExtensions),
-			new PropertyMetadata(default(SolidColorBrush)));
-
-		[DynamicDependency(nameof(SetTintedBackground))]
-		public static SolidColorBrush GetTintedBackground(UIElement obj) => (SolidColorBrush)obj.GetValue(TintedBackgroundProperty);
-		[DynamicDependency(nameof(GetTintedBackground))]
-		public static void SetTintedBackground(UIElement obj, SolidColorBrush value) => obj.SetValue(TintedBackgroundProperty, value);
-
-		#endregion
-		#region DependencyProperty: IsTintEnabled
-		/// <summary>
-		/// Gets or sets whether or not the SurfaceTintColor should be applied for elevated views
-		/// </summary>
-		public static DependencyProperty IsTintEnabledProperty { [DynamicDependency(nameof(GetIsTintEnabled))] get; } = DependencyProperty.RegisterAttached(
-			"IsTintEnabled",
-			typeof(bool),
-			typeof(ControlExtensions),
-			new PropertyMetadata(false, OnIsTintEnabledChanged));
-
-		[DynamicDependency(nameof(SetIsTintEnabled))]
-		public static bool GetIsTintEnabled(UIElement obj) => (bool)obj.GetValue(IsTintEnabledProperty);
-		[DynamicDependency(nameof(GetIsTintEnabled))]
-		public static void SetIsTintEnabled(UIElement obj, bool value) => obj.SetValue(IsTintEnabledProperty, value);
-
-		#endregion
-
-		private static void OnElevationChanged(DependencyObject element, DependencyPropertyChangedEventArgs e)
-			=> SurfaceTintExtensions.OnElevationChanged(element, (int)e.NewValue);
-
-		private static void OnIsTintEnabledChanged(DependencyObject element, DependencyPropertyChangedEventArgs e)
-			=> SurfaceTintExtensions.OnIsTintEnabledChanged(element, (bool)e.NewValue);
 	}
 }

src/library/Uno.Material/Styles/Controls/v2/Button.xaml

@@ -20,7 +20,6 @@
 	<x:String x:Key="ButtonIconVerticalAlignment">Stretch</x:String>
 	<x:String x:Key="IconButtonEllipseVerticalAlignment">Stretch</x:String>
 	<x:String x:Key="IconButtonEllipseHorizontalAlignment">Stretch</x:String>
-	<x:Boolean x:Key="ElevatedButtonIsTintEnabled">True</x:Boolean>
 
 	<ResourceDictionary.ThemeDictionaries>
 		<ResourceDictionary x:Key="Default">
@@ -409,8 +408,6 @@
 		<Setter Property="Foreground" Value="{ThemeResource ElevatedButtonForeground}" />
 		<Setter Property="Background" Value="{ThemeResource ElevatedButtonBackground}" />
 		<Setter Property="um:ControlExtensions.Elevation" Value="{ThemeResource ElevatedButtonElevation}" />
-		<Setter Property="um:ControlExtensions.TintedBackground" Value="{x:Null}" />
-		<Setter Property="um:ControlExtensions.IsTintEnabled" Value="{StaticResource ElevatedButtonIsTintEnabled}" />
 		<Setter Property="BorderBrush" Value="{ThemeResource ElevatedButtonBorderBrush}" />
 
 		<Setter Property="Template">
@@ -490,7 +487,7 @@
 						</VisualStateManager.VisualStateGroups>
 
 						<Grid x:Name="Root"
-							  Background="{Binding Path=(um:ControlExtensions.TintedBackground), RelativeSource={RelativeSource TemplatedParent}}"
+							  Background="{TemplateBinding Background}"
 							  BorderBrush="{TemplateBinding BorderBrush}"
 							  BorderThickness="{TemplateBinding BorderThickness}"
 							  CornerRadius="{TemplateBinding CornerRadius}">

src/library/Uno.Themes.WinUI.Markup/Theme/Button.cs

@@ -93,9 +93,6 @@ public static partial class Foreground
 					[ResourceKeyDefinition(typeof(Brush), "ElevatedButtonForeground")]
 					public static ThemeResourceKey<Brush> Default => new("ElevatedButtonForeground");
 				}
-
-				[ResourceKeyDefinition(typeof(bool), "ElevatedButtonIsTintEnabled")]
-				public static StaticResourceKey<bool> IsTintEnabled => new("ElevatedButtonIsTintEnabled");
 			}
 
 			public static partial class Filled