Remove binding to prevent unintended value update from hidden color palette

The color palette GridView was applying a selection even when not visible, causing the bound SelectedColor to reset unexpectedly. This change replaces the binding with code-behind value update to preserve the intended value when the palette is collapsed.

Author: AndrewKeepCoding

components/ColorPicker/src/ColorPicker.cs

@@ -46,6 +46,7 @@ namespace CommunityToolkit.WinUI.Controls;
 [TemplatePart(Name = nameof(ColorPicker.ColorSpectrumControl),        Type = typeof(ColorSpectrum))]
 [TemplatePart(Name = nameof(ColorPicker.ColorSpectrumAlphaSlider),    Type = typeof(ColorPickerSlider))]
 [TemplatePart(Name = nameof(ColorPicker.ColorSpectrumThirdDimensionSlider), Type = typeof(ColorPickerSlider))]
+[TemplatePart(Name = nameof(ColorPicker.PaletteItemGridView),         Type = typeof(GridView))]
 [TemplatePart(Name = nameof(ColorPicker.HexInputTextBox),             Type = typeof(TextBox))]
 [TemplatePart(Name = nameof(ColorPicker.ColorModeComboBox), Type = typeof(ComboBox))]
 
@@ -81,6 +82,7 @@ public partial class ColorPicker : Microsoft.UI.Xaml.Controls.ColorPicker
     private ColorSpectrum     ColorSpectrumControl;
     private ColorPickerSlider ColorSpectrumAlphaSlider;
     private ColorPickerSlider ColorSpectrumThirdDimensionSlider;
+    private GridView          PaletteItemGridView;
     private TextBox           HexInputTextBox;
     private ComboBox          ColorModeComboBox;
 
@@ -186,6 +188,8 @@ protected override void OnApplyTemplate()
         this.ColorSpectrumAlphaSlider          = (ColorPickerSlider)this.GetTemplateChild(nameof(ColorSpectrumAlphaSlider));
         this.ColorSpectrumThirdDimensionSlider = (ColorPickerSlider)this.GetTemplateChild(nameof(ColorSpectrumThirdDimensionSlider));
 
+        this.PaletteItemGridView = (GridView)GetTemplateChild(nameof(PaletteItemGridView));
+
         this.HexInputTextBox = (TextBox)this.GetTemplateChild(nameof(HexInputTextBox));
         this.ColorModeComboBox = (ComboBox)this.GetTemplateChild(nameof(ColorModeComboBox));
 
@@ -263,6 +267,9 @@ private void ConnectEvents(bool connected)
 
             if (this.ColorSpectrumControl != null) { this.ColorSpectrumControl.ColorChanged += ColorSpectrum_ColorChanged; }
             if (this.ColorSpectrumControl != null) { this.ColorSpectrumControl.GotFocus     += ColorSpectrum_GotFocus; }
+
+            if (this.PaletteItemGridView != null) { this.PaletteItemGridView.SelectionChanged += this.PaletteItemGridView_SelectionChanged; }
+
             if (this.HexInputTextBox      != null) { this.HexInputTextBox.KeyDown           += HexInputTextBox_KeyDown; }
             if (this.HexInputTextBox      != null) { this.HexInputTextBox.LostFocus         += HexInputTextBox_LostFocus; }
             if (this.ColorModeComboBox    != null) { this.ColorModeComboBox.SelectionChanged += ColorModeComboBox_SelectionChanged; }
@@ -309,6 +316,9 @@ private void ConnectEvents(bool connected)
 
             if (this.ColorSpectrumControl != null) { this.ColorSpectrumControl.ColorChanged -= ColorSpectrum_ColorChanged; }
             if (this.ColorSpectrumControl != null) { this.ColorSpectrumControl.GotFocus     -= ColorSpectrum_GotFocus; }
+
+            if (this.PaletteItemGridView != null) { this.PaletteItemGridView.SelectionChanged -= this.PaletteItemGridView_SelectionChanged; }
+
             if (this.HexInputTextBox      != null) { this.HexInputTextBox.KeyDown           -= HexInputTextBox_KeyDown; }
             if (this.HexInputTextBox      != null) { this.HexInputTextBox.LostFocus         -= HexInputTextBox_LostFocus; }
             if (this.ColorModeComboBox != null) { this.ColorModeComboBox.SelectionChanged -= ColorModeComboBox_SelectionChanged; }
@@ -1325,6 +1335,20 @@ private void ColorSpectrum_GotFocus(object sender, RoutedEventArgs e)
         return;
     }
 
+    /// <summary>
+    /// Event handler for when a color is selected from the palette.
+    /// This will update the current color.
+    /// </summary>
+    private void PaletteItemGridView_SelectionChanged(object sender, SelectionChangedEventArgs e)
+    {
+        if ((sender as GridView)?.SelectedValue is not Color selectedColor)
+        {
+            return;
+        }
+
+        this.Color = selectedColor;
+    }
+
     /// <summary>
     /// Event handler for when the selected color representation changes.
     /// This will convert between RGB and HSV.

components/ColorPicker/src/ColorPicker.xaml

@@ -286,12 +286,12 @@
                                 </controls:Case>
                                 <controls:Case Value="PaletteItem">
                                     <Grid HorizontalAlignment="Stretch">
-                                        <GridView Margin="0"
+                                        <GridView x:Name="PaletteItemGridView"
+                                                  Margin="0"
                                                   Padding="0"
                                                   animations:Implicit.HideAnimations="{StaticResource HideTransitions}"
                                                   animations:Implicit.ShowAnimations="{StaticResource ShowTransitions}"
                                                   ItemsSource="{TemplateBinding CustomPaletteColors}"
-                                                  SelectedValue="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Color, Converter={StaticResource NullToTransparentConverter}, Mode=TwoWay}"
                                                   SelectionMode="Single"
                                                   Tag="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Color, Mode=OneWay}">
                                             <GridView.ItemsPanel>