From bcf7782034c5d0bbbfa0b32b79abc4d91e674657 Mon Sep 17 00:00:00 2001
From: Marc-Antoine Soucy <ma.soucy@nventive.com>
Date: Wed, 26 Jul 2023 15:40:57 -0400
Subject: [PATCH 1/4] feat: added Pipspage lightweight styling

---
 .../Styles/Controls/v2/PipsPager.Base.xaml    | 538 +++++++++++++-----
 1 file changed, 394 insertions(+), 144 deletions(-)

diff --git a/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml b/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
index 76b60b5f0..5d9a9d8de 100644
--- a/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
+++ b/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
@@ -6,55 +6,224 @@
 					xmlns:not_win="http://uno.ui/not_win"
 					mc:Ignorable="d not_win">
 
-	<!-- Material PipsPager Resources -->
+	<ResourceDictionary.ThemeDictionaries>
 
-	<x:Double x:Key="MaterialPipsPagerHorizontalOrientationButtonWidth">12</x:Double>
-	<x:Double x:Key="MaterialPipsPagerHorizontalOrientationButtonHeight">12</x:Double>
+		<ResourceDictionary x:Key="Default">
+			<!-- Background -->
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackground"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundSelected"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundDisabled"
+							 Color="Transparent" />
 
-	<x:Double x:Key="MaterialPipsPagerVerticalOrientationButtonWidth">12</x:Double>
-	<x:Double x:Key="MaterialPipsPagerVerticalOrientationButtonHeight">12</x:Double>
+			<!-- BorderBrush -->
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrush"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushSelected"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled"
+							 Color="Transparent" />
 
-	<Thickness x:Key="MaterialPipsPagerButtonBorderThickness">0</Thickness>
-	<Thickness x:Key="MaterialPipsPagerNavigationButtonBorderThickness">0</Thickness>
+			<!-- Foreground -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
 
-	<x:String x:Key="MaterialPipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
-	<x:String x:Key="MaterialPipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
+			<!-- Selection Button Visual States Ellipse -->
+			<SolidColorBrush x:Key="MaterialPipsPagerVisualStateEllipseFill"
+							 Color="Transparent" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
 
-	<x:Double x:Key="MaterialPipsPagerNavigationButtonHeight">40</x:Double>
-	<x:Double x:Key="MaterialPipsPagerNavigationButtonWidth">40</x:Double>
 
-	<x:Double x:Key="MaterialPipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
-	<x:Double x:Key="MaterialPipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
+			<!-- Navigation Button Background -->
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackground"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundDisabled"
+							 Color="Transparent" />
 
-	<x:Double x:Key="MaterialPipsPagerSelectedEllipseSize">8</x:Double>
-	<x:Double x:Key="MaterialPipsPagerNormalEllipseSize">8</x:Double>
+			<!-- Navigation Button BorderBrush -->
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrush"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushDisabled"
+							 Color="Transparent" />
+
+			<!-- Navigation Button Foreground -->
+			<StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+
+			<!-- Navigation Button Visual States Ellipse -->
+			<SolidColorBrush x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill"
+							 Color="Transparent" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
+
+			<!-- Material PipsPager Resources -->
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
+
+			<Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
+			<Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
+
+			<x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
+			<x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
+
+			<x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
+			<x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
+			<Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
+
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
+			<x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
+		</ResourceDictionary>
+
+		<ResourceDictionary x:Key="Light">
+
+			<!-- Background -->
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackground"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundSelected"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundDisabled"
+							 Color="Transparent" />
+
+			<!-- BorderBrush -->
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrush"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushSelected"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled"
+							 Color="Transparent" />
+
+			<!-- Foreground -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
+
+			<!-- Foreground Selected -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
+
+			<!-- Selection Button Visual States Ellipse -->
+			<SolidColorBrush x:Key="MaterialPipsPagerVisualStateEllipseFill"
+							 Color="Transparent" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+
+
+			<!-- Navigation Button Background -->
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackground"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundDisabled"
+							 Color="Transparent" />
+
+			<!-- Navigation Button BorderBrush -->
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrush"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPointerOver"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPressed"
+							 Color="Transparent" />
+			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushDisabled"
+							 Color="Transparent" />
+
+			<!-- Navigation Button Foreground -->
+			<StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+
+			<!-- Navigation Button Visual States Ellipse -->
+			<SolidColorBrush x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill"
+							 Color="Transparent" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
+
+			<!-- Material PipsPager Resources -->
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
+
+			<Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
+			<Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
+
+			<x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
+			<x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
+
+			<x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
+			<x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
+			<Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
+
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
+			<x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
+		</ResourceDictionary>
+	</ResourceDictionary.ThemeDictionaries>
 
 	<Style x:Key="MaterialPipsPagerNavigationButtonBaseStyle"
 		   TargetType="Button">
-		<Setter Property="Background"
-				Value="Transparent" />
-		<Setter Property="Foreground"
-				Value="{ThemeResource PrimaryBrush}" />
-		<Setter Property="BorderBrush"
-				Value="Transparent" />
-		<Setter Property="BorderThickness"
-				Value="{StaticResource MaterialPipsPagerNavigationButtonBorderThickness}" />
-		<Setter Property="UseSystemFocusVisuals"
-				Value="{StaticResource UseSystemFocusVisuals}" />
-		<Setter Property="FocusVisualMargin"
-				Value="0" />
-		<Setter Property="HorizontalAlignment"
-				Value="Center" />
-		<Setter Property="HorizontalContentAlignment"
-				Value="Center" />
-		<Setter Property="VerticalContentAlignment"
-				Value="Center" />
-		<Setter Property="Width"
-				Value="{StaticResource MaterialPipsPagerNavigationButtonWidth}" />
-		<Setter Property="Height"
-				Value="{StaticResource MaterialPipsPagerNavigationButtonHeight}" />
-		<Setter Property="Padding"
-				Value="4" />
+		<Setter Property="Background" Value="Transparent" />
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerNavigationButtonForeground}" />
+		<Setter Property="BorderBrush" Value="{ThemeResource PipsPagerNavigationButtonBorderBrush}" />
+		<Setter Property="BorderThickness" Value="{ThemeResource PipsPagerNavigationButtonBorderThickness}" />
+		<Setter Property="UseSystemFocusVisuals" Value="{ThemeResource UseSystemFocusVisuals}" />
+		<Setter Property="FocusVisualMargin" Value="0" />
+		<Setter Property="HorizontalAlignment" Value="Center" />
+		<Setter Property="HorizontalContentAlignment" Value="Center" />
+		<Setter Property="VerticalContentAlignment" Value="Center" />
+		<Setter Property="Width" Value="{ThemeResource PipsPagerNavigationButtonWidth}" />
+		<Setter Property="Height" Value="{ThemeResource PipsPagerNavigationButtonHeight}" />
+		<Setter Property="Padding" Value="{ThemeResource PipsPagerNavigationButtonPadding}" />
 		<Setter Property="Template">
 			<Setter.Value>
 				<ControlTemplate TargetType="Button">
@@ -70,7 +239,25 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryHoverBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+																	   Storyboard.TargetProperty="Foreground">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonForegroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="BorderBrush">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPointerOver}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -79,7 +266,25 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryPressedBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+																	   Storyboard.TargetProperty="Foreground">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonForegroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="BorderBrush">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPressed}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -88,7 +293,19 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
 																	   Storyboard.TargetProperty="Foreground">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource OnSurfaceDisabledBrush}" />
+																	Value="{ThemeResource PipsPagerNavigationButtonForegroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="BorderBrush">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushDisabled}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -99,7 +316,7 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryFocusedBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -108,19 +325,18 @@
 						</VisualStateManager.VisualStateGroups>
 
 						<Ellipse x:Name="VisualStatesEllipse"
-								 Height="{StaticResource MaterialPipsPagerNavigationVisualStatesEllipseHeight}"
-								 Width="{StaticResource MaterialPipsPagerNavigationVisualStatesEllipseWidth}"
+								 Height="{ThemeResource PipsPagerNavigationVisualStatesEllipseHeight}"
+								 Width="{ThemeResource PipsPagerNavigationVisualStatesEllipseWidth}"
 								 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
 								 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-								 Fill="Transparent"
+								 Fill="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFill}"
 								 AutomationProperties.AccessibilityView="Raw" />
 
 						<Border Padding="{TemplateBinding Padding}"
-								RenderTransformOrigin="0.5, 0.5">
+								RenderTransformOrigin="0.5, 0.5"
+								Background="{TemplateBinding Background}">
 							<Border.RenderTransform>
-								<ScaleTransform x:Name="ScaleTransform"
-												ScaleY="1"
-												ScaleX="1" />
+								<ScaleTransform x:Name="ScaleTransform" ScaleY="1" ScaleX="1" />
 							</Border.RenderTransform>
 							<PathIcon x:Name="Content"
 									  Data="{TemplateBinding Content}"
@@ -138,54 +354,43 @@
 	<Style x:Key="MaterialPipsPagerPreviousPageButtonStyle"
 		   TargetType="Button"
 		   BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
-		<Setter Property="Content"
-				Value="{StaticResource MaterialPipsPagerPreviousPageButtonData}" />
-		<Setter Property="VerticalContentAlignment"
-				Value="Bottom" />
+		<Setter Property="Content" Value="{StaticResource PipsPagerPreviousPageButtonData}" />
+		<Setter Property="VerticalContentAlignment" Value="Bottom" />
 	</Style>
 
 	<Style x:Key="MaterialPipsPagerNextPageButtonStyle"
 		   TargetType="Button"
 		   BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
-		<Setter Property="Content"
-				Value="{StaticResource MaterialPipsPagerNextPageButtonData}" />
-		<Setter Property="VerticalContentAlignment"
-				Value="Top" />
+		<Setter Property="Content" Value="{StaticResource PipsPagerNextPageButtonData}" />
+		<Setter Property="VerticalContentAlignment" Value="Top" />
 	</Style>
 
 	<Style x:Key="MaterialPipsPagerButtonBaseStyle"
 		   TargetType="Button">
-		<Setter Property="Background"
-				Value="Transparent" />
-		<Setter Property="Foreground"
-				Value="{ThemeResource SurfaceVariantBrush}" />
-		<Setter Property="BorderBrush"
-				Value="Transparent" />
-		<Setter Property="BorderThickness"
-				Value="{StaticResource MaterialPipsPagerButtonBorderThickness}" />
-		<Setter Property="HorizontalContentAlignment"
-				Value="Center" />
-		<Setter Property="VerticalContentAlignment"
-				Value="Center" />
-		<Setter Property="UseSystemFocusVisuals"
-				Value="{StaticResource UseSystemFocusVisuals}" />
-		<Setter Property="FocusVisualMargin"
-				Value="0" />
+		<Setter Property="Background" Value="{ThemeResource PipsPagerSelectionIndicatorBackground}" />
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
+		<Setter Property="BorderBrush" Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrush}" />
+		<Setter Property="BorderThickness" Value="{ThemeResource PipsPagerButtonBorderThickness}" />
+		<Setter Property="HorizontalContentAlignment" Value="Center" />
+		<Setter Property="VerticalContentAlignment" Value="Center" />
+		<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
+		<Setter Property="FocusVisualMargin" Value="0" />
 	</Style>
 
 	<Style x:Key="MaterialPipsPagerSelectedPipButtonStyle"
 		   TargetType="Button"
 		   BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
-		<Setter Property="Foreground"
-				Value="{ThemeResource PrimaryBrush}" />
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForegroundSelected}" />
 		<Setter Property="Template">
 			<Setter.Value>
 				<ControlTemplate TargetType="Button">
 					<Grid x:Name="RootGrid"
 						  IsHitTestVisible="True"
 						  Background="{TemplateBinding Background}"
-						  Width="{StaticResource MaterialPipsPagerHorizontalOrientationButtonWidth}"
-						  Height="{StaticResource MaterialPipsPagerHorizontalOrientationButtonHeight}">
+						  BorderBrush="{TemplateBinding BorderBrush}"
+						  BorderThickness="{TemplateBinding BorderThickness}"
+						  Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+						  Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
 						<VisualStateManager.VisualStateGroups>
 							<VisualStateGroup x:Name="CommonStates">
 								<VisualState x:Name="Normal" />
@@ -194,7 +399,17 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryHoverBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -203,7 +418,17 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryPressedBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -212,7 +437,17 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource OnSurfaceDisabledBrush}" />
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushDisabled}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -223,7 +458,7 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryFocusedBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -233,24 +468,22 @@
 								<VisualState x:Name="HorizontalOrientation" />
 								<VisualState x:Name="VerticalOrientation">
 									<VisualState.Setters>
-										<Setter Target="RootGrid.Width"
-												Value="{StaticResource MaterialPipsPagerVerticalOrientationButtonWidth}" />
-										<Setter Target="RootGrid.Height"
-												Value="{StaticResource MaterialPipsPagerVerticalOrientationButtonHeight}" />
+										<Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
+										<Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
 									</VisualState.Setters>
 								</VisualState>
 							</VisualStateGroup>
 						</VisualStateManager.VisualStateGroups>
 
 						<Ellipse x:Name="VisualStatesEllipse"
-								 Height="{StaticResource MaterialPipsPagerHorizontalOrientationButtonHeight}"
-								 Width="{StaticResource MaterialPipsPagerHorizontalOrientationButtonWidth}"
-								 Fill="Transparent"
+								 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
+								 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+								 Fill="{ThemeResource MaterialPipsPagerVisualStateEllipseFill}"
 								 AutomationProperties.AccessibilityView="Raw" />
 
 						<Ellipse x:Name="MainEllipse"
-								 Height="{StaticResource MaterialPipsPagerNormalEllipseSize}"
-								 Width="{StaticResource MaterialPipsPagerNormalEllipseSize}"
+								 Height="{ThemeResource PipsPagerSelectedEllipseSize}"
+								 Width="{ThemeResource PipsPagerSelectedEllipseSize}"
 								 Fill="{TemplateBinding Foreground}"
 								 Stroke="{TemplateBinding BorderBrush}"
 								 StrokeThickness="{TemplateBinding BorderThickness}"
@@ -266,16 +499,15 @@
 	<Style x:Key="MaterialPipsPagerNormalPipButtonStyle"
 		   TargetType="Button"
 		   BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
-		<Setter Property="Foreground"
-				Value="{ThemeResource SurfaceVariantBrush}" />
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
 		<Setter Property="Template">
 			<Setter.Value>
 				<ControlTemplate TargetType="Button">
 					<Grid x:Name="RootGrid"
 						  IsHitTestVisible="True"
 						  Background="{TemplateBinding Background}"
-						  Width="{StaticResource MaterialPipsPagerHorizontalOrientationButtonWidth}"
-						  Height="{StaticResource MaterialPipsPagerHorizontalOrientationButtonHeight}">
+						  Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+						  Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
 						<VisualStateManager.VisualStateGroups>
 							<VisualStateGroup x:Name="CommonStates">
 								<VisualState x:Name="Normal" />
@@ -284,26 +516,50 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource SurfaceBrush}" />
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPointerOver}" />
 										</ObjectAnimationUsingKeyFrames>
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryHoverBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
 								<VisualState x:Name="Pressed">
 									<Storyboard>
+
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource SurfaceBrush}" />
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPressed}" />
 										</ObjectAnimationUsingKeyFrames>
+
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryPressedBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -312,7 +568,7 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource OnSurfaceDisabledBrush}" />
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -323,12 +579,25 @@
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource SurfaceBrush}" />
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundFocused}" />
 										</ObjectAnimationUsingKeyFrames>
+
 										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
 																	   Storyboard.TargetProperty="Fill">
 											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PrimaryFocusedBrush}" />
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushFocused}" />
 										</ObjectAnimationUsingKeyFrames>
 									</Storyboard>
 								</VisualState>
@@ -338,18 +607,16 @@
 								<VisualState x:Name="HorizontalOrientation" />
 								<VisualState x:Name="VerticalOrientation">
 									<VisualState.Setters>
-										<Setter Target="RootGrid.Width"
-												Value="{StaticResource MaterialPipsPagerVerticalOrientationButtonWidth}" />
-										<Setter Target="RootGrid.Height"
-												Value="{StaticResource MaterialPipsPagerVerticalOrientationButtonHeight}" />
+										<Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
+										<Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
 									</VisualState.Setters>
 								</VisualState>
 							</VisualStateGroup>
 						</VisualStateManager.VisualStateGroups>
 
 						<Ellipse x:Name="MainEllipse"
-								 Height="{StaticResource MaterialPipsPagerNormalEllipseSize}"
-								 Width="{StaticResource MaterialPipsPagerNormalEllipseSize}"
+								 Height="{ThemeResource PipsPagerNormalEllipseSize}"
+								 Width="{ThemeResource PipsPagerNormalEllipseSize}"
 								 Fill="{TemplateBinding Foreground}"
 								 Stroke="{TemplateBinding BorderBrush}"
 								 StrokeThickness="{TemplateBinding BorderThickness}"
@@ -358,8 +625,8 @@
 								 AutomationProperties.AccessibilityView="Raw" />
 
 						<Ellipse x:Name="VisualStatesEllipse"
-								 Height="{StaticResource MaterialPipsPagerHorizontalOrientationButtonHeight}"
-								 Width="{StaticResource MaterialPipsPagerHorizontalOrientationButtonWidth}"
+								 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
+								 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
 								 Fill="Transparent"
 								 AutomationProperties.AccessibilityView="Raw" />
 					</Grid>
@@ -370,18 +637,12 @@
 
 	<Style x:Key="BaseMaterialPipsPagerStyle"
 		   TargetType="muxc:PipsPager">
-		<Setter Property="Background"
-				Value="Transparent" />
-		<Setter Property="HorizontalAlignment"
-				Value="Left" />
-		<Setter Property="VerticalAlignment"
-				Value="Top" />
-		<Setter Property="IsTabStop"
-				Value="False" />
-		<Setter Property="PreviousButtonStyle"
-				Value="{StaticResource MaterialPipsPagerPreviousPageButtonStyle}" />
-		<Setter Property="NextButtonStyle"
-				Value="{StaticResource MaterialPipsPagerNextPageButtonStyle}" />
+		<Setter Property="Background" Value="Transparent" />
+		<Setter Property="HorizontalAlignment" Value="Left" />
+		<Setter Property="VerticalAlignment" Value="Top" />
+		<Setter Property="IsTabStop" Value="False" />
+		<Setter Property="PreviousButtonStyle" Value="{StaticResource MaterialPipsPagerPreviousPageButtonStyle}" />
+		<Setter Property="NextButtonStyle" Value="{StaticResource MaterialPipsPagerNextPageButtonStyle}" />
 		<!-- Uno already implemented the 2.8.0 MUX version of the control -->
 		<!-- Uno.Themes reference is still on the MUX v2.6.0-prerelease.210113001 version for now -->
 		<!-- Remove this file, PipsPager.UWP.xaml,and use <Setter Property=NormalPipStyle /> and <Setter Property=SelectedPipStyle /> only in PipsPager.xaml -->
@@ -401,14 +662,12 @@
 								<VisualState x:Name="PreviousPageButtonVisible" />
 								<VisualState x:Name="PreviousPageButtonHidden">
 									<VisualState.Setters>
-										<Setter Target="PreviousPageButton.Opacity"
-												Value="0" />
+										<Setter Target="PreviousPageButton.Opacity" Value="0" />
 									</VisualState.Setters>
 								</VisualState>
 								<VisualState x:Name="PreviousPageButtonCollapsed">
 									<VisualState.Setters>
-										<Setter Target="PreviousPageButton.Visibility"
-												Value="Collapsed" />
+										<Setter Target="PreviousPageButton.Visibility" Value="Collapsed" />
 									</VisualState.Setters>
 								</VisualState>
 							</VisualStateGroup>
@@ -417,8 +676,7 @@
 								<VisualState x:Name="PreviousPageButtonEnabled" />
 								<VisualState x:Name="PreviousPageButtonDisabled">
 									<VisualState.Setters>
-										<Setter Target="PreviousPageButton.IsEnabled"
-												Value="False" />
+										<Setter Target="PreviousPageButton.IsEnabled" Value="False" />
 									</VisualState.Setters>
 								</VisualState>
 							</VisualStateGroup>
@@ -427,14 +685,12 @@
 								<VisualState x:Name="NextPageButtonVisible" />
 								<VisualState x:Name="NextPageButtonHidden">
 									<VisualState.Setters>
-										<Setter Target="NextPageButton.Opacity"
-												Value="0" />
+										<Setter Target="NextPageButton.Opacity" Value="0" />
 									</VisualState.Setters>
 								</VisualState>
 								<VisualState x:Name="NextPageButtonCollapsed">
 									<VisualState.Setters>
-										<Setter Target="NextPageButton.Visibility"
-												Value="Collapsed" />
+										<Setter Target="NextPageButton.Visibility" Value="Collapsed" />
 									</VisualState.Setters>
 								</VisualState>
 							</VisualStateGroup>
@@ -443,8 +699,7 @@
 								<VisualState x:Name="NextPageButtonEnabled" />
 								<VisualState x:Name="NextPageButtonDisabled">
 									<VisualState.Setters>
-										<Setter Target="NextPageButton.IsEnabled"
-												Value="False" />
+										<Setter Target="NextPageButton.IsEnabled" Value="False" />
 									</VisualState.Setters>
 								</VisualState>
 							</VisualStateGroup>
@@ -453,21 +708,16 @@
 								<VisualState x:Name="VerticalOrientationView" />
 								<VisualState x:Name="HorizontalOrientationView">
 									<VisualState.Setters>
-										<Setter Target="RootPanel.Orientation"
-												Value="Horizontal" />
-										<Setter Target="PreviousPageButton.(ToolTipService.Placement)"
-												Value="Left" />
-										<Setter Target="PreviousPageButton.RenderTransformOrigin"
-												Value="0.5, 0.5" />
+										<Setter Target="RootPanel.Orientation" Value="Horizontal" />
+										<Setter Target="PreviousPageButton.(ToolTipService.Placement)" Value="Left" />
+										<Setter Target="PreviousPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
 										<Setter Target="PreviousPageButton.RenderTransform">
 											<Setter.Value>
 												<RotateTransform Angle="-90" />
 											</Setter.Value>
 										</Setter>
-										<Setter Target="NextPageButton.(ToolTipService.Placement)"
-												Value="Right" />
-										<Setter Target="NextPageButton.RenderTransformOrigin"
-												Value="0.5, 0.5" />
+										<Setter Target="NextPageButton.(ToolTipService.Placement)" Value="Right" />
+										<Setter Target="NextPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
 										<Setter Target="NextPageButton.RenderTransform">
 											<Setter.Value>
 												<RotateTransform Angle="-90" />

From 373e5da1f80408b3e8ce21b3a5122f9fd6b61df1 Mon Sep 17 00:00:00 2001
From: "NVENTIVE\\vy.nguyen" <vy.nguyen@nventive.com>
Date: Wed, 26 Jul 2023 16:29:32 -0400
Subject: [PATCH 2/4] fix: change brush value transparent to
 SystemControlTransparentBrush

---
 .../Styles/Controls/v2/PipsPager.Base.xaml    | 1498 ++++++++---------
 1 file changed, 729 insertions(+), 769 deletions(-)

diff --git a/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml b/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
index 5d9a9d8de..f671826ff 100644
--- a/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
+++ b/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
@@ -1,772 +1,732 @@
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-					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:muxc="using:Microsoft.UI.Xaml.Controls"
-					xmlns:not_win="http://uno.ui/not_win"
-					mc:Ignorable="d not_win">
-
-	<ResourceDictionary.ThemeDictionaries>
-
-		<ResourceDictionary x:Key="Default">
-			<!-- Background -->
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackground"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundSelected"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundDisabled"
-							 Color="Transparent" />
-
-			<!-- BorderBrush -->
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrush"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushSelected"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled"
-							 Color="Transparent" />
-
-			<!-- Foreground -->
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
-
-			<!-- Selection Button Visual States Ellipse -->
-			<SolidColorBrush x:Key="MaterialPipsPagerVisualStateEllipseFill"
-							 Color="Transparent" />
-			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-
-
-			<!-- Navigation Button Background -->
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackground"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundDisabled"
-							 Color="Transparent" />
-
-			<!-- Navigation Button BorderBrush -->
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrush"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushDisabled"
-							 Color="Transparent" />
-
-			<!-- Navigation Button Foreground -->
-			<StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
-			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
-			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
-			<StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-
-			<!-- Navigation Button Visual States Ellipse -->
-			<SolidColorBrush x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill"
-							 Color="Transparent" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
-
-			<!-- Material PipsPager Resources -->
-			<x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
-			<x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
-
-			<x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
-			<x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
-
-			<Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
-			<Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
-
-			<x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
-			<x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
-
-			<x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
-			<x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
-			<Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
-
-			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
-			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
-
-			<x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
-			<x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
-		</ResourceDictionary>
-
-		<ResourceDictionary x:Key="Light">
-
-			<!-- Background -->
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackground"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundSelected"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBackgroundDisabled"
-							 Color="Transparent" />
-
-			<!-- BorderBrush -->
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrush"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushSelected"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled"
-							 Color="Transparent" />
-
-			<!-- Foreground -->
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
-
-			<!-- Foreground Selected -->
-			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
-
-			<!-- Selection Button Visual States Ellipse -->
-			<SolidColorBrush x:Key="MaterialPipsPagerVisualStateEllipseFill"
-							 Color="Transparent" />
-			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-
-
-			<!-- Navigation Button Background -->
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackground"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBackgroundDisabled"
-							 Color="Transparent" />
-
-			<!-- Navigation Button BorderBrush -->
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrush"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPointerOver"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushPressed"
-							 Color="Transparent" />
-			<SolidColorBrush x:Key="PipsPagerNavigationButtonBorderBrushDisabled"
-							 Color="Transparent" />
-
-			<!-- Navigation Button Foreground -->
-			<StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
-			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
-			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
-			<StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-
-			<!-- Navigation Button Visual States Ellipse -->
-			<SolidColorBrush x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill"
-							 Color="Transparent" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
-
-			<!-- Material PipsPager Resources -->
-			<x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
-			<x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
-
-			<x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
-			<x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
-
-			<Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
-			<Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
-
-			<x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
-			<x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
-
-			<x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
-			<x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
-			<Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
-
-			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
-			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
-
-			<x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
-			<x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
-		</ResourceDictionary>
-	</ResourceDictionary.ThemeDictionaries>
-
-	<Style x:Key="MaterialPipsPagerNavigationButtonBaseStyle"
-		   TargetType="Button">
-		<Setter Property="Background" Value="Transparent" />
-		<Setter Property="Foreground" Value="{ThemeResource PipsPagerNavigationButtonForeground}" />
-		<Setter Property="BorderBrush" Value="{ThemeResource PipsPagerNavigationButtonBorderBrush}" />
-		<Setter Property="BorderThickness" Value="{ThemeResource PipsPagerNavigationButtonBorderThickness}" />
-		<Setter Property="UseSystemFocusVisuals" Value="{ThemeResource UseSystemFocusVisuals}" />
-		<Setter Property="FocusVisualMargin" Value="0" />
-		<Setter Property="HorizontalAlignment" Value="Center" />
-		<Setter Property="HorizontalContentAlignment" Value="Center" />
-		<Setter Property="VerticalContentAlignment" Value="Center" />
-		<Setter Property="Width" Value="{ThemeResource PipsPagerNavigationButtonWidth}" />
-		<Setter Property="Height" Value="{ThemeResource PipsPagerNavigationButtonHeight}" />
-		<Setter Property="Padding" Value="{ThemeResource PipsPagerNavigationButtonPadding}" />
-		<Setter Property="Template">
-			<Setter.Value>
-				<ControlTemplate TargetType="Button">
-					<Grid x:Name="RootGrid"
-						  Background="{TemplateBinding Background}"
-						  BorderBrush="{TemplateBinding BorderBrush}"
-						  BorderThickness="{TemplateBinding BorderThickness}">
-						<VisualStateManager.VisualStateGroups>
-							<VisualStateGroup x:Name="CommonStates">
-								<VisualState x:Name="Normal" />
-								<VisualState x:Name="PointerOver">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
-																	   Storyboard.TargetProperty="Foreground">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonForegroundPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="BorderBrush">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Pressed">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
-																	   Storyboard.TargetProperty="Foreground">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonForegroundPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="BorderBrush">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Disabled">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
-																	   Storyboard.TargetProperty="Foreground">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonForegroundDisabled}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundDisabled}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="BorderBrush">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushDisabled}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-							</VisualStateGroup>
-							<VisualStateGroup x:Name="FocusStates">
-								<VisualState x:Name="Focused">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Unfocused" />
-							</VisualStateGroup>
-						</VisualStateManager.VisualStateGroups>
-
-						<Ellipse x:Name="VisualStatesEllipse"
-								 Height="{ThemeResource PipsPagerNavigationVisualStatesEllipseHeight}"
-								 Width="{ThemeResource PipsPagerNavigationVisualStatesEllipseWidth}"
-								 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-								 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-								 Fill="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFill}"
-								 AutomationProperties.AccessibilityView="Raw" />
-
-						<Border Padding="{TemplateBinding Padding}"
-								RenderTransformOrigin="0.5, 0.5"
-								Background="{TemplateBinding Background}">
-							<Border.RenderTransform>
-								<ScaleTransform x:Name="ScaleTransform" ScaleY="1" ScaleX="1" />
-							</Border.RenderTransform>
-							<PathIcon x:Name="Content"
-									  Data="{TemplateBinding Content}"
-									  Foreground="{TemplateBinding Foreground}"
-									  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-									  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-									  AutomationProperties.AccessibilityView="Raw" />
-						</Border>
-					</Grid>
-				</ControlTemplate>
-			</Setter.Value>
-		</Setter>
-	</Style>
-
-	<Style x:Key="MaterialPipsPagerPreviousPageButtonStyle"
-		   TargetType="Button"
-		   BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
-		<Setter Property="Content" Value="{StaticResource PipsPagerPreviousPageButtonData}" />
-		<Setter Property="VerticalContentAlignment" Value="Bottom" />
-	</Style>
-
-	<Style x:Key="MaterialPipsPagerNextPageButtonStyle"
-		   TargetType="Button"
-		   BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
-		<Setter Property="Content" Value="{StaticResource PipsPagerNextPageButtonData}" />
-		<Setter Property="VerticalContentAlignment" Value="Top" />
-	</Style>
-
-	<Style x:Key="MaterialPipsPagerButtonBaseStyle"
-		   TargetType="Button">
-		<Setter Property="Background" Value="{ThemeResource PipsPagerSelectionIndicatorBackground}" />
-		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
-		<Setter Property="BorderBrush" Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrush}" />
-		<Setter Property="BorderThickness" Value="{ThemeResource PipsPagerButtonBorderThickness}" />
-		<Setter Property="HorizontalContentAlignment" Value="Center" />
-		<Setter Property="VerticalContentAlignment" Value="Center" />
-		<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
-		<Setter Property="FocusVisualMargin" Value="0" />
-	</Style>
-
-	<Style x:Key="MaterialPipsPagerSelectedPipButtonStyle"
-		   TargetType="Button"
-		   BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
-		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForegroundSelected}" />
-		<Setter Property="Template">
-			<Setter.Value>
-				<ControlTemplate TargetType="Button">
-					<Grid x:Name="RootGrid"
-						  IsHitTestVisible="True"
-						  Background="{TemplateBinding Background}"
-						  BorderBrush="{TemplateBinding BorderBrush}"
-						  BorderThickness="{TemplateBinding BorderThickness}"
-						  Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-						  Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
-						<VisualStateManager.VisualStateGroups>
-							<VisualStateGroup x:Name="CommonStates">
-								<VisualState x:Name="Normal" />
-								<VisualState x:Name="PointerOver">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Stroke">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Pressed">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Stroke">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Disabled">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundDisabled}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Stroke">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushDisabled}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-							</VisualStateGroup>
-							<VisualStateGroup x:Name="FocusStates">
-								<VisualState x:Name="Focused">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Unfocused" />
-							</VisualStateGroup>
-							<VisualStateGroup x:Name="OrientationStates">
-								<VisualState x:Name="HorizontalOrientation" />
-								<VisualState x:Name="VerticalOrientation">
-									<VisualState.Setters>
-										<Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
-										<Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
-									</VisualState.Setters>
-								</VisualState>
-							</VisualStateGroup>
-						</VisualStateManager.VisualStateGroups>
-
-						<Ellipse x:Name="VisualStatesEllipse"
-								 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
-								 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-								 Fill="{ThemeResource MaterialPipsPagerVisualStateEllipseFill}"
-								 AutomationProperties.AccessibilityView="Raw" />
-
-						<Ellipse x:Name="MainEllipse"
-								 Height="{ThemeResource PipsPagerSelectedEllipseSize}"
-								 Width="{ThemeResource PipsPagerSelectedEllipseSize}"
-								 Fill="{TemplateBinding Foreground}"
-								 Stroke="{TemplateBinding BorderBrush}"
-								 StrokeThickness="{TemplateBinding BorderThickness}"
-								 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-								 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-								 AutomationProperties.AccessibilityView="Raw" />
-					</Grid>
-				</ControlTemplate>
-			</Setter.Value>
-		</Setter>
-	</Style>
-
-	<Style x:Key="MaterialPipsPagerNormalPipButtonStyle"
-		   TargetType="Button"
-		   BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
-		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
-		<Setter Property="Template">
-			<Setter.Value>
-				<ControlTemplate TargetType="Button">
-					<Grid x:Name="RootGrid"
-						  IsHitTestVisible="True"
-						  Background="{TemplateBinding Background}"
-						  Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-						  Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
-						<VisualStateManager.VisualStateGroups>
-							<VisualStateGroup x:Name="CommonStates">
-								<VisualState x:Name="Normal" />
-								<VisualState x:Name="PointerOver">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Stroke">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Pressed">
-									<Storyboard>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Stroke">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Disabled">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-							</VisualStateGroup>
-							<VisualStateGroup x:Name="FocusStates">
-								<VisualState x:Name="Focused">
-									<Storyboard>
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundFocused}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-																	   Storyboard.TargetProperty="Fill">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-																	   Storyboard.TargetProperty="Background">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundFocused}" />
-										</ObjectAnimationUsingKeyFrames>
-
-										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-																	   Storyboard.TargetProperty="Stroke">
-											<DiscreteObjectKeyFrame KeyTime="0"
-																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushFocused}" />
-										</ObjectAnimationUsingKeyFrames>
-									</Storyboard>
-								</VisualState>
-								<VisualState x:Name="Unfocused" />
-							</VisualStateGroup>
-							<VisualStateGroup x:Name="OrientationStates">
-								<VisualState x:Name="HorizontalOrientation" />
-								<VisualState x:Name="VerticalOrientation">
-									<VisualState.Setters>
-										<Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
-										<Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
-									</VisualState.Setters>
-								</VisualState>
-							</VisualStateGroup>
-						</VisualStateManager.VisualStateGroups>
-
-						<Ellipse x:Name="MainEllipse"
-								 Height="{ThemeResource PipsPagerNormalEllipseSize}"
-								 Width="{ThemeResource PipsPagerNormalEllipseSize}"
-								 Fill="{TemplateBinding Foreground}"
-								 Stroke="{TemplateBinding BorderBrush}"
-								 StrokeThickness="{TemplateBinding BorderThickness}"
-								 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-								 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-								 AutomationProperties.AccessibilityView="Raw" />
-
-						<Ellipse x:Name="VisualStatesEllipse"
-								 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
-								 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-								 Fill="Transparent"
-								 AutomationProperties.AccessibilityView="Raw" />
-					</Grid>
-				</ControlTemplate>
-			</Setter.Value>
-		</Setter>
-	</Style>
-
-	<Style x:Key="BaseMaterialPipsPagerStyle"
-		   TargetType="muxc:PipsPager">
-		<Setter Property="Background" Value="Transparent" />
-		<Setter Property="HorizontalAlignment" Value="Left" />
-		<Setter Property="VerticalAlignment" Value="Top" />
-		<Setter Property="IsTabStop" Value="False" />
-		<Setter Property="PreviousButtonStyle" Value="{StaticResource MaterialPipsPagerPreviousPageButtonStyle}" />
-		<Setter Property="NextButtonStyle" Value="{StaticResource MaterialPipsPagerNextPageButtonStyle}" />
-		<!-- Uno already implemented the 2.8.0 MUX version of the control -->
-		<!-- Uno.Themes reference is still on the MUX v2.6.0-prerelease.210113001 version for now -->
-		<!-- Remove this file, PipsPager.UWP.xaml,and use <Setter Property=NormalPipStyle /> and <Setter Property=SelectedPipStyle /> only in PipsPager.xaml -->
-		<!-- with the rest of the code, once we can bump the Microsoft.UI.Xaml version -->
-		<not_win:Setter Property="SelectedPipStyle"
-						Value="{StaticResource MaterialPipsPagerSelectedPipButtonStyle}" />
-		<not_win:Setter Property="NormalPipStyle"
-						Value="{StaticResource MaterialPipsPagerNormalPipButtonStyle}" />
-		<Setter Property="Template">
-			<Setter.Value>
-				<ControlTemplate TargetType="muxc:PipsPager">
-					<StackPanel x:Name="RootPanel"
-								Orientation="{TemplateBinding Orientation}"
-								Background="{TemplateBinding Background}">
-						<VisualStateManager.VisualStateGroups>
-							<VisualStateGroup x:Name="PreviousPageButtonVisibilityStates">
-								<VisualState x:Name="PreviousPageButtonVisible" />
-								<VisualState x:Name="PreviousPageButtonHidden">
-									<VisualState.Setters>
-										<Setter Target="PreviousPageButton.Opacity" Value="0" />
-									</VisualState.Setters>
-								</VisualState>
-								<VisualState x:Name="PreviousPageButtonCollapsed">
-									<VisualState.Setters>
-										<Setter Target="PreviousPageButton.Visibility" Value="Collapsed" />
-									</VisualState.Setters>
-								</VisualState>
-							</VisualStateGroup>
-
-							<VisualStateGroup x:Name="PreviousPageButtonIsEnabledStates">
-								<VisualState x:Name="PreviousPageButtonEnabled" />
-								<VisualState x:Name="PreviousPageButtonDisabled">
-									<VisualState.Setters>
-										<Setter Target="PreviousPageButton.IsEnabled" Value="False" />
-									</VisualState.Setters>
-								</VisualState>
-							</VisualStateGroup>
-
-							<VisualStateGroup x:Name="NextPageButtonVisibilityStates">
-								<VisualState x:Name="NextPageButtonVisible" />
-								<VisualState x:Name="NextPageButtonHidden">
-									<VisualState.Setters>
-										<Setter Target="NextPageButton.Opacity" Value="0" />
-									</VisualState.Setters>
-								</VisualState>
-								<VisualState x:Name="NextPageButtonCollapsed">
-									<VisualState.Setters>
-										<Setter Target="NextPageButton.Visibility" Value="Collapsed" />
-									</VisualState.Setters>
-								</VisualState>
-							</VisualStateGroup>
-
-							<VisualStateGroup x:Name="NextPageButtonIsEnabledStates">
-								<VisualState x:Name="NextPageButtonEnabled" />
-								<VisualState x:Name="NextPageButtonDisabled">
-									<VisualState.Setters>
-										<Setter Target="NextPageButton.IsEnabled" Value="False" />
-									</VisualState.Setters>
-								</VisualState>
-							</VisualStateGroup>
-
-							<VisualStateGroup x:Name="RootPanelOrientationStates">
-								<VisualState x:Name="VerticalOrientationView" />
-								<VisualState x:Name="HorizontalOrientationView">
-									<VisualState.Setters>
-										<Setter Target="RootPanel.Orientation" Value="Horizontal" />
-										<Setter Target="PreviousPageButton.(ToolTipService.Placement)" Value="Left" />
-										<Setter Target="PreviousPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
-										<Setter Target="PreviousPageButton.RenderTransform">
-											<Setter.Value>
-												<RotateTransform Angle="-90" />
-											</Setter.Value>
-										</Setter>
-										<Setter Target="NextPageButton.(ToolTipService.Placement)" Value="Right" />
-										<Setter Target="NextPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
-										<Setter Target="NextPageButton.RenderTransform">
-											<Setter.Value>
-												<RotateTransform Angle="-90" />
-											</Setter.Value>
-										</Setter>
-									</VisualState.Setters>
-								</VisualState>
-							</VisualStateGroup>
-						</VisualStateManager.VisualStateGroups>
-
-						<Button x:Name="PreviousPageButton"
-								ToolTipService.ToolTip="{Binding ElementName=PreviousPageButton, Path=(AutomationProperties.Name)}"
-								ToolTipService.Placement="Top"
-								Style="{TemplateBinding PreviousButtonStyle}"
-								HorizontalAlignment="Center"
-								VerticalAlignment="Center" />
-
-						<ScrollViewer x:Name="PipsPagerScrollViewer"
-									  VerticalScrollBarVisibility="Hidden"
-									  VerticalScrollMode="Disabled"
-									  HorizontalScrollBarVisibility="Hidden"
-									  HorizontalScrollMode="Disabled"
-									  IsHorizontalScrollChainingEnabled="False"
-									  IsVerticalScrollChainingEnabled="False"
-									  HorizontalAlignment="Center"
-									  VerticalAlignment="Center">
-							<muxc:ItemsRepeater x:Name="PipsPagerItemsRepeater"
-												ItemsSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PipsPagerItems}">
-								<muxc:ItemsRepeater.Layout>
-									<muxc:StackLayout Orientation="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}" />
-								</muxc:ItemsRepeater.Layout>
-								<muxc:ItemsRepeater.ItemTemplate>
-									<DataTemplate>
-										<Button />
-									</DataTemplate>
-								</muxc:ItemsRepeater.ItemTemplate>
-							</muxc:ItemsRepeater>
-						</ScrollViewer>
-
-						<Button x:Name="NextPageButton"
-								ToolTipService.ToolTip="{Binding ElementName=NextPageButton, Path=(AutomationProperties.Name)}"
-								ToolTipService.Placement="Bottom"
-								Style="{TemplateBinding NextButtonStyle}"
-								HorizontalAlignment="Center"
-								VerticalAlignment="Center" />
-					</StackPanel>
-				</ControlTemplate>
-			</Setter.Value>
-		</Setter>
-	</Style>
+                    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:muxc="using:Microsoft.UI.Xaml.Controls"
+                    xmlns:not_win="http://uno.ui/not_win"
+                    mc:Ignorable="d not_win">
+
+    <ResourceDictionary.ThemeDictionaries>
+
+        <ResourceDictionary x:Key="Default">
+            <!-- Background -->
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackground" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundSelected" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- BorderBrush -->
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushSelected" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- Foreground -->
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
+
+            <!-- Selection Button Visual States Ellipse -->
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+
+
+            <!-- Navigation Button Background -->
+            <StaticResource x:Key="PipsPagerNavigationButtonBackground" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- Navigation Button BorderBrush -->
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- Navigation Button Foreground -->
+            <StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+
+            <!-- Navigation Button Visual States Ellipse -->
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
+
+            <!-- Material PipsPager Resources -->
+            <x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
+            <x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
+
+            <x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
+            <x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
+
+            <Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
+            <Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
+
+            <x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
+            <x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
+
+            <x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
+            <x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
+            <Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
+
+            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
+            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
+
+            <x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
+            <x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
+        </ResourceDictionary>
+
+        <ResourceDictionary x:Key="Light">
+
+            <!-- Background -->
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackground" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundSelected" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- BorderBrush -->
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushSelected" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- Foreground -->
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
+
+            <!-- Foreground Selected -->
+            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
+
+            <!-- Selection Button Visual States Ellipse -->
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+
+
+            <!-- Navigation Button Background -->
+            <StaticResource x:Key="PipsPagerNavigationButtonBackground" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- Navigation Button BorderBrush -->
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+            <!-- Navigation Button Foreground -->
+            <StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
+            <StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+
+            <!-- Navigation Button Visual States Ellipse -->
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
+
+            <!-- Material PipsPager Resources -->
+            <x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
+            <x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
+
+            <x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
+            <x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
+
+            <Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
+            <Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
+
+            <x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
+            <x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
+
+            <x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
+            <x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
+            <Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
+
+            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
+            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
+
+            <x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
+            <x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
+        </ResourceDictionary>
+    </ResourceDictionary.ThemeDictionaries>
+
+    <Style x:Key="MaterialPipsPagerNavigationButtonBaseStyle"
+           TargetType="Button">
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Foreground" Value="{ThemeResource PipsPagerNavigationButtonForeground}" />
+        <Setter Property="BorderBrush" Value="{ThemeResource PipsPagerNavigationButtonBorderBrush}" />
+        <Setter Property="BorderThickness" Value="{ThemeResource PipsPagerNavigationButtonBorderThickness}" />
+        <Setter Property="UseSystemFocusVisuals" Value="{ThemeResource UseSystemFocusVisuals}" />
+        <Setter Property="FocusVisualMargin" Value="0" />
+        <Setter Property="HorizontalAlignment" Value="Center" />
+        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="Width" Value="{ThemeResource PipsPagerNavigationButtonWidth}" />
+        <Setter Property="Height" Value="{ThemeResource PipsPagerNavigationButtonHeight}" />
+        <Setter Property="Padding" Value="{ThemeResource PipsPagerNavigationButtonPadding}" />
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="Button">
+                    <Grid x:Name="RootGrid"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}">
+                        <VisualStateManager.VisualStateGroups>
+                            <VisualStateGroup x:Name="CommonStates">
+                                <VisualState x:Name="Normal" />
+                                <VisualState x:Name="PointerOver">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+                                                                       Storyboard.TargetProperty="Foreground">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonForegroundPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonBackgroundPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="BorderBrush">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Pressed">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+                                                                       Storyboard.TargetProperty="Foreground">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonForegroundPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonBackgroundPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="BorderBrush">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Disabled">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+                                                                       Storyboard.TargetProperty="Foreground">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonForegroundDisabled}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonBackgroundDisabled}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="BorderBrush">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerNavigationButtonBorderBrushDisabled}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                            </VisualStateGroup>
+                            <VisualStateGroup x:Name="FocusStates">
+                                <VisualState x:Name="Focused">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Unfocused" />
+                            </VisualStateGroup>
+                        </VisualStateManager.VisualStateGroups>
+
+                        <Ellipse x:Name="VisualStatesEllipse"
+                                 Height="{ThemeResource PipsPagerNavigationVisualStatesEllipseHeight}"
+                                 Width="{ThemeResource PipsPagerNavigationVisualStatesEllipseWidth}"
+                                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                 Fill="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFill}"
+                                 AutomationProperties.AccessibilityView="Raw" />
+
+                        <Border Padding="{TemplateBinding Padding}"
+                                RenderTransformOrigin="0.5, 0.5"
+                                Background="{TemplateBinding Background}">
+                            <Border.RenderTransform>
+                                <ScaleTransform x:Name="ScaleTransform" ScaleY="1" ScaleX="1" />
+                            </Border.RenderTransform>
+                            <PathIcon x:Name="Content"
+                                      Data="{TemplateBinding Content}"
+                                      Foreground="{TemplateBinding Foreground}"
+                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                      AutomationProperties.AccessibilityView="Raw" />
+                        </Border>
+                    </Grid>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+
+    <Style x:Key="MaterialPipsPagerPreviousPageButtonStyle"
+           TargetType="Button"
+           BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
+        <Setter Property="Content" Value="{StaticResource PipsPagerPreviousPageButtonData}" />
+        <Setter Property="VerticalContentAlignment" Value="Bottom" />
+    </Style>
+
+    <Style x:Key="MaterialPipsPagerNextPageButtonStyle"
+           TargetType="Button"
+           BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
+        <Setter Property="Content" Value="{StaticResource PipsPagerNextPageButtonData}" />
+        <Setter Property="VerticalContentAlignment" Value="Top" />
+    </Style>
+
+    <Style x:Key="MaterialPipsPagerButtonBaseStyle"
+           TargetType="Button">
+        <Setter Property="Background" Value="{ThemeResource PipsPagerSelectionIndicatorBackground}" />
+        <Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
+        <Setter Property="BorderBrush" Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrush}" />
+        <Setter Property="BorderThickness" Value="{ThemeResource PipsPagerButtonBorderThickness}" />
+        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
+        <Setter Property="FocusVisualMargin" Value="0" />
+    </Style>
+
+    <Style x:Key="MaterialPipsPagerSelectedPipButtonStyle"
+           TargetType="Button"
+           BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
+        <Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForegroundSelected}" />
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="Button">
+                    <Grid x:Name="RootGrid"
+                          IsHitTestVisible="True"
+                          Background="{TemplateBinding Background}"
+                          BorderBrush="{TemplateBinding BorderBrush}"
+                          BorderThickness="{TemplateBinding BorderThickness}"
+                          Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+                          Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
+                        <VisualStateManager.VisualStateGroups>
+                            <VisualStateGroup x:Name="CommonStates">
+                                <VisualState x:Name="Normal" />
+                                <VisualState x:Name="PointerOver">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Stroke">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Pressed">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Stroke">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Disabled">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundDisabled}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Stroke">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushDisabled}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                            </VisualStateGroup>
+                            <VisualStateGroup x:Name="FocusStates">
+                                <VisualState x:Name="Focused">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Unfocused" />
+                            </VisualStateGroup>
+                            <VisualStateGroup x:Name="OrientationStates">
+                                <VisualState x:Name="HorizontalOrientation" />
+                                <VisualState x:Name="VerticalOrientation">
+                                    <VisualState.Setters>
+                                        <Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
+                                        <Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+                        </VisualStateManager.VisualStateGroups>
+
+                        <Ellipse x:Name="VisualStatesEllipse"
+                                 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
+                                 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+                                 Fill="{ThemeResource MaterialPipsPagerVisualStateEllipseFill}"
+                                 AutomationProperties.AccessibilityView="Raw" />
+
+                        <Ellipse x:Name="MainEllipse"
+                                 Height="{ThemeResource PipsPagerSelectedEllipseSize}"
+                                 Width="{ThemeResource PipsPagerSelectedEllipseSize}"
+                                 Fill="{TemplateBinding Foreground}"
+                                 Stroke="{TemplateBinding BorderBrush}"
+                                 StrokeThickness="{TemplateBinding BorderThickness}"
+                                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                 AutomationProperties.AccessibilityView="Raw" />
+                    </Grid>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+
+    <Style x:Key="MaterialPipsPagerNormalPipButtonStyle"
+           TargetType="Button"
+           BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
+        <Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="Button">
+                    <Grid x:Name="RootGrid"
+                          IsHitTestVisible="True"
+                          Background="{TemplateBinding Background}"
+                          Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+                          Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
+                        <VisualStateManager.VisualStateGroups>
+                            <VisualStateGroup x:Name="CommonStates">
+                                <VisualState x:Name="Normal" />
+                                <VisualState x:Name="PointerOver">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Stroke">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Pressed">
+                                    <Storyboard>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Stroke">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Disabled">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                            </VisualStateGroup>
+                            <VisualStateGroup x:Name="FocusStates">
+                                <VisualState x:Name="Focused">
+                                    <Storyboard>
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundFocused}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+                                                                       Storyboard.TargetProperty="Fill">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+                                                                       Storyboard.TargetProperty="Background">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundFocused}" />
+                                        </ObjectAnimationUsingKeyFrames>
+
+                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+                                                                       Storyboard.TargetProperty="Stroke">
+                                            <DiscreteObjectKeyFrame KeyTime="0"
+                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushFocused}" />
+                                        </ObjectAnimationUsingKeyFrames>
+                                    </Storyboard>
+                                </VisualState>
+                                <VisualState x:Name="Unfocused" />
+                            </VisualStateGroup>
+                            <VisualStateGroup x:Name="OrientationStates">
+                                <VisualState x:Name="HorizontalOrientation" />
+                                <VisualState x:Name="VerticalOrientation">
+                                    <VisualState.Setters>
+                                        <Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
+                                        <Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+                        </VisualStateManager.VisualStateGroups>
+
+                        <Ellipse x:Name="MainEllipse"
+                                 Height="{ThemeResource PipsPagerNormalEllipseSize}"
+                                 Width="{ThemeResource PipsPagerNormalEllipseSize}"
+                                 Fill="{TemplateBinding Foreground}"
+                                 Stroke="{TemplateBinding BorderBrush}"
+                                 StrokeThickness="{TemplateBinding BorderThickness}"
+                                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                                 AutomationProperties.AccessibilityView="Raw" />
+
+                        <Ellipse x:Name="VisualStatesEllipse"
+                                 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
+                                 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+                                 Fill="Transparent"
+                                 AutomationProperties.AccessibilityView="Raw" />
+                    </Grid>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+
+    <Style x:Key="BaseMaterialPipsPagerStyle"
+           TargetType="muxc:PipsPager">
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="HorizontalAlignment" Value="Left" />
+        <Setter Property="VerticalAlignment" Value="Top" />
+        <Setter Property="IsTabStop" Value="False" />
+        <Setter Property="PreviousButtonStyle" Value="{StaticResource MaterialPipsPagerPreviousPageButtonStyle}" />
+        <Setter Property="NextButtonStyle" Value="{StaticResource MaterialPipsPagerNextPageButtonStyle}" />
+        <!-- Uno already implemented the 2.8.0 MUX version of the control -->
+        <!-- Uno.Themes reference is still on the MUX v2.6.0-prerelease.210113001 version for now -->
+        <!-- Remove this file, PipsPager.UWP.xaml,and use <Setter Property=NormalPipStyle /> and <Setter Property=SelectedPipStyle /> only in PipsPager.xaml -->
+        <!-- with the rest of the code, once we can bump the Microsoft.UI.Xaml version -->
+        <not_win:Setter Property="SelectedPipStyle"
+                        Value="{StaticResource MaterialPipsPagerSelectedPipButtonStyle}" />
+        <not_win:Setter Property="NormalPipStyle"
+                        Value="{StaticResource MaterialPipsPagerNormalPipButtonStyle}" />
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="muxc:PipsPager">
+                    <StackPanel x:Name="RootPanel"
+                                Orientation="{TemplateBinding Orientation}"
+                                Background="{TemplateBinding Background}">
+                        <VisualStateManager.VisualStateGroups>
+                            <VisualStateGroup x:Name="PreviousPageButtonVisibilityStates">
+                                <VisualState x:Name="PreviousPageButtonVisible" />
+                                <VisualState x:Name="PreviousPageButtonHidden">
+                                    <VisualState.Setters>
+                                        <Setter Target="PreviousPageButton.Opacity" Value="0" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                                <VisualState x:Name="PreviousPageButtonCollapsed">
+                                    <VisualState.Setters>
+                                        <Setter Target="PreviousPageButton.Visibility" Value="Collapsed" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+
+                            <VisualStateGroup x:Name="PreviousPageButtonIsEnabledStates">
+                                <VisualState x:Name="PreviousPageButtonEnabled" />
+                                <VisualState x:Name="PreviousPageButtonDisabled">
+                                    <VisualState.Setters>
+                                        <Setter Target="PreviousPageButton.IsEnabled" Value="False" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+
+                            <VisualStateGroup x:Name="NextPageButtonVisibilityStates">
+                                <VisualState x:Name="NextPageButtonVisible" />
+                                <VisualState x:Name="NextPageButtonHidden">
+                                    <VisualState.Setters>
+                                        <Setter Target="NextPageButton.Opacity" Value="0" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                                <VisualState x:Name="NextPageButtonCollapsed">
+                                    <VisualState.Setters>
+                                        <Setter Target="NextPageButton.Visibility" Value="Collapsed" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+
+                            <VisualStateGroup x:Name="NextPageButtonIsEnabledStates">
+                                <VisualState x:Name="NextPageButtonEnabled" />
+                                <VisualState x:Name="NextPageButtonDisabled">
+                                    <VisualState.Setters>
+                                        <Setter Target="NextPageButton.IsEnabled" Value="False" />
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+
+                            <VisualStateGroup x:Name="RootPanelOrientationStates">
+                                <VisualState x:Name="VerticalOrientationView" />
+                                <VisualState x:Name="HorizontalOrientationView">
+                                    <VisualState.Setters>
+                                        <Setter Target="RootPanel.Orientation" Value="Horizontal" />
+                                        <Setter Target="PreviousPageButton.(ToolTipService.Placement)" Value="Left" />
+                                        <Setter Target="PreviousPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
+                                        <Setter Target="PreviousPageButton.RenderTransform">
+                                            <Setter.Value>
+                                                <RotateTransform Angle="-90" />
+                                            </Setter.Value>
+                                        </Setter>
+                                        <Setter Target="NextPageButton.(ToolTipService.Placement)" Value="Right" />
+                                        <Setter Target="NextPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
+                                        <Setter Target="NextPageButton.RenderTransform">
+                                            <Setter.Value>
+                                                <RotateTransform Angle="-90" />
+                                            </Setter.Value>
+                                        </Setter>
+                                    </VisualState.Setters>
+                                </VisualState>
+                            </VisualStateGroup>
+                        </VisualStateManager.VisualStateGroups>
+
+                        <Button x:Name="PreviousPageButton"
+                                ToolTipService.ToolTip="{Binding ElementName=PreviousPageButton, Path=(AutomationProperties.Name)}"
+                                ToolTipService.Placement="Top"
+                                Style="{TemplateBinding PreviousButtonStyle}"
+                                HorizontalAlignment="Center"
+                                VerticalAlignment="Center" />
+
+                        <ScrollViewer x:Name="PipsPagerScrollViewer"
+                                      VerticalScrollBarVisibility="Hidden"
+                                      VerticalScrollMode="Disabled"
+                                      HorizontalScrollBarVisibility="Hidden"
+                                      HorizontalScrollMode="Disabled"
+                                      IsHorizontalScrollChainingEnabled="False"
+                                      IsVerticalScrollChainingEnabled="False"
+                                      HorizontalAlignment="Center"
+                                      VerticalAlignment="Center">
+                            <muxc:ItemsRepeater x:Name="PipsPagerItemsRepeater"
+                                                ItemsSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PipsPagerItems}">
+                                <muxc:ItemsRepeater.Layout>
+                                    <muxc:StackLayout Orientation="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}" />
+                                </muxc:ItemsRepeater.Layout>
+                                <muxc:ItemsRepeater.ItemTemplate>
+                                    <DataTemplate>
+                                        <Button />
+                                    </DataTemplate>
+                                </muxc:ItemsRepeater.ItemTemplate>
+                            </muxc:ItemsRepeater>
+                        </ScrollViewer>
+
+                        <Button x:Name="NextPageButton"
+                                ToolTipService.ToolTip="{Binding ElementName=NextPageButton, Path=(AutomationProperties.Name)}"
+                                ToolTipService.Placement="Bottom"
+                                Style="{TemplateBinding NextButtonStyle}"
+                                HorizontalAlignment="Center"
+                                VerticalAlignment="Center" />
+                    </StackPanel>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
 
 </ResourceDictionary>

From 55fcdc471fb40ce69e259f1afe28d517c206cfc2 Mon Sep 17 00:00:00 2001
From: Marc-Antoine Soucy <ma.soucy@nventive.com>
Date: Thu, 27 Jul 2023 11:42:03 -0400
Subject: [PATCH 3/4] chore: Uno package update

---
 src/library/Uno.Cupertino/Uno.Cupertino.csproj              | 4 ++--
 src/library/Uno.Material/Uno.Material.csproj                | 4 ++--
 .../Uno.Themes.Samples.Mobile.csproj                        | 6 +++---
 .../Uno.Themes.Samples.Skia.Gtk.csproj                      | 6 +++---
 .../Uno.Themes.Samples.UWP/Uno.Themes.Samples.UWP.csproj    | 2 +-
 .../Uno.Themes.Samples.Wasm/Uno.Themes.Samples.Wasm.csproj  | 6 +++---
 6 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/library/Uno.Cupertino/Uno.Cupertino.csproj b/src/library/Uno.Cupertino/Uno.Cupertino.csproj
index d393c991b..d337bc3d9 100644
--- a/src/library/Uno.Cupertino/Uno.Cupertino.csproj
+++ b/src/library/Uno.Cupertino/Uno.Cupertino.csproj
@@ -86,14 +86,14 @@
 			</PropertyGroup>
 
 			<ItemGroup>
-				<PackageReference Include="Uno.UI" Version="5.0.0-dev.1433" />
+				<PackageReference Include="Uno.UI" Version="5.0.0-dev.1634" />
 			</ItemGroup>
 			<ItemGroup Condition="$(_IsUWP)">
 				<PackageReference Include="Microsoft.UI.Xaml" Version="2.6.0-prerelease.210113001" />
 				<PackageReference Include="Microsoft.Toolkit.Uwp.UI.Lottie" Version="6.1.0" />
 			</ItemGroup>
 			<ItemGroup Condition="!$(_IsUWP)">
-				<PackageReference Include="Uno.UI.Lottie" Version="5.0.0-dev.1433" />
+				<PackageReference Include="Uno.UI.Lottie" Version="5.0.0-dev.1634" />
 			</ItemGroup>
 
 			<ItemGroup Condition="$(_IsUWP)">
diff --git a/src/library/Uno.Material/Uno.Material.csproj b/src/library/Uno.Material/Uno.Material.csproj
index 05661cb75..44283c9f3 100644
--- a/src/library/Uno.Material/Uno.Material.csproj
+++ b/src/library/Uno.Material/Uno.Material.csproj
@@ -97,14 +97,14 @@
 			</PropertyGroup>
 
 			<ItemGroup>
-				<PackageReference Include="Uno.UI" Version="5.0.0-dev.1433" />
+				<PackageReference Include="Uno.UI" Version="5.0.0-dev.1634" />
 			</ItemGroup>
 			<ItemGroup Condition="$(_IsUWP)">
 				<PackageReference Include="Microsoft.UI.Xaml" Version="2.6.0-prerelease.210113001" />
 				<PackageReference Include="Microsoft.Toolkit.Uwp.UI.Lottie" Version="6.1.0" />
 			</ItemGroup>
 			<ItemGroup Condition="!$(_IsUWP)">
-				<PackageReference Include="Uno.UI.Lottie" Version="5.0.0-dev.1433" />
+				<PackageReference Include="Uno.UI.Lottie" Version="5.0.0-dev.1634" />
 			</ItemGroup>
 
 
diff --git a/src/samples/UWP/Uno.Themes.Samples.Mobile/Uno.Themes.Samples.Mobile.csproj b/src/samples/UWP/Uno.Themes.Samples.Mobile/Uno.Themes.Samples.Mobile.csproj
index 816617b62..d2fc9be0c 100644
--- a/src/samples/UWP/Uno.Themes.Samples.Mobile/Uno.Themes.Samples.Mobile.csproj
+++ b/src/samples/UWP/Uno.Themes.Samples.Mobile/Uno.Themes.Samples.Mobile.csproj
@@ -44,11 +44,11 @@
 		<PackageReference Include="Uno.ShowMeTheXAML.MSBuild">
 			<Version>1.0.59</Version>
 		</PackageReference>
-		<PackageReference Include="Uno.UI" Version="5.0.0-dev.1433" />
-		<PackageReference Include="Uno.UI.RemoteControl" Version="5.0.0-dev.1433" Condition="'$(Configuration)'=='Debug'" />
+		<PackageReference Include="Uno.UI" Version="5.0.0-dev.1634" />
+		<PackageReference Include="Uno.UI.RemoteControl" Version="5.0.0-dev.1634" Condition="'$(Configuration)'=='Debug'" />
 		<PackageReference Include="Microsoft.Extensions.Logging.Console" Version="1.1.1" />
 		<PackageReference Include="Microsoft.Extensions.Logging.Filter" Version="1.1.1" />
-		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.0.0-dev.1433" />
+		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.0.0-dev.1634" />
 		<PackageReference Include="Uno.Core.Extensions.Compatibility" Version="4.0.1" />
 		<PackageReference Include="Uno.Core.Extensions.Disposables" Version="4.0.1" />
 	</ItemGroup>
diff --git a/src/samples/UWP/Uno.Themes.Samples.Skia.Gtk/Uno.Themes.Samples.Skia.Gtk.csproj b/src/samples/UWP/Uno.Themes.Samples.Skia.Gtk/Uno.Themes.Samples.Skia.Gtk.csproj
index 236cf62c7..07135e63f 100644
--- a/src/samples/UWP/Uno.Themes.Samples.Skia.Gtk/Uno.Themes.Samples.Skia.Gtk.csproj
+++ b/src/samples/UWP/Uno.Themes.Samples.Skia.Gtk/Uno.Themes.Samples.Skia.Gtk.csproj
@@ -36,9 +36,9 @@
 		<PackageReference Include="SkiaSharp.Views.Uno" Version="2.88.1-preview.79" />
 		<PackageReference Include="Uno.ShowMeTheXAML" Version="1.0.59" />
 		<PackageReference Include="Uno.ShowMeTheXAML.MSBuild" Version="1.0.59" />
-		<PackageReference Include="Uno.UI.Skia.Gtk" Version="5.0.0-dev.1433" />
-		<PackageReference Include="Uno.UI.RemoteControl" Version="5.0.0-dev.1433" Condition="'$(Configuration)'=='Debug'" />
-		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.0.0-dev.1433" />
+		<PackageReference Include="Uno.UI.Skia.Gtk" Version="5.0.0-dev.1634" />
+		<PackageReference Include="Uno.UI.RemoteControl" Version="5.0.0-dev.1634" Condition="'$(Configuration)'=='Debug'" />
+		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.0.0-dev.1634" />
 		<PackageReference Include="Uno.Core.Extensions.Compatibility" Version="4.0.1" />
 		<PackageReference Include="Uno.Core.Extensions.Disposables" Version="4.0.1" />
 	</ItemGroup>
diff --git a/src/samples/UWP/Uno.Themes.Samples.UWP/Uno.Themes.Samples.UWP.csproj b/src/samples/UWP/Uno.Themes.Samples.UWP/Uno.Themes.Samples.UWP.csproj
index 38f18d4fc..b98f788ad 100644
--- a/src/samples/UWP/Uno.Themes.Samples.UWP/Uno.Themes.Samples.UWP.csproj
+++ b/src/samples/UWP/Uno.Themes.Samples.UWP/Uno.Themes.Samples.UWP.csproj
@@ -37,7 +37,7 @@
       <Version>1.0.59</Version>
     </PackageReference>
     <PackageReference Include="Uno.UI">
-      <Version>5.0.0-dev.1433</Version>
+      <Version>5.0.0-dev.1634</Version>
     </PackageReference>
     <PackageReference Include="Uno.Core.Extensions.Compatibility" Version="4.0.1" />
     <PackageReference Include="Uno.Core.Extensions.Disposables" Version="4.0.1" />
diff --git a/src/samples/UWP/Uno.Themes.Samples.Wasm/Uno.Themes.Samples.Wasm.csproj b/src/samples/UWP/Uno.Themes.Samples.Wasm/Uno.Themes.Samples.Wasm.csproj
index 1e3be8cf4..f9405c7ce 100644
--- a/src/samples/UWP/Uno.Themes.Samples.Wasm/Uno.Themes.Samples.Wasm.csproj
+++ b/src/samples/UWP/Uno.Themes.Samples.Wasm/Uno.Themes.Samples.Wasm.csproj
@@ -54,9 +54,9 @@
 		</PackageReference>
 		<PackageReference Include="Uno.ShowMeTheXAML" Version="1.0.59" />
 		<PackageReference Include="Uno.ShowMeTheXAML.MSBuild" Version="1.0.59" />
-		<PackageReference Include="Uno.UI.RemoteControl" Version="5.0.0-dev.1433" Condition="'$(Configuration)'=='Debug'" />
-		<PackageReference Include="Uno.UI.WebAssembly" Version="5.0.0-dev.1433" />
-		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.0.0-dev.1433" />
+		<PackageReference Include="Uno.UI.RemoteControl" Version="5.0.0-dev.1634" Condition="'$(Configuration)'=='Debug'" />
+		<PackageReference Include="Uno.UI.WebAssembly" Version="5.0.0-dev.1634" />
+		<PackageReference Include="Uno.UI.Adapter.Microsoft.Extensions.Logging" Version="5.0.0-dev.1634" />
 		<PackageReference Include="Uno.Core.Extensions.Compatibility" Version="4.0.1" />
 		<PackageReference Include="Uno.Core.Extensions.Disposables" Version="4.0.1" />
 		<PackageReference Include="Uno.Wasm.Bootstrap" Version="7.0.20" />

From 73822ccb5ed0e21ce1a216a18315cbb6a0cfaf07 Mon Sep 17 00:00:00 2001
From: Marc-Antoine Soucy <ma.soucy@nventive.com>
Date: Thu, 27 Jul 2023 12:00:12 -0400
Subject: [PATCH 4/4] fix: pipspager resources not used

---
 .../Styles/Controls/v2/PipsPager.Base.xaml    | 1458 ++++++++---------
 1 file changed, 729 insertions(+), 729 deletions(-)

diff --git a/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml b/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
index f671826ff..d80dc42b0 100644
--- a/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
+++ b/src/library/Uno.Material/Styles/Controls/v2/PipsPager.Base.xaml
@@ -1,732 +1,732 @@
 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-                    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:muxc="using:Microsoft.UI.Xaml.Controls"
-                    xmlns:not_win="http://uno.ui/not_win"
-                    mc:Ignorable="d not_win">
-
-    <ResourceDictionary.ThemeDictionaries>
-
-        <ResourceDictionary x:Key="Default">
-            <!-- Background -->
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackground" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundSelected" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- BorderBrush -->
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrush" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushSelected" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- Foreground -->
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
-
-            <!-- Selection Button Visual States Ellipse -->
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-
-
-            <!-- Navigation Button Background -->
-            <StaticResource x:Key="PipsPagerNavigationButtonBackground" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- Navigation Button BorderBrush -->
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrush" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- Navigation Button Foreground -->
-            <StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-
-            <!-- Navigation Button Visual States Ellipse -->
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
-
-            <!-- Material PipsPager Resources -->
-            <x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
-            <x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
-
-            <x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
-            <x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
-
-            <Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
-            <Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
-
-            <x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
-            <x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
-
-            <x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
-            <x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
-            <Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
-
-            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
-            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
-
-            <x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
-            <x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
-        </ResourceDictionary>
-
-        <ResourceDictionary x:Key="Light">
-
-            <!-- Background -->
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackground" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundSelected" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- BorderBrush -->
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrush" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushSelected" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- Foreground -->
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
-
-            <!-- Foreground Selected -->
-            <StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
-
-            <!-- Selection Button Visual States Ellipse -->
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-            <StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-
-
-            <!-- Navigation Button Background -->
-            <StaticResource x:Key="PipsPagerNavigationButtonBackground" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- Navigation Button BorderBrush -->
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrush" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
-
-            <!-- Navigation Button Foreground -->
-            <StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
-            <StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
-
-            <!-- Navigation Button Visual States Ellipse -->
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
-            <StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
-
-            <!-- Material PipsPager Resources -->
-            <x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
-            <x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
-
-            <x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
-            <x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
-
-            <Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
-            <Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
-
-            <x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
-            <x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
-
-            <x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
-            <x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
-            <Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
-
-            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
-            <x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
-
-            <x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
-            <x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
-        </ResourceDictionary>
-    </ResourceDictionary.ThemeDictionaries>
-
-    <Style x:Key="MaterialPipsPagerNavigationButtonBaseStyle"
-           TargetType="Button">
-        <Setter Property="Background" Value="Transparent" />
-        <Setter Property="Foreground" Value="{ThemeResource PipsPagerNavigationButtonForeground}" />
-        <Setter Property="BorderBrush" Value="{ThemeResource PipsPagerNavigationButtonBorderBrush}" />
-        <Setter Property="BorderThickness" Value="{ThemeResource PipsPagerNavigationButtonBorderThickness}" />
-        <Setter Property="UseSystemFocusVisuals" Value="{ThemeResource UseSystemFocusVisuals}" />
-        <Setter Property="FocusVisualMargin" Value="0" />
-        <Setter Property="HorizontalAlignment" Value="Center" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="Width" Value="{ThemeResource PipsPagerNavigationButtonWidth}" />
-        <Setter Property="Height" Value="{ThemeResource PipsPagerNavigationButtonHeight}" />
-        <Setter Property="Padding" Value="{ThemeResource PipsPagerNavigationButtonPadding}" />
-        <Setter Property="Template">
-            <Setter.Value>
-                <ControlTemplate TargetType="Button">
-                    <Grid x:Name="RootGrid"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}">
-                        <VisualStateManager.VisualStateGroups>
-                            <VisualStateGroup x:Name="CommonStates">
-                                <VisualState x:Name="Normal" />
-                                <VisualState x:Name="PointerOver">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
-                                                                       Storyboard.TargetProperty="Foreground">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonForegroundPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonBackgroundPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="BorderBrush">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Pressed">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
-                                                                       Storyboard.TargetProperty="Foreground">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonForegroundPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonBackgroundPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="BorderBrush">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Disabled">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
-                                                                       Storyboard.TargetProperty="Foreground">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonForegroundDisabled}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonBackgroundDisabled}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="BorderBrush">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerNavigationButtonBorderBrushDisabled}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                            </VisualStateGroup>
-                            <VisualStateGroup x:Name="FocusStates">
-                                <VisualState x:Name="Focused">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Unfocused" />
-                            </VisualStateGroup>
-                        </VisualStateManager.VisualStateGroups>
-
-                        <Ellipse x:Name="VisualStatesEllipse"
-                                 Height="{ThemeResource PipsPagerNavigationVisualStatesEllipseHeight}"
-                                 Width="{ThemeResource PipsPagerNavigationVisualStatesEllipseWidth}"
-                                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                 Fill="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFill}"
-                                 AutomationProperties.AccessibilityView="Raw" />
-
-                        <Border Padding="{TemplateBinding Padding}"
-                                RenderTransformOrigin="0.5, 0.5"
-                                Background="{TemplateBinding Background}">
-                            <Border.RenderTransform>
-                                <ScaleTransform x:Name="ScaleTransform" ScaleY="1" ScaleX="1" />
-                            </Border.RenderTransform>
-                            <PathIcon x:Name="Content"
-                                      Data="{TemplateBinding Content}"
-                                      Foreground="{TemplateBinding Foreground}"
-                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                      AutomationProperties.AccessibilityView="Raw" />
-                        </Border>
-                    </Grid>
-                </ControlTemplate>
-            </Setter.Value>
-        </Setter>
-    </Style>
-
-    <Style x:Key="MaterialPipsPagerPreviousPageButtonStyle"
-           TargetType="Button"
-           BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
-        <Setter Property="Content" Value="{StaticResource PipsPagerPreviousPageButtonData}" />
-        <Setter Property="VerticalContentAlignment" Value="Bottom" />
-    </Style>
-
-    <Style x:Key="MaterialPipsPagerNextPageButtonStyle"
-           TargetType="Button"
-           BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
-        <Setter Property="Content" Value="{StaticResource PipsPagerNextPageButtonData}" />
-        <Setter Property="VerticalContentAlignment" Value="Top" />
-    </Style>
-
-    <Style x:Key="MaterialPipsPagerButtonBaseStyle"
-           TargetType="Button">
-        <Setter Property="Background" Value="{ThemeResource PipsPagerSelectionIndicatorBackground}" />
-        <Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
-        <Setter Property="BorderBrush" Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrush}" />
-        <Setter Property="BorderThickness" Value="{ThemeResource PipsPagerButtonBorderThickness}" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
-        <Setter Property="FocusVisualMargin" Value="0" />
-    </Style>
-
-    <Style x:Key="MaterialPipsPagerSelectedPipButtonStyle"
-           TargetType="Button"
-           BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
-        <Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForegroundSelected}" />
-        <Setter Property="Template">
-            <Setter.Value>
-                <ControlTemplate TargetType="Button">
-                    <Grid x:Name="RootGrid"
-                          IsHitTestVisible="True"
-                          Background="{TemplateBinding Background}"
-                          BorderBrush="{TemplateBinding BorderBrush}"
-                          BorderThickness="{TemplateBinding BorderThickness}"
-                          Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-                          Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
-                        <VisualStateManager.VisualStateGroups>
-                            <VisualStateGroup x:Name="CommonStates">
-                                <VisualState x:Name="Normal" />
-                                <VisualState x:Name="PointerOver">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Stroke">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Pressed">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Stroke">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Disabled">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundDisabled}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Stroke">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushDisabled}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                            </VisualStateGroup>
-                            <VisualStateGroup x:Name="FocusStates">
-                                <VisualState x:Name="Focused">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Unfocused" />
-                            </VisualStateGroup>
-                            <VisualStateGroup x:Name="OrientationStates">
-                                <VisualState x:Name="HorizontalOrientation" />
-                                <VisualState x:Name="VerticalOrientation">
-                                    <VisualState.Setters>
-                                        <Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
-                                        <Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                            </VisualStateGroup>
-                        </VisualStateManager.VisualStateGroups>
-
-                        <Ellipse x:Name="VisualStatesEllipse"
-                                 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
-                                 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-                                 Fill="{ThemeResource MaterialPipsPagerVisualStateEllipseFill}"
-                                 AutomationProperties.AccessibilityView="Raw" />
-
-                        <Ellipse x:Name="MainEllipse"
-                                 Height="{ThemeResource PipsPagerSelectedEllipseSize}"
-                                 Width="{ThemeResource PipsPagerSelectedEllipseSize}"
-                                 Fill="{TemplateBinding Foreground}"
-                                 Stroke="{TemplateBinding BorderBrush}"
-                                 StrokeThickness="{TemplateBinding BorderThickness}"
-                                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                 AutomationProperties.AccessibilityView="Raw" />
-                    </Grid>
-                </ControlTemplate>
-            </Setter.Value>
-        </Setter>
-    </Style>
-
-    <Style x:Key="MaterialPipsPagerNormalPipButtonStyle"
-           TargetType="Button"
-           BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
-        <Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
-        <Setter Property="Template">
-            <Setter.Value>
-                <ControlTemplate TargetType="Button">
-                    <Grid x:Name="RootGrid"
-                          IsHitTestVisible="True"
-                          Background="{TemplateBinding Background}"
-                          Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-                          Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
-                        <VisualStateManager.VisualStateGroups>
-                            <VisualStateGroup x:Name="CommonStates">
-                                <VisualState x:Name="Normal" />
-                                <VisualState x:Name="PointerOver">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Stroke">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Pressed">
-                                    <Storyboard>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Stroke">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Disabled">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                            </VisualStateGroup>
-                            <VisualStateGroup x:Name="FocusStates">
-                                <VisualState x:Name="Focused">
-                                    <Storyboard>
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorForegroundFocused}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
-                                                                       Storyboard.TargetProperty="Fill">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
-                                                                       Storyboard.TargetProperty="Background">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundFocused}" />
-                                        </ObjectAnimationUsingKeyFrames>
-
-                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
-                                                                       Storyboard.TargetProperty="Stroke">
-                                            <DiscreteObjectKeyFrame KeyTime="0"
-                                                                    Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushFocused}" />
-                                        </ObjectAnimationUsingKeyFrames>
-                                    </Storyboard>
-                                </VisualState>
-                                <VisualState x:Name="Unfocused" />
-                            </VisualStateGroup>
-                            <VisualStateGroup x:Name="OrientationStates">
-                                <VisualState x:Name="HorizontalOrientation" />
-                                <VisualState x:Name="VerticalOrientation">
-                                    <VisualState.Setters>
-                                        <Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
-                                        <Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                            </VisualStateGroup>
-                        </VisualStateManager.VisualStateGroups>
-
-                        <Ellipse x:Name="MainEllipse"
-                                 Height="{ThemeResource PipsPagerNormalEllipseSize}"
-                                 Width="{ThemeResource PipsPagerNormalEllipseSize}"
-                                 Fill="{TemplateBinding Foreground}"
-                                 Stroke="{TemplateBinding BorderBrush}"
-                                 StrokeThickness="{TemplateBinding BorderThickness}"
-                                 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                 AutomationProperties.AccessibilityView="Raw" />
-
-                        <Ellipse x:Name="VisualStatesEllipse"
-                                 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
-                                 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
-                                 Fill="Transparent"
-                                 AutomationProperties.AccessibilityView="Raw" />
-                    </Grid>
-                </ControlTemplate>
-            </Setter.Value>
-        </Setter>
-    </Style>
-
-    <Style x:Key="BaseMaterialPipsPagerStyle"
-           TargetType="muxc:PipsPager">
-        <Setter Property="Background" Value="Transparent" />
-        <Setter Property="HorizontalAlignment" Value="Left" />
-        <Setter Property="VerticalAlignment" Value="Top" />
-        <Setter Property="IsTabStop" Value="False" />
-        <Setter Property="PreviousButtonStyle" Value="{StaticResource MaterialPipsPagerPreviousPageButtonStyle}" />
-        <Setter Property="NextButtonStyle" Value="{StaticResource MaterialPipsPagerNextPageButtonStyle}" />
-        <!-- Uno already implemented the 2.8.0 MUX version of the control -->
-        <!-- Uno.Themes reference is still on the MUX v2.6.0-prerelease.210113001 version for now -->
-        <!-- Remove this file, PipsPager.UWP.xaml,and use <Setter Property=NormalPipStyle /> and <Setter Property=SelectedPipStyle /> only in PipsPager.xaml -->
-        <!-- with the rest of the code, once we can bump the Microsoft.UI.Xaml version -->
-        <not_win:Setter Property="SelectedPipStyle"
-                        Value="{StaticResource MaterialPipsPagerSelectedPipButtonStyle}" />
-        <not_win:Setter Property="NormalPipStyle"
-                        Value="{StaticResource MaterialPipsPagerNormalPipButtonStyle}" />
-        <Setter Property="Template">
-            <Setter.Value>
-                <ControlTemplate TargetType="muxc:PipsPager">
-                    <StackPanel x:Name="RootPanel"
-                                Orientation="{TemplateBinding Orientation}"
-                                Background="{TemplateBinding Background}">
-                        <VisualStateManager.VisualStateGroups>
-                            <VisualStateGroup x:Name="PreviousPageButtonVisibilityStates">
-                                <VisualState x:Name="PreviousPageButtonVisible" />
-                                <VisualState x:Name="PreviousPageButtonHidden">
-                                    <VisualState.Setters>
-                                        <Setter Target="PreviousPageButton.Opacity" Value="0" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                                <VisualState x:Name="PreviousPageButtonCollapsed">
-                                    <VisualState.Setters>
-                                        <Setter Target="PreviousPageButton.Visibility" Value="Collapsed" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                            </VisualStateGroup>
-
-                            <VisualStateGroup x:Name="PreviousPageButtonIsEnabledStates">
-                                <VisualState x:Name="PreviousPageButtonEnabled" />
-                                <VisualState x:Name="PreviousPageButtonDisabled">
-                                    <VisualState.Setters>
-                                        <Setter Target="PreviousPageButton.IsEnabled" Value="False" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                            </VisualStateGroup>
-
-                            <VisualStateGroup x:Name="NextPageButtonVisibilityStates">
-                                <VisualState x:Name="NextPageButtonVisible" />
-                                <VisualState x:Name="NextPageButtonHidden">
-                                    <VisualState.Setters>
-                                        <Setter Target="NextPageButton.Opacity" Value="0" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                                <VisualState x:Name="NextPageButtonCollapsed">
-                                    <VisualState.Setters>
-                                        <Setter Target="NextPageButton.Visibility" Value="Collapsed" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                            </VisualStateGroup>
-
-                            <VisualStateGroup x:Name="NextPageButtonIsEnabledStates">
-                                <VisualState x:Name="NextPageButtonEnabled" />
-                                <VisualState x:Name="NextPageButtonDisabled">
-                                    <VisualState.Setters>
-                                        <Setter Target="NextPageButton.IsEnabled" Value="False" />
-                                    </VisualState.Setters>
-                                </VisualState>
-                            </VisualStateGroup>
-
-                            <VisualStateGroup x:Name="RootPanelOrientationStates">
-                                <VisualState x:Name="VerticalOrientationView" />
-                                <VisualState x:Name="HorizontalOrientationView">
-                                    <VisualState.Setters>
-                                        <Setter Target="RootPanel.Orientation" Value="Horizontal" />
-                                        <Setter Target="PreviousPageButton.(ToolTipService.Placement)" Value="Left" />
-                                        <Setter Target="PreviousPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
-                                        <Setter Target="PreviousPageButton.RenderTransform">
-                                            <Setter.Value>
-                                                <RotateTransform Angle="-90" />
-                                            </Setter.Value>
-                                        </Setter>
-                                        <Setter Target="NextPageButton.(ToolTipService.Placement)" Value="Right" />
-                                        <Setter Target="NextPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
-                                        <Setter Target="NextPageButton.RenderTransform">
-                                            <Setter.Value>
-                                                <RotateTransform Angle="-90" />
-                                            </Setter.Value>
-                                        </Setter>
-                                    </VisualState.Setters>
-                                </VisualState>
-                            </VisualStateGroup>
-                        </VisualStateManager.VisualStateGroups>
-
-                        <Button x:Name="PreviousPageButton"
-                                ToolTipService.ToolTip="{Binding ElementName=PreviousPageButton, Path=(AutomationProperties.Name)}"
-                                ToolTipService.Placement="Top"
-                                Style="{TemplateBinding PreviousButtonStyle}"
-                                HorizontalAlignment="Center"
-                                VerticalAlignment="Center" />
-
-                        <ScrollViewer x:Name="PipsPagerScrollViewer"
-                                      VerticalScrollBarVisibility="Hidden"
-                                      VerticalScrollMode="Disabled"
-                                      HorizontalScrollBarVisibility="Hidden"
-                                      HorizontalScrollMode="Disabled"
-                                      IsHorizontalScrollChainingEnabled="False"
-                                      IsVerticalScrollChainingEnabled="False"
-                                      HorizontalAlignment="Center"
-                                      VerticalAlignment="Center">
-                            <muxc:ItemsRepeater x:Name="PipsPagerItemsRepeater"
-                                                ItemsSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PipsPagerItems}">
-                                <muxc:ItemsRepeater.Layout>
-                                    <muxc:StackLayout Orientation="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}" />
-                                </muxc:ItemsRepeater.Layout>
-                                <muxc:ItemsRepeater.ItemTemplate>
-                                    <DataTemplate>
-                                        <Button />
-                                    </DataTemplate>
-                                </muxc:ItemsRepeater.ItemTemplate>
-                            </muxc:ItemsRepeater>
-                        </ScrollViewer>
-
-                        <Button x:Name="NextPageButton"
-                                ToolTipService.ToolTip="{Binding ElementName=NextPageButton, Path=(AutomationProperties.Name)}"
-                                ToolTipService.Placement="Bottom"
-                                Style="{TemplateBinding NextButtonStyle}"
-                                HorizontalAlignment="Center"
-                                VerticalAlignment="Center" />
-                    </StackPanel>
-                </ControlTemplate>
-            </Setter.Value>
-        </Setter>
-    </Style>
+					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:muxc="using:Microsoft.UI.Xaml.Controls"
+					xmlns:not_win="http://uno.ui/not_win"
+					mc:Ignorable="d not_win">
+
+	<ResourceDictionary.ThemeDictionaries>
+
+		<ResourceDictionary x:Key="Default">
+			<!-- Background -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackground" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundSelected" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- BorderBrush -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushSelected" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- Foreground -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
+
+			<!-- Selection Button Visual States Ellipse -->
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+
+
+			<!-- Navigation Button Background -->
+			<StaticResource x:Key="PipsPagerNavigationButtonBackground" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- Navigation Button BorderBrush -->
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- Navigation Button Foreground -->
+			<StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+
+			<!-- Navigation Button Visual States Ellipse -->
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
+
+			<!-- Material PipsPager Resources -->
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
+
+			<Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
+			<Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
+
+			<x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
+			<x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
+
+			<x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
+			<x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
+			<Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
+
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
+			<x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
+		</ResourceDictionary>
+
+		<ResourceDictionary x:Key="Light">
+
+			<!-- Background -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackground" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundSelected" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- BorderBrush -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushSelected" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- Foreground -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForeground" ResourceKey="SurfaceVariantBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPointerOver" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundPressed" ResourceKey="SurfaceBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundFocused" ResourceKey="SurfaceBrush" />
+
+			<!-- Foreground Selected -->
+			<StaticResource x:Key="PipsPagerSelectionIndicatorForegroundSelected" ResourceKey="PrimaryBrush" />
+
+			<!-- Selection Button Visual States Ellipse -->
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+
+
+			<!-- Navigation Button Background -->
+			<StaticResource x:Key="PipsPagerNavigationButtonBackground" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBackgroundPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBackgroundPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBackgroundDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- Navigation Button BorderBrush -->
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrush" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPointerOver" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrushPressed" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonBorderBrushDisabled" ResourceKey="SystemControlTransparentBrush" />
+
+			<!-- Navigation Button Foreground -->
+			<StaticResource x:Key="PipsPagerNavigationButtonForeground" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPointerOver" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundPressed" ResourceKey="PrimaryBrush" />
+			<StaticResource x:Key="PipsPagerNavigationButtonForegroundDisabled" ResourceKey="OnSurfaceDisabledBrush" />
+
+			<!-- Navigation Button Visual States Ellipse -->
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFill" ResourceKey="SystemControlTransparentBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver" ResourceKey="PrimaryHoverBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed" ResourceKey="PrimaryPressedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused" ResourceKey="PrimaryFocusedBrush" />
+			<StaticResource x:Key="MaterialPipsPagerNavigationButtonVisualStateEllipseFillUnfocused" ResourceKey="PrimaryUnfocusedBrush" />
+
+			<!-- Material PipsPager Resources -->
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerHorizontalOrientationButtonHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerVerticalOrientationButtonHeight">12</x:Double>
+
+			<Thickness x:Key="PipsPagerButtonBorderThickness">0</Thickness>
+			<Thickness x:Key="PipsPagerNavigationButtonBorderThickness">0</Thickness>
+
+			<x:String x:Key="PipsPagerPreviousPageButtonData">M3.33681 0.322148C3.63156 -0.107383 4.36844 -0.107382 4.66319 0.322148L7.89626 5.03356C8.19101 5.46309 7.82257 6 7.23307 6L0.766932 6C0.177427 6 -0.191014 5.46309 0.103739 5.03356L3.33681 0.322148Z</x:String>
+			<x:String x:Key="PipsPagerNextPageButtonData">M4.66319 5.67785C4.36844 6.10738 3.63156 6.10738 3.33681 5.67785L0.103738 0.966444C-0.191015 0.536913 0.177425 6.83871e-07 0.766931 6.32335e-07L7.23307 6.70473e-08C7.82257 1.55111e-08 8.19101 0.536912 7.89626 0.966443L4.66319 5.67785Z</x:String>
+
+			<x:Double x:Key="PipsPagerNavigationButtonHeight">40</x:Double>
+			<x:Double x:Key="PipsPagerNavigationButtonWidth">40</x:Double>
+			<Thickness x:Key="PipsPagerNavigationButtonPadding">4</Thickness>
+
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseWidth">12</x:Double>
+			<x:Double x:Key="PipsPagerNavigationVisualStatesEllipseHeight">12</x:Double>
+
+			<x:Double x:Key="PipsPagerSelectedEllipseSize">8</x:Double>
+			<x:Double x:Key="PipsPagerNormalEllipseSize">8</x:Double>
+		</ResourceDictionary>
+	</ResourceDictionary.ThemeDictionaries>
+
+	<Style x:Key="MaterialPipsPagerNavigationButtonBaseStyle"
+		   TargetType="Button">
+		<Setter Property="Background" Value="{ThemeResource PipsPagerNavigationButtonBackground}" />
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerNavigationButtonForeground}" />
+		<Setter Property="BorderBrush" Value="{ThemeResource PipsPagerNavigationButtonBorderBrush}" />
+		<Setter Property="BorderThickness" Value="{ThemeResource PipsPagerNavigationButtonBorderThickness}" />
+		<Setter Property="UseSystemFocusVisuals" Value="{ThemeResource UseSystemFocusVisuals}" />
+		<Setter Property="FocusVisualMargin" Value="0" />
+		<Setter Property="HorizontalAlignment" Value="Center" />
+		<Setter Property="HorizontalContentAlignment" Value="Center" />
+		<Setter Property="VerticalContentAlignment" Value="Center" />
+		<Setter Property="Width" Value="{ThemeResource PipsPagerNavigationButtonWidth}" />
+		<Setter Property="Height" Value="{ThemeResource PipsPagerNavigationButtonHeight}" />
+		<Setter Property="Padding" Value="{ThemeResource PipsPagerNavigationButtonPadding}" />
+		<Setter Property="Template">
+			<Setter.Value>
+				<ControlTemplate TargetType="Button">
+					<Grid x:Name="RootGrid"
+						  Background="{TemplateBinding Background}"
+						  BorderBrush="{TemplateBinding BorderBrush}"
+						  BorderThickness="{TemplateBinding BorderThickness}">
+						<VisualStateManager.VisualStateGroups>
+							<VisualStateGroup x:Name="CommonStates">
+								<VisualState x:Name="Normal" />
+								<VisualState x:Name="PointerOver">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+																	   Storyboard.TargetProperty="Foreground">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonForegroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="BorderBrush">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Pressed">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+																	   Storyboard.TargetProperty="Foreground">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonForegroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="BorderBrush">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Disabled">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content"
+																	   Storyboard.TargetProperty="Foreground">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonForegroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBackgroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="BorderBrush">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerNavigationButtonBorderBrushDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+							</VisualStateGroup>
+							<VisualStateGroup x:Name="FocusStates">
+								<VisualState x:Name="Focused">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFillFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Unfocused" />
+							</VisualStateGroup>
+						</VisualStateManager.VisualStateGroups>
+
+						<Ellipse x:Name="VisualStatesEllipse"
+								 Height="{ThemeResource PipsPagerNavigationVisualStatesEllipseHeight}"
+								 Width="{ThemeResource PipsPagerNavigationVisualStatesEllipseWidth}"
+								 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+								 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+								 Fill="{ThemeResource MaterialPipsPagerNavigationButtonVisualStateEllipseFill}"
+								 AutomationProperties.AccessibilityView="Raw" />
+
+						<Border Padding="{TemplateBinding Padding}"
+								RenderTransformOrigin="0.5, 0.5"
+								Background="{TemplateBinding Background}">
+							<Border.RenderTransform>
+								<ScaleTransform x:Name="ScaleTransform" ScaleY="1" ScaleX="1" />
+							</Border.RenderTransform>
+							<PathIcon x:Name="Content"
+									  Data="{TemplateBinding Content}"
+									  Foreground="{TemplateBinding Foreground}"
+									  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+									  VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+									  AutomationProperties.AccessibilityView="Raw" />
+						</Border>
+					</Grid>
+				</ControlTemplate>
+			</Setter.Value>
+		</Setter>
+	</Style>
+
+	<Style x:Key="MaterialPipsPagerPreviousPageButtonStyle"
+		   TargetType="Button"
+		   BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
+		<Setter Property="Content" Value="{StaticResource PipsPagerPreviousPageButtonData}" />
+		<Setter Property="VerticalContentAlignment" Value="Bottom" />
+	</Style>
+
+	<Style x:Key="MaterialPipsPagerNextPageButtonStyle"
+		   TargetType="Button"
+		   BasedOn="{StaticResource MaterialPipsPagerNavigationButtonBaseStyle}">
+		<Setter Property="Content" Value="{StaticResource PipsPagerNextPageButtonData}" />
+		<Setter Property="VerticalContentAlignment" Value="Top" />
+	</Style>
+
+	<Style x:Key="MaterialPipsPagerButtonBaseStyle"
+		   TargetType="Button">
+		<Setter Property="Background" Value="{ThemeResource PipsPagerSelectionIndicatorBackground}" />
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
+		<Setter Property="BorderBrush" Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrush}" />
+		<Setter Property="BorderThickness" Value="{ThemeResource PipsPagerButtonBorderThickness}" />
+		<Setter Property="HorizontalContentAlignment" Value="Center" />
+		<Setter Property="VerticalContentAlignment" Value="Center" />
+		<Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
+		<Setter Property="FocusVisualMargin" Value="0" />
+	</Style>
+
+	<Style x:Key="MaterialPipsPagerSelectedPipButtonStyle"
+		   TargetType="Button"
+		   BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForegroundSelected}" />
+		<Setter Property="Template">
+			<Setter.Value>
+				<ControlTemplate TargetType="Button">
+					<Grid x:Name="RootGrid"
+						  IsHitTestVisible="True"
+						  Background="{TemplateBinding Background}"
+						  BorderBrush="{TemplateBinding BorderBrush}"
+						  BorderThickness="{TemplateBinding BorderThickness}"
+						  Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+						  Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
+						<VisualStateManager.VisualStateGroups>
+							<VisualStateGroup x:Name="CommonStates">
+								<VisualState x:Name="Normal" />
+								<VisualState x:Name="PointerOver">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Pressed">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Disabled">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+							</VisualStateGroup>
+							<VisualStateGroup x:Name="FocusStates">
+								<VisualState x:Name="Focused">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Unfocused" />
+							</VisualStateGroup>
+							<VisualStateGroup x:Name="OrientationStates">
+								<VisualState x:Name="HorizontalOrientation" />
+								<VisualState x:Name="VerticalOrientation">
+									<VisualState.Setters>
+										<Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
+										<Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
+									</VisualState.Setters>
+								</VisualState>
+							</VisualStateGroup>
+						</VisualStateManager.VisualStateGroups>
+
+						<Ellipse x:Name="VisualStatesEllipse"
+								 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
+								 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+								 Fill="{ThemeResource MaterialPipsPagerVisualStateEllipseFill}"
+								 AutomationProperties.AccessibilityView="Raw" />
+
+						<Ellipse x:Name="MainEllipse"
+								 Height="{ThemeResource PipsPagerSelectedEllipseSize}"
+								 Width="{ThemeResource PipsPagerSelectedEllipseSize}"
+								 Fill="{TemplateBinding Foreground}"
+								 Stroke="{TemplateBinding BorderBrush}"
+								 StrokeThickness="{TemplateBinding BorderThickness}"
+								 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+								 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+								 AutomationProperties.AccessibilityView="Raw" />
+					</Grid>
+				</ControlTemplate>
+			</Setter.Value>
+		</Setter>
+	</Style>
+
+	<Style x:Key="MaterialPipsPagerNormalPipButtonStyle"
+		   TargetType="Button"
+		   BasedOn="{StaticResource MaterialPipsPagerButtonBaseStyle}">
+		<Setter Property="Foreground" Value="{ThemeResource PipsPagerSelectionIndicatorForeground}" />
+		<Setter Property="Template">
+			<Setter.Value>
+				<ControlTemplate TargetType="Button">
+					<Grid x:Name="RootGrid"
+						  IsHitTestVisible="True"
+						  Background="{TemplateBinding Background}"
+						  Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+						  Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}">
+						<VisualStateManager.VisualStateGroups>
+							<VisualStateGroup x:Name="CommonStates">
+								<VisualState x:Name="Normal" />
+								<VisualState x:Name="PointerOver">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPointerOver}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Pressed">
+									<Storyboard>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushPressed}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Disabled">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundDisabled}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+							</VisualStateGroup>
+							<VisualStateGroup x:Name="FocusStates">
+								<VisualState x:Name="Focused">
+									<Storyboard>
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorForegroundFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="VisualStatesEllipse"
+																	   Storyboard.TargetProperty="Fill">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource MaterialPipsPagerVisualStateEllipseFillFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid"
+																	   Storyboard.TargetProperty="Background">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBackgroundFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+
+										<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MainEllipse"
+																	   Storyboard.TargetProperty="Stroke">
+											<DiscreteObjectKeyFrame KeyTime="0"
+																	Value="{ThemeResource PipsPagerSelectionIndicatorBorderBrushFocused}" />
+										</ObjectAnimationUsingKeyFrames>
+									</Storyboard>
+								</VisualState>
+								<VisualState x:Name="Unfocused" />
+							</VisualStateGroup>
+							<VisualStateGroup x:Name="OrientationStates">
+								<VisualState x:Name="HorizontalOrientation" />
+								<VisualState x:Name="VerticalOrientation">
+									<VisualState.Setters>
+										<Setter Target="RootGrid.Width" Value="{ThemeResource PipsPagerVerticalOrientationButtonWidth}" />
+										<Setter Target="RootGrid.Height" Value="{ThemeResource PipsPagerVerticalOrientationButtonHeight}" />
+									</VisualState.Setters>
+								</VisualState>
+							</VisualStateGroup>
+						</VisualStateManager.VisualStateGroups>
+
+						<Ellipse x:Name="MainEllipse"
+								 Height="{ThemeResource PipsPagerNormalEllipseSize}"
+								 Width="{ThemeResource PipsPagerNormalEllipseSize}"
+								 Fill="{TemplateBinding Foreground}"
+								 Stroke="{TemplateBinding BorderBrush}"
+								 StrokeThickness="{TemplateBinding BorderThickness}"
+								 HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+								 VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+								 AutomationProperties.AccessibilityView="Raw" />
+
+						<Ellipse x:Name="VisualStatesEllipse"
+								 Height="{ThemeResource PipsPagerHorizontalOrientationButtonHeight}"
+								 Width="{ThemeResource PipsPagerHorizontalOrientationButtonWidth}"
+								 Fill="{ThemeResource MaterialPipsPagerVisualStateEllipseFill}"
+								 AutomationProperties.AccessibilityView="Raw" />
+					</Grid>
+				</ControlTemplate>
+			</Setter.Value>
+		</Setter>
+	</Style>
+
+	<Style x:Key="BaseMaterialPipsPagerStyle"
+		   TargetType="muxc:PipsPager">
+		<Setter Property="Background" Value="Transparent" />
+		<Setter Property="HorizontalAlignment" Value="Left" />
+		<Setter Property="VerticalAlignment" Value="Top" />
+		<Setter Property="IsTabStop" Value="False" />
+		<Setter Property="PreviousButtonStyle" Value="{StaticResource MaterialPipsPagerPreviousPageButtonStyle}" />
+		<Setter Property="NextButtonStyle" Value="{StaticResource MaterialPipsPagerNextPageButtonStyle}" />
+		<!-- Uno already implemented the 2.8.0 MUX version of the control -->
+		<!-- Uno.Themes reference is still on the MUX v2.6.0-prerelease.210113001 version for now -->
+		<!-- Remove this file, PipsPager.UWP.xaml,and use <Setter Property=NormalPipStyle /> and <Setter Property=SelectedPipStyle /> only in PipsPager.xaml -->
+		<!-- with the rest of the code, once we can bump the Microsoft.UI.Xaml version -->
+		<not_win:Setter Property="SelectedPipStyle"
+						Value="{StaticResource MaterialPipsPagerSelectedPipButtonStyle}" />
+		<not_win:Setter Property="NormalPipStyle"
+						Value="{StaticResource MaterialPipsPagerNormalPipButtonStyle}" />
+		<Setter Property="Template">
+			<Setter.Value>
+				<ControlTemplate TargetType="muxc:PipsPager">
+					<StackPanel x:Name="RootPanel"
+								Orientation="{TemplateBinding Orientation}"
+								Background="{TemplateBinding Background}">
+						<VisualStateManager.VisualStateGroups>
+							<VisualStateGroup x:Name="PreviousPageButtonVisibilityStates">
+								<VisualState x:Name="PreviousPageButtonVisible" />
+								<VisualState x:Name="PreviousPageButtonHidden">
+									<VisualState.Setters>
+										<Setter Target="PreviousPageButton.Opacity" Value="0" />
+									</VisualState.Setters>
+								</VisualState>
+								<VisualState x:Name="PreviousPageButtonCollapsed">
+									<VisualState.Setters>
+										<Setter Target="PreviousPageButton.Visibility" Value="Collapsed" />
+									</VisualState.Setters>
+								</VisualState>
+							</VisualStateGroup>
+
+							<VisualStateGroup x:Name="PreviousPageButtonIsEnabledStates">
+								<VisualState x:Name="PreviousPageButtonEnabled" />
+								<VisualState x:Name="PreviousPageButtonDisabled">
+									<VisualState.Setters>
+										<Setter Target="PreviousPageButton.IsEnabled" Value="False" />
+									</VisualState.Setters>
+								</VisualState>
+							</VisualStateGroup>
+
+							<VisualStateGroup x:Name="NextPageButtonVisibilityStates">
+								<VisualState x:Name="NextPageButtonVisible" />
+								<VisualState x:Name="NextPageButtonHidden">
+									<VisualState.Setters>
+										<Setter Target="NextPageButton.Opacity" Value="0" />
+									</VisualState.Setters>
+								</VisualState>
+								<VisualState x:Name="NextPageButtonCollapsed">
+									<VisualState.Setters>
+										<Setter Target="NextPageButton.Visibility" Value="Collapsed" />
+									</VisualState.Setters>
+								</VisualState>
+							</VisualStateGroup>
+
+							<VisualStateGroup x:Name="NextPageButtonIsEnabledStates">
+								<VisualState x:Name="NextPageButtonEnabled" />
+								<VisualState x:Name="NextPageButtonDisabled">
+									<VisualState.Setters>
+										<Setter Target="NextPageButton.IsEnabled" Value="False" />
+									</VisualState.Setters>
+								</VisualState>
+							</VisualStateGroup>
+
+							<VisualStateGroup x:Name="RootPanelOrientationStates">
+								<VisualState x:Name="VerticalOrientationView" />
+								<VisualState x:Name="HorizontalOrientationView">
+									<VisualState.Setters>
+										<Setter Target="RootPanel.Orientation" Value="Horizontal" />
+										<Setter Target="PreviousPageButton.(ToolTipService.Placement)" Value="Left" />
+										<Setter Target="PreviousPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
+										<Setter Target="PreviousPageButton.RenderTransform">
+											<Setter.Value>
+												<RotateTransform Angle="-90" />
+											</Setter.Value>
+										</Setter>
+										<Setter Target="NextPageButton.(ToolTipService.Placement)" Value="Right" />
+										<Setter Target="NextPageButton.RenderTransformOrigin" Value="0.5, 0.5" />
+										<Setter Target="NextPageButton.RenderTransform">
+											<Setter.Value>
+												<RotateTransform Angle="-90" />
+											</Setter.Value>
+										</Setter>
+									</VisualState.Setters>
+								</VisualState>
+							</VisualStateGroup>
+						</VisualStateManager.VisualStateGroups>
+
+						<Button x:Name="PreviousPageButton"
+								ToolTipService.ToolTip="{Binding ElementName=PreviousPageButton, Path=(AutomationProperties.Name)}"
+								ToolTipService.Placement="Top"
+								Style="{TemplateBinding PreviousButtonStyle}"
+								HorizontalAlignment="Center"
+								VerticalAlignment="Center" />
+
+						<ScrollViewer x:Name="PipsPagerScrollViewer"
+									  VerticalScrollBarVisibility="Hidden"
+									  VerticalScrollMode="Disabled"
+									  HorizontalScrollBarVisibility="Hidden"
+									  HorizontalScrollMode="Disabled"
+									  IsHorizontalScrollChainingEnabled="False"
+									  IsVerticalScrollChainingEnabled="False"
+									  HorizontalAlignment="Center"
+									  VerticalAlignment="Center">
+							<muxc:ItemsRepeater x:Name="PipsPagerItemsRepeater"
+												ItemsSource="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.PipsPagerItems}">
+								<muxc:ItemsRepeater.Layout>
+									<muxc:StackLayout Orientation="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Orientation}" />
+								</muxc:ItemsRepeater.Layout>
+								<muxc:ItemsRepeater.ItemTemplate>
+									<DataTemplate>
+										<Button />
+									</DataTemplate>
+								</muxc:ItemsRepeater.ItemTemplate>
+							</muxc:ItemsRepeater>
+						</ScrollViewer>
+
+						<Button x:Name="NextPageButton"
+								ToolTipService.ToolTip="{Binding ElementName=NextPageButton, Path=(AutomationProperties.Name)}"
+								ToolTipService.Placement="Bottom"
+								Style="{TemplateBinding NextButtonStyle}"
+								HorizontalAlignment="Center"
+								VerticalAlignment="Center" />
+					</StackPanel>
+				</ControlTemplate>
+			</Setter.Value>
+		</Setter>
+	</Style>
 
 </ResourceDictionary>