From b8ad5a6dd152e4e80ef622d5c6fd0ed91bc2b607 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 19:47:20 +0000
Subject: [PATCH 01/11] change template for datavalidation errors.

---
 .../DataValidationErrors.xaml                 | 48 ++++++++-----------
 1 file changed, 20 insertions(+), 28 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml b/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml
index 902fc74c0c..1161a92e30 100644
--- a/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml
+++ b/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml
@@ -14,39 +14,31 @@
   <Setter Property="Template">
     <ControlTemplate>
       <DockPanel LastChildFill="True">
-        <ContentControl DockPanel.Dock="Right"
-                        ContentTemplate="{TemplateBinding ErrorTemplate}"
-                        DataContext="{TemplateBinding Owner}"
-                        Content="{Binding (DataValidationErrors.Errors)}"
-                        IsVisible="{Binding (DataValidationErrors.HasErrors)}"/>
-        <ContentPresenter Name="PART_ContentPresenter"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          ContentTemplate="{TemplateBinding ContentTemplate}"
-                          Content="{TemplateBinding Content}"
-                          Padding="{TemplateBinding Padding}"/>
+        <ContentControl
+          DockPanel.Dock="Bottom"
+          ContentTemplate="{TemplateBinding ErrorTemplate}"
+          DataContext="{TemplateBinding Owner}"
+          Content="{Binding (DataValidationErrors.Errors)}"
+          IsVisible="{Binding (DataValidationErrors.HasErrors)}" />
+        <ContentPresenter
+          Name="PART_ContentPresenter"
+          Background="{TemplateBinding Background}"
+          BorderThickness="{TemplateBinding BorderThickness}"
+          ContentTemplate="{TemplateBinding ContentTemplate}"
+          Content="{TemplateBinding Content}"
+          Padding="{TemplateBinding Padding}" />
       </DockPanel>
     </ControlTemplate>
   </Setter>
   <Setter Property="ErrorTemplate">
     <DataTemplate>
-      <Canvas Name="PART_ErrorTemplateCanvas"
-              Width="14" Height="14" Margin="4 0 1 0" 
-              Background="Transparent">
-        <Canvas.Styles>
-          <Style Selector="Canvas#PART_ErrorTemplateCanvas ToolTip">
-            <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
-          </Style>
-          <Style Selector="Canvas#PART_ErrorTemplateCanvas ToolTip TextBlock">
-            <Setter Property="TextWrapping" Value="Wrap" />
-          </Style>
-        </Canvas.Styles>
-        <ToolTip.Tip>
-          <ItemsControl Items="{Binding}"/>
-        </ToolTip.Tip>
-        <Path Data="M14,7 A7,7 0 0,0 0,7 M0,7 A7,7 0 1,0 14,7 M7,3l0,5 M7,9l0,2" Stroke="{DynamicResource SystemControlErrorTextForegroundBrush}" StrokeThickness="2"/>
-      </Canvas>
+      <ItemsControl Items="{Binding}">
+        <ItemsControl.ItemTemplate>
+          <DataTemplate>
+            <TextBlock Text="{Binding Message}" Foreground="{DynamicResource SystemControlErrorTextForegroundBrush}" TextWrapping="Wrap" />
+          </DataTemplate>
+        </ItemsControl.ItemTemplate>
+      </ItemsControl>
     </DataTemplate>
   </Setter>
 </Style>

From 9e0b33b542b2c33bdb3526bef5c7f988d43a6e07 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 20:40:52 +0000
Subject: [PATCH 02/11] add an example of datavalidation errors on textbox.

---
 samples/ControlCatalog/Pages/TextBoxPage.xaml | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/samples/ControlCatalog/Pages/TextBoxPage.xaml b/samples/ControlCatalog/Pages/TextBoxPage.xaml
index 8b07ac3f85..4958174f40 100644
--- a/samples/ControlCatalog/Pages/TextBoxPage.xaml
+++ b/samples/ControlCatalog/Pages/TextBoxPage.xaml
@@ -1,6 +1,7 @@
 <UserControl xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             x:Class="ControlCatalog.Pages.TextBoxPage">
+             x:Class="ControlCatalog.Pages.TextBoxPage"
+             xmlns:sys="clr-namespace:System;assembly=netstandard">
   <StackPanel Orientation="Vertical" Spacing="4">
     <Label Classes="h1">TextBox</Label>
     <Label Classes="h2">A control into which the user can input text</Label>
@@ -11,12 +12,18 @@
               Spacing="16">
       <StackPanel Orientation="Vertical" Spacing="8">
         <TextBox Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit." Width="200" />
-        <TextBox Watermark="ReadOnly" IsReadOnly="True" Text="This is read only"/>
+        <TextBox Width="200" Watermark="ReadOnly" IsReadOnly="True" Text="This is read only"/>
         <TextBox Width="200" Watermark="Watermark" />
         <TextBox Width="200"
                  Watermark="Floating Watermark"
                  UseFloatingWatermark="True"
                  Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit."/>
+        
+        <TextBox Width="200" Text="Validation Error">
+          <DataValidationErrors.Error>
+            <sys:Exception /> 
+          </DataValidationErrors.Error>
+        </TextBox>
 
         <TextBox Width="200"
                  Watermark="Password Box"

From 78e2e2ef93381c11f70164843f03f92b8e703106 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 20:41:14 +0000
Subject: [PATCH 03/11] position datavalidation errors underneath textbox.

---
 src/Avalonia.Themes.Fluent/TextBox.xaml | 18 ++++--------------
 1 file changed, 4 insertions(+), 14 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/TextBox.xaml b/src/Avalonia.Themes.Fluent/TextBox.xaml
index 162835ae10..2303c438fc 100644
--- a/src/Avalonia.Themes.Fluent/TextBox.xaml
+++ b/src/Avalonia.Themes.Fluent/TextBox.xaml
@@ -37,15 +37,8 @@
     <Setter Property="Template">
       <ControlTemplate>
         <DockPanel>
-
-          <!-- TODO bind Content -> Header and ContentTemplate -> HeaderTemplate -->
-          <ContentPresenter x:Name="PART_HeaderContentPresenter"
-                            DockPanel.Dock="Top"
-                            TextBlock.FontWeight="Normal"
-                            TextBlock.Foreground="{DynamicResource TextControlHeaderForeground}"
-                            IsVisible="False"
-                            Margin="{DynamicResource TextBoxTopHeaderMargin}" />
-
+          <DataValidationErrors DockPanel.Dock="Bottom" Margin="0 10 0 0" />
+          
           <Panel>
             <Border
               Name="PART_BorderElement"
@@ -66,10 +59,8 @@
                              FontSize="{TemplateBinding FontSize}"
                              Text="{TemplateBinding Watermark}"
                              DockPanel.Dock="Top" />
-
-                  <DataValidationErrors>
-                    <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
-                                  VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
+                  <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
+                                VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
                       <Panel>
                         <TextBlock Name="PART_Watermark"
                                 Opacity="0.5"
@@ -97,7 +88,6 @@
                                       VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
                       </Panel>
                     </ScrollViewer>
-                  </DataValidationErrors>
                 </DockPanel>
                 <ContentPresenter Grid.Column="2" Grid.ColumnSpan="1" Content="{TemplateBinding InnerRightContent}"/>
               </Grid>

From cc712b6e0f8e3eab9e275f036a838fdf6dab6715 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 20:49:30 +0000
Subject: [PATCH 04/11] wrap control in datavalidation errors so it can be
 applied consistently.

---
 src/Avalonia.Themes.Fluent/DataValidationErrors.xaml | 2 +-
 src/Avalonia.Themes.Fluent/TextBox.xaml              | 6 ++----
 2 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml b/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml
index 1161a92e30..ed31f7b573 100644
--- a/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml
+++ b/src/Avalonia.Themes.Fluent/DataValidationErrors.xaml
@@ -14,7 +14,7 @@
   <Setter Property="Template">
     <ControlTemplate>
       <DockPanel LastChildFill="True">
-        <ContentControl
+        <ContentControl Margin="0 4 0 0"
           DockPanel.Dock="Bottom"
           ContentTemplate="{TemplateBinding ErrorTemplate}"
           DataContext="{TemplateBinding Owner}"
diff --git a/src/Avalonia.Themes.Fluent/TextBox.xaml b/src/Avalonia.Themes.Fluent/TextBox.xaml
index 2303c438fc..139a61abdf 100644
--- a/src/Avalonia.Themes.Fluent/TextBox.xaml
+++ b/src/Avalonia.Themes.Fluent/TextBox.xaml
@@ -36,9 +36,7 @@
     <Setter Property="ContextMenu" Value="{StaticResource DefaultTextBoxContextMenu}" />
     <Setter Property="Template">
       <ControlTemplate>
-        <DockPanel>
-          <DataValidationErrors DockPanel.Dock="Bottom" Margin="0 10 0 0" />
-          
+        <DataValidationErrors>
           <Panel>
             <Border
               Name="PART_BorderElement"
@@ -93,7 +91,7 @@
               </Grid>
             </Border>
           </Panel>
-        </DockPanel>
+        </DataValidationErrors>
       </ControlTemplate>
     </Setter>
   </Style>

From 76d3d013e34e0a1d9cd91daf0a319910f77f60c5 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 21:36:35 +0000
Subject: [PATCH 05/11] add datavalidations to button spinner.

---
 .../Pages/ButtonSpinnerPage.xaml              | 11 ++-
 src/Avalonia.Themes.Fluent/ButtonSpinner.xaml | 99 ++++++++++---------
 2 files changed, 61 insertions(+), 49 deletions(-)

diff --git a/samples/ControlCatalog/Pages/ButtonSpinnerPage.xaml b/samples/ControlCatalog/Pages/ButtonSpinnerPage.xaml
index c3f9f65dd9..4ac2330403 100644
--- a/samples/ControlCatalog/Pages/ButtonSpinnerPage.xaml
+++ b/samples/ControlCatalog/Pages/ButtonSpinnerPage.xaml
@@ -1,6 +1,7 @@
 <UserControl xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             x:Class="ControlCatalog.Pages.ButtonSpinnerPage">
+             x:Class="ControlCatalog.Pages.ButtonSpinnerPage"
+             xmlns:sys="clr-namespace:System;assembly=netstandard">
 
   <StackPanel Orientation="Vertical" Spacing="4">
     <TextBlock Classes="h1">ButtonSpinner</TextBlock>
@@ -19,6 +20,14 @@
                      ShowButtonSpinner="{Binding #showSpinCheck.IsChecked}">
         <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="Everest"/>
       </ButtonSpinner>
+      <ButtonSpinner MinHeight="30" Spin="OnSpin" ButtonSpinnerLocation="Left"
+                     AllowSpin="{Binding #allowSpinCheck.IsChecked}"
+                     ShowButtonSpinner="{Binding #showSpinCheck.IsChecked}">
+        <DataValidationErrors.Error>
+          <sys:Exception /> 
+        </DataValidationErrors.Error>
+        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="Everest"/>
+      </ButtonSpinner>
     </StackPanel>
   </StackPanel>
 
diff --git a/src/Avalonia.Themes.Fluent/ButtonSpinner.xaml b/src/Avalonia.Themes.Fluent/ButtonSpinner.xaml
index 82265ea282..12b4845522 100644
--- a/src/Avalonia.Themes.Fluent/ButtonSpinner.xaml
+++ b/src/Avalonia.Themes.Fluent/ButtonSpinner.xaml
@@ -65,56 +65,59 @@
     <Setter Property="VerticalContentAlignment" Value="Center" />
     <Setter Property="Template">
       <ControlTemplate>
-        <Border Background="{TemplateBinding Background}"
-                BorderBrush="{TemplateBinding BorderBrush}"
-                BorderThickness="{TemplateBinding BorderThickness}"
-                CornerRadius="{DynamicResource ControlCornerRadius}">
-          <Grid ColumnDefinitions="Auto,*,Auto">
-            <ContentPresenter Name="PART_ContentPresenter"
-                              Grid.Column="1"
-                              ContentTemplate="{TemplateBinding ContentTemplate}"
-                              Content="{TemplateBinding Content}"
-                              HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                              VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                              Padding="{TemplateBinding Padding}" />
+        <DataValidationErrors>
+          <Border Background="{TemplateBinding Background}"
+                  BorderBrush="{TemplateBinding BorderBrush}"
+                  BorderThickness="{TemplateBinding BorderThickness}"
+                  CornerRadius="{DynamicResource ControlCornerRadius}"
+                  MinHeight="{TemplateBinding MinHeight}">
+            <Grid ColumnDefinitions="Auto,*,Auto">
+              <ContentPresenter Name="PART_ContentPresenter"
+                                Grid.Column="1"
+                                ContentTemplate="{TemplateBinding ContentTemplate}"
+                                Content="{TemplateBinding Content}"
+                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                Padding="{TemplateBinding Padding}" />
 
-            <StackPanel Name="PART_SpinnerPanel"
-                        Orientation="Horizontal"
-                        IsVisible="{TemplateBinding ShowButtonSpinner}">
-              <RepeatButton Name="PART_IncreaseButton"
-                            Classes="ButtonSpinnerRepeatButton"
-                            VerticalContentAlignment="Center"
-                            Foreground="{TemplateBinding Foreground}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            Background="{TemplateBinding Background}"
-                            FontSize="{TemplateBinding FontSize}">
-                <Path Fill="{TemplateBinding Foreground}"
-                      Width="16"
-                      Height="8"
-                      Stretch="Uniform"
-                      HorizontalAlignment="Center"
-                      VerticalAlignment="Center"
-                      Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
-              </RepeatButton>
+              <StackPanel Name="PART_SpinnerPanel"
+                          Orientation="Horizontal"
+                          IsVisible="{TemplateBinding ShowButtonSpinner}">
+                <RepeatButton Name="PART_IncreaseButton"
+                              Classes="ButtonSpinnerRepeatButton"
+                              VerticalContentAlignment="Center"
+                              Foreground="{TemplateBinding Foreground}"
+                              BorderBrush="{TemplateBinding BorderBrush}"
+                              Background="{TemplateBinding Background}"
+                              FontSize="{TemplateBinding FontSize}">
+                  <Path Fill="{TemplateBinding Foreground}"
+                        Width="16"
+                        Height="8"
+                        Stretch="Uniform"
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        Data="{StaticResource ButtonSpinnerIncreaseButtonIcon}" />
+                </RepeatButton>
 
-              <RepeatButton Name="PART_DecreaseButton"
-                            Classes="ButtonSpinnerRepeatButton"
-                            Foreground="{TemplateBinding Foreground}"
-                            BorderBrush="{TemplateBinding BorderBrush}"
-                            Background="{TemplateBinding Background}"
-                            VerticalContentAlignment="Center"
-                            FontSize="{TemplateBinding FontSize}">
-                <Path Fill="{TemplateBinding Foreground}"
-                      Width="16"
-                      Height="8"
-                      Stretch="Uniform"
-                      HorizontalAlignment="Center"
-                      VerticalAlignment="Center"
-                      Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
-              </RepeatButton>
-            </StackPanel>
-          </Grid>
-        </Border>
+                <RepeatButton Name="PART_DecreaseButton"
+                              Classes="ButtonSpinnerRepeatButton"
+                              Foreground="{TemplateBinding Foreground}"
+                              BorderBrush="{TemplateBinding BorderBrush}"
+                              Background="{TemplateBinding Background}"
+                              VerticalContentAlignment="Center"
+                              FontSize="{TemplateBinding FontSize}">
+                  <Path Fill="{TemplateBinding Foreground}"
+                        Width="16"
+                        Height="8"
+                        Stretch="Uniform"
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        Data="{StaticResource ButtonSpinnerDecreaseButtonIcon}" />
+                </RepeatButton>
+              </StackPanel>
+            </Grid>
+          </Border>
+        </DataValidationErrors>
       </ControlTemplate>
     </Setter>
   </Style>

From 62ca81e9fbfbba9a3436553d4a4d8bb4f108b98b Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 21:49:41 +0000
Subject: [PATCH 06/11] add datavalidation errors to combobox.

---
 .../ControlCatalog/Pages/ComboBoxPage.xaml    |  13 +-
 src/Avalonia.Controls/Primitives/Popup.cs     |   1 +
 src/Avalonia.Themes.Fluent/ComboBox.xaml      | 201 +++++++++---------
 3 files changed, 117 insertions(+), 98 deletions(-)

diff --git a/samples/ControlCatalog/Pages/ComboBoxPage.xaml b/samples/ControlCatalog/Pages/ComboBoxPage.xaml
index 369f703718..025b85492c 100644
--- a/samples/ControlCatalog/Pages/ComboBoxPage.xaml
+++ b/samples/ControlCatalog/Pages/ComboBoxPage.xaml
@@ -1,6 +1,7 @@
 <UserControl xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             x:Class="ControlCatalog.Pages.ComboBoxPage">
+             x:Class="ControlCatalog.Pages.ComboBoxPage"
+             xmlns:sys="clr-namespace:System;assembly=netstandard">
   <StackPanel Orientation="Vertical" Spacing="4">
     <TextBlock Classes="h1">ComboBox</TextBlock>
     <TextBlock Classes="h2">A drop-down list.</TextBlock>
@@ -35,6 +36,16 @@
            </DataTemplate>
          </ComboBox.ItemTemplate>
        </ComboBox>
+      
+      <ComboBox PlaceholderText="Pick an Item">
+        <ComboBoxItem>Inline Items</ComboBoxItem>
+        <ComboBoxItem>Inline Item 2</ComboBoxItem>
+        <ComboBoxItem>Inline Item 3</ComboBoxItem>
+        <ComboBoxItem>Inline Item 4</ComboBoxItem>
+        <DataValidationErrors.Error>
+          <sys:Exception /> 
+        </DataValidationErrors.Error>
+      </ComboBox>
     </StackPanel>
 
   </StackPanel>
diff --git a/src/Avalonia.Controls/Primitives/Popup.cs b/src/Avalonia.Controls/Primitives/Popup.cs
index becb489557..b445de0472 100644
--- a/src/Avalonia.Controls/Primitives/Popup.cs
+++ b/src/Avalonia.Controls/Primitives/Popup.cs
@@ -265,6 +265,7 @@ namespace Avalonia.Controls.Primitives
         /// <summary>
         /// Gets or sets the control that is used to determine the popup's position.
         /// </summary>
+        [ResolveByName]
         public Control? PlacementTarget
         {
             get { return GetValue(PlacementTargetProperty); }
diff --git a/src/Avalonia.Themes.Fluent/ComboBox.xaml b/src/Avalonia.Themes.Fluent/ComboBox.xaml
index 8155264f18..2eee656dc6 100644
--- a/src/Avalonia.Themes.Fluent/ComboBox.xaml
+++ b/src/Avalonia.Themes.Fluent/ComboBox.xaml
@@ -44,105 +44,107 @@
     <Setter Property="PlaceholderForeground" Value="{DynamicResource ComboBoxPlaceHolderForeground}" />
     <Setter Property="Template">
       <ControlTemplate>
-        <Grid RowDefinitions="Auto, *, Auto"
-              ColumnDefinitions="*,32">
-          <ContentPresenter x:Name="HeaderContentPresenter"
-                            Grid.Row="0"
+        <DataValidationErrors>
+          <Grid RowDefinitions="Auto, *, Auto"
+                ColumnDefinitions="*,32">
+            <ContentPresenter x:Name="HeaderContentPresenter"
+                              Grid.Row="0"
+                              Grid.Column="0"
+                              Grid.ColumnSpan="2"
+                              IsVisible="False"
+                              TextBlock.FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}"
+                              Margin="{DynamicResource ComboBoxTopHeaderMargin}"
+                              VerticalAlignment="Top" />
+            <Border x:Name="Background"
+                    Grid.Row="1"
+                    Grid.Column="0"
+                    Grid.ColumnSpan="2"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    MinWidth="{DynamicResource ComboBoxThemeMinWidth}" />
+
+            <Border x:Name="HighlightBackground"
+                    Grid.Row="1"
+                    Grid.Column="0"
+                    Grid.ColumnSpan="2"
+                    Background="{DynamicResource ComboBoxBackgroundUnfocused}"
+                    BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
+                    BorderThickness="{TemplateBinding BorderThickness}" />
+            <TextBlock x:Name="PlaceholderTextBlock"
+                       Grid.Row="1"
+                       Grid.Column="0"
+                       HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                       VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                       Margin="{TemplateBinding Padding}"
+                       Text="{TemplateBinding PlaceholderText}"
+                       Foreground="{TemplateBinding PlaceholderForeground}"
+                       IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}" />
+            <ContentControl x:Name="ContentPresenter"
+                            Content="{TemplateBinding SelectionBoxItem}"
+                            ContentTemplate="{TemplateBinding ItemTemplate}"
+                            Grid.Row="1"
                             Grid.Column="0"
-                            Grid.ColumnSpan="2"
-                            IsVisible="False"
-                            TextBlock.FontWeight="{DynamicResource ComboBoxHeaderThemeFontWeight}"
-                            Margin="{DynamicResource ComboBoxTopHeaderMargin}"
-                            VerticalAlignment="Top" />
-          <Border x:Name="Background"
-                  Grid.Row="1"
-                  Grid.Column="0"
-                  Grid.ColumnSpan="2"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  MinWidth="{DynamicResource ComboBoxThemeMinWidth}" />
-
-          <Border x:Name="HighlightBackground"
-                  Grid.Row="1"
-                  Grid.Column="0"
-                  Grid.ColumnSpan="2"
-                  Background="{DynamicResource ComboBoxBackgroundUnfocused}"
-                  BorderBrush="{DynamicResource ComboBoxBackgroundBorderBrushUnfocused}"
-                  BorderThickness="{TemplateBinding BorderThickness}" />
-          <TextBlock x:Name="PlaceholderTextBlock"
+                            Margin="{TemplateBinding Padding}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
+
+            <Border x:Name="DropDownOverlay"
+                    Grid.Row="1"
+                    Grid.Column="1"
+                    Background="Transparent"
+                    Margin="0,1,1,1"
+                    Width="30"
+                    IsVisible="False"
+                    HorizontalAlignment="Right" />
+
+            <Viewbox UseLayoutRounding="False"
+                     MinHeight="{DynamicResource ComboBoxMinHeight}"
                      Grid.Row="1"
-                     Grid.Column="0"
-                     HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                     VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                     Margin="{TemplateBinding Padding}"
-                     Text="{TemplateBinding PlaceholderText}"
-                     Foreground="{TemplateBinding PlaceholderForeground}"
-                     IsVisible="{TemplateBinding SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}" />
-          <ContentControl x:Name="ContentPresenter"
-                          Content="{TemplateBinding SelectionBoxItem}"
-                          ContentTemplate="{TemplateBinding ItemTemplate}"
-                          Grid.Row="1"
-                          Grid.Column="0"
-                          Margin="{TemplateBinding Padding}"
-                          HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                          VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
-
-          <Border x:Name="DropDownOverlay"
-                  Grid.Row="1"
-                  Grid.Column="1"
-                  Background="Transparent"
-                  Margin="0,1,1,1"
-                  Width="30"
-                  IsVisible="False"
-                  HorizontalAlignment="Right" />
-
-          <Viewbox UseLayoutRounding="False"
-                   MinHeight="{DynamicResource ComboBoxMinHeight}"
-                   Grid.Row="1"
-                   Grid.Column="1"
-                   IsHitTestVisible="False"
-                   Margin="0,0,10,0"
-                   Height="12"
-                   Width="12"
-                   HorizontalAlignment="Right"
-                   VerticalAlignment="Center">
-            <Panel>
-              <Panel Height="12"
-                     Width="12" />
-              <Path x:Name="DropDownGlyph"
-                    Stretch="Uniform"
-                    VerticalAlignment="Center"
-                    Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
-            </Panel>
-          </Viewbox>
-          <Popup Name="PART_Popup"
-                 WindowManagerAddShadowHint="False"
-                 IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}"
-                 MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                 MaxHeight="{TemplateBinding MaxDropDownHeight}"
-                 PlacementTarget="{TemplateBinding}"
-                 IsLightDismissEnabled="True">
-            <Border x:Name="PopupBorder"
-                    Background="{DynamicResource ComboBoxDropDownBackground}"
-                    BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
-                    BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
-                    Margin="0,-1,0,-1"
-                    Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
-                    HorizontalAlignment="Stretch"
-                    CornerRadius="{DynamicResource OverlayCornerRadius}">
-              <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-                            VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-                <ItemsPresenter Name="PART_ItemsPresenter"
-                                Items="{TemplateBinding Items}"
-                                Margin="{DynamicResource ComboBoxDropdownContentMargin}"
-                                ItemsPanel="{TemplateBinding ItemsPanel}"
-                                ItemTemplate="{TemplateBinding ItemTemplate}"
-                                VirtualizationMode="{TemplateBinding VirtualizationMode}" />
-              </ScrollViewer>
-            </Border>
-          </Popup>
-        </Grid>
+                     Grid.Column="1"
+                     IsHitTestVisible="False"
+                     Margin="0,0,10,0"
+                     Height="12"
+                     Width="12"
+                     HorizontalAlignment="Right"
+                     VerticalAlignment="Center">
+              <Panel>
+                <Panel Height="12"
+                       Width="12" />
+                <Path x:Name="DropDownGlyph"
+                      Stretch="Uniform"
+                      VerticalAlignment="Center"
+                      Data="M1939 486L2029 576L1024 1581L19 576L109 486L1024 1401L1939 486Z" />
+              </Panel>
+            </Viewbox>
+            <Popup Name="PART_Popup"
+                   WindowManagerAddShadowHint="False"
+                   IsOpen="{TemplateBinding IsDropDownOpen, Mode=TwoWay}"
+                   MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                   MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                   PlacementTarget="Background"
+                   IsLightDismissEnabled="True">
+              <Border x:Name="PopupBorder"
+                      Background="{DynamicResource ComboBoxDropDownBackground}"
+                      BorderBrush="{DynamicResource ComboBoxDropDownBorderBrush}"
+                      BorderThickness="{DynamicResource ComboBoxDropdownBorderThickness}"
+                      Margin="0,-1,0,-1"
+                      Padding="{DynamicResource ComboBoxDropdownBorderPadding}"
+                      HorizontalAlignment="Stretch"
+                      CornerRadius="{DynamicResource OverlayCornerRadius}">
+                <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                              VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+                  <ItemsPresenter Name="PART_ItemsPresenter"
+                                  Items="{TemplateBinding Items}"
+                                  Margin="{DynamicResource ComboBoxDropdownContentMargin}"
+                                  ItemsPanel="{TemplateBinding ItemsPanel}"
+                                  ItemTemplate="{TemplateBinding ItemTemplate}"
+                                  VirtualizationMode="{TemplateBinding VirtualizationMode}" />
+                </ScrollViewer>
+              </Border>
+            </Popup>
+          </Grid>
+        </DataValidationErrors>
       </ControlTemplate>
     </Setter>
   </Style>
@@ -232,4 +234,9 @@
   <Style Selector="ComboBox /template/ Border#HighlightBackground">
     <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
   </Style>
+  
+  <!-- Error State -->
+  <Style Selector="ComboBox:error /template/ Border#Background">
+    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+  </Style>
 </Styles>

From 18ac4010070cfb1e77502fb34840da45bce67958 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 21:56:12 +0000
Subject: [PATCH 07/11] add example of datavalidation on autocomplete box.

---
 samples/ControlCatalog/Pages/AutoCompleteBoxPage.xaml | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/samples/ControlCatalog/Pages/AutoCompleteBoxPage.xaml b/samples/ControlCatalog/Pages/AutoCompleteBoxPage.xaml
index a49616e543..1a53217842 100644
--- a/samples/ControlCatalog/Pages/AutoCompleteBoxPage.xaml
+++ b/samples/ControlCatalog/Pages/AutoCompleteBoxPage.xaml
@@ -1,5 +1,6 @@
 <UserControl xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:sys="clr-namespace:System;assembly=netstandard"
              x:Class="ControlCatalog.Pages.AutoCompleteBoxPage">
   <StackPanel Orientation="Vertical" Spacing="4">
     <TextBlock Classes="h1">AutoCompleteBox</TextBlock>
@@ -56,6 +57,16 @@
                          Width="200"
                          Margin="0,0,0,8"
                          FilterMode="None"/>
+        
+        <TextBlock Text="With Validation Errors"/>
+        <AutoCompleteBox Name="ValidationErrors"
+                         Width="200"
+                         Margin="0,0,0,8"
+                         FilterMode="None">
+          <DataValidationErrors.Error>
+            <sys:Exception /> 
+          </DataValidationErrors.Error>
+        </AutoCompleteBox>
       </StackPanel>
     </StackPanel>
   </StackPanel>

From a0ce794c41a15aa336e36d96af45361b9ebc27dc Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 22:02:49 +0000
Subject: [PATCH 08/11] make numeric up down work with validation errors.

---
 samples/ControlCatalog/Pages/NumericUpDownPage.xaml | 10 ++++++++++
 src/Avalonia.Themes.Fluent/NumericUpDown.xaml       |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/samples/ControlCatalog/Pages/NumericUpDownPage.xaml b/samples/ControlCatalog/Pages/NumericUpDownPage.xaml
index 0d7e5da17f..d75622f1fb 100644
--- a/samples/ControlCatalog/Pages/NumericUpDownPage.xaml
+++ b/samples/ControlCatalog/Pages/NumericUpDownPage.xaml
@@ -1,5 +1,6 @@
 <UserControl xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:sys="clr-namespace:System;assembly=netstandard"
              x:Class="ControlCatalog.Pages.NumericUpDownPage">
   <StackPanel Orientation="Vertical" Spacing="4">
     <TextBlock Margin="2" Classes="h1">Numeric up-down control</TextBlock>
@@ -75,6 +76,15 @@
       <NumericUpDown Name="upDown" Minimum="0" Maximum="10" Increment="0.5"
                      CultureInfo="en-US" VerticalAlignment="Center"
                      Watermark="Enter text" FormatString="{Binding SelectedFormat.Value}"/>
+      
+      <TextBlock FontSize="14" FontWeight="Bold" VerticalAlignment="Center">NumericUpDown with Validation Errors:</TextBlock>
+      <NumericUpDown Minimum="0" Maximum="10" Increment="0.5"
+                     CultureInfo="en-US" VerticalAlignment="Center"
+                     Watermark="Enter text" FormatString="{Binding SelectedFormat.Value}">
+        <DataValidationErrors.Error>
+          <sys:Exception /> 
+        </DataValidationErrors.Error>
+      </NumericUpDown>
     </StackPanel>
 
   </StackPanel>
diff --git a/src/Avalonia.Themes.Fluent/NumericUpDown.xaml b/src/Avalonia.Themes.Fluent/NumericUpDown.xaml
index cc5e2234f8..1da48ebd8a 100644
--- a/src/Avalonia.Themes.Fluent/NumericUpDown.xaml
+++ b/src/Avalonia.Themes.Fluent/NumericUpDown.xaml
@@ -39,6 +39,7 @@
                        VerticalContentAlignment="Stretch"
                        AllowSpin="{TemplateBinding AllowSpin}"
                        ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}"
+                       DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                        ButtonSpinnerLocation="{TemplateBinding ButtonSpinnerLocation}">
           <TextBox Name="PART_TextBox"
                    Background="Transparent"
@@ -46,7 +47,6 @@
                    Margin="-1"
                    Padding="{TemplateBinding Padding}"
                    Watermark="{TemplateBinding Watermark}"
-                   DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                    IsReadOnly="{TemplateBinding IsReadOnly}"
                    Text="{TemplateBinding Text}"
                    AcceptsReturn="False"

From ec937153a4f449c3dcbe764bffada0d75488bf6d Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 22:22:43 +0000
Subject: [PATCH 09/11] add datavalidation to date and time pickers.

---
 .../Pages/DateTimePickerPage.xaml             |  20 +++
 src/Avalonia.Themes.Fluent/DatePicker.xaml    | 143 +++++++--------
 src/Avalonia.Themes.Fluent/TimePicker.xaml    | 164 +++++++++---------
 3 files changed, 180 insertions(+), 147 deletions(-)

diff --git a/samples/ControlCatalog/Pages/DateTimePickerPage.xaml b/samples/ControlCatalog/Pages/DateTimePickerPage.xaml
index af6b6e8605..45056a9a76 100644
--- a/samples/ControlCatalog/Pages/DateTimePickerPage.xaml
+++ b/samples/ControlCatalog/Pages/DateTimePickerPage.xaml
@@ -2,6 +2,7 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:sys="clr-namespace:System;assembly=netstandard"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:Class="ControlCatalog.Pages.DateTimePickerPage">
   <StackPanel Orientation="Vertical" Spacing="4" HorizontalAlignment="Stretch">
@@ -30,6 +31,16 @@
         </Panel>
       </StackPanel>
       
+      
+      <Border BorderBrush="{DynamicResource SystemControlHighlightBaseLowBrush}"
+              BorderThickness="1" Padding="15">
+        <DatePicker Header="Pick a date">
+          <DataValidationErrors.Error>
+            <sys:Exception /> 
+          </DataValidationErrors.Error>
+        </DatePicker>
+      </Border>
+      
       <TextBlock FontSize="18">A DatePicker with day formatted and year hidden.</TextBlock>
       <StackPanel Orientation="Vertical">
         <Border BorderBrush="{DynamicResource SystemControlHighlightBaseLowBrush}"
@@ -66,6 +77,15 @@
           </TextBlock>
         </Panel>
       </StackPanel>
+      
+      <Border BorderBrush="{DynamicResource SystemControlHighlightBaseLowBrush}"
+              BorderThickness="1" Padding="15">
+        <TimePicker Header="Pick a time">
+          <DataValidationErrors.Error>
+            <sys:Exception /> 
+          </DataValidationErrors.Error>
+        </TimePicker>
+      </Border>
 
       <TextBlock FontSize="18">A TimePicker with a header and minute increments specified.</TextBlock>
       <StackPanel Orientation="Vertical">
diff --git a/src/Avalonia.Themes.Fluent/DatePicker.xaml b/src/Avalonia.Themes.Fluent/DatePicker.xaml
index 6fbfa1bbf7..b6e36861e0 100644
--- a/src/Avalonia.Themes.Fluent/DatePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/DatePicker.xaml
@@ -125,77 +125,79 @@
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="Template">
       <ControlTemplate>
-        <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-          <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
-                            Content="{TemplateBinding Header}"
-                            ContentTemplate="{TemplateBinding HeaderTemplate}"
-                            Margin="{DynamicResource DatePickerTopHeaderMargin}"
-                            MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
-                            HorizontalAlignment="Stretch"
-                            VerticalAlignment="Top"/>
+        <DataValidationErrors>
+          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+            <ContentPresenter Name="HeaderContentPresenter" Grid.Row="0"
+                              Content="{TemplateBinding Header}"
+                              ContentTemplate="{TemplateBinding HeaderTemplate}"
+                              Margin="{DynamicResource DatePickerTopHeaderMargin}"
+                              MaxWidth="{DynamicResource DatePickerThemeMaxWidth}"
+                              HorizontalAlignment="Stretch"
+                              VerticalAlignment="Top"/>
 
-          <Button Name="FlyoutButton" Grid.Row="1"
-                  Foreground="{TemplateBinding Foreground}"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  IsEnabled="{TemplateBinding IsEnabled}"
-                  MinWidth="{StaticResource DatePickerThemeMinWidth}"
-                  MaxWidth="{StaticResource DatePickerThemeMaxWidth}"
-                  HorizontalAlignment="Stretch"
-                  VerticalAlignment="Stretch"
-                  HorizontalContentAlignment="Stretch"
-                  VerticalContentAlignment="Stretch"
-                  TemplatedControl.IsTemplateFocusTarget="True">
-            <Button.Template>
-              <ControlTemplate>
-                <ContentPresenter Name="ContentPresenter"
-                                  BorderBrush="{TemplateBinding BorderBrush}"
-                                  Background="{TemplateBinding Background}"
-                                  BorderThickness="{TemplateBinding BorderThickness}"
-                                  Content="{TemplateBinding Content}"
-                                  TextBlock.Foreground="{TemplateBinding Foreground}"
-                                  HorizontalContentAlignment="Stretch"
-                                  VerticalContentAlignment="Stretch"
-                                  CornerRadius="{DynamicResource ControlCornerRadius}"/>
-              </ControlTemplate>
-            </Button.Template>
-            <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
-              <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
-                         Padding="{DynamicResource DatePickerHostPadding}"
-                         FontFamily="{TemplateBinding FontFamily}"
-                         FontWeight="{TemplateBinding FontWeight}"
-                         FontSize="{TemplateBinding FontSize}"/>
-              <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
-                         Padding="{DynamicResource DatePickerHostMonthPadding}"
-                         FontFamily="{TemplateBinding FontFamily}"
-                         FontWeight="{TemplateBinding FontWeight}"
-                         FontSize="{TemplateBinding FontSize}"/>
-              <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
-                         Padding="{DynamicResource DatePickerHostPadding}"
-                         FontFamily="{TemplateBinding FontFamily}"
-                         FontWeight="{TemplateBinding FontWeight}"
-                         FontSize="{TemplateBinding FontSize}"/>
-              <Rectangle x:Name="FirstSpacer"
-                    Fill="{DynamicResource DatePickerSpacerFill}"
-                    HorizontalAlignment="Center"
-                    Width="1"
-                    Grid.Column="1" />
-              <Rectangle x:Name="SecondSpacer"
-                    Fill="{DynamicResource DatePickerSpacerFill}"
-                    HorizontalAlignment="Center"
-                    Width="1"
-                    Grid.Column="3" />
-            </Grid>
-          </Button>
+            <Button Name="FlyoutButton" Grid.Row="1"
+                    Foreground="{TemplateBinding Foreground}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    IsEnabled="{TemplateBinding IsEnabled}"
+                    MinWidth="{StaticResource DatePickerThemeMinWidth}"
+                    MaxWidth="{StaticResource DatePickerThemeMaxWidth}"
+                    HorizontalAlignment="Stretch"
+                    VerticalAlignment="Stretch"
+                    HorizontalContentAlignment="Stretch"
+                    VerticalContentAlignment="Stretch"
+                    TemplatedControl.IsTemplateFocusTarget="True">
+              <Button.Template>
+                <ControlTemplate>
+                  <ContentPresenter Name="ContentPresenter"
+                                    BorderBrush="{TemplateBinding BorderBrush}"
+                                    Background="{TemplateBinding Background}"
+                                    BorderThickness="{TemplateBinding BorderThickness}"
+                                    Content="{TemplateBinding Content}"
+                                    TextBlock.Foreground="{TemplateBinding Foreground}"
+                                    HorizontalContentAlignment="Stretch"
+                                    VerticalContentAlignment="Stretch"
+                                    CornerRadius="{DynamicResource ControlCornerRadius}"/>
+                </ControlTemplate>
+              </Button.Template>
+              <Grid Name="ButtonContentGrid" ColumnDefinitions="78*,Auto,132*,Auto,78*">
+                <TextBlock Name="DayText" Text="day" HorizontalAlignment="Center"
+                           Padding="{DynamicResource DatePickerHostPadding}"
+                           FontFamily="{TemplateBinding FontFamily}"
+                           FontWeight="{TemplateBinding FontWeight}"
+                           FontSize="{TemplateBinding FontSize}"/>
+                <TextBlock Name="MonthText" Text="month" TextAlignment="Left"
+                           Padding="{DynamicResource DatePickerHostMonthPadding}"
+                           FontFamily="{TemplateBinding FontFamily}"
+                           FontWeight="{TemplateBinding FontWeight}"
+                           FontSize="{TemplateBinding FontSize}"/>
+                <TextBlock Name="YearText" Text="year" HorizontalAlignment="Center"
+                           Padding="{DynamicResource DatePickerHostPadding}"
+                           FontFamily="{TemplateBinding FontFamily}"
+                           FontWeight="{TemplateBinding FontWeight}"
+                           FontSize="{TemplateBinding FontSize}"/>
+                <Rectangle x:Name="FirstSpacer"
+                      Fill="{DynamicResource DatePickerSpacerFill}"
+                      HorizontalAlignment="Center"
+                      Width="1"
+                      Grid.Column="1" />
+                <Rectangle x:Name="SecondSpacer"
+                      Fill="{DynamicResource DatePickerSpacerFill}"
+                      HorizontalAlignment="Center"
+                      Width="1"
+                      Grid.Column="3" />
+              </Grid>
+            </Button>
 
-          <Popup Name="Popup" WindowManagerAddShadowHint="False"
-                 IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
-                 PlacementMode="Bottom">
-            <DatePickerPresenter Name="PickerPresenter" />
-          </Popup>
+            <Popup Name="Popup" WindowManagerAddShadowHint="False"
+                   IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
+                   PlacementMode="Bottom">
+              <DatePickerPresenter Name="PickerPresenter" />
+            </Popup>
 
-        </Grid>
+          </Grid>
+        </DataValidationErrors>
       </ControlTemplate>
     </Setter>
   </Style>
@@ -228,6 +230,11 @@
   <Style Selector="DatePicker:hasnodate /template/ Button#FlyoutButton TextBlock">
     <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
   </Style>
+  
+  <Style Selector="DatePicker:error /template/ Button#FlyoutButton /template/ ContentPresenter">
+    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+  </Style>
+  
 
   <!--WinUI: DatePickerFlyoutPresenter-->
   <Style Selector="DatePickerPresenter">
diff --git a/src/Avalonia.Themes.Fluent/TimePicker.xaml b/src/Avalonia.Themes.Fluent/TimePicker.xaml
index 84352213e1..91969d8733 100644
--- a/src/Avalonia.Themes.Fluent/TimePicker.xaml
+++ b/src/Avalonia.Themes.Fluent/TimePicker.xaml
@@ -41,94 +41,96 @@
     <Setter Property="VerticalAlignment" Value="Center" />
     <Setter Property="Template">
       <ControlTemplate>
-        <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
-          <ContentPresenter x:Name="HeaderContentPresenter"
-                 Grid.Row="0"
-                 Content="{TemplateBinding Header}"
-                 ContentTemplate="{TemplateBinding HeaderTemplate}"
-                 Margin="{DynamicResource TimePickerTopHeaderMargin}"
-                 MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
-                 TextBlock.Foreground="{DynamicResource TimePickerHeaderForeground}"
-                 HorizontalAlignment="Stretch"
-                 VerticalAlignment="Top" />
+        <DataValidationErrors>
+          <Grid Name="LayoutRoot" Margin="{TemplateBinding Padding}" RowDefinitions="Auto,*">
+            <ContentPresenter x:Name="HeaderContentPresenter"
+                   Grid.Row="0"
+                   Content="{TemplateBinding Header}"
+                   ContentTemplate="{TemplateBinding HeaderTemplate}"
+                   Margin="{DynamicResource TimePickerTopHeaderMargin}"
+                   MaxWidth="{DynamicResource TimePickerThemeMaxWidth}"
+                   TextBlock.Foreground="{DynamicResource TimePickerHeaderForeground}"
+                   HorizontalAlignment="Stretch"
+                   VerticalAlignment="Top" />
 
-          <Button x:Name="FlyoutButton"
-                  Grid.Row="1"
-                  Foreground="{TemplateBinding Foreground}"
-                  Background="{TemplateBinding Background}"
-                  BorderBrush="{TemplateBinding BorderBrush}"
-                  BorderThickness="{TemplateBinding BorderThickness}"
-                  IsEnabled="{TemplateBinding IsEnabled}"
-                  MinWidth="{StaticResource TimePickerThemeMinWidth}"
-                  MaxWidth="{StaticResource TimePickerThemeMaxWidth}"
-                  HorizontalAlignment="Stretch"
-                  HorizontalContentAlignment="Stretch"
-                  VerticalAlignment="Top"
-                  VerticalContentAlignment="Stretch">
-            <Button.Template>
-              <ControlTemplate>
-                <ContentPresenter Name="ContentPresenter"
-                                BorderBrush="{TemplateBinding BorderBrush}"
-                                Background="{TemplateBinding Background}"
-                                BorderThickness="{TemplateBinding BorderThickness}"
-                                Content="{TemplateBinding Content}"
-                                TextBlock.Foreground="{TemplateBinding Foreground}"
-                                HorizontalContentAlignment="Stretch"
-                                VerticalContentAlignment="Stretch"
-                                CornerRadius="{DynamicResource ControlCornerRadius}" />
-              </ControlTemplate>
-            </Button.Template>
+            <Button x:Name="FlyoutButton"
+                    Grid.Row="1"
+                    Foreground="{TemplateBinding Foreground}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    IsEnabled="{TemplateBinding IsEnabled}"
+                    MinWidth="{StaticResource TimePickerThemeMinWidth}"
+                    MaxWidth="{StaticResource TimePickerThemeMaxWidth}"
+                    HorizontalAlignment="Stretch"
+                    HorizontalContentAlignment="Stretch"
+                    VerticalAlignment="Top"
+                    VerticalContentAlignment="Stretch">
+              <Button.Template>
+                <ControlTemplate>
+                  <ContentPresenter Name="ContentPresenter"
+                                  BorderBrush="{TemplateBinding BorderBrush}"
+                                  Background="{TemplateBinding Background}"
+                                  BorderThickness="{TemplateBinding BorderThickness}"
+                                  Content="{TemplateBinding Content}"
+                                  TextBlock.Foreground="{TemplateBinding Foreground}"
+                                  HorizontalContentAlignment="Stretch"
+                                  VerticalContentAlignment="Stretch"
+                                  CornerRadius="{DynamicResource ControlCornerRadius}" />
+                </ControlTemplate>
+              </Button.Template>
 
-            <Grid Name="FlyoutButtonContentGrid">
-              <!--Ignore col defs here, set in code-->
-              <Border x:Name="FirstPickerHost" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <TextBlock x:Name="HourTextBlock"
-                    HorizontalAlignment="Center"
-                    Padding="{DynamicResource TimePickerHostPadding}"
-                    FontFamily="{TemplateBinding FontFamily}"
-                    FontWeight="{TemplateBinding FontWeight}"
-                    FontSize="{TemplateBinding FontSize}" />
-              </Border>
+              <Grid Name="FlyoutButtonContentGrid">
+                <!--Ignore col defs here, set in code-->
+                <Border x:Name="FirstPickerHost" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <TextBlock x:Name="HourTextBlock"
+                      HorizontalAlignment="Center"
+                      Padding="{DynamicResource TimePickerHostPadding}"
+                      FontFamily="{TemplateBinding FontFamily}"
+                      FontWeight="{TemplateBinding FontWeight}"
+                      FontSize="{TemplateBinding FontSize}" />
+                </Border>
 
-              <Rectangle Name="FirstColumnDivider"
-                  Fill="{DynamicResource TimePickerSpacerFill}"
-                  HorizontalAlignment="Center"
-                  Width="{DynamicResource TimePickerSpacerThemeWidth}"
-                  Grid.Column="1" />
-
-              <Border x:Name="SecondPickerHost" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <TextBlock x:Name="MinuteTextBlock"
+                <Rectangle Name="FirstColumnDivider"
+                    Fill="{DynamicResource TimePickerSpacerFill}"
                     HorizontalAlignment="Center"
-                    Padding="{DynamicResource TimePickerHostPadding}"
-                    FontFamily="{TemplateBinding FontFamily}"
-                    FontWeight="{TemplateBinding FontWeight}"
-                    FontSize="{TemplateBinding FontSize}"/>
-              </Border>
+                    Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                    Grid.Column="1" />
 
-              <Rectangle Name="SecondColumnDivider"
-                  Fill="{DynamicResource TimePickerSpacerFill}"
-                  HorizontalAlignment="Center"
-                  Width="{DynamicResource TimePickerSpacerThemeWidth}"
-                  Grid.Column="3" />
+                <Border x:Name="SecondPickerHost" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <TextBlock x:Name="MinuteTextBlock"
+                      HorizontalAlignment="Center"
+                      Padding="{DynamicResource TimePickerHostPadding}"
+                      FontFamily="{TemplateBinding FontFamily}"
+                      FontWeight="{TemplateBinding FontWeight}"
+                      FontSize="{TemplateBinding FontSize}"/>
+                </Border>
 
-              <Border x:Name="ThirdPickerHost" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                <TextBlock x:Name="PeriodTextBlock"
+                <Rectangle Name="SecondColumnDivider"
+                    Fill="{DynamicResource TimePickerSpacerFill}"
                     HorizontalAlignment="Center"
-                    Padding="{DynamicResource TimePickerHostPadding}"
-                    FontFamily="{TemplateBinding FontFamily}"
-                    FontWeight="{TemplateBinding FontWeight}"
-                    FontSize="{TemplateBinding FontSize}" />
-              </Border>
-            </Grid>
-          </Button>
+                    Width="{DynamicResource TimePickerSpacerThemeWidth}"
+                    Grid.Column="3" />
+
+                <Border x:Name="ThirdPickerHost" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                  <TextBlock x:Name="PeriodTextBlock"
+                      HorizontalAlignment="Center"
+                      Padding="{DynamicResource TimePickerHostPadding}"
+                      FontFamily="{TemplateBinding FontFamily}"
+                      FontWeight="{TemplateBinding FontWeight}"
+                      FontSize="{TemplateBinding FontSize}" />
+                </Border>
+              </Grid>
+            </Button>
 
-          <Popup Name="Popup" WindowManagerAddShadowHint="False"
-                 IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
-                 PlacementMode="Bottom">
-            <TimePickerPresenter Name="PickerPresenter" />
-          </Popup>
+            <Popup Name="Popup" WindowManagerAddShadowHint="False"
+                   IsLightDismissEnabled="True" PlacementTarget="{TemplateBinding}"
+                   PlacementMode="Bottom">
+              <TimePickerPresenter Name="PickerPresenter" />
+            </Popup>
 
-        </Grid>
+          </Grid>
+        </DataValidationErrors>
       </ControlTemplate>
     </Setter>
   </Style>
@@ -161,6 +163,10 @@
   <Style Selector="TimePicker:hasnotime /template/ Button#FlyoutButton TextBlock">
     <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
   </Style>
+  
+  <Style Selector="TimePicker:error /template/ Button#FlyoutButton /template/ ContentPresenter">
+    <Setter Property="BorderBrush" Value="{DynamicResource SystemControlErrorTextForegroundBrush}"/>
+  </Style>
 
   <Style Selector="TimePickerPresenter">
     <Setter Property="Width" Value="242" />

From 6435fc3ad0e1b6d082c9415a5077769730b26506 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Wed, 28 Oct 2020 22:28:18 +0000
Subject: [PATCH 10/11] Add validation to slider.

---
 samples/ControlCatalog/Pages/SliderPage.xaml |  10 +
 src/Avalonia.Themes.Fluent/Slider.xaml       | 200 ++++++++++---------
 2 files changed, 114 insertions(+), 96 deletions(-)

diff --git a/samples/ControlCatalog/Pages/SliderPage.xaml b/samples/ControlCatalog/Pages/SliderPage.xaml
index ea31ed0050..b3f32ed421 100644
--- a/samples/ControlCatalog/Pages/SliderPage.xaml
+++ b/samples/ControlCatalog/Pages/SliderPage.xaml
@@ -1,5 +1,6 @@
 <UserControl xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:sys="clr-namespace:System;assembly=netstandard"
              x:Class="ControlCatalog.Pages.SliderPage">
   <StackPanel Orientation="Vertical" Spacing="4">
     <TextBlock Classes="h1">Slider</TextBlock>
@@ -21,6 +22,15 @@
                 IsSnapToTickEnabled="True"
                 Ticks="0,20,25,40,75,100"
                 Width="300" />
+        <Slider Value="0"
+                Minimum="0"
+                Maximum="100"
+                TickFrequency="10"
+                Width="300">
+          <DataValidationErrors.Error>
+            <sys:Exception /> 
+          </DataValidationErrors.Error>
+        </Slider>
       </StackPanel>
       <Slider Value="0"
               Minimum="0"
diff --git a/src/Avalonia.Themes.Fluent/Slider.xaml b/src/Avalonia.Themes.Fluent/Slider.xaml
index 8abf78cc81..8abba461e7 100644
--- a/src/Avalonia.Themes.Fluent/Slider.xaml
+++ b/src/Avalonia.Themes.Fluent/Slider.xaml
@@ -42,56 +42,58 @@
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
     <Setter Property="Template">
       <ControlTemplate>
-        <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{DynamicResource ControlCornerRadius}">
-          <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
-            <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextBlock.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextBlock.Foreground="{DynamicResource SliderHeaderForeground}"
-            Margin="{DynamicResource SliderTopHeaderMargin}" />
-            <Grid x:Name="SliderContainer" Grid.Row="1">
-              <Grid.Styles>
-                <Style Selector="TickBar">
-                  <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
-                </Style>
-              </Grid.Styles>
-              <Grid x:Name="HorizontalTemplate" ColumnDefinitions="Auto,Auto,*" MinHeight="{DynamicResource SliderHorizontalHeight}">
-                <Grid.RowDefinitions>
-                  <RowDefinition Height="{DynamicResource SliderPreContentMargin}" />
-                  <RowDefinition Height="Auto" />
-                  <RowDefinition Height="{DynamicResource SliderPostContentMargin}" />
-                </Grid.RowDefinitions>
-                <TickBar Name="TopTickBar" Placement="Top" Height="{DynamicResource SliderOutsideTickBarThemeHeight}" VerticalAlignment="Bottom" Margin="0,0,0,4" Grid.ColumnSpan="3" />
-                <!-- <TickBar Name="HorizontalInlineTickBar" Placement="Top" Fill="{DynamicResource SliderInlineTickBarFill}" Height="{DynamicResource SliderTrackThemeHeight}" Grid.Row="1" Grid.ColumnSpan="3" /> -->
-                <TickBar Name="BottomTickBar" Placement="Bottom" Height="{DynamicResource SliderOutsideTickBarThemeHeight}" VerticalAlignment="Top" Margin="0,4,0,0" Grid.Row="2" Grid.ColumnSpan="3" />
-                <Track Name="PART_Track" Grid.Row="1" Grid.ColumnSpan="3" Orientation="Horizontal">
-                  <Track.DecreaseButton>
-                    <RepeatButton Name="PART_DecreaseButton" Background="{TemplateBinding Foreground}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                      <RepeatButton.Template>
-                        <ControlTemplate>
-                          <Grid>
-                            <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                            <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Height="{DynamicResource SliderTrackThemeHeight}" VerticalAlignment="Center" />
-                          </Grid>
-                        </ControlTemplate>
-                      </RepeatButton.Template>
-                    </RepeatButton>
-                  </Track.DecreaseButton>
-                  <Track.IncreaseButton>
-                    <RepeatButton Name="PART_IncreaseButton" Background="{TemplateBinding Background}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
-                      <RepeatButton.Template>
-                        <ControlTemplate>
-                          <Grid>
-                            <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                            <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Height="{DynamicResource SliderTrackThemeHeight}" VerticalAlignment="Center" />
-                          </Grid>
-                        </ControlTemplate>
-                      </RepeatButton.Template>
-                    </RepeatButton>
-                  </Track.IncreaseButton>
-                  <Thumb Classes="SliderThumbStyle" Name="thumb" Margin="0" Padding="0" DataContext="{TemplateBinding Value}" Height="{DynamicResource SliderHorizontalThumbHeight}" Width="{DynamicResource SliderHorizontalThumbWidth}" />
-                </Track>
+        <DataValidationErrors>
+          <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{DynamicResource ControlCornerRadius}">
+            <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
+              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextBlock.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextBlock.Foreground="{DynamicResource SliderHeaderForeground}"
+              Margin="{DynamicResource SliderTopHeaderMargin}" />
+              <Grid x:Name="SliderContainer" Grid.Row="1">
+                <Grid.Styles>
+                  <Style Selector="TickBar">
+                    <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
+                  </Style>
+                </Grid.Styles>
+                <Grid x:Name="HorizontalTemplate" ColumnDefinitions="Auto,Auto,*" MinHeight="{DynamicResource SliderHorizontalHeight}">
+                  <Grid.RowDefinitions>
+                    <RowDefinition Height="{DynamicResource SliderPreContentMargin}" />
+                    <RowDefinition Height="Auto" />
+                    <RowDefinition Height="{DynamicResource SliderPostContentMargin}" />
+                  </Grid.RowDefinitions>
+                  <TickBar Name="TopTickBar" Placement="Top" Height="{DynamicResource SliderOutsideTickBarThemeHeight}" VerticalAlignment="Bottom" Margin="0,0,0,4" Grid.ColumnSpan="3" />
+                  <!-- <TickBar Name="HorizontalInlineTickBar" Placement="Top" Fill="{DynamicResource SliderInlineTickBarFill}" Height="{DynamicResource SliderTrackThemeHeight}" Grid.Row="1" Grid.ColumnSpan="3" /> -->
+                  <TickBar Name="BottomTickBar" Placement="Bottom" Height="{DynamicResource SliderOutsideTickBarThemeHeight}" VerticalAlignment="Top" Margin="0,4,0,0" Grid.Row="2" Grid.ColumnSpan="3" />
+                  <Track Name="PART_Track" Grid.Row="1" Grid.ColumnSpan="3" Orientation="Horizontal">
+                    <Track.DecreaseButton>
+                      <RepeatButton Name="PART_DecreaseButton" Background="{TemplateBinding Foreground}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                        <RepeatButton.Template>
+                          <ControlTemplate>
+                            <Grid>
+                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
+                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Height="{DynamicResource SliderTrackThemeHeight}" VerticalAlignment="Center" />
+                            </Grid>
+                          </ControlTemplate>
+                        </RepeatButton.Template>
+                      </RepeatButton>
+                    </Track.DecreaseButton>
+                    <Track.IncreaseButton>
+                      <RepeatButton Name="PART_IncreaseButton" Background="{TemplateBinding Background}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
+                        <RepeatButton.Template>
+                          <ControlTemplate>
+                            <Grid>
+                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
+                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Height="{DynamicResource SliderTrackThemeHeight}" VerticalAlignment="Center" />
+                            </Grid>
+                          </ControlTemplate>
+                        </RepeatButton.Template>
+                      </RepeatButton>
+                    </Track.IncreaseButton>
+                    <Thumb Classes="SliderThumbStyle" Name="thumb" Margin="0" Padding="0" DataContext="{TemplateBinding Value}" Height="{DynamicResource SliderHorizontalThumbHeight}" Width="{DynamicResource SliderHorizontalThumbWidth}" />
+                  </Track>
+                </Grid>
               </Grid>
             </Grid>
-          </Grid>
-        </Border>
+          </Border>
+        </DataValidationErrors>
       </ControlTemplate>
     </Setter>
   </Style>
@@ -102,56 +104,58 @@
     <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
     <Setter Property="Template">
       <ControlTemplate>
-        <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{DynamicResource ControlCornerRadius}">
-          <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
-            <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextBlock.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextBlock.Foreground="{DynamicResource SliderHeaderForeground}"
-            Margin="{DynamicResource SliderTopHeaderMargin}" />
-            <Grid x:Name="SliderContainer" Grid.Row="1">
-              <Grid.Styles>
-                <Style Selector="TickBar">
-                  <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
-                </Style>
-              </Grid.Styles>
-              <Grid x:Name="VerticalTemplate" RowDefinitions="*,Auto,Auto" MinWidth="{DynamicResource SliderVerticalWidth}">
-                <Grid.ColumnDefinitions>
-                  <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
-                  <ColumnDefinition Width="Auto" />
-                  <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
-                </Grid.ColumnDefinitions>
-                <TickBar Name="LeftTickBar" Placement="Left" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Right" Margin="0,0,4,0" Grid.RowSpan="3" />
-                <!-- <TickBar Name="VerticalInlineTickBar" Placement="Inline" Fill="{DynamicResource SliderInlineTickBarFill}" Width="{DynamicResource SliderTrackThemeHeight}" Grid.Column="1" Grid.RowSpan="3" /> -->
-                <TickBar Name="RightTickBar" Placement="Right" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Left" Margin="4,0,0,0" Grid.Column="2" Grid.RowSpan="3" />
-                <Track Name="PART_Track" Grid.Column="1" Grid.ColumnSpan="1" Grid.RowSpan="3" Orientation="Vertical">
-                  <Track.DecreaseButton>
-                    <RepeatButton Name="PART_DecreaseButton" Background="{TemplateBinding Foreground}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
-                      <RepeatButton.Template>
-                        <ControlTemplate>
-                          <Grid>
-                            <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                            <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
-                          </Grid>
-                        </ControlTemplate>
-                      </RepeatButton.Template>
-                    </RepeatButton>
-                  </Track.DecreaseButton>
-                  <Track.IncreaseButton>
-                    <RepeatButton Name="PART_IncreaseButton" Background="{TemplateBinding Background}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
-                      <RepeatButton.Template>
-                        <ControlTemplate>
-                          <Grid>
-                            <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
-                            <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
-                          </Grid>
-                        </ControlTemplate>
-                      </RepeatButton.Template>
-                    </RepeatButton>
-                  </Track.IncreaseButton>
-                  <Thumb Classes="SliderThumbStyle" Name="SliderThumb" Margin="0" Padding="0" DataContext="{TemplateBinding Value}" Height="{DynamicResource SliderVerticalThumbHeight}" Width="{DynamicResource SliderVerticalThumbWidth}" />
-                </Track>
+        <DataValidationErrors>
+          <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{DynamicResource ControlCornerRadius}">
+            <Grid Name="grid" Margin="{TemplateBinding Padding}" RowDefinitions="Auto, *">
+              <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" TextBlock.FontWeight="{DynamicResource SliderHeaderThemeFontWeight}" TextBlock.Foreground="{DynamicResource SliderHeaderForeground}"
+              Margin="{DynamicResource SliderTopHeaderMargin}" />
+              <Grid x:Name="SliderContainer" Grid.Row="1">
+                <Grid.Styles>
+                  <Style Selector="TickBar">
+                    <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
+                  </Style>
+                </Grid.Styles>
+                <Grid x:Name="VerticalTemplate" RowDefinitions="*,Auto,Auto" MinWidth="{DynamicResource SliderVerticalWidth}">
+                  <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
+                    <ColumnDefinition Width="Auto" />
+                    <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
+                  </Grid.ColumnDefinitions>
+                  <TickBar Name="LeftTickBar" Placement="Left" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Right" Margin="0,0,4,0" Grid.RowSpan="3" />
+                  <!-- <TickBar Name="VerticalInlineTickBar" Placement="Inline" Fill="{DynamicResource SliderInlineTickBarFill}" Width="{DynamicResource SliderTrackThemeHeight}" Grid.Column="1" Grid.RowSpan="3" /> -->
+                  <TickBar Name="RightTickBar" Placement="Right" Width="{DynamicResource SliderOutsideTickBarThemeHeight}" HorizontalAlignment="Left" Margin="4,0,0,0" Grid.Column="2" Grid.RowSpan="3" />
+                  <Track Name="PART_Track" Grid.Column="1" Grid.ColumnSpan="1" Grid.RowSpan="3" Orientation="Vertical">
+                    <Track.DecreaseButton>
+                      <RepeatButton Name="PART_DecreaseButton" Background="{TemplateBinding Foreground}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
+                        <RepeatButton.Template>
+                          <ControlTemplate>
+                            <Grid>
+                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
+                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
+                            </Grid>
+                          </ControlTemplate>
+                        </RepeatButton.Template>
+                      </RepeatButton>
+                    </Track.DecreaseButton>
+                    <Track.IncreaseButton>
+                      <RepeatButton Name="PART_IncreaseButton" Background="{TemplateBinding Background}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
+                        <RepeatButton.Template>
+                          <ControlTemplate>
+                            <Grid>
+                              <Border Name="FocusTarget" Background="Transparent" Margin="0,-10" />
+                              <Border Name="TrackBackground" Background="{TemplateBinding Background}" CornerRadius="{DynamicResource ControlCornerRadius}" Width="{DynamicResource SliderTrackThemeHeight}" HorizontalAlignment="Center" />
+                            </Grid>
+                          </ControlTemplate>
+                        </RepeatButton.Template>
+                      </RepeatButton>
+                    </Track.IncreaseButton>
+                    <Thumb Classes="SliderThumbStyle" Name="SliderThumb" Margin="0" Padding="0" DataContext="{TemplateBinding Value}" Height="{DynamicResource SliderVerticalThumbHeight}" Width="{DynamicResource SliderVerticalThumbWidth}" />
+                  </Track>
+                </Grid>
               </Grid>
             </Grid>
-          </Grid>
-        </Border>
+          </Border>
+        </DataValidationErrors>
       </ControlTemplate>
     </Setter>
   </Style>
@@ -260,4 +264,8 @@
   <Style Selector="Slider:pointerover /template/ RepeatButton#PART_DecreaseButton">
     <Setter Property="Background" Value="{DynamicResource SliderTrackValueFillPressed}" />
   </Style>
+  
+  <Style Selector="Slider:error /template/ Thumb.SliderThumbStyle">
+    <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+  </Style>
 </Styles>

From 233fdc9289cb6125f18c8566e157c711224eb576 Mon Sep 17 00:00:00 2001
From: Dan Walmsley <dan@walms.co.uk>
Date: Thu, 29 Oct 2020 11:30:18 +0000
Subject: [PATCH 11/11] make slider track red when there is an error.

---
 src/Avalonia.Themes.Fluent/Slider.xaml | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/Avalonia.Themes.Fluent/Slider.xaml b/src/Avalonia.Themes.Fluent/Slider.xaml
index 8abba461e7..d70eb1abe3 100644
--- a/src/Avalonia.Themes.Fluent/Slider.xaml
+++ b/src/Avalonia.Themes.Fluent/Slider.xaml
@@ -268,4 +268,8 @@
   <Style Selector="Slider:error /template/ Thumb.SliderThumbStyle">
     <Setter Property="Background" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
   </Style>
+  
+  <Style Selector="Slider:error">
+      <Setter Property="Foreground" Value="{DynamicResource SystemControlErrorTextForegroundBrush}" />
+  </Style>
 </Styles>