From faa3d42b624298c237902060a7c83ffdf6063101 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Tue, 25 Apr 2023 13:39:19 +0800
Subject: [PATCH 1/8] feat: upgrade to preview 7

---
 demo/Ursa.Demo/Pages/BannerDemo.axaml        | 2 +-
 demo/Ursa.Demo/Ursa.Demo.csproj              | 8 ++++----
 src/Ursa.Themes.Semi/Index.axaml             | 4 ++--
 src/Ursa.Themes.Semi/Ursa.Themes.Semi.csproj | 2 +-
 src/Ursa/Controls/Pagination/Pagination.cs   | 8 ++++++++
 src/Ursa/Ursa.csproj                         | 2 +-
 6 files changed, 17 insertions(+), 9 deletions(-)
 create mode 100644 src/Ursa/Controls/Pagination/Pagination.cs

diff --git a/demo/Ursa.Demo/Pages/BannerDemo.axaml b/demo/Ursa.Demo/Pages/BannerDemo.axaml
index e7b9630..ac539e7 100644
--- a/demo/Ursa.Demo/Pages/BannerDemo.axaml
+++ b/demo/Ursa.Demo/Pages/BannerDemo.axaml
@@ -32,7 +32,7 @@
                         Grid.Row="0"
                         Grid.Column="1"
                         MinWidth="200"
-                        Items="{Binding Types}"
+                        ItemsSource="{Binding Types}"
                         SelectedItem="{Binding SelectedType}" />
                     <Label
                         Grid.Row="1"
diff --git a/demo/Ursa.Demo/Ursa.Demo.csproj b/demo/Ursa.Demo/Ursa.Demo.csproj
index f66e639..08bc7d1 100644
--- a/demo/Ursa.Demo/Ursa.Demo.csproj
+++ b/demo/Ursa.Demo/Ursa.Demo.csproj
@@ -19,12 +19,12 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia" Version="11.0.0-preview6" />
-        <PackageReference Include="Avalonia.Desktop" Version="11.0.0-preview6" />
+        <PackageReference Include="Avalonia" Version="11.0.0-preview7" />
+        <PackageReference Include="Avalonia.Desktop" Version="11.0.0-preview7" />
         <!--Condition below is needed to remove Avalonia.Diagnostics package from build output in Release configuration.-->
-        <PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="11.0.0-preview6" />
+        <PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="11.0.0-preview7" />
         <PackageReference Include="CommunityToolkit.Mvvm" Version="8.1.0" />
-        <PackageReference Include="Semi.Avalonia" Version="0.1.0-preview6" />
+        <PackageReference Include="Semi.Avalonia" Version="0.1.0-preview7" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Ursa.Themes.Semi/Index.axaml b/src/Ursa.Themes.Semi/Index.axaml
index e1d3523..414abaa 100644
--- a/src/Ursa.Themes.Semi/Index.axaml
+++ b/src/Ursa.Themes.Semi/Index.axaml
@@ -7,8 +7,8 @@
     <Styles.Resources>
         <ResourceDictionary>
             <ResourceDictionary.ThemeDictionaries>
-                <ResourceInclude x:Key="Dark" Source="./Themes/Dark/_index.axaml" />
-                <ResourceInclude x:Key="Light" Source="./Themes/Light/_index.axaml" />
+                <MergeResourceInclude x:Key="Dark" Source="./Themes/Dark/_index.axaml" />
+                <MergeResourceInclude x:Key="Light" Source="./Themes/Light/_index.axaml" />
             </ResourceDictionary.ThemeDictionaries>
             <ResourceDictionary.MergedDictionaries>
                 <ResourceInclude Source="../Controls/_index.axaml" />
diff --git a/src/Ursa.Themes.Semi/Ursa.Themes.Semi.csproj b/src/Ursa.Themes.Semi/Ursa.Themes.Semi.csproj
index 901586d..ff84eee 100644
--- a/src/Ursa.Themes.Semi/Ursa.Themes.Semi.csproj
+++ b/src/Ursa.Themes.Semi/Ursa.Themes.Semi.csproj
@@ -8,7 +8,7 @@
     </PropertyGroup>
 
     <ItemGroup>
-      <PackageReference Include="Avalonia" Version="11.0.0-preview6" />
+      <PackageReference Include="Avalonia" Version="11.0.0-preview7" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Ursa/Controls/Pagination/Pagination.cs b/src/Ursa/Controls/Pagination/Pagination.cs
new file mode 100644
index 0000000..3834606
--- /dev/null
+++ b/src/Ursa/Controls/Pagination/Pagination.cs
@@ -0,0 +1,8 @@
+using Avalonia.Controls.Primitives;
+
+namespace Ursa.Controls;
+
+public class Pagination: TemplatedControl
+{
+    
+}
\ No newline at end of file
diff --git a/src/Ursa/Ursa.csproj b/src/Ursa/Ursa.csproj
index 2eb6dee..b09fce8 100644
--- a/src/Ursa/Ursa.csproj
+++ b/src/Ursa/Ursa.csproj
@@ -8,7 +8,7 @@
     </PropertyGroup>
 
     <ItemGroup>
-      <PackageReference Include="Avalonia" Version="11.0.0-preview6" />
+      <PackageReference Include="Avalonia" Version="11.0.0-preview7" />
     </ItemGroup>
 
     <ItemGroup>

From 26cb5f9436b100342848974e24598b7788a8f999 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 26 Apr 2023 02:03:07 +0800
Subject: [PATCH 2/8] feat: start pagination.

---
 src/Ursa/Controls/Pagination/Pagination.cs | 135 +++++++++++++++++++++
 1 file changed, 135 insertions(+)

diff --git a/src/Ursa/Controls/Pagination/Pagination.cs b/src/Ursa/Controls/Pagination/Pagination.cs
index 3834606..e7b47c9 100644
--- a/src/Ursa/Controls/Pagination/Pagination.cs
+++ b/src/Ursa/Controls/Pagination/Pagination.cs
@@ -1,8 +1,143 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.Metadata;
 using Avalonia.Controls.Primitives;
+using Avalonia.Interactivity;
+using Avalonia.Styling;
 
 namespace Ursa.Controls;
 
+[TemplatePart(PART_PreviousButton, typeof(Button))]
+[TemplatePart(PART_NextButton, typeof(Button))]
+[TemplatePart(PART_ButtonPanel, typeof(StackPanel))]
 public class Pagination: TemplatedControl
 {
+    public const string PART_PreviousButton = "PART_PreviousButton";
+    public const string PART_NextButton = "PART_NextButton";
+    public const string PART_ButtonPanel = "PART_ButtonPanel";
+    private Button? _previousButton;
+    private Button? _nextButton;
+    private StackPanel? _buttonPanel;
+
+    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+    {
+        base.OnApplyTemplate(e);
+        if (_previousButton != null) _previousButton.Click -= OnButtonClick;
+        if (_nextButton != null) _nextButton.Click -= OnButtonClick;
+        _previousButton = e.NameScope.Find<Button>(PART_PreviousButton);
+        _nextButton = e.NameScope.Find<Button>(PART_NextButton);
+        _buttonPanel = e.NameScope.Find<StackPanel>(PART_ButtonPanel);
+        if (_previousButton != null) _previousButton.Click += OnButtonClick;
+        if (_nextButton != null) _nextButton.Click += OnButtonClick;
+    }
     
+    public static readonly StyledProperty<int> CurrentPageProperty = AvaloniaProperty.Register<Pagination, int>(
+        nameof(CurrentPage));
+    
+    public int CurrentPage
+    {
+        get => GetValue(CurrentPageProperty);
+        set {
+            int actualValue = CoercePage(value);
+            SetValue(CurrentPageProperty, actualValue);
+        }
+    }
+
+    public static readonly StyledProperty<int> TotalCountProperty = AvaloniaProperty.Register<Pagination, int>(
+        nameof(TotalCount));
+
+    /// <summary>
+    /// Total count of items. 
+    /// </summary>
+    public int TotalCount
+    {
+        get => GetValue(TotalCountProperty);
+        set => SetValue(TotalCountProperty, value);
+    }
+    
+    public static readonly StyledProperty<int> PageSizeProperty = AvaloniaProperty.Register<Pagination, int>(
+        nameof(PageSize));
+    
+    /// <summary>
+    /// Page size.
+    /// </summary>
+    public int PageSize
+    {
+        get => GetValue(PageSizeProperty);
+        set => SetValue(PageSizeProperty, value);
+    }
+
+    private int _pageCount;
+
+    public static readonly DirectProperty<Pagination, int> PageCountProperty = AvaloniaProperty.RegisterDirect<Pagination, int>(
+        nameof(PageCount), o => o.PageCount);
+
+    /// <summary>
+    /// Page count.
+    /// </summary>
+    public int PageCount
+    {
+        get => _pageCount;
+        private set => SetAndRaise(PageCountProperty, ref _pageCount, value);
+    }
+
+    private int _startIndex;
+
+    public static readonly DirectProperty<Pagination, int> StartIndexProperty = AvaloniaProperty.RegisterDirect<Pagination, int>(
+        nameof(StartIndex), o => o.StartIndex);
+
+    public int StartIndex
+    {
+        get => _startIndex;
+        private set => SetAndRaise(StartIndexProperty, ref _startIndex, value);
+    }
+
+    private int _endIndex;
+
+    public static readonly DirectProperty<Pagination, int> EndIndexProperty = AvaloniaProperty.RegisterDirect<Pagination, int>(
+        nameof(EndIndex), o => o.EndIndex);
+
+    public int EndIndex
+    {
+        get => _endIndex;
+        private set => SetAndRaise(EndIndexProperty, ref _endIndex, value);
+    }
+
+    public static readonly StyledProperty<ControlTheme> PageButtonThemeProperty = AvaloniaProperty.Register<Pagination, ControlTheme>(
+        nameof(PageButtonTheme));
+
+    public ControlTheme PageButtonTheme
+    {
+        get => GetValue(PageButtonThemeProperty);
+        set => SetValue(PageButtonThemeProperty, value);
+    }
+
+    public static readonly StyledProperty<ControlTheme> ExpandButtonThemeProperty = AvaloniaProperty.Register<Pagination, ControlTheme>(
+        nameof(ExpandButtonTheme));
+
+    public ControlTheme ExpandButtonTheme
+    {
+        get => GetValue(ExpandButtonThemeProperty);
+        set => SetValue(ExpandButtonThemeProperty, value);
+    }
+    
+    private void OnButtonClick(object? sender, RoutedEventArgs e)
+    {
+        if (Equals(sender, _previousButton))
+        {
+            CurrentPage--;
+        }
+        else
+        {
+            CurrentPage++;
+        }
+    }
+    
+    private int CoercePage(int page)
+    {
+        if (page < 1) return 1;
+        if (page > PageCount) return PageCount;
+        return page;
+    }
+
 }
\ No newline at end of file

From 16dc10422c12af848840bfda28c1140c6fc22657 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Sun, 7 May 2023 01:16:27 +0800
Subject: [PATCH 3/8] feat: WIP: add template.

---
 demo/Ursa.Demo/Pages/PaginationDemo.axaml     | 18 +++++
 demo/Ursa.Demo/Pages/PaginationDemo.axaml.cs  | 15 ++++
 .../ViewModels/PaginationDemoViewModel.cs     | 10 +++
 demo/Ursa.Demo/Views/MainWindow.axaml         |  3 +
 .../Controls/Pagination.axaml                 | 22 ++++++
 src/Ursa.Themes.Semi/Controls/_index.axaml    |  1 +
 src/Ursa/Controls/Pagination/Pagination.cs    | 74 +++++++++++--------
 7 files changed, 111 insertions(+), 32 deletions(-)
 create mode 100644 demo/Ursa.Demo/Pages/PaginationDemo.axaml
 create mode 100644 demo/Ursa.Demo/Pages/PaginationDemo.axaml.cs
 create mode 100644 demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs
 create mode 100644 src/Ursa.Themes.Semi/Controls/Pagination.axaml

diff --git a/demo/Ursa.Demo/Pages/PaginationDemo.axaml b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
new file mode 100644
index 0000000..bd14888
--- /dev/null
+++ b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
@@ -0,0 +1,18 @@
+<UserControl
+    x:Class="Ursa.Demo.Pages.PaginationDemo"
+    xmlns="https://github.com/avaloniaui"
+    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:u="https://irihi.tech/ursa"
+    xmlns:viewModels="clr-namespace:Ursa.Demo.ViewModels"
+    d:DesignHeight="450"
+    d:DesignWidth="800"
+    mc:Ignorable="d">
+    <Design.DataContext>
+        <viewModels:PaginationDemoViewModel />
+    </Design.DataContext>
+    <StackPanel>
+        <u:Pagination PageSizeOptions="{Binding PageSizes}" TotalCount="300" />
+    </StackPanel>
+</UserControl>
diff --git a/demo/Ursa.Demo/Pages/PaginationDemo.axaml.cs b/demo/Ursa.Demo/Pages/PaginationDemo.axaml.cs
new file mode 100644
index 0000000..3418732
--- /dev/null
+++ b/demo/Ursa.Demo/Pages/PaginationDemo.axaml.cs
@@ -0,0 +1,15 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Markup.Xaml;
+using Ursa.Demo.ViewModels;
+
+namespace Ursa.Demo.Pages;
+
+public partial class PaginationDemo : UserControl
+{
+    public PaginationDemo()
+    {
+        InitializeComponent();
+        this.DataContext = new PaginationDemoViewModel();
+    }
+}
\ No newline at end of file
diff --git a/demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs b/demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs
new file mode 100644
index 0000000..e85fd3e
--- /dev/null
+++ b/demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs
@@ -0,0 +1,10 @@
+using System.Collections.ObjectModel;
+using Avalonia.Collections;
+using CommunityToolkit.Mvvm.ComponentModel;
+
+namespace Ursa.Demo.ViewModels;
+
+public class PaginationDemoViewModel: ObservableObject
+{
+    public AvaloniaList<int> PageSizes { get; set; } = new() { 10, 20, 50, 100 };
+}
\ No newline at end of file
diff --git a/demo/Ursa.Demo/Views/MainWindow.axaml b/demo/Ursa.Demo/Views/MainWindow.axaml
index 9ba93b8..76a2f17 100644
--- a/demo/Ursa.Demo/Views/MainWindow.axaml
+++ b/demo/Ursa.Demo/Views/MainWindow.axaml
@@ -35,6 +35,9 @@
             <TabItem Header="IPv4Box">
                 <pages:IPv4BoxDemo />
             </TabItem>
+            <TabItem Header="Pagination">
+                <pages:PaginationDemo />
+            </TabItem>
             <TabItem Header="Timeline">
                 <pages:TimelineDemo />
             </TabItem>
diff --git a/src/Ursa.Themes.Semi/Controls/Pagination.axaml b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
new file mode 100644
index 0000000..923c133
--- /dev/null
+++ b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
@@ -0,0 +1,22 @@
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:u="https://irihi.tech/ursa">
+    <!--  Add Resources Here  -->
+    <ControlTheme x:Key="{x:Type u:Pagination}" TargetType="u:Pagination">
+        <Setter Property="Template">
+            <ControlTemplate TargetType="u:Pagination">
+                <StackPanel Orientation="Horizontal">
+                    <Button Name="{x:Static u:Pagination.PART_PreviousButton}" Content="&lt;" />
+                    <Button Name="{x:Static u:Pagination.PART_NextButton}" Content="&gt;" />
+                    <StackPanel Name="{x:Static u:Pagination.PART_ButtonPanel}" Orientation="Horizontal" />
+                    <ComboBox
+                        Name="{x:Static u:Pagination.PART_SizeChangerComboBox}"
+                        ItemsSource="{TemplateBinding PageSizeOptions}"
+                        SelectedItem="{TemplateBinding PageSize,
+                                                       Mode=TwoWay}" />
+                </StackPanel>
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+</ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Controls/_index.axaml b/src/Ursa.Themes.Semi/Controls/_index.axaml
index 7c08f47..48da0db 100644
--- a/src/Ursa.Themes.Semi/Controls/_index.axaml
+++ b/src/Ursa.Themes.Semi/Controls/_index.axaml
@@ -5,6 +5,7 @@
         <ResourceInclude Source="Banner.axaml" />
         <ResourceInclude Source="Divider.axaml" />
         <ResourceInclude Source="IPv4Box.axaml" />
+        <ResourceInclude Source="Pagination.axaml" />
         <ResourceInclude Source="Timeline.axaml" />
     </ResourceDictionary.MergedDictionaries>
 </ResourceDictionary>
diff --git a/src/Ursa/Controls/Pagination/Pagination.cs b/src/Ursa/Controls/Pagination/Pagination.cs
index e7b47c9..2c58f4f 100644
--- a/src/Ursa/Controls/Pagination/Pagination.cs
+++ b/src/Ursa/Controls/Pagination/Pagination.cs
@@ -1,4 +1,5 @@
 using Avalonia;
+using Avalonia.Collections;
 using Avalonia.Controls;
 using Avalonia.Controls.Metadata;
 using Avalonia.Controls.Primitives;
@@ -10,14 +11,17 @@ namespace Ursa.Controls;
 [TemplatePart(PART_PreviousButton, typeof(Button))]
 [TemplatePart(PART_NextButton, typeof(Button))]
 [TemplatePart(PART_ButtonPanel, typeof(StackPanel))]
+[TemplatePart(PART_SizeChangerComboBox, typeof(ComboBox))]
 public class Pagination: TemplatedControl
 {
     public const string PART_PreviousButton = "PART_PreviousButton";
     public const string PART_NextButton = "PART_NextButton";
     public const string PART_ButtonPanel = "PART_ButtonPanel";
+    public const string PART_SizeChangerComboBox = "PART_SizeChangerComboBox";
     private Button? _previousButton;
     private Button? _nextButton;
     private StackPanel? _buttonPanel;
+    private ComboBox? _sizeChangerComboBox;
 
     protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
     {
@@ -27,8 +31,11 @@ public class Pagination: TemplatedControl
         _previousButton = e.NameScope.Find<Button>(PART_PreviousButton);
         _nextButton = e.NameScope.Find<Button>(PART_NextButton);
         _buttonPanel = e.NameScope.Find<StackPanel>(PART_ButtonPanel);
+        _sizeChangerComboBox = e.NameScope.Find<ComboBox>(PART_SizeChangerComboBox);
         if (_previousButton != null) _previousButton.Click += OnButtonClick;
         if (_nextButton != null) _nextButton.Click += OnButtonClick;
+        UpdateButtons();
+
     }
     
     public static readonly StyledProperty<int> CurrentPageProperty = AvaloniaProperty.Register<Pagination, int>(
@@ -37,10 +44,7 @@ public class Pagination: TemplatedControl
     public int CurrentPage
     {
         get => GetValue(CurrentPageProperty);
-        set {
-            int actualValue = CoercePage(value);
-            SetValue(CurrentPageProperty, actualValue);
-        }
+        set => SetValue(CurrentPageProperty, value);
     }
 
     public static readonly StyledProperty<int> TotalCountProperty = AvaloniaProperty.Register<Pagination, int>(
@@ -54,9 +58,9 @@ public class Pagination: TemplatedControl
         get => GetValue(TotalCountProperty);
         set => SetValue(TotalCountProperty, value);
     }
-    
+
     public static readonly StyledProperty<int> PageSizeProperty = AvaloniaProperty.Register<Pagination, int>(
-        nameof(PageSize));
+        nameof(PageSize), defaultValue: 100);
     
     /// <summary>
     /// Page size.
@@ -81,26 +85,13 @@ public class Pagination: TemplatedControl
         private set => SetAndRaise(PageCountProperty, ref _pageCount, value);
     }
 
-    private int _startIndex;
+    public static readonly StyledProperty<AvaloniaList<int>> PageSizeOptionsProperty = AvaloniaProperty.Register<Pagination, AvaloniaList<int>>(
+        nameof(PageSizeOptions));
 
-    public static readonly DirectProperty<Pagination, int> StartIndexProperty = AvaloniaProperty.RegisterDirect<Pagination, int>(
-        nameof(StartIndex), o => o.StartIndex);
-
-    public int StartIndex
+    public AvaloniaList<int> PageSizeOptions
     {
-        get => _startIndex;
-        private set => SetAndRaise(StartIndexProperty, ref _startIndex, value);
-    }
-
-    private int _endIndex;
-
-    public static readonly DirectProperty<Pagination, int> EndIndexProperty = AvaloniaProperty.RegisterDirect<Pagination, int>(
-        nameof(EndIndex), o => o.EndIndex);
-
-    public int EndIndex
-    {
-        get => _endIndex;
-        private set => SetAndRaise(EndIndexProperty, ref _endIndex, value);
+        get => GetValue(PageSizeOptionsProperty);
+        set => SetValue(PageSizeOptionsProperty, value);
     }
 
     public static readonly StyledProperty<ControlTheme> PageButtonThemeProperty = AvaloniaProperty.Register<Pagination, ControlTheme>(
@@ -120,7 +111,16 @@ public class Pagination: TemplatedControl
         get => GetValue(ExpandButtonThemeProperty);
         set => SetValue(ExpandButtonThemeProperty, value);
     }
-    
+
+    protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change)
+    {
+        base.OnPropertyChanged(change);
+        if (change.Property == PageSizeProperty || change.Property == TotalCountProperty)
+        {
+            UpdateButtons();
+        }
+    }
+
     private void OnButtonClick(object? sender, RoutedEventArgs e)
     {
         if (Equals(sender, _previousButton))
@@ -132,12 +132,22 @@ public class Pagination: TemplatedControl
             CurrentPage++;
         }
     }
-    
-    private int CoercePage(int page)
-    {
-        if (page < 1) return 1;
-        if (page > PageCount) return PageCount;
-        return page;
-    }
 
+    private void UpdateButtons()
+    {
+        if (PageSize == 0) return;
+        int currentPage = CurrentPage;
+        
+        int pageCount = TotalCount / PageSize;
+        int residue = TotalCount % PageSize;
+        if (residue > 0)
+        {
+            pageCount++;
+        }
+        _buttonPanel?.Children.Clear();
+        for (int i = 0; i < pageCount; i++)
+        {
+            _buttonPanel?.Children.Add(new Button { Content = i + 1 });
+        }
+    }
 }
\ No newline at end of file

From 642fcb3aebac3b22dc2ea42d6211e0dc0620843e Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Sun, 7 May 2023 01:59:04 +0800
Subject: [PATCH 4/8] feat: add ExpandButton

---
 .../Controls/Pagination.axaml                 | 16 +++++++++++++++
 src/Ursa/Controls/Pagination/Pagination.cs    | 20 +++++++++++++++++--
 .../Pagination/PaginationExpandButton.cs      | 19 ++++++++++++++++++
 3 files changed, 53 insertions(+), 2 deletions(-)
 create mode 100644 src/Ursa/Controls/Pagination/PaginationExpandButton.cs

diff --git a/src/Ursa.Themes.Semi/Controls/Pagination.axaml b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
index 923c133..de80998 100644
--- a/src/Ursa.Themes.Semi/Controls/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
@@ -19,4 +19,20 @@
             </ControlTemplate>
         </Setter>
     </ControlTheme>
+
+    <ControlTheme x:Key="{x:Type u:PaginationExpandButton}" TargetType="u:PaginationExpandButton">
+        <Setter Property="Template">
+            <ControlTemplate TargetType="u:PaginationExpandButton">
+                <Grid>
+                    <Button Name="button" Content="..." />
+                    <Popup
+                        IsLightDismissEnabled="True"
+                        IsOpen="{Binding #button.IsPointerOver}"
+                        PlacementTarget="button">
+                        <ListBox Background="White" ItemsSource="{TemplateBinding Pages}" />
+                    </Popup>
+                </Grid>
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
 </ResourceDictionary>
diff --git a/src/Ursa/Controls/Pagination/Pagination.cs b/src/Ursa/Controls/Pagination/Pagination.cs
index 2c58f4f..9b04540 100644
--- a/src/Ursa/Controls/Pagination/Pagination.cs
+++ b/src/Ursa/Controls/Pagination/Pagination.cs
@@ -23,6 +23,12 @@ public class Pagination: TemplatedControl
     private StackPanel? _buttonPanel;
     private ComboBox? _sizeChangerComboBox;
 
+    /// <summary>
+    /// To reduce allocation, there are maximum of 7 buttons and 2 selection controls. it will be reused.
+    /// </summary>
+    private PaginationExpandButton? _leftSelection;
+    private PaginationExpandButton? _rightSelection;
+
     protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
     {
         base.OnApplyTemplate(e);
@@ -34,6 +40,8 @@ public class Pagination: TemplatedControl
         _sizeChangerComboBox = e.NameScope.Find<ComboBox>(PART_SizeChangerComboBox);
         if (_previousButton != null) _previousButton.Click += OnButtonClick;
         if (_nextButton != null) _nextButton.Click += OnButtonClick;
+        _leftSelection = new PaginationExpandButton();
+        _rightSelection = new PaginationExpandButton();
         UpdateButtons();
 
     }
@@ -60,7 +68,7 @@ public class Pagination: TemplatedControl
     }
 
     public static readonly StyledProperty<int> PageSizeProperty = AvaloniaProperty.Register<Pagination, int>(
-        nameof(PageSize), defaultValue: 100);
+        nameof(PageSize), defaultValue: 50);
     
     /// <summary>
     /// Page size.
@@ -147,7 +155,15 @@ public class Pagination: TemplatedControl
         _buttonPanel?.Children.Clear();
         for (int i = 0; i < pageCount; i++)
         {
-            _buttonPanel?.Children.Add(new Button { Content = i + 1 });
+            if (i == 1 && _leftSelection is not null)
+            {
+                _leftSelection.Pages = new AvaloniaList<int>() { PageSize + 1, PageSize + 2, PageSize + 3 };
+                _buttonPanel?.Children.Add(_leftSelection);
+            }
+            else
+            {
+                _buttonPanel?.Children.Add(new Button { Content = i + 1 });
+            }
         }
     }
 }
\ No newline at end of file
diff --git a/src/Ursa/Controls/Pagination/PaginationExpandButton.cs b/src/Ursa/Controls/Pagination/PaginationExpandButton.cs
new file mode 100644
index 0000000..ba330bb
--- /dev/null
+++ b/src/Ursa/Controls/Pagination/PaginationExpandButton.cs
@@ -0,0 +1,19 @@
+using Avalonia;
+using Avalonia.Collections;
+using Avalonia.Controls.Primitives;
+
+namespace Ursa.Controls;
+
+public class PaginationExpandButton: TemplatedControl
+{
+    public static readonly StyledProperty<AvaloniaList<int>> PagesProperty = AvaloniaProperty.Register<PaginationExpandButton, AvaloniaList<int>>(
+        nameof(Pages));
+
+    public AvaloniaList<int> Pages
+    {
+        get => GetValue(PagesProperty);
+        set => SetValue(PagesProperty, value);
+    }
+    
+    
+}
\ No newline at end of file

From e0dfd64681995702cab3b167f45c527672854874 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Sun, 7 May 2023 22:23:12 +0800
Subject: [PATCH 5/8] feat: improve popup behavior.

---
 demo/Ursa.Demo/Pages/PaginationDemo.axaml     |  6 +-
 .../Controls/Pagination.axaml                 | 29 +++++++--
 src/Ursa/Controls/Pagination/Pagination.cs    |  6 +-
 .../Controls/Pagination/PaginationButton.cs   | 14 ++++
 .../Pagination/PaginationExpandButton.cs      | 64 ++++++++++++++++++-
 5 files changed, 109 insertions(+), 10 deletions(-)
 create mode 100644 src/Ursa/Controls/Pagination/PaginationButton.cs

diff --git a/demo/Ursa.Demo/Pages/PaginationDemo.axaml b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
index bd14888..9af5f60 100644
--- a/demo/Ursa.Demo/Pages/PaginationDemo.axaml
+++ b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
@@ -13,6 +13,10 @@
         <viewModels:PaginationDemoViewModel />
     </Design.DataContext>
     <StackPanel>
-        <u:Pagination PageSizeOptions="{Binding PageSizes}" TotalCount="300" />
+        <TextBlock Text="{Binding #page.CurrentPage}" />
+        <u:Pagination
+            Name="page"
+            PageSizeOptions="{Binding PageSizes}"
+            TotalCount="300" />
     </StackPanel>
 </UserControl>
diff --git a/src/Ursa.Themes.Semi/Controls/Pagination.axaml b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
index de80998..03cd756 100644
--- a/src/Ursa.Themes.Semi/Controls/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
@@ -24,12 +24,33 @@
         <Setter Property="Template">
             <ControlTemplate TargetType="u:PaginationExpandButton">
                 <Grid>
-                    <Button Name="button" Content="..." />
+                    <Button Name="PART_Button" Content="..." />
                     <Popup
+                        Name="{x:Static u:PaginationExpandButton.PART_Popup}"
                         IsLightDismissEnabled="True"
-                        IsOpen="{Binding #button.IsPointerOver}"
-                        PlacementTarget="button">
-                        <ListBox Background="White" ItemsSource="{TemplateBinding Pages}" />
+                        IsOpen="{TemplateBinding IsDropdownOpen,
+                                                 Mode=TwoWay}"
+                        PlacementTarget="PART_Button">
+                        <Border
+                            Margin="4,0,4,4"
+                            Padding="4"
+                            Background="White"
+                            BorderBrush="LightGray"
+                            BorderThickness="1"
+                            BoxShadow="0 0 8 0 #1A000000"
+                            ClipToBounds="True"
+                            CornerRadius="6">
+                            <ListBox
+                                MinWidth="50"
+                                MaxHeight="300"
+                                ItemsSource="{TemplateBinding Pages}">
+                                <ListBox.ItemContainerTheme>
+                                    <ControlTheme BasedOn="{StaticResource {x:Type ListBoxItem}}" TargetType="ListBoxItem">
+                                        <Setter Property="HorizontalContentAlignment" Value="Center" />
+                                    </ControlTheme>
+                                </ListBox.ItemContainerTheme>
+                            </ListBox>
+                        </Border>
                     </Popup>
                 </Grid>
             </ControlTemplate>
diff --git a/src/Ursa/Controls/Pagination/Pagination.cs b/src/Ursa/Controls/Pagination/Pagination.cs
index 9b04540..002985a 100644
--- a/src/Ursa/Controls/Pagination/Pagination.cs
+++ b/src/Ursa/Controls/Pagination/Pagination.cs
@@ -68,7 +68,7 @@ public class Pagination: TemplatedControl
     }
 
     public static readonly StyledProperty<int> PageSizeProperty = AvaloniaProperty.Register<Pagination, int>(
-        nameof(PageSize), defaultValue: 50);
+        nameof(PageSize), defaultValue: 10);
     
     /// <summary>
     /// Page size.
@@ -144,7 +144,7 @@ public class Pagination: TemplatedControl
     private void UpdateButtons()
     {
         if (PageSize == 0) return;
-        int currentPage = CurrentPage;
+        int currentIndex = CurrentPage * PageSize;
         
         int pageCount = TotalCount / PageSize;
         int residue = TotalCount % PageSize;
@@ -162,7 +162,7 @@ public class Pagination: TemplatedControl
             }
             else
             {
-                _buttonPanel?.Children.Add(new Button { Content = i + 1 });
+                _buttonPanel?.Children.Add(new PaginationButton { Content = i + 1, Page = i + 1 });
             }
         }
     }
diff --git a/src/Ursa/Controls/Pagination/PaginationButton.cs b/src/Ursa/Controls/Pagination/PaginationButton.cs
new file mode 100644
index 0000000..71bfeb1
--- /dev/null
+++ b/src/Ursa/Controls/Pagination/PaginationButton.cs
@@ -0,0 +1,14 @@
+using Avalonia.Controls;
+using Avalonia.Controls.Primitives;
+using Avalonia.Styling;
+
+namespace Ursa.Controls;
+
+public class PaginationButton: Button, IStyleable
+{
+    Type IStyleable.StyleKey => typeof(Button);
+    
+    public int Page { get; set; }
+    
+    
+}
\ No newline at end of file
diff --git a/src/Ursa/Controls/Pagination/PaginationExpandButton.cs b/src/Ursa/Controls/Pagination/PaginationExpandButton.cs
index ba330bb..fb50a59 100644
--- a/src/Ursa/Controls/Pagination/PaginationExpandButton.cs
+++ b/src/Ursa/Controls/Pagination/PaginationExpandButton.cs
@@ -1,11 +1,21 @@
 using Avalonia;
 using Avalonia.Collections;
+using Avalonia.Controls;
+using Avalonia.Controls.Metadata;
 using Avalonia.Controls.Primitives;
+using Avalonia.Input;
 
 namespace Ursa.Controls;
 
+[TemplatePart(PART_Button, typeof(Button))]
+[TemplatePart(PART_Popup, typeof(Popup))]
 public class PaginationExpandButton: TemplatedControl
 {
+    public const string PART_Button = "PART_Button";
+    public const string PART_Popup = "PART_Popup";
+    private Popup? _popup;
+    private Button? _button;
+    
     public static readonly StyledProperty<AvaloniaList<int>> PagesProperty = AvaloniaProperty.Register<PaginationExpandButton, AvaloniaList<int>>(
         nameof(Pages));
 
@@ -14,6 +24,56 @@ public class PaginationExpandButton: TemplatedControl
         get => GetValue(PagesProperty);
         set => SetValue(PagesProperty, value);
     }
-    
-    
+
+    public static readonly StyledProperty<bool> IsDropdownOpenProperty = AvaloniaProperty.Register<PaginationExpandButton, bool>(
+        nameof(IsDropdownOpen));
+
+    public bool IsDropdownOpen
+    {
+        get => GetValue(IsDropdownOpenProperty);
+        set => SetValue(IsDropdownOpenProperty, value);
+    }
+
+    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
+    {
+        base.OnApplyTemplate(e);
+        _popup = e.NameScope.Find<Popup>(PART_Popup);
+        _button = e.NameScope.Find<Button>(PART_Button);
+    }
+
+    protected override void OnPointerEntered(PointerEventArgs e)
+    {
+        if (!e.Handled && e.Source is Visual source )
+        {
+            SetCurrentValue(IsDropdownOpenProperty, true);
+            e.Handled = true;
+        }
+        base.OnPointerEntered(e);
+
+    }
+
+    protected override void OnPointerExited(PointerEventArgs e)
+    {
+        base.OnPointerExited(e);
+        // IsDropdownOpen = false;
+    }
+
+    protected override void OnPointerReleased(PointerReleasedEventArgs e)
+    {
+        if (!e.Handled && e.Source is Visual source)
+        {
+            if (_popup?.IsInsidePopup(source) == true)
+            {
+                SetCurrentValue(IsDropdownOpenProperty, false);
+                e.Handled = true;
+            }
+            else
+            {
+                //SetCurrentValue(IsDropdownOpenProperty, !IsDropdownOpen);
+                SetCurrentValue(IsDropdownOpenProperty, false);
+                e.Handled = true;
+            }
+        }
+        base.OnPointerReleased(e);
+    }
 }
\ No newline at end of file

From 105c996af4bbd85473004b80b50092030415b348 Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 21 Jun 2023 19:29:42 +0800
Subject: [PATCH 6/8] feat: update pagination functionality, start building
 themes.

---
 demo/Ursa.Demo/Pages/PaginationDemo.axaml     |   2 +-
 .../Controls/Pagination.axaml                 | 102 ++++++++----
 .../Themes/Dark/Pagination.axaml              |   3 +
 src/Ursa.Themes.Semi/Themes/Dark/_index.axaml |   1 +
 .../Themes/Light/Pagination.axaml             |   3 +
 .../Themes/Light/_index.axaml                 |   1 +
 .../Themes/Shared/Pagination.axaml            |   7 +
 .../Themes/Shared/_index.axaml                |   1 +
 src/Ursa/Controls/Pagination/Pagination.cs    | 153 ++++++++++++++----
 .../Controls/Pagination/PaginationButton.cs   |  35 +++-
 .../Pagination/PaginationExpandButton.cs      |  79 ---------
 11 files changed, 239 insertions(+), 148 deletions(-)
 create mode 100644 src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml
 create mode 100644 src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml
 create mode 100644 src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml
 delete mode 100644 src/Ursa/Controls/Pagination/PaginationExpandButton.cs

diff --git a/demo/Ursa.Demo/Pages/PaginationDemo.axaml b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
index 9af5f60..ab087ef 100644
--- a/demo/Ursa.Demo/Pages/PaginationDemo.axaml
+++ b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
@@ -17,6 +17,6 @@
         <u:Pagination
             Name="page"
             PageSizeOptions="{Binding PageSizes}"
-            TotalCount="300" />
+            TotalCount="600" />
     </StackPanel>
 </UserControl>
diff --git a/src/Ursa.Themes.Semi/Controls/Pagination.axaml b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
index 03cd756..039c857 100644
--- a/src/Ursa.Themes.Semi/Controls/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
@@ -2,14 +2,29 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:u="https://irihi.tech/ursa">
+    <Design.PreviewWith>
+        <StackPanel Margin="20">
+            <u:PaginationButton Page="3" />
+        </StackPanel>
+    </Design.PreviewWith>
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type u:Pagination}" TargetType="u:Pagination">
         <Setter Property="Template">
             <ControlTemplate TargetType="u:Pagination">
                 <StackPanel Orientation="Horizontal">
-                    <Button Name="{x:Static u:Pagination.PART_PreviousButton}" Content="&lt;" />
-                    <Button Name="{x:Static u:Pagination.PART_NextButton}" Content="&gt;" />
+                    <u:PaginationButton Name="{x:Static u:Pagination.PART_PreviousButton}">
+                        <PathIcon
+                            Width="12"
+                            Height="12"
+                            Data="{DynamicResource PaginationBackwardGlyph}" />
+                    </u:PaginationButton>
                     <StackPanel Name="{x:Static u:Pagination.PART_ButtonPanel}" Orientation="Horizontal" />
+                    <u:PaginationButton Name="{x:Static u:Pagination.PART_NextButton}">
+                        <PathIcon
+                            Width="12"
+                            Height="12"
+                            Data="{DynamicResource PaginationForwardGlyph}" />
+                    </u:PaginationButton>
                     <ComboBox
                         Name="{x:Static u:Pagination.PART_SizeChangerComboBox}"
                         ItemsSource="{TemplateBinding PageSizeOptions}"
@@ -20,40 +35,59 @@
         </Setter>
     </ControlTheme>
 
-    <ControlTheme x:Key="{x:Type u:PaginationExpandButton}" TargetType="u:PaginationExpandButton">
+    <ControlTheme x:Key="{x:Type u:PaginationButton}" TargetType="u:PaginationButton">
+        <Setter Property="Content" Value="{Binding $self.Page}" />
+        <Setter Property="BorderBrush" Value="Transparent" />
+        <Setter Property="MinWidth" Value="40" />
+        <Setter Property="Cursor" Value="Hand" />
         <Setter Property="Template">
-            <ControlTemplate TargetType="u:PaginationExpandButton">
-                <Grid>
-                    <Button Name="PART_Button" Content="..." />
-                    <Popup
-                        Name="{x:Static u:PaginationExpandButton.PART_Popup}"
-                        IsLightDismissEnabled="True"
-                        IsOpen="{TemplateBinding IsDropdownOpen,
-                                                 Mode=TwoWay}"
-                        PlacementTarget="PART_Button">
-                        <Border
-                            Margin="4,0,4,4"
-                            Padding="4"
-                            Background="White"
-                            BorderBrush="LightGray"
-                            BorderThickness="1"
-                            BoxShadow="0 0 8 0 #1A000000"
-                            ClipToBounds="True"
-                            CornerRadius="6">
-                            <ListBox
-                                MinWidth="50"
-                                MaxHeight="300"
-                                ItemsSource="{TemplateBinding Pages}">
-                                <ListBox.ItemContainerTheme>
-                                    <ControlTheme BasedOn="{StaticResource {x:Type ListBoxItem}}" TargetType="ListBoxItem">
-                                        <Setter Property="HorizontalContentAlignment" Value="Center" />
-                                    </ControlTheme>
-                                </ListBox.ItemContainerTheme>
-                            </ListBox>
-                        </Border>
-                    </Popup>
-                </Grid>
+            <ControlTemplate TargetType="u:PaginationButton">
+                <Border
+                    Padding="8,0"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="1"
+                    CornerRadius="3">
+                    <ContentPresenter
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        Content="{TemplateBinding Content}" />
+                </Border>
             </ControlTemplate>
         </Setter>
+        <Style Selector="^:pointerover">
+            <Setter Property="u:PaginationButton.Background" Value="LightGray" />
+        </Style>
+        <Style Selector="^:left">
+            <Setter Property="u:PaginationButton.Content" Value="..." />
+            <Style Selector="^:pointerover">
+                <Setter Property="u:PaginationButton.Content">
+                    <Template>
+                        <PathIcon
+                            Width="12"
+                            Height="12"
+                            Data="{DynamicResource PaginationFastBackwardGlyph}" />
+                    </Template>
+                </Setter>
+            </Style>
+        </Style>
+        <Style Selector="^:right">
+            <Setter Property="u:PaginationButton.Content" Value="..." />
+            <Style Selector="^:pointerover">
+                <Setter Property="u:PaginationButton.Content">
+                    <Template>
+                        <PathIcon
+                            Width="12"
+                            Height="12"
+                            Data="{DynamicResource PaginationFastForwardGlyph}" />
+                    </Template>
+                </Setter>
+            </Style>
+        </Style>
+        <Style Selector="^:selected">
+            <Setter Property="u:PaginationButton.Background" Value="LightBlue" />
+        </Style>
     </ControlTheme>
+
+
 </ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml b/src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml
new file mode 100644
index 0000000..9017e8d
--- /dev/null
+++ b/src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml
@@ -0,0 +1,3 @@
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <!--  Add Resources Here  -->
+</ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Dark/_index.axaml b/src/Ursa.Themes.Semi/Themes/Dark/_index.axaml
index 004d6a1..69dc5ed 100644
--- a/src/Ursa.Themes.Semi/Themes/Dark/_index.axaml
+++ b/src/Ursa.Themes.Semi/Themes/Dark/_index.axaml
@@ -5,6 +5,7 @@
         <MergeResourceInclude Source="Banner.axaml" />
         <MergeResourceInclude Source="Divider.axaml" />
         <MergeResourceInclude Source="IPv4Box.axaml" />
+        <MergeResourceInclude Source="Pagination.axaml" />
         <MergeResourceInclude Source="Timeline.axaml" />
     </ResourceDictionary.MergedDictionaries>
 </ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml b/src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml
new file mode 100644
index 0000000..9017e8d
--- /dev/null
+++ b/src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml
@@ -0,0 +1,3 @@
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <!--  Add Resources Here  -->
+</ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Light/_index.axaml b/src/Ursa.Themes.Semi/Themes/Light/_index.axaml
index 004d6a1..69dc5ed 100644
--- a/src/Ursa.Themes.Semi/Themes/Light/_index.axaml
+++ b/src/Ursa.Themes.Semi/Themes/Light/_index.axaml
@@ -5,6 +5,7 @@
         <MergeResourceInclude Source="Banner.axaml" />
         <MergeResourceInclude Source="Divider.axaml" />
         <MergeResourceInclude Source="IPv4Box.axaml" />
+        <MergeResourceInclude Source="Pagination.axaml" />
         <MergeResourceInclude Source="Timeline.axaml" />
     </ResourceDictionary.MergedDictionaries>
 </ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml b/src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml
new file mode 100644
index 0000000..dd66176
--- /dev/null
+++ b/src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml
@@ -0,0 +1,7 @@
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <!--  Add Resources Here  -->
+    <PathGeometry x:Key="PaginationFastBackwardGlyph">M12.6185 4.39653C13.1272 4.92524 13.1272 5.78245 12.6185 6.31116L7.14483 12L12.6185 17.6888C13.1272 18.2176 13.1272 19.0748 12.6185 19.6035C12.1098 20.1322 11.285 20.1322 10.7763 19.6035L4.38153 12.9573C3.87282 12.4286 3.87282 11.5714 4.38153 11.0427L10.7763 4.39653C11.285 3.86782 12.1098 3.86782 12.6185 4.39653Z M19.6185 4.39653C20.1272 4.92524 20.1272 5.78245 19.6185 6.31116L14.1448 12L19.6185 17.6888C20.1272 18.2176 20.1272 19.0748 19.6185 19.6035C19.1098 20.1322 18.285 20.1322 17.7763 19.6035L11.3815 12.9573C10.8728 12.4286 10.8728 11.5714 11.3815 11.0427L17.7763 4.39653C18.285 3.86782 19.1098 3.86782 19.6185 4.39653Z</PathGeometry>
+    <PathGeometry x:Key="PaginationFastForwardGlyph">M4.38153 4.39653C4.89024 3.86782 5.71502 3.86782 6.22373 4.39653L12.6185 11.0427C13.1272 11.5714 13.1272 12.4286 12.6185 12.9573L6.22373 19.6035C5.71502 20.1322 4.89024 20.1322 4.38153 19.6035C3.87282 19.0748 3.87282 18.2176 4.38153 17.6888L9.85517 12L4.38153 6.31116C3.87282 5.78245 3.87282 4.92524 4.38153 4.39653Z M11.3815 4.39653C11.8902 3.86782 12.715 3.86782 13.2237 4.39653L19.6185 11.0427C20.1272 11.5714 20.1272 12.4286 19.6185 12.9573L13.2237 19.6035C12.715 20.1322 11.8902 20.1322 11.3815 19.6035C10.8728 19.0748 10.8728 18.2176 11.3815 17.6888L16.8552 12L11.3815 6.31116C10.8728 5.78245 10.8728 4.92524 11.3815 4.39653Z</PathGeometry>
+    <PathGeometry x:Key="PaginationForwardGlyph">M7.43934 19.7957C6.85355 19.2099 6.85355 18.2601 7.43934 17.6744L13.0962 12.0175L7.43934 6.36065C6.85355 5.77486 6.85355 4.82511 7.43934 4.23933C8.02513 3.65354 8.97487 3.65354 9.56066 4.23933L16.2782 10.9568C16.864 11.5426 16.864 12.4924 16.2782 13.0782L9.56066 19.7957C8.97487 20.3815 8.02513 20.3815 7.43934 19.7957Z</PathGeometry>
+    <PathGeometry x:Key="PaginationBackwardGlyph">M16.2782 4.23933C16.864 4.82511 16.864 5.77486 16.2782 6.36065L10.6213 12.0175L16.2782 17.6744C16.864 18.2601 16.864 19.2099 16.2782 19.7957C15.6924 20.3815 14.7426 20.3815 14.1569 19.7957L7.43934 13.0782C6.85355 12.4924 6.85355 11.5426 7.43934 10.9568L14.1569 4.23933C14.7426 3.65354 15.6924 3.65354 16.2782 4.23933Z</PathGeometry>
+</ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Shared/_index.axaml b/src/Ursa.Themes.Semi/Themes/Shared/_index.axaml
index 7a530cc..5d9a332 100644
--- a/src/Ursa.Themes.Semi/Themes/Shared/_index.axaml
+++ b/src/Ursa.Themes.Semi/Themes/Shared/_index.axaml
@@ -5,5 +5,6 @@
         <MergeResourceInclude Source="Banner.axaml" />
         <MergeResourceInclude Source="Divider.axaml" />
         <MergeResourceInclude Source="IPv4Box.axaml" />
+        <MergeResourceInclude Source="Pagination.axaml" />
     </ResourceDictionary.MergedDictionaries>
 </ResourceDictionary>
diff --git a/src/Ursa/Controls/Pagination/Pagination.cs b/src/Ursa/Controls/Pagination/Pagination.cs
index 002985a..0b71333 100644
--- a/src/Ursa/Controls/Pagination/Pagination.cs
+++ b/src/Ursa/Controls/Pagination/Pagination.cs
@@ -8,6 +8,11 @@ using Avalonia.Styling;
 
 namespace Ursa.Controls;
 
+/// <summary>
+/// Pagination is a control that displays a series of buttons that can be used to navigate to pages.
+/// CurrentPage starts from 1.
+/// Pagination only stores an approximate index internally.
+/// </summary>
 [TemplatePart(PART_PreviousButton, typeof(Button))]
 [TemplatePart(PART_NextButton, typeof(Button))]
 [TemplatePart(PART_ButtonPanel, typeof(StackPanel))]
@@ -21,14 +26,9 @@ public class Pagination: TemplatedControl
     private Button? _previousButton;
     private Button? _nextButton;
     private StackPanel? _buttonPanel;
+    private readonly PaginationButton[] _buttons = new PaginationButton[7];
     private ComboBox? _sizeChangerComboBox;
 
-    /// <summary>
-    /// To reduce allocation, there are maximum of 7 buttons and 2 selection controls. it will be reused.
-    /// </summary>
-    private PaginationExpandButton? _leftSelection;
-    private PaginationExpandButton? _rightSelection;
-
     protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
     {
         base.OnApplyTemplate(e);
@@ -40,9 +40,8 @@ public class Pagination: TemplatedControl
         _sizeChangerComboBox = e.NameScope.Find<ComboBox>(PART_SizeChangerComboBox);
         if (_previousButton != null) _previousButton.Click += OnButtonClick;
         if (_nextButton != null) _nextButton.Click += OnButtonClick;
-        _leftSelection = new PaginationExpandButton();
-        _rightSelection = new PaginationExpandButton();
-        UpdateButtons();
+        InitializePanelButtons();
+        UpdateButtons(0);
 
     }
     
@@ -111,21 +110,20 @@ public class Pagination: TemplatedControl
         set => SetValue(PageButtonThemeProperty, value);
     }
 
-    public static readonly StyledProperty<ControlTheme> ExpandButtonThemeProperty = AvaloniaProperty.Register<Pagination, ControlTheme>(
-        nameof(ExpandButtonTheme));
-
-    public ControlTheme ExpandButtonTheme
-    {
-        get => GetValue(ExpandButtonThemeProperty);
-        set => SetValue(ExpandButtonThemeProperty, value);
-    }
-
     protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change)
     {
         base.OnPropertyChanged(change);
-        if (change.Property == PageSizeProperty || change.Property == TotalCountProperty)
+        // When page size is updated, the selected current page must be updated. 
+        if (change.Property == PageSizeProperty)
         {
-            UpdateButtons();
+            int oldPageSize = change.GetOldValue<int>();
+            int index = oldPageSize * CurrentPage;
+            UpdateButtons(index);
+        }
+        else if (change.Property == TotalCountProperty || change.Property == CurrentPageProperty)
+        {
+            int index = PageSize * CurrentPage;
+            UpdateButtons(index);
         }
     }
 
@@ -133,18 +131,60 @@ public class Pagination: TemplatedControl
     {
         if (Equals(sender, _previousButton))
         {
-            CurrentPage--;
+            AddCurrentPage(-1);
         }
         else
         {
-            CurrentPage++;
+            AddCurrentPage(1);
         }
     }
 
-    private void UpdateButtons()
+    private void InitializePanelButtons()
     {
+        if (_buttonPanel is null) return;
+        _buttonPanel.Children.Clear();
+        for (int i = 1; i <= 7; i++)
+        {
+            var button = new PaginationButton() { Page = i, IsVisible = true };
+            _buttonPanel.Children.Add(button);
+            _buttons![i - 1] = button;
+            button.Click+= OnPageButtonClick;
+        }
+    }
+
+    private void OnPageButtonClick(object sender, RoutedEventArgs args)
+    {
+        if (sender is PaginationButton pageButton)
+        {
+            if (pageButton.IsLeftForward)
+            {
+                AddCurrentPage(-5);
+            }
+            else if (pageButton.IsRightForward)
+            {
+                AddCurrentPage(5);
+            }
+            else
+            {
+                CurrentPage = pageButton.Page;
+            }
+        }
+    }
+
+    private void AddCurrentPage(int pageChange)
+    {
+        int newValue = CurrentPage + pageChange;
+        if (newValue <= 0) newValue = 1;
+        else if(newValue>=PageCount) newValue = PageCount;
+        CurrentPage = newValue;
+    }
+
+    private void UpdateButtons(int index)
+    {
+        if (_buttonPanel is null) return;
         if (PageSize == 0) return;
-        int currentIndex = CurrentPage * PageSize;
+
+        int currentIndex = index;
         
         int pageCount = TotalCount / PageSize;
         int residue = TotalCount % PageSize;
@@ -152,18 +192,71 @@ public class Pagination: TemplatedControl
         {
             pageCount++;
         }
-        _buttonPanel?.Children.Clear();
-        for (int i = 0; i < pageCount; i++)
+        
+        PageCount = pageCount;
+        
+        int currentPage = currentIndex/ PageSize;
+        if (currentPage == 0) currentPage++;
+
+        if (pageCount <= 7)
         {
-            if (i == 1 && _leftSelection is not null)
+            for (int i = 0; i < 7; i++)
             {
-                _leftSelection.Pages = new AvaloniaList<int>() { PageSize + 1, PageSize + 2, PageSize + 3 };
-                _buttonPanel?.Children.Add(_leftSelection);
+                if (i < pageCount)
+                {
+                    _buttons[i].IsVisible = true;
+                    _buttons[i].SetStatus(i + 1, i+1 == CurrentPage, false, false);
+                }
+                else
+                {
+                    _buttons[i].IsVisible = false;
+                }
+            }
+        }
+        else
+        {
+            for (int i = 0; i < 7; i++)
+            {
+                _buttons[i].IsVisible = true;
+            }
+            int mid = currentPage;
+            if (mid < 4) mid = 4;
+            else if (mid > pageCount - 3) mid = pageCount - 3;
+            _buttons[3].Page = mid;
+            _buttons[2].Page = mid - 1;
+            _buttons[4].Page = mid + 1;
+            _buttons[0].Page = 1;
+            _buttons[6].Page = pageCount;
+            if(mid>4)
+            {
+                _buttons[1].SetStatus(0, false, true, false);
             }
             else
             {
-                _buttonPanel?.Children.Add(new PaginationButton { Content = i + 1, Page = i + 1 });
+                _buttons[1].SetStatus(mid-2, false, false, false);
+            }
+            if(mid<pageCount-3)
+            {
+                _buttons[5].SetStatus(0, false, false, true);
+            }
+            else
+            {
+                _buttons[5].SetStatus(mid+2, false, false, false);
+            }
+
+            foreach (var button in _buttons)
+            {
+                if (button.Page == currentPage)
+                {
+                    button.SetSelected(true);
+                }
+                else
+                {
+                    button.SetSelected(false);
+                }
             }
         }
+
+        CurrentPage = currentPage;
     }
 }
\ No newline at end of file
diff --git a/src/Ursa/Controls/Pagination/PaginationButton.cs b/src/Ursa/Controls/Pagination/PaginationButton.cs
index 71bfeb1..84f366c 100644
--- a/src/Ursa/Controls/Pagination/PaginationButton.cs
+++ b/src/Ursa/Controls/Pagination/PaginationButton.cs
@@ -1,14 +1,41 @@
+using Avalonia;
 using Avalonia.Controls;
+using Avalonia.Controls.Metadata;
 using Avalonia.Controls.Primitives;
 using Avalonia.Styling;
 
 namespace Ursa.Controls;
 
+[PseudoClasses(PC_Left, PC_Right, PC_Selected)]
 public class PaginationButton: Button, IStyleable
 {
-    Type IStyleable.StyleKey => typeof(Button);
-    
-    public int Page { get; set; }
-    
+    public const string PC_Left = ":left";
+    public const string PC_Right = ":right";
+    public const string PC_Selected = ":selected";
+
+    public static readonly StyledProperty<int> PageProperty = AvaloniaProperty.Register<PaginationButton, int>(
+        nameof(Page));
+
+    public int Page
+    {
+        get => GetValue(PageProperty);
+        set => SetValue(PageProperty, value);
+    }
+    public bool IsLeftForward { get; private set; }
+    public bool IsRightForward { get; private set; }
     
+    internal void SetStatus(int page, bool isSelected, bool isLeft, bool isRight)
+    {
+        PseudoClasses.Set(PC_Selected, isSelected);
+        PseudoClasses.Set(PC_Left, isLeft);
+        PseudoClasses.Set(PC_Right, isRight);
+        IsLeftForward = isLeft;
+        IsRightForward = isRight;
+        Page = page;
+    }
+
+    internal void SetSelected(bool isSelected)
+    {
+        PseudoClasses.Set(PC_Selected, isSelected);
+    }
 }
\ No newline at end of file
diff --git a/src/Ursa/Controls/Pagination/PaginationExpandButton.cs b/src/Ursa/Controls/Pagination/PaginationExpandButton.cs
deleted file mode 100644
index fb50a59..0000000
--- a/src/Ursa/Controls/Pagination/PaginationExpandButton.cs
+++ /dev/null
@@ -1,79 +0,0 @@
-using Avalonia;
-using Avalonia.Collections;
-using Avalonia.Controls;
-using Avalonia.Controls.Metadata;
-using Avalonia.Controls.Primitives;
-using Avalonia.Input;
-
-namespace Ursa.Controls;
-
-[TemplatePart(PART_Button, typeof(Button))]
-[TemplatePart(PART_Popup, typeof(Popup))]
-public class PaginationExpandButton: TemplatedControl
-{
-    public const string PART_Button = "PART_Button";
-    public const string PART_Popup = "PART_Popup";
-    private Popup? _popup;
-    private Button? _button;
-    
-    public static readonly StyledProperty<AvaloniaList<int>> PagesProperty = AvaloniaProperty.Register<PaginationExpandButton, AvaloniaList<int>>(
-        nameof(Pages));
-
-    public AvaloniaList<int> Pages
-    {
-        get => GetValue(PagesProperty);
-        set => SetValue(PagesProperty, value);
-    }
-
-    public static readonly StyledProperty<bool> IsDropdownOpenProperty = AvaloniaProperty.Register<PaginationExpandButton, bool>(
-        nameof(IsDropdownOpen));
-
-    public bool IsDropdownOpen
-    {
-        get => GetValue(IsDropdownOpenProperty);
-        set => SetValue(IsDropdownOpenProperty, value);
-    }
-
-    protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
-    {
-        base.OnApplyTemplate(e);
-        _popup = e.NameScope.Find<Popup>(PART_Popup);
-        _button = e.NameScope.Find<Button>(PART_Button);
-    }
-
-    protected override void OnPointerEntered(PointerEventArgs e)
-    {
-        if (!e.Handled && e.Source is Visual source )
-        {
-            SetCurrentValue(IsDropdownOpenProperty, true);
-            e.Handled = true;
-        }
-        base.OnPointerEntered(e);
-
-    }
-
-    protected override void OnPointerExited(PointerEventArgs e)
-    {
-        base.OnPointerExited(e);
-        // IsDropdownOpen = false;
-    }
-
-    protected override void OnPointerReleased(PointerReleasedEventArgs e)
-    {
-        if (!e.Handled && e.Source is Visual source)
-        {
-            if (_popup?.IsInsidePopup(source) == true)
-            {
-                SetCurrentValue(IsDropdownOpenProperty, false);
-                e.Handled = true;
-            }
-            else
-            {
-                //SetCurrentValue(IsDropdownOpenProperty, !IsDropdownOpen);
-                SetCurrentValue(IsDropdownOpenProperty, false);
-                e.Handled = true;
-            }
-        }
-        base.OnPointerReleased(e);
-    }
-}
\ No newline at end of file

From c4f49765b833a0cbbf4bd62cf10b51b60181faee Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 21 Jun 2023 20:12:43 +0800
Subject: [PATCH 7/8] feat: update light theme.

---
 demo/Ursa.Demo/Pages/PaginationDemo.axaml     |  2 +-
 .../ViewModels/PaginationDemoViewModel.cs     |  1 +
 .../Controls/Pagination.axaml                 | 53 +++++++++++++++----
 .../Themes/Light/Pagination.axaml             |  7 +++
 .../Themes/Shared/Pagination.axaml            |  1 +
 src/Ursa/Controls/Pagination/Pagination.cs    | 36 ++++++++++---
 .../Controls/Pagination/PaginationButton.cs   | 10 ++--
 7 files changed, 85 insertions(+), 25 deletions(-)

diff --git a/demo/Ursa.Demo/Pages/PaginationDemo.axaml b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
index ab087ef..32cd9bd 100644
--- a/demo/Ursa.Demo/Pages/PaginationDemo.axaml
+++ b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
@@ -16,7 +16,7 @@
         <TextBlock Text="{Binding #page.CurrentPage}" />
         <u:Pagination
             Name="page"
-            PageSizeOptions="{Binding PageSizes}"
+            PageSizeOptions="10, 20, 50, 100"
             TotalCount="600" />
     </StackPanel>
 </UserControl>
diff --git a/demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs b/demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs
index e85fd3e..bf69393 100644
--- a/demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs
+++ b/demo/Ursa.Demo/ViewModels/PaginationDemoViewModel.cs
@@ -1,3 +1,4 @@
+using System.Collections.Generic;
 using System.Collections.ObjectModel;
 using Avalonia.Collections;
 using CommunityToolkit.Mvvm.ComponentModel;
diff --git a/src/Ursa.Themes.Semi/Controls/Pagination.axaml b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
index 039c857..c5564d6 100644
--- a/src/Ursa.Themes.Semi/Controls/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
@@ -16,17 +16,20 @@
                         <PathIcon
                             Width="12"
                             Height="12"
-                            Data="{DynamicResource PaginationBackwardGlyph}" />
+                            Data="{DynamicResource PaginationBackwardGlyph}"
+                            Foreground="{DynamicResource PaginationButtonIconForeground}" />
                     </u:PaginationButton>
                     <StackPanel Name="{x:Static u:Pagination.PART_ButtonPanel}" Orientation="Horizontal" />
                     <u:PaginationButton Name="{x:Static u:Pagination.PART_NextButton}">
                         <PathIcon
                             Width="12"
                             Height="12"
-                            Data="{DynamicResource PaginationForwardGlyph}" />
+                            Data="{DynamicResource PaginationForwardGlyph}"
+                            Foreground="{DynamicResource PaginationButtonIconForeground}" />
                     </u:PaginationButton>
                     <ComboBox
                         Name="{x:Static u:Pagination.PART_SizeChangerComboBox}"
+                        IsVisible="{TemplateBinding ShowPageSizeSelector}"
                         ItemsSource="{TemplateBinding PageSizeOptions}"
                         SelectedItem="{TemplateBinding PageSize,
                                                        Mode=TwoWay}" />
@@ -38,12 +41,15 @@
     <ControlTheme x:Key="{x:Type u:PaginationButton}" TargetType="u:PaginationButton">
         <Setter Property="Content" Value="{Binding $self.Page}" />
         <Setter Property="BorderBrush" Value="Transparent" />
-        <Setter Property="MinWidth" Value="40" />
+        <Setter Property="MinWidth" Value="32" />
+        <Setter Property="MinHeight" Value="32" />
+        <Setter Property="Background" Value="{DynamicResource PaginationButtonDefaultBackground}" />
+        <Setter Property="Foreground" Value="{DynamicResource PaginationButtonDefaultForeground}" />
         <Setter Property="Cursor" Value="Hand" />
         <Setter Property="Template">
             <ControlTemplate TargetType="u:PaginationButton">
                 <Border
-                    Padding="8,0"
+                    Padding="4"
                     Background="{TemplateBinding Background}"
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="1"
@@ -51,41 +57,66 @@
                     <ContentPresenter
                         HorizontalAlignment="Center"
                         VerticalAlignment="Center"
-                        Content="{TemplateBinding Content}" />
+                        Content="{TemplateBinding Content}"
+                        FontWeight="{TemplateBinding FontWeight}"
+                        Foreground="{TemplateBinding Foreground}" />
                 </Border>
             </ControlTemplate>
         </Setter>
         <Style Selector="^:pointerover">
-            <Setter Property="u:PaginationButton.Background" Value="LightGray" />
+            <Setter Property="u:PaginationButton.Background" Value="{DynamicResource PaginationButtonPointeroverBackground}" />
+        </Style>
+        <Style Selector="^:pressed">
+            <Setter Property="u:PaginationButton.Background" Value="{DynamicResource PaginationButtonPressedBackground}" />
         </Style>
         <Style Selector="^:left">
-            <Setter Property="u:PaginationButton.Content" Value="..." />
+            <Setter Property="u:PaginationButton.Content">
+                <Template>
+                    <PathIcon
+                        Width="12"
+                        Height="12"
+                        Data="{DynamicResource PaginationMoreGlyph}"
+                        Foreground="{DynamicResource PaginationButtonIconForeground}" />
+                </Template>
+            </Setter>
             <Style Selector="^:pointerover">
                 <Setter Property="u:PaginationButton.Content">
                     <Template>
                         <PathIcon
                             Width="12"
                             Height="12"
-                            Data="{DynamicResource PaginationFastBackwardGlyph}" />
+                            Data="{DynamicResource PaginationFastBackwardGlyph}"
+                            Foreground="{DynamicResource PaginationButtonIconForeground}" />
                     </Template>
                 </Setter>
             </Style>
         </Style>
         <Style Selector="^:right">
-            <Setter Property="u:PaginationButton.Content" Value="..." />
+            <Setter Property="u:PaginationButton.Content">
+                <Template>
+                    <PathIcon
+                        Width="12"
+                        Height="12"
+                        Data="{DynamicResource PaginationMoreGlyph}"
+                        Foreground="{DynamicResource PaginationButtonIconForeground}" />
+                </Template>
+            </Setter>
             <Style Selector="^:pointerover">
                 <Setter Property="u:PaginationButton.Content">
                     <Template>
                         <PathIcon
                             Width="12"
                             Height="12"
-                            Data="{DynamicResource PaginationFastForwardGlyph}" />
+                            Data="{DynamicResource PaginationFastForwardGlyph}"
+                            Foreground="{DynamicResource PaginationButtonIconForeground}" />
                     </Template>
                 </Setter>
             </Style>
         </Style>
         <Style Selector="^:selected">
-            <Setter Property="u:PaginationButton.Background" Value="LightBlue" />
+            <Setter Property="u:PaginationButton.Background" Value="{DynamicResource PaginationButtonSelectedBackground}" />
+            <Setter Property="u:PaginationButton.Foreground" Value="{DynamicResource PaginationButtonSelectedForeground}" />
+            <Setter Property="u:PaginationButton.FontWeight" Value="600" />
         </Style>
     </ControlTheme>
 
diff --git a/src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml b/src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml
index 9017e8d..31ddae8 100644
--- a/src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Themes/Light/Pagination.axaml
@@ -1,3 +1,10 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--  Add Resources Here  -->
+    <SolidColorBrush x:Key="PaginationButtonDefaultForeground" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="PaginationButtonSelectedForeground" Color="#FF0077FA" />
+    <SolidColorBrush x:Key="PaginationButtonIconForeground" Opacity="0.62" Color="#FF1C1F23" />
+    <SolidColorBrush x:Key="PaginationButtonDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="PaginationButtonPointeroverBackground" Opacity="0.05" Color="#FF2E3238" />
+    <SolidColorBrush x:Key="PaginationButtonPressedBackground" Opacity="0.09" Color="#FF2E3238" />
+    <SolidColorBrush x:Key="PaginationButtonSelectedBackground" Color="#FFEAF5FF" />
 </ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml b/src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml
index dd66176..83c83a6 100644
--- a/src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Themes/Shared/Pagination.axaml
@@ -4,4 +4,5 @@
     <PathGeometry x:Key="PaginationFastForwardGlyph">M4.38153 4.39653C4.89024 3.86782 5.71502 3.86782 6.22373 4.39653L12.6185 11.0427C13.1272 11.5714 13.1272 12.4286 12.6185 12.9573L6.22373 19.6035C5.71502 20.1322 4.89024 20.1322 4.38153 19.6035C3.87282 19.0748 3.87282 18.2176 4.38153 17.6888L9.85517 12L4.38153 6.31116C3.87282 5.78245 3.87282 4.92524 4.38153 4.39653Z M11.3815 4.39653C11.8902 3.86782 12.715 3.86782 13.2237 4.39653L19.6185 11.0427C20.1272 11.5714 20.1272 12.4286 19.6185 12.9573L13.2237 19.6035C12.715 20.1322 11.8902 20.1322 11.3815 19.6035C10.8728 19.0748 10.8728 18.2176 11.3815 17.6888L16.8552 12L11.3815 6.31116C10.8728 5.78245 10.8728 4.92524 11.3815 4.39653Z</PathGeometry>
     <PathGeometry x:Key="PaginationForwardGlyph">M7.43934 19.7957C6.85355 19.2099 6.85355 18.2601 7.43934 17.6744L13.0962 12.0175L7.43934 6.36065C6.85355 5.77486 6.85355 4.82511 7.43934 4.23933C8.02513 3.65354 8.97487 3.65354 9.56066 4.23933L16.2782 10.9568C16.864 11.5426 16.864 12.4924 16.2782 13.0782L9.56066 19.7957C8.97487 20.3815 8.02513 20.3815 7.43934 19.7957Z</PathGeometry>
     <PathGeometry x:Key="PaginationBackwardGlyph">M16.2782 4.23933C16.864 4.82511 16.864 5.77486 16.2782 6.36065L10.6213 12.0175L16.2782 17.6744C16.864 18.2601 16.864 19.2099 16.2782 19.7957C15.6924 20.3815 14.7426 20.3815 14.1569 19.7957L7.43934 13.0782C6.85355 12.4924 6.85355 11.5426 7.43934 10.9568L14.1569 4.23933C14.7426 3.65354 15.6924 3.65354 16.2782 4.23933Z</PathGeometry>
+    <PathGeometry x:Key="PaginationMoreGlyph">M7 12C7 13.3807 5.88071 14.5 4.5 14.5C3.11929 14.5 2 13.3807 2 12C2 10.6193 3.11929 9.5 4.5 9.5C5.88071 9.5 7 10.6193 7 12Z M14.5 12C14.5 13.3807 13.3807 14.5 12 14.5C10.6193 14.5 9.5 13.3807 9.5 12C9.5 10.6193 10.6193 9.5 12 9.5C13.3807 9.5 14.5 10.6193 14.5 12Z M19.5 14.5C20.8807 14.5 22 13.3807 22 12C22 10.6193 20.8807 9.5 19.5 9.5C18.1193 9.5 17 10.6193 17 12C17 13.3807 18.1193 14.5 19.5 14.5Z</PathGeometry>
 </ResourceDictionary>
diff --git a/src/Ursa/Controls/Pagination/Pagination.cs b/src/Ursa/Controls/Pagination/Pagination.cs
index 0b71333..f462496 100644
--- a/src/Ursa/Controls/Pagination/Pagination.cs
+++ b/src/Ursa/Controls/Pagination/Pagination.cs
@@ -13,8 +13,8 @@ namespace Ursa.Controls;
 /// CurrentPage starts from 1.
 /// Pagination only stores an approximate index internally.
 /// </summary>
-[TemplatePart(PART_PreviousButton, typeof(Button))]
-[TemplatePart(PART_NextButton, typeof(Button))]
+[TemplatePart(PART_PreviousButton, typeof(PaginationButton))]
+[TemplatePart(PART_NextButton, typeof(PaginationButton))]
 [TemplatePart(PART_ButtonPanel, typeof(StackPanel))]
 [TemplatePart(PART_SizeChangerComboBox, typeof(ComboBox))]
 public class Pagination: TemplatedControl
@@ -23,8 +23,8 @@ public class Pagination: TemplatedControl
     public const string PART_NextButton = "PART_NextButton";
     public const string PART_ButtonPanel = "PART_ButtonPanel";
     public const string PART_SizeChangerComboBox = "PART_SizeChangerComboBox";
-    private Button? _previousButton;
-    private Button? _nextButton;
+    private PaginationButton? _previousButton;
+    private PaginationButton? _nextButton;
     private StackPanel? _buttonPanel;
     private readonly PaginationButton[] _buttons = new PaginationButton[7];
     private ComboBox? _sizeChangerComboBox;
@@ -34,8 +34,8 @@ public class Pagination: TemplatedControl
         base.OnApplyTemplate(e);
         if (_previousButton != null) _previousButton.Click -= OnButtonClick;
         if (_nextButton != null) _nextButton.Click -= OnButtonClick;
-        _previousButton = e.NameScope.Find<Button>(PART_PreviousButton);
-        _nextButton = e.NameScope.Find<Button>(PART_NextButton);
+        _previousButton = e.NameScope.Find<PaginationButton>(PART_PreviousButton);
+        _nextButton = e.NameScope.Find<PaginationButton>(PART_NextButton);
         _buttonPanel = e.NameScope.Find<StackPanel>(PART_ButtonPanel);
         _sizeChangerComboBox = e.NameScope.Find<ComboBox>(PART_SizeChangerComboBox);
         if (_previousButton != null) _previousButton.Click += OnButtonClick;
@@ -110,6 +110,24 @@ public class Pagination: TemplatedControl
         set => SetValue(PageButtonThemeProperty, value);
     }
 
+    public static readonly StyledProperty<bool> ShowPageSizeSelectorProperty = AvaloniaProperty.Register<Pagination, bool>(
+        nameof(ShowPageSizeSelector));
+
+    public bool ShowPageSizeSelector
+    {
+        get => GetValue(ShowPageSizeSelectorProperty);
+        set => SetValue(ShowPageSizeSelectorProperty, value);
+    }
+
+    public static readonly StyledProperty<bool> ShowQuickJumpProperty = AvaloniaProperty.Register<Pagination, bool>(
+        nameof(ShowQuickJump));
+
+    public bool ShowQuickJump
+    {
+        get => GetValue(ShowQuickJumpProperty);
+        set => SetValue(ShowQuickJumpProperty, value);
+    }
+
     protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change)
     {
         base.OnPropertyChanged(change);
@@ -156,11 +174,11 @@ public class Pagination: TemplatedControl
     {
         if (sender is PaginationButton pageButton)
         {
-            if (pageButton.IsLeftForward)
+            if (pageButton.IsFastForward)
             {
                 AddCurrentPage(-5);
             }
-            else if (pageButton.IsRightForward)
+            else if (pageButton.IsFastBackward)
             {
                 AddCurrentPage(5);
             }
@@ -258,5 +276,7 @@ public class Pagination: TemplatedControl
         }
 
         CurrentPage = currentPage;
+        if (_previousButton != null) _previousButton.IsEnabled = CurrentPage > 1;
+        if( _nextButton!=null) _nextButton.IsEnabled = CurrentPage < PageCount;
     }
 }
\ No newline at end of file
diff --git a/src/Ursa/Controls/Pagination/PaginationButton.cs b/src/Ursa/Controls/Pagination/PaginationButton.cs
index 84f366c..9f87f38 100644
--- a/src/Ursa/Controls/Pagination/PaginationButton.cs
+++ b/src/Ursa/Controls/Pagination/PaginationButton.cs
@@ -7,7 +7,7 @@ using Avalonia.Styling;
 namespace Ursa.Controls;
 
 [PseudoClasses(PC_Left, PC_Right, PC_Selected)]
-public class PaginationButton: Button, IStyleable
+public class PaginationButton: Button
 {
     public const string PC_Left = ":left";
     public const string PC_Right = ":right";
@@ -21,16 +21,16 @@ public class PaginationButton: Button, IStyleable
         get => GetValue(PageProperty);
         set => SetValue(PageProperty, value);
     }
-    public bool IsLeftForward { get; private set; }
-    public bool IsRightForward { get; private set; }
+    internal bool IsFastForward { get; private set; }
+    internal bool IsFastBackward { get; private set; }
     
     internal void SetStatus(int page, bool isSelected, bool isLeft, bool isRight)
     {
         PseudoClasses.Set(PC_Selected, isSelected);
         PseudoClasses.Set(PC_Left, isLeft);
         PseudoClasses.Set(PC_Right, isRight);
-        IsLeftForward = isLeft;
-        IsRightForward = isRight;
+        IsFastForward = isLeft;
+        IsFastBackward = isRight;
         Page = page;
     }
 

From 44c69e4ae472a9d7151300b7bc458bbc84b9d6da Mon Sep 17 00:00:00 2001
From: rabbitism <popmessiah@hotmail.com>
Date: Wed, 21 Jun 2023 20:22:02 +0800
Subject: [PATCH 8/8] feat: add dark mode, improve demo.

---
 demo/Ursa.Demo/Pages/PaginationDemo.axaml         | 2 ++
 src/Ursa.Themes.Semi/Controls/Pagination.axaml    | 1 -
 src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml | 7 +++++++
 3 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/demo/Ursa.Demo/Pages/PaginationDemo.axaml b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
index 32cd9bd..0037750 100644
--- a/demo/Ursa.Demo/Pages/PaginationDemo.axaml
+++ b/demo/Ursa.Demo/Pages/PaginationDemo.axaml
@@ -14,9 +14,11 @@
     </Design.DataContext>
     <StackPanel>
         <TextBlock Text="{Binding #page.CurrentPage}" />
+        <ToggleSwitch Name="pageSizeSelector" Content="Show Page Size Selector" />
         <u:Pagination
             Name="page"
             PageSizeOptions="10, 20, 50, 100"
+            ShowPageSizeSelector="{Binding #pageSizeSelector.IsChecked}"
             TotalCount="600" />
     </StackPanel>
 </UserControl>
diff --git a/src/Ursa.Themes.Semi/Controls/Pagination.axaml b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
index c5564d6..0eaa096 100644
--- a/src/Ursa.Themes.Semi/Controls/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Controls/Pagination.axaml
@@ -120,5 +120,4 @@
         </Style>
     </ControlTheme>
 
-
 </ResourceDictionary>
diff --git a/src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml b/src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml
index 9017e8d..b80dd02 100644
--- a/src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml
+++ b/src/Ursa.Themes.Semi/Themes/Dark/Pagination.axaml
@@ -1,3 +1,10 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--  Add Resources Here  -->
+    <SolidColorBrush x:Key="PaginationButtonDefaultForeground" Color="#FFF9F9F9" />
+    <SolidColorBrush x:Key="PaginationButtonSelectedForeground" Color="#FF54A9FF" />
+    <SolidColorBrush x:Key="PaginationButtonIconForeground" Opacity="0.6" Color="#FFF9F9F9" />
+    <SolidColorBrush x:Key="PaginationButtonDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="PaginationButtonPointeroverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="PaginationButtonPressedBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="PaginationButtonSelectedBackground" Opacity="0.2" Color="#FF54A9FF" />
 </ResourceDictionary>