From 2a343dcf019f69bc336ee6933a4feb0c6061e452 Mon Sep 17 00:00:00 2001
From: robloo <robloo@users.noreply.github.com>
Date: Mon, 21 Mar 2022 12:09:03 -0400
Subject: [PATCH] Implement :large-selector pseudo class

---
 .../ColorSpectrum/ColorSpectrum.cs            | 28 +++++++++---------
 .../Controls/ColorSpectrum.xaml               | 29 ++++++++-----------
 2 files changed, 27 insertions(+), 30 deletions(-)

diff --git a/src/Avalonia.Controls/ColorPicker/ColorSpectrum/ColorSpectrum.cs b/src/Avalonia.Controls/ColorPicker/ColorSpectrum/ColorSpectrum.cs
index d35c18115d..988d475853 100644
--- a/src/Avalonia.Controls/ColorPicker/ColorSpectrum/ColorSpectrum.cs
+++ b/src/Avalonia.Controls/ColorPicker/ColorSpectrum/ColorSpectrum.cs
@@ -20,9 +20,10 @@ namespace Avalonia.Controls.Primitives
     /// <summary>
     /// A two dimensional spectrum for color selection.
     /// </summary>
-    [PseudoClasses(pcLightSelector)]
+    [PseudoClasses(pcLargeSelector, pcLightSelector)]
     public partial class ColorSpectrum : TemplatedControl
     {
+        protected const string pcLargeSelector = ":large-selector";
         protected const string pcLightSelector = ":light-selector";
 
         /// <summary>
@@ -514,18 +515,19 @@ namespace Avalonia.Controls.Primitives
         /// </summary>
         private void UpdatePseudoClasses()
         {
-            //if (m_isPointerPressed)
-            //{
-            //    VisualStateManager.GoToState(this, m_shouldShowLargeSelection ? "PressedLarge" : "Pressed", useTransitions);
-            //}
-            //else if (m_isPointerOver)
-            //{
-            //    VisualStateManager.GoToState(this, "PointerOver", useTransitions);
-            //}
-            //else
-            //{
-            //    VisualStateManager.GoToState(this, "Normal", useTransitions);
-            //}
+            if (_isPointerPressed)
+            {
+                PseudoClasses.Set(pcLargeSelector, _shouldShowLargeSelection);
+            }
+            else if (_isPointerOver)
+            {
+                //VisualStateManager.GoToState(this, "PointerOver", useTransitions);
+                PseudoClasses.Set(pcLargeSelector, false);
+            }
+            else
+            {
+                PseudoClasses.Set(pcLargeSelector, false);
+            }
 
             PseudoClasses.Set(pcLightSelector, SelectionEllipseShouldBeLight());
 
diff --git a/src/Avalonia.Themes.Fluent/Controls/ColorSpectrum.xaml b/src/Avalonia.Themes.Fluent/Controls/ColorSpectrum.xaml
index 84eec272ed..13e9773940 100644
--- a/src/Avalonia.Themes.Fluent/Controls/ColorSpectrum.xaml
+++ b/src/Avalonia.Themes.Fluent/Controls/ColorSpectrum.xaml
@@ -52,9 +52,7 @@
                       Background="Transparent"
                       HorizontalAlignment="Stretch"
                       VerticalAlignment="Stretch">
-                <Grid x:Name="PART_SelectionEllipsePanel"
-                      Width="16"
-                      Height="16">
+                <Grid x:Name="PART_SelectionEllipsePanel">
                   <Ellipse x:Name="FocusEllipse"
                            Margin="-2"
                            StrokeThickness="2"
@@ -98,7 +96,7 @@
     </Setter>
   </Style>
 
-  <!-- SelectionEllipseColor -->
+  <!-- Selector Color -->
   <Style Selector="ColorSpectrum /template/ Ellipse#FocusEllipse">
     <Setter Property="Stroke" Value="{DynamicResource SystemControlBackgroundChromeWhiteBrush}" />
   </Style>
@@ -112,11 +110,19 @@
     <Setter Property="Stroke" Value="{DynamicResource SystemControlBackgroundChromeWhiteBrush}" />
   </Style>
 
+  <!-- Selector Size -->
+  <Style Selector="ColorSpectrum /template/ Grid#PART_SelectionEllipsePanel">
+    <Setter Property="Width" Value="16" />
+    <Setter Property="Height" Value="16" />
+  </Style>
+  <Style Selector="ColorSpectrum:large-selector /template/ Grid#PART_SelectionEllipsePanel">
+    <Setter Property="Width" Value="48" />
+    <Setter Property="Height" Value="48" />
+  </Style>
+
   <!--<VisualStateManager.VisualStateGroups>
     <VisualStateGroup
       x:Name="CommonStates">
-      <VisualState
-        x:Name="Normal" />
       <VisualState
         x:Name="PointerOver">
         <VisualState.Setters>
@@ -127,17 +133,6 @@
       </VisualState>
       <VisualState
         x:Name="Pressed" />
-      <VisualState
-        x:Name="PressedLarge">
-        <VisualState.Setters>
-          <Setter
-            Target="SelectionEllipsePanel.Width"
-            Value="48" />
-          <Setter
-            Target="SelectionEllipsePanel.Height"
-            Value="48" />
-        </VisualState.Setters>
-      </VisualState>
     </VisualStateGroup>
     <VisualStateGroup
       x:Name="FocusStates">