Merge pull request #169 from irihitech/nightly

Update to Avalonia preview 7

.github/workflows/Pack.yml

@@ -0,0 +1,55 @@
+name: Pack
+
+on:
+  push:
+    branches: [ "release" ]
+  pull_request:
+    branches: [ "release" ]
+
+jobs:
+  nuget_desktop:
+    runs-on: windows-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Nuget Semi.Avalonia
+        run: dotnet pack ./src/Semi.Avalonia -o ./nugets
+
+      - name: Nuget Semi.Avalonia.DataGrid
+        run: dotnet pack ./src/Semi.Avalonia.DataGrid  -o ./nugets
+
+      - name: Nuget Semi.Avalonia.ColorPicker
+        run: dotnet pack ./src/Semi.Avalonia.ColorPicker  -o ./nugets
+
+      - name: Desktop
+        run: dotnet publish ./demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true --self-contained true
+
+      - name: Upload
+        uses: actions/upload-artifact@v3.1.2
+        with:
+          name: nuget_desktop
+          path: |
+            ./nugets
+            ./**/publish/*.exe
+
+  android:
+    runs-on: windows-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: CD Android
+        run: cd ./demo/Semi.Avalonia.Demo.Android
+
+      - name: Restore Dependencies
+        run: dotnet restore
+
+      - name: Build
+        run: dotnet publish ./demo/Semi.Avalonia.Demo.Android -c Release -f net7.0-android --no-restore
+
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v3.1.2
+        with:
+          name: android
+          path: ./**/publish/*Signed.apk

.run/SC-Single.run.xml

@@ -0,0 +1,6 @@
+<component name="ProjectRunConfigurationManager">
+  <configuration default="false" name="SC-Single" type="DotNetFolderPublish" factoryName="Publish to folder">
+    <riderPublish configuration="Release" include_native_libs_for_self_extract="true" platform="Any CPU" produce_single_file="true" runtime="win-x64" self_contained="true" target_folder="$PROJECT_DIR$/demo/Semi.Avalonia.Demo.Desktop/bin/Release/net7.0/win-x64/publish" target_framework="net7.0" uuid_high="3088527218258560748" uuid_low="-8649338673481336678" />
+    <method v="2" />
+  </configuration>
+</component>

README.md

@@ -11,7 +11,7 @@ Avalonia Theme inspired by Semi Design
 
 ## Installation
 ```bash
-dotnet add package Semi.Avalonia --version 0.1.0-preview5.3
+dotnet add package Semi.Avalonia --version 0.1.0-preview7
 ```
 Include Semi Design Styles in application:
 
@@ -25,8 +25,8 @@ That's all.
 
 DataGrid and ColorPicker are distributed in separated packages. Please install if you need. 
 ```bash
-dotnet add package Semi.Avalonia.ColorPicker --version 0.1.0-preview5.2
-dotnet add package Semi.Avalonia.DataGrid --version 0.1.0-preview5.2
+dotnet add package Semi.Avalonia.ColorPicker --version 0.1.0-preview7
+dotnet add package Semi.Avalonia.DataGrid --version 0.1.0-preview7
 ```
 ```xaml
 <Application.Styles>
@@ -42,10 +42,17 @@ https://github.com/irihitech/Semi.Avalonia/releases
 
 ## Version compatibility
 
-| Semi Design Version | Avalonia Version|
-|:--------------------|:---|
-| 0.1.0-preview3      |11.0-preview4|
-| 0.1.0-preview5.x    |11.0-preview5|
+| Semi Design Version | Avalonia Version |
+|:--------------------|:-----------------|
+| 0.1.0-preview3      | 11.0-preview4    |
+| 0.1.0-preview5.x    | 11.0-preview5    |
+| 0.1.0-preview6.x    | 11.0-preview6    |
+| 0.1.0-preview7.x    | 11.0-preview7    |
+
+**NOTE**
+
+Semi Avalonia theme is moving forward together with Avalonia preview versions now. So new feature/fixes are not backported to previous preview versions. If you need a feature/fix for outdated avalonia preview version, please raise an issue so we can do that for you. 
+
 
 ## TODO
 * DataValidationErrors

Semi.Avalonia.sln

@@ -20,9 +20,11 @@ Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.Demo.Web", "d
 EndProject
 Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.Demo", "demo\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj", "{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0}"
 EndProject
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Semi.Avalonia.DataGrid", "src\Semi.Avalonia.DataGrid\Semi.Avalonia.DataGrid.csproj", "{8A90C292-8761-4F70-8E1F-EFC097FEADB3}"
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.DataGrid", "src\Semi.Avalonia.DataGrid\Semi.Avalonia.DataGrid.csproj", "{8A90C292-8761-4F70-8E1F-EFC097FEADB3}"
 EndProject
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Semi.Avalonia.ColorPicker", "src\Semi.Avalonia.ColorPicker\Semi.Avalonia.ColorPicker.csproj", "{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}"
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.ColorPicker", "src\Semi.Avalonia.ColorPicker\Semi.Avalonia.ColorPicker.csproj", "{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}"
+EndProject
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.Demo.Android", "demo\Semi.Avalonia.Demo.Android\Semi.Avalonia.Demo.Android.csproj", "{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}"
 EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
@@ -54,6 +56,11 @@ Global
 		{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}.Debug|Any CPU.Build.0 = Debug|Any CPU
 		{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}.Release|Any CPU.ActiveCfg = Release|Any CPU
 		{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}.Release|Any CPU.Build.0 = Release|Any CPU
+		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Debug|Any CPU.Deploy.0 = Debug|Any CPU
+		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Release|Any CPU.Build.0 = Release|Any CPU
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE
@@ -62,6 +69,7 @@ Global
 		{2ADCA724-2B6D-46EC-87F7-604D7918B89A} = {43091528-9509-43CB-A003-9C5C11E96DD6}
 		{69A2C77D-6DB7-4AE4-B179-D1F5CF5E2DF0} = {43091528-9509-43CB-A003-9C5C11E96DD6}
 		{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0} = {43091528-9509-43CB-A003-9C5C11E96DD6}
+		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F} = {43091528-9509-43CB-A003-9C5C11E96DD6}
 	EndGlobalSection
 	GlobalSection(ExtensibilityGlobals) = postSolution
 		SolutionGuid = {7CA41ED3-2CED-40CC-AA21-28C3B42B1E86}

demo/Directory.Build.props

@@ -1,6 +1,6 @@
 <Project>
   <PropertyGroup>
     <Nullable>enable</Nullable>
-    <AvaloniaVersion>11.0.0-preview4</AvaloniaVersion>
+    <AvaloniaVersion>11.0.0-preview7</AvaloniaVersion>
   </PropertyGroup>
 </Project>

demo/Semi.Avalonia.Demo.Android/App.axaml

@@ -0,0 +1,11 @@
+<Application
+    x:Class="Semi.Avalonia.Demo.Android.App"
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:Semi.Avalonia.Demo.Android">
+    <Application.Styles>
+        <StyleInclude Source="avares://Semi.Avalonia/Themes/Index.axaml" />
+        <StyleInclude Source="avares://Semi.Avalonia.DataGrid/Index.axaml" />
+        <StyleInclude Source="avares://Semi.Avalonia.ColorPicker/Index.axaml" />
+    </Application.Styles>
+</Application>

demo/Semi.Avalonia.Demo.Android/App.axaml.cs

@@ -0,0 +1,27 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.ApplicationLifetimes;
+using Avalonia.Markup.Xaml;
+using Semi.Avalonia.Demo.Views;
+
+namespace Semi.Avalonia.Demo.Android;
+
+public partial class App : Application
+{
+    public override void Initialize()
+    {
+        AvaloniaXamlLoader.Load(this);
+    }
+
+    public override void OnFrameworkInitializationCompleted()
+    {
+        if (ApplicationLifetime is ISingleViewApplicationLifetime single)
+        {
+            single.MainView = new MainView()
+            {
+
+            };
+        }
+        base.OnFrameworkInitializationCompleted();
+    }
+}

demo/Semi.Avalonia.Demo.Android/MainActivity.cs

@@ -0,0 +1,12 @@
+using Android.App;
+using Android.Content.PM;
+using Avalonia.Android;
+
+namespace Semi.Avalonia.Demo.Android;
+
+[Activity(Label = "Semi.Avalonia.Demo.Android", Icon = "@drawable/Icon", Theme = "@style/MyTheme.NoActionBar",
+    LaunchMode = LaunchMode.SingleTop, ConfigurationChanges = ConfigChanges.Orientation | ConfigChanges.ScreenSize)]
+public class MainActivity : AvaloniaMainActivity
+{
+    
+}

demo/Semi.Avalonia.Demo.Android/Properties/AndroidManifest.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:installLocation="auto">
+	<uses-permission android:name="android.permission.INTERNET" />
+	<application android:label="Semi.Avalonia" android:icon="@drawable/Icon" />
+</manifest>

demo/Semi.Avalonia.Demo.Android/Resources/drawable/splash_screen.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+
+  <item>
+    <color android:color="@color/splash_background"/>
+  </item>
+
+  <item android:drawable="@drawable/Icon"
+        android:width="120dp"
+        android:height="120dp"
+        android:gravity="center" />
+
+</layer-list>

demo/Semi.Avalonia.Demo.Android/Resources/values/colors.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+  <color name="splash_background">#FFFFFF</color>
+</resources>

demo/Semi.Avalonia.Demo.Android/Resources/values/styles.xml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<resources>
+
+  <style name="MyTheme">
+  </style>
+
+  <style name="MyTheme.NoActionBar" parent="@style/Theme.AppCompat.NoActionBar">
+    <item name="android:windowActionBar">false</item>
+    <item name="android:windowNoTitle">true</item>
+  </style>
+
+  <style name="MyTheme.Splash" parent ="MyTheme.NoActionBar">
+    <item name="android:windowBackground">@drawable/splash_screen</item>
+    <item name="android:windowContentOverlay">@null</item>
+  </style>
+
+</resources>

demo/Semi.Avalonia.Demo.Android/Semi.Avalonia.Demo.Android.csproj

@@ -0,0 +1,25 @@
+<Project Sdk="Microsoft.NET.Sdk">
+    <PropertyGroup>
+        <OutputType>Exe</OutputType>
+        <TargetFramework>net7.0-android</TargetFramework>
+        <SupportedOSPlatformVersion>21</SupportedOSPlatformVersion>
+        <ApplicationId>com.irihitech.Semi.Avalonia</ApplicationId>
+        <ApplicationVersion>1</ApplicationVersion>
+        <ApplicationDisplayVersion>1.0</ApplicationDisplayVersion>
+        <AndroidPackageFormat>apk</AndroidPackageFormat>
+        <AndroidEnableProfiledAot>False</AndroidEnableProfiledAot>
+        <EmbedAssembliesIntoApk>true</EmbedAssembliesIntoApk>
+        <RootNamespace>Semi.Avalonia.Demo.Android</RootNamespace>
+    </PropertyGroup>
+
+    <Import Project="../Directory.Build.props" />
+
+    <ItemGroup>
+      <PackageReference Include="Avalonia.Android" Version="$(AvaloniaVersion)" />
+    </ItemGroup>
+
+    <ItemGroup>
+      <ProjectReference Include="..\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj" />
+    </ItemGroup>
+    
+</Project>

demo/Semi.Avalonia.Demo.Android/SplashActivity.cs

@@ -0,0 +1,22 @@
+using Android.App;
+using Android.Content;
+using Avalonia;
+using Avalonia.Android;
+using Application = Android.App.Application;
+
+namespace Semi.Avalonia.Demo.Android;
+
+[Activity(Theme = "@style/MyTheme.Splash", MainLauncher = true, NoHistory = true)]
+public class SplashActivity: AvaloniaSplashActivity<App>
+{
+    protected override AppBuilder CustomizeAppBuilder(AppBuilder builder)
+    {
+        return base.CustomizeAppBuilder(builder);
+    }
+
+    protected override void OnResume()
+    {
+        base.OnResume();
+        StartActivity(new Intent(Application.Context, typeof(MainActivity)));
+    }
+}

demo/Semi.Avalonia.Demo.Android/Views/MainView.axaml

@@ -0,0 +1,11 @@
+<UserControl
+    x:Class="Semi.Avalonia.Demo.Android.Views.MainView"
+    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"
+    d:DesignHeight="450"
+    d:DesignWidth="800"
+    mc:Ignorable="d">
+    Welcome to Avalonia!
+</UserControl>

demo/Semi.Avalonia.Demo.Android/Views/MainView.axaml.cs

@@ -0,0 +1,18 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Markup.Xaml;
+
+namespace Semi.Avalonia.Demo.Android.Views;
+
+public partial class MainView : UserControl
+{
+    public MainView()
+    {
+        InitializeComponent();
+    }
+
+    private void InitializeComponent()
+    {
+        AvaloniaXamlLoader.Load(this);
+    }
+}

demo/Semi.Avalonia.Demo.Desktop/Semi.Avalonia.Demo.Desktop.csproj

@@ -16,13 +16,13 @@
     </PropertyGroup>
     
     <ItemGroup>
-        <RdXmlFile Include="rd.xml"/>
+        <RdXmlFile Include="rd.xml" />
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Desktop" Version="11.0.0-preview5" />
+        <PackageReference Include="Avalonia.Desktop" Version="$(AvaloniaVersion)" />
         <!--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-preview5" />
+        <PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="$(AvaloniaVersion)" />
     </ItemGroup>
 
     <ItemGroup>

demo/Semi.Avalonia.Demo.Web/Program.cs

@@ -10,7 +10,7 @@ internal partial class Program
 {
     private static void Main(string[] args)
     {
-        BuildAvaloniaApp().SetupBrowserApp("out");
+        BuildAvaloniaApp(); //.SetupBrowserApp("out");
     }
 
     public static AppBuilder BuildAvaloniaApp()

demo/Semi.Avalonia.Demo.Web/Semi.Avalonia.Demo.Web.csproj

@@ -19,8 +19,8 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Browser" Version="11.0.0-preview5" />
-        <PackageReference Include="Avalonia.Themes.Fluent" Version="11.0.0-preview5" />
+        <PackageReference Include="Avalonia.Browser" Version="$(AvaloniaVersion)" />
+        <PackageReference Include="Avalonia.Themes.Fluent" Version="$(AvaloniaVersion)" />
     </ItemGroup>
 
     <ItemGroup>

demo/Semi.Avalonia.Demo/Controls/ColorDetailControl.axaml

@@ -21,8 +21,8 @@
                         HorizontalAlignment="Stretch"
                         Background="{TemplateBinding Background}"
                         CornerRadius="6" />
-                    <Grid ColumnDefinitions="*, Auto" RowDefinitions="*, *, *, *, *, *">
-                        <!--  Row 0-1 ResourceKey  -->
+                    <Grid ColumnDefinitions="*, Auto" RowDefinitions="*, *, *, *, *, *, *">
+                        <!--  Row 0-1-2 ResourceKey  -->
                         <TextBlock
                             Grid.Column="0"
                             Grid.ColumnSpan="2"
@@ -48,23 +48,43 @@
                                 Data="{StaticResource CopyIcon}"
                                 Foreground="{Binding $parent[Button].Foreground}" />
                         </Button>
-
-                        <!--  Row 2-3 HEX  -->
-                        <TextBlock
+                        <SelectableTextBlock
                             Grid.Row="2"
                             Grid.Column="0"
+                            VerticalAlignment="Center"
+                            IsVisible="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ColorResourceKey, Converter={x:Static ObjectConverters.IsNotNull}}"
+                            Text="{TemplateBinding ColorResourceKey}" />
+                        <Button
+                            Grid.Row="2"
+                            Grid.Column="1"
+                            Classes="Tertiary"
+                            Command="{Binding $parent[controls:ColorDetailControl].Copy}"
+                            CommandParameter="{x:Static controls:ColorDetailControl.KEY_ColorResourceKey}"
+                            IsVisible="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ColorResourceKey, Converter={x:Static ObjectConverters.IsNotNull}}"
+                            Theme="{DynamicResource BorderlessButton}">
+                            <PathIcon
+                                Width="12"
+                                Height="12"
+                                Data="{StaticResource CopyIcon}"
+                                Foreground="{Binding $parent[Button].Foreground}" />
+                        </Button>
+
+                        <!--  Row 3-4 HEX  -->
+                        <TextBlock
+                            Grid.Row="3"
+                            Grid.Column="0"
                             Grid.ColumnSpan="2"
                             Margin="4,8,0,0"
                             VerticalAlignment="Center"
                             Classes="Tertiary"
                             Text="ARGB" />
                         <SelectableTextBlock
-                            Grid.Row="3"
+                            Grid.Row="4"
                             Grid.Column="0"
                             VerticalAlignment="Center"
                             Text="{TemplateBinding Hex}" />
                         <Button
-                            Grid.Row="3"
+                            Grid.Row="4"
                             Grid.Column="1"
                             Classes="Tertiary"
                             Command="{Binding $parent[controls:ColorDetailControl].Copy}"
@@ -77,9 +97,9 @@
                                 Foreground="{Binding $parent[Button].Foreground}" />
                         </Button>
 
-                        <!--  Row 4-5 Opacity  -->
+                        <!--  Row 5-6 Opacity  -->
                         <TextBlock
-                            Grid.Row="4"
+                            Grid.Row="5"
                             Grid.Column="0"
                             Grid.ColumnSpan="2"
                             Margin="4,8,0,0"
@@ -87,12 +107,12 @@
                             Classes="Tertiary"
                             Text="Opacity" />
                         <SelectableTextBlock
-                            Grid.Row="5"
+                            Grid.Row="6"
                             Grid.Column="0"
                             VerticalAlignment="Center"
                             Text="{TemplateBinding OpacityNumber}" />
                         <Button
-                            Grid.Row="5"
+                            Grid.Row="6"
                             Grid.Column="1"
                             Classes="Tertiary"
                             Command="{Binding $parent[controls:ColorDetailControl].Copy}"

demo/Semi.Avalonia.Demo/Controls/ColorDetailControl.cs

@@ -1,5 +1,6 @@
 using System.Globalization;
 using Avalonia;
+using Avalonia.Controls;
 using Avalonia.Controls.Primitives;
 using Avalonia.Input.Platform;
 using Avalonia.Media;
@@ -12,6 +13,7 @@ public class ColorDetailControl: TemplatedControl
     public const string KEY_ResourceKey = "ResourceKey";
     public const string KEY_Hex = "Hex";
     public const string KEY_Opacity = "Opacity";
+    public const string KEY_ColorResourceKey = "ColorResourceKey";
     
     public static readonly StyledProperty<string?> ResourceKeyProperty = AvaloniaProperty.Register<ColorDetailControl, string?>(
         nameof(ResourceKey));
@@ -30,6 +32,15 @@ public class ColorDetailControl: TemplatedControl
         set => SetValue(ResourceNameProperty, value);
     }
 
+    public static readonly StyledProperty<string?> ColorResourceKeyProperty = AvaloniaProperty.Register<ColorDetailControl, string?>(
+        nameof(ColorResourceKey));
+
+    public string? ColorResourceKey
+    {
+        get => GetValue(ColorResourceKeyProperty);
+        set => SetValue(ColorResourceKeyProperty, value);
+    }
+
     public static readonly DirectProperty<ColorDetailControl, string?> HexProperty = AvaloniaProperty.RegisterDirect<ColorDetailControl, string?>(
         nameof(Hex), o => o.Hex);
     private string? _hex;
@@ -49,6 +60,8 @@ public class ColorDetailControl: TemplatedControl
     }
     
     
+    
+    
     static ColorDetailControl()
     {
         BackgroundProperty.Changed.AddClassHandler<ColorDetailControl>((o, e) => o.OnBackgroundChanged(e));
@@ -77,15 +90,18 @@ public class ColorDetailControl: TemplatedControl
                     break;
                 case KEY_Opacity: text = OpacityNumber;
                     break;
+                case KEY_ColorResourceKey: text = ColorResourceKey;
+                    break;
                 default: text = string.Empty; break;
             }
         }
 
-        if (Application.Current is { Clipboard: { } c })
+        var toplevel = TopLevel.GetTopLevel(this);
+        if (toplevel?.Clipboard is { } c)
         {
             await c.SetTextAsync(text??string.Empty);
         }
-        
+
     }
     
 }

demo/Semi.Avalonia.Demo/Controls/FunctionalColorGroupControl.axaml

@@ -19,7 +19,7 @@
                         Theme="{DynamicResource TitleTextBlock}" />
                     <TabControl Grid.Row="1">
                         <TabItem Header="Light">
-                            <DataGrid IsReadOnly="True" Items="{TemplateBinding LightColors}">
+                            <DataGrid IsReadOnly="True" ItemsSource="{TemplateBinding LightColors}">
                                 <DataGrid.Columns>
                                     <DataGridTemplateColumn Width="70" Header="Color">
                                         <DataGridTemplateColumn.CellTemplate>
@@ -77,7 +77,7 @@
                             </DataGrid>
                         </TabItem>
                         <TabItem Header="Dark">
-                            <DataGrid IsReadOnly="True" Items="{TemplateBinding DarkColors}">
+                            <DataGrid IsReadOnly="True" ItemsSource="{TemplateBinding DarkColors}">
                                 <DataGrid.Columns>
                                     <DataGridTemplateColumn Width="70" Header="Color">
                                         <DataGridTemplateColumn.CellTemplate>

demo/Semi.Avalonia.Demo/Controls/FunctionalColorGroupControl.cs

@@ -14,19 +14,19 @@ public class FunctionalColorGroupControl: TemplatedControl
         set => SetValue(TitleProperty, value);
     }
     
-    public static readonly DirectProperty<FunctionalColorGroupControl, IEnumerable> LightColorsProperty = AvaloniaProperty.RegisterDirect<FunctionalColorGroupControl, IEnumerable>(
+    public static readonly DirectProperty<FunctionalColorGroupControl, IEnumerable?> LightColorsProperty = AvaloniaProperty.RegisterDirect<FunctionalColorGroupControl, IEnumerable?>(
         nameof(LightColors), o => o.LightColors, (o, v) => o.LightColors = v);
-    private IEnumerable _lightColors;
-    public IEnumerable LightColors
+    private IEnumerable? _lightColors;
+    public IEnumerable? LightColors
     {
         get => _lightColors;
         set => SetAndRaise(LightColorsProperty, ref _lightColors, value);
     }
     
-    public static readonly DirectProperty<FunctionalColorGroupControl, IEnumerable> DarkColorsProperty = AvaloniaProperty.RegisterDirect<FunctionalColorGroupControl, IEnumerable>(
+    public static readonly DirectProperty<FunctionalColorGroupControl, IEnumerable?> DarkColorsProperty = AvaloniaProperty.RegisterDirect<FunctionalColorGroupControl, IEnumerable?>(
         nameof(DarkColors), o => o.DarkColors, (o, v) => o.DarkColors = v);
-    private IEnumerable _darkColors;
-    public IEnumerable DarkColors
+    private IEnumerable? _darkColors;
+    public IEnumerable? DarkColors
     {
         get => _darkColors;
         set => SetAndRaise(DarkColorsProperty, ref _darkColors, value);

demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml

@@ -20,7 +20,7 @@
             </Style>
         </StackPanel.Styles>
         <AutoCompleteBox
-            Items="{Binding States}"
+            ItemsSource="{Binding States}"
             ValueMemberBinding="{Binding Name}"
             Watermark="Please select a State">
             <AutoCompleteBox.ItemTemplate>
@@ -31,7 +31,7 @@
         </AutoCompleteBox>
         <AutoCompleteBox
             Classes="Large"
-            Items="{Binding States}"
+            ItemsSource="{Binding States}"
             ValueMemberBinding="{ReflectionBinding Name}">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
@@ -41,7 +41,7 @@
         </AutoCompleteBox>
         <AutoCompleteBox
             Classes="Small"
-            Items="{Binding States}"
+            ItemsSource="{Binding States}"
             ValueMemberBinding="{ReflectionBinding Name}">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
@@ -51,7 +51,7 @@
         </AutoCompleteBox>
         <AutoCompleteBox
             Classes="Bordered"
-            Items="{Binding States}"
+            ItemsSource="{Binding States}"
             ValueMemberBinding="{ReflectionBinding Name}">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
@@ -61,7 +61,7 @@
         </AutoCompleteBox>
         <AutoCompleteBox
             IsEnabled="False"
-            Items="{Binding States}"
+            ItemsSource="{Binding States}"
             ValueMemberBinding="{ReflectionBinding Name}"
             Watermark="Disabled">
             <AutoCompleteBox.ItemTemplate>

demo/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml

@@ -45,7 +45,7 @@
                 Danger
             </Button>
         </StackPanel>
-        <TextBlock>DropdownButton</TextBlock>
+        <TextBlock>DropDownButton</TextBlock>
         <StackPanel Orientation="Horizontal" Spacing="8">
             <DropDownButton Content="Submit">
                 <DropDownButton.Flyout>
@@ -55,7 +55,7 @@
                     </MenuFlyout>
                 </DropDownButton.Flyout>
             </DropDownButton>
-            <DropDownButton Content="Submit" Theme="{DynamicResource SolidDropdownButton}">
+            <DropDownButton Content="Submit" Theme="{DynamicResource SolidDropDownButton}">
                 <DropDownButton.Flyout>
                     <MenuFlyout Placement="BottomEdgeAlignedRight">
                         <MenuItem Header="Submit All" />
@@ -63,7 +63,7 @@
                     </MenuFlyout>
                 </DropDownButton.Flyout>
             </DropDownButton>
-            <DropDownButton Content="Submit" Theme="{DynamicResource BorderlessDropdownButton}">
+            <DropDownButton Content="Submit" Theme="{DynamicResource BorderlessDropDownButton}">
                 <DropDownButton.Flyout>
                     <MenuFlyout Placement="BottomEdgeAlignedRight">
                         <MenuItem Header="Submit All" />

demo/Semi.Avalonia.Demo/Pages/CarouselDemo.axaml

@@ -14,6 +14,7 @@
         <Style Selector="TextBlock">
             <Setter Property="HorizontalAlignment" Value="Center" />
             <Setter Property="VerticalAlignment" Value="Center" />
+            <Setter Property="Foreground" Value="#1C1F23" />
         </Style>
     </UserControl.Styles>
     <StackPanel Spacing="20">

demo/Semi.Avalonia.Demo/Pages/CheckBoxDemo.axaml

@@ -8,21 +8,26 @@
     d:DesignWidth="800"
     mc:Ignorable="d">
     <ScrollViewer HorizontalScrollBarVisibility="Auto">
-        <StackPanel HorizontalAlignment="Left">
-            <CheckBox>Unchecked</CheckBox>
-            <CheckBox IsEnabled="False">Unchecked</CheckBox>
-            <CheckBox IsChecked="True">Checked</CheckBox>
-            <CheckBox IsChecked="True" IsEnabled="False">Checked</CheckBox>
-            <CheckBox IsChecked="{x:Null}" IsThreeState="True">Indeterminate</CheckBox>
-            <CheckBox
-                IsChecked="{x:Null}"
-                IsEnabled="False"
-                IsThreeState="True">
-                Indeterminate
-            </CheckBox>
+        <StackPanel HorizontalAlignment="Left" Spacing="20">
+            <TextBlock Text="CheckBox" />
+            <StackPanel Orientation="Horizontal">
+                <CheckBox>Unchecked</CheckBox>
+                <CheckBox IsChecked="True">Checked</CheckBox>
+                <CheckBox IsChecked="{x:Null}" IsThreeState="True">Indeterminate</CheckBox>
+            </StackPanel>
+            <StackPanel Orientation="Horizontal">
+                <CheckBox IsEnabled="False">Unchecked</CheckBox>
+                <CheckBox IsChecked="True" IsEnabled="False">Checked</CheckBox>
+                <CheckBox
+                    IsChecked="{x:Null}"
+                    IsEnabled="False"
+                    IsThreeState="True">
+                    Indeterminate
+                </CheckBox>
+            </StackPanel>
             <CheckBox Width="120" HorizontalAlignment="Left">Checkbox should wrap its text</CheckBox>
             <TextBlock Margin="0,16" Text="CardCheckBox" />
-            <StackPanel Orientation="Vertical">
+            <StackPanel Orientation="Horizontal">
                 <CheckBox Width="300" Theme="{DynamicResource CardCheckBox}">
                     <StackPanel>
                         <TextBlock FontWeight="Bold">复选框标题</TextBlock>
@@ -38,6 +43,18 @@
                         <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
                     </StackPanel>
                 </CheckBox>
+                <CheckBox
+                    Width="300"
+                    IsChecked="{x:Null}"
+                    IsThreeState="True"
+                    Theme="{DynamicResource CardCheckBox}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">复选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </CheckBox>
+            </StackPanel>
+            <StackPanel Orientation="Horizontal">
                 <CheckBox
                     Width="300"
                     IsEnabled="False"
@@ -57,17 +74,6 @@
                         <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
                     </StackPanel>
                 </CheckBox>
-                <CheckBox
-                    Width="300"
-                    IsChecked="{x:Null}"
-                    IsEnabled="True"
-                    IsThreeState="True"
-                    Theme="{DynamicResource CardCheckBox}">
-                    <StackPanel>
-                        <TextBlock FontWeight="Bold">复选框标题</TextBlock>
-                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                    </StackPanel>
-                </CheckBox>
                 <CheckBox
                     Width="300"
                     IsChecked="{x:Null}"
@@ -81,7 +87,7 @@
                 </CheckBox>
             </StackPanel>
             <TextBlock Margin="0,16" Text="PureCardCheckBox" />
-            <StackPanel Orientation="Vertical">
+            <StackPanel Orientation="Horizontal">
                 <CheckBox Width="300" Theme="{DynamicResource PureCardCheckBox}">
                     <StackPanel>
                         <TextBlock FontWeight="Bold">复选框标题</TextBlock>
@@ -97,6 +103,19 @@
                         <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
                     </StackPanel>
                 </CheckBox>
+                <CheckBox
+                    Width="300"
+                    IsChecked="{x:Null}"
+                    IsEnabled="True"
+                    IsThreeState="True"
+                    Theme="{DynamicResource PureCardCheckBox}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">复选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </CheckBox>
+            </StackPanel>
+            <StackPanel Orientation="Horizontal">
                 <CheckBox
                     Width="300"
                     IsEnabled="False"
@@ -116,17 +135,6 @@
                         <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
                     </StackPanel>
                 </CheckBox>
-                <CheckBox
-                    Width="300"
-                    IsChecked="{x:Null}"
-                    IsEnabled="True"
-                    IsThreeState="True"
-                    Theme="{DynamicResource PureCardCheckBox}">
-                    <StackPanel>
-                        <TextBlock FontWeight="Bold">复选框标题</TextBlock>
-                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                    </StackPanel>
-                </CheckBox>
                 <CheckBox
                     Width="300"
                     IsChecked="{x:Null}"
@@ -141,4 +149,4 @@
             </StackPanel>
         </StackPanel>
     </ScrollViewer>
-</UserControl>
+</UserControl>

demo/Semi.Avalonia.Demo/Pages/ColorPickerDemo.axaml

@@ -2,6 +2,7 @@
     x:Class="Semi.Avalonia.Demo.Pages.ColorPickerDemo"
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:colorPicker="clr-namespace:Semi.Avalonia.ColorPicker;assembly=Semi.Avalonia.ColorPicker"
     xmlns:controls="using:Avalonia.Controls"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
@@ -15,11 +16,7 @@
             Spacing="20">
             <ColorView ColorSpectrumShape="Ring" />
             <ColorView ColorSpectrumShape="Box" />
-            <ColorView>
-                <ColorView.Palette>
-                    <controls:MaterialColorPalette />
-                </ColorView.Palette>
-            </ColorView>
+            <ColorView Palette="{DynamicResource SemiColorPalette}" />
         </StackPanel>
         <StackPanel HorizontalAlignment="Left" Orientation="Horizontal">
             <ColorPicker ColorSpectrumShape="Ring">
@@ -29,7 +26,7 @@
             </ColorPicker>
             <ColorPicker ColorSpectrumShape="Box">
                 <ColorPicker.Palette>
-                    <controls:MaterialColorPalette />
+                    <colorPicker:SemiColorLightPalette />
                 </ColorPicker.Palette>
             </ColorPicker>
         </StackPanel>

demo/Semi.Avalonia.Demo/Pages/DataGridDemo.axaml

@@ -143,7 +143,7 @@
                     Name="dataGridEdit"
                     Grid.Row="1"
                     Margin="12"
-                    Items="{Binding DataGrid3Source}">
+                    ItemsSource="{Binding DataGrid3Source}">
                     <DataGrid.Columns>
                         <DataGridTextColumn
                             Width="2*"

demo/Semi.Avalonia.Demo/Pages/DataGridDemo.axaml.cs

@@ -38,7 +38,7 @@ public partial class DataGridDemo : UserControl
                 collectionView1.SortDescriptions.Add(dataGridSortDescription);
             }
         };
-        dg1.Items = collectionView1;
+        dg1.ItemsSource = collectionView1;
 
         var dg2 = this.Get<DataGrid>("dataGridGrouping");
         dg2.IsReadOnly = true;
@@ -46,7 +46,7 @@ public partial class DataGridDemo : UserControl
         var collectionView2 = new DataGridCollectionView(Countries.All);
         collectionView2.GroupDescriptions.Add(new DataGridPathGroupDescription("Region"));
 
-        dg2.Items = collectionView2;
+        dg2.ItemsSource = collectionView2;
 
         var dg3 = this.Get<DataGrid>("dataGridEdit");
         dg3.IsReadOnly = false;

demo/Semi.Avalonia.Demo/Pages/ExpanderDemo.axaml

@@ -19,7 +19,7 @@
                 <Button Content="Hello Avalonia World!" />
             </Expander>
         </StackPanel>
-        <Grid ColumnDefinitions="* *">
+        <Grid ColumnDefinitions="*, *">
             <Expander
                 Height="200"
                 ExpandDirection="Right"

demo/Semi.Avalonia.Demo/Pages/FlyoutDemo.axaml

@@ -15,8 +15,8 @@
     <Grid
         HorizontalAlignment="Center"
         VerticalAlignment="Center"
-        ColumnDefinitions="* * * * *"
-        RowDefinitions="* * * * *">
+        ColumnDefinitions="*, *, *, *, *"
+        RowDefinitions="*, *, *, *, *">
         <Button
             Grid.Row="0"
             Grid.Column="1"

demo/Semi.Avalonia.Demo/Pages/NumericUpDownDemo.axaml

@@ -27,5 +27,15 @@
             Maximum="100"
             Minimum="0"
             ShowButtonSpinner="False" />
+        <NumericUpDown
+            Width="200"
+            Classes="Large"
+            Maximum="100"
+            Minimum="0" />
+        <NumericUpDown
+            Width="200"
+            Classes="Small"
+            Maximum="100"
+            Minimum="0" />
     </StackPanel>
 </UserControl>

demo/Semi.Avalonia.Demo/Pages/Overview.axaml

@@ -47,27 +47,101 @@
                         <RadioButton Theme="{StaticResource ButtonRadioButton}">选项 2</RadioButton>
                     </StackPanel>
                 </Border>
-                <RadioButton Margin="4" Theme="{StaticResource CardRadioButton}">
-                    <StackPanel>
-                        <TextBlock FontWeight="Bold">Option 1</TextBlock>
-                        <TextBlock Classes="Tertiary">Description 1</TextBlock>
-                    </StackPanel>
-                </RadioButton>
-                <RadioButton
-                    Margin="4"
-                    IsChecked="True"
-                    Theme="{StaticResource CardRadioButton}">
-                    <StackPanel>
-                        <TextBlock FontWeight="Bold">Option 2</TextBlock>
-                        <TextBlock Classes="Tertiary">Description 2</TextBlock>
-                    </StackPanel>
-                </RadioButton>
+                <StackPanel Orientation="Horizontal">
+                    <RadioButton Margin="4" Theme="{StaticResource CardRadioButton}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 1</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 1</TextBlock>
+                        </StackPanel>
+                    </RadioButton>
+                    <RadioButton
+                        Margin="4"
+                        IsChecked="True"
+                        Theme="{StaticResource CardRadioButton}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 2</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 2</TextBlock>
+                        </StackPanel>
+                    </RadioButton>
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <RadioButton Margin="4" Theme="{StaticResource PureCardRadioButton}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 1</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 1</TextBlock>
+                        </StackPanel>
+                    </RadioButton>
+                    <RadioButton
+                        Margin="4"
+                        IsChecked="True"
+                        Theme="{StaticResource PureCardRadioButton}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 2</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 2</TextBlock>
+                        </StackPanel>
+                    </RadioButton>
+                </StackPanel>
             </StackPanel>
-            <StackPanel Orientation="Horizontal" />
             <StackPanel Orientation="Horizontal">
-                <CheckBox Margin="0,0,8,0">Avalonia</CheckBox>
-                <CheckBox Margin="0,0,8,0" IsChecked="True">WPF</CheckBox>
-                <CheckBox IsChecked="{x:Null}" IsThreeState="True">UWP</CheckBox>
+                <StackPanel Orientation="Horizontal">
+                    <CheckBox Margin="0,0,8,0">Avalonia</CheckBox>
+                    <CheckBox Margin="0,0,8,0" IsChecked="True">WPF</CheckBox>
+                    <CheckBox IsChecked="{x:Null}" IsThreeState="True">UWP</CheckBox>
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <CheckBox Margin="4" Theme="{StaticResource CardCheckBox}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 1</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 1</TextBlock>
+                        </StackPanel>
+                    </CheckBox>
+                    <CheckBox
+                        Margin="4"
+                        IsChecked="True"
+                        Theme="{StaticResource CardCheckBox}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 2</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 2</TextBlock>
+                        </StackPanel>
+                    </CheckBox>
+                    <CheckBox
+                        Margin="4"
+                        IsChecked="{x:Null}"
+                        IsThreeState="True"
+                        Theme="{StaticResource CardCheckBox}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 3</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 3</TextBlock>
+                        </StackPanel>
+                    </CheckBox>
+                </StackPanel>
+                <StackPanel Orientation="Horizontal">
+                    <CheckBox Margin="4" Theme="{StaticResource PureCardCheckBox}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 1</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 1</TextBlock>
+                        </StackPanel>
+                    </CheckBox>
+                    <CheckBox
+                        Margin="4"
+                        IsChecked="True"
+                        Theme="{StaticResource PureCardCheckBox}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 2</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 2</TextBlock>
+                        </StackPanel>
+                    </CheckBox>
+                    <CheckBox
+                        Margin="4"
+                        IsChecked="{x:Null}"
+                        IsThreeState="True"
+                        Theme="{StaticResource PureCardCheckBox}">
+                        <StackPanel>
+                            <TextBlock FontWeight="Bold">Option 3</TextBlock>
+                            <TextBlock Classes="Tertiary">Description 3</TextBlock>
+                        </StackPanel>
+                    </CheckBox>
+                </StackPanel>
             </StackPanel>
             <StackPanel Orientation="Horizontal">
                 <ToggleSwitch
@@ -96,7 +170,7 @@
                 </TabItem>
             </TabControl>
             <StackPanel Orientation="Horizontal" Spacing="20">
-                <ComboBox Width="200" PlaceholderText="Please Select" >
+                <ComboBox Width="200" PlaceholderText="Please Select">
                     <ComboBoxItem>Item 1</ComboBoxItem>
                     <ComboBoxItem>Item 2</ComboBoxItem>
                     <ComboBoxItem>Item 3</ComboBoxItem>
@@ -105,7 +179,7 @@
                 <TimePicker />
                 <CalendarDatePicker />
             </StackPanel>
-            <Grid ColumnDefinitions="* * *">
+            <Grid ColumnDefinitions="*, *, *">
                 <Border Theme="{StaticResource CardBorder}">
                     <TextBlock>Card</TextBlock>
                 </Border>
@@ -157,4 +231,4 @@
             </StackPanel>
         </StackPanel>
     </ScrollViewer>
-</UserControl>
+</UserControl>

demo/Semi.Avalonia.Demo/Pages/PaletteDemo.axaml

@@ -46,6 +46,7 @@
                             TextWrapping="Wrap" />
                         <controls:ColorDetailControl
                             Background="{Binding SelectedColor.Brush}"
+                            ColorResourceKey="{Binding SelectedColor.ColorResourceKey}"
                             IsVisible="{Binding SelectedColor, Converter={x:Static ObjectConverters.IsNotNull}}"
                             ResourceKey="{Binding SelectedColor.ResourceKey}"
                             ResourceName="{Binding SelectedColor.ColorDisplayName}" />
@@ -62,7 +63,7 @@
                         Theme="{DynamicResource TitleTextBlock}" />
                     <TabControl>
                         <TabItem Header="Light">
-                            <ItemsControl Margin="16" Items="{Binding LightLists}">
+                            <ItemsControl Margin="16" ItemsSource="{Binding LightLists}">
                                 <ItemsControl.ItemsPanel>
                                     <ItemsPanelTemplate>
                                         <WrapPanel Orientation="Horizontal" />
@@ -70,7 +71,7 @@
                                 </ItemsControl.ItemsPanel>
                                 <ItemsControl.ItemTemplate>
                                     <DataTemplate x:DataType="viewModels:ColorListViewModel">
-                                        <ItemsControl Margin="4,0" Items="{Binding Color}">
+                                        <ItemsControl Margin="4,0" ItemsSource="{Binding Color}">
                                             <ItemsControl.ItemTemplate>
                                                 <DataTemplate x:DataType="viewModels:ColorItemViewModel">
                                                     <controls:ColorItemControl
@@ -86,7 +87,7 @@
                             </ItemsControl>
                         </TabItem>
                         <TabItem Header="Dark">
-                            <ItemsControl Margin="16" Items="{Binding DarkLists}">
+                            <ItemsControl Margin="16" ItemsSource="{Binding DarkLists}">
                                 <ItemsControl.ItemsPanel>
                                     <ItemsPanelTemplate>
                                         <WrapPanel Orientation="Horizontal" />
@@ -94,7 +95,7 @@
                                 </ItemsControl.ItemsPanel>
                                 <ItemsControl.ItemTemplate>
                                     <DataTemplate x:DataType="viewModels:ColorListViewModel">
-                                        <ItemsControl Margin="4,0" Items="{Binding Color}">
+                                        <ItemsControl Margin="4,0" ItemsSource="{Binding Color}">
                                             <ItemsControl.ItemTemplate>
                                                 <DataTemplate x:DataType="viewModels:ColorItemViewModel">
                                                     <controls:ColorItemControl
@@ -111,7 +112,7 @@
                         </TabItem>
                     </TabControl>
 
-                    <ItemsControl Items="{Binding FunctionalColors}">
+                    <ItemsControl ItemsSource="{Binding FunctionalColors}">
                         <ItemsControl.ItemTemplate>
                             <DataTemplate>
                                 <!--    -->

demo/Semi.Avalonia.Demo/Pages/RadioButtonDemo.axaml

@@ -5,73 +5,163 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     mc:Ignorable="d">
-    <StackPanel HorizontalAlignment="Left" Spacing="20">
-        <TextBlock Text="Radio Buttons" />
-        <StackPanel>
-            <RadioButton>111</RadioButton>
-            <RadioButton>222</RadioButton>
-            <RadioButton>333</RadioButton>
-        </StackPanel>
-        <TextBlock Text="Radio Button as Button" />
-        <Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+    <ScrollViewer>
+        <StackPanel HorizontalAlignment="Left" Spacing="20">
+            <TextBlock Text="Radio Buttons" />
             <StackPanel Orientation="Horizontal">
-                <RadioButton Classes="Small" Theme="{DynamicResource ButtonRadioButton}">小1</RadioButton>
-                <RadioButton Classes="Small" Theme="{DynamicResource ButtonRadioButton}">小2</RadioButton>
+                <RadioButton>Unchecked</RadioButton>
+                <RadioButton IsChecked="True">Checked</RadioButton>
             </StackPanel>
-        </Border>
-        <Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
             <StackPanel Orientation="Horizontal">
-                <RadioButton Theme="{DynamicResource ButtonRadioButton}">默认1</RadioButton>
-                <RadioButton Theme="{DynamicResource ButtonRadioButton}">默认2</RadioButton>
+                <RadioButton IsEnabled="False">Unchecked</RadioButton>
+                <RadioButton IsChecked="True" IsEnabled="False">Checked</RadioButton>
             </StackPanel>
-        </Border>
-        <Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+            <TextBlock Text="Radio Button as Button" />
             <StackPanel Orientation="Horizontal">
-                <RadioButton Classes="Large" Theme="{DynamicResource ButtonRadioButton}">大1</RadioButton>
-                <RadioButton Classes="Large" Theme="{DynamicResource ButtonRadioButton}">大2</RadioButton>
+                <Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+                    <StackPanel Orientation="Horizontal">
+                        <RadioButton Classes="Small" Theme="{DynamicResource ButtonRadioButton}">小1</RadioButton>
+                        <RadioButton
+                            Classes="Small"
+                            Theme="{DynamicResource ButtonRadioButton}"
+                            IsChecked="True">
+                            小2
+                        </RadioButton>
+                    </StackPanel>
+                </Border>
+                <Border Margin="8 0" HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+                    <StackPanel Orientation="Horizontal">
+                        <RadioButton
+                            Classes="Small"
+                            Theme="{DynamicResource ButtonRadioButton}"
+                            IsEnabled="False">
+                            小1
+                        </RadioButton>
+                        <RadioButton
+                            Classes="Small"
+                            Theme="{DynamicResource ButtonRadioButton}"
+                            IsChecked="True"
+                            IsEnabled="False">
+                            小2
+                        </RadioButton>
+                    </StackPanel>
+                </Border>
+            </StackPanel>
+            <StackPanel Orientation="Horizontal">
+                <Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+                    <StackPanel Orientation="Horizontal">
+                        <RadioButton Theme="{DynamicResource ButtonRadioButton}">默认1</RadioButton>
+                        <RadioButton Theme="{DynamicResource ButtonRadioButton}" IsChecked="True">默认2</RadioButton>
+                    </StackPanel>
+                </Border>
+                <Border Margin="8 0" HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+                    <StackPanel Orientation="Horizontal">
+                        <RadioButton Theme="{DynamicResource ButtonRadioButton}" IsEnabled="False">默认1</RadioButton>
+                        <RadioButton
+                            Theme="{DynamicResource ButtonRadioButton}"
+                            IsEnabled="False"
+                            IsChecked="True">
+                            默认2
+                        </RadioButton>
+                    </StackPanel>
+                </Border>
+            </StackPanel>
+            <StackPanel Orientation="Horizontal">
+                <Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+                    <StackPanel Orientation="Horizontal">
+                        <RadioButton Classes="Large" Theme="{DynamicResource ButtonRadioButton}">大1</RadioButton>
+                        <RadioButton
+                            Classes="Large"
+                            Theme="{DynamicResource ButtonRadioButton}"
+                            IsChecked="True">
+                            大2
+                        </RadioButton>
+                    </StackPanel>
+                </Border>
+                <Border Margin="8 0" HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
+                    <StackPanel Orientation="Horizontal">
+                        <RadioButton
+                            Classes="Large"
+                            Theme="{DynamicResource ButtonRadioButton}"
+                            IsEnabled="False">
+                            大1
+                        </RadioButton>
+                        <RadioButton
+                            Classes="Large"
+                            Theme="{DynamicResource ButtonRadioButton}"
+                            IsChecked="True"
+                            IsEnabled="False">
+                            大2
+                        </RadioButton>
+                    </StackPanel>
+                </Border>
+            </StackPanel>
+            <TextBlock Text="Radio Button as Card" />
+            <StackPanel Orientation="Horizontal">
+                <RadioButton Width="300" Theme="{DynamicResource CardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
+                <RadioButton IsChecked="True" Width="300" Theme="{DynamicResource CardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
+            </StackPanel>
+            <StackPanel Orientation="Horizontal">
+                <RadioButton IsEnabled="False" Width="300" Theme="{DynamicResource CardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
+                <RadioButton 
+                    IsChecked="True"
+                    IsEnabled="False"
+                    Width="300"
+                    Theme="{DynamicResource CardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
+            </StackPanel>
+            <TextBlock Text="Radio Button as Pure Card" />
+            <StackPanel Orientation="Horizontal">
+                <RadioButton Width="300" Theme="{DynamicResource PureCardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
+                <RadioButton IsChecked="True" Width="300" Theme="{DynamicResource PureCardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
+            </StackPanel>
+            <StackPanel Orientation="Horizontal">
+                <RadioButton IsEnabled="False" Width="300" Theme="{DynamicResource PureCardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
+                <RadioButton
+                    IsChecked="True"
+                    IsEnabled="False"
+                    Width="300"
+                    Theme="{DynamicResource PureCardRadioButton}">
+                    <StackPanel>
+                        <TextBlock FontWeight="Bold">单选框标题</TextBlock>
+                        <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
+                    </StackPanel>
+                </RadioButton>
             </StackPanel>
-        </Border>
-        <TextBlock Text="Radio Button as Card" />
-        <StackPanel Orientation="Horizontal">
-            <RadioButton Width="300" Theme="{DynamicResource CardRadioButton}">
-                <StackPanel>
-                    <TextBlock FontWeight="Bold">单选框标题</TextBlock>
-                    <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                </StackPanel>
-            </RadioButton>
-            <RadioButton Width="300" Theme="{DynamicResource CardRadioButton}">
-                <StackPanel>
-                    <TextBlock FontWeight="Bold">单选框标题</TextBlock>
-                    <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                </StackPanel>
-            </RadioButton>
-            <RadioButton Width="300" Theme="{DynamicResource CardRadioButton}">
-                <StackPanel>
-                    <TextBlock FontWeight="Bold">单选框标题</TextBlock>
-                    <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                </StackPanel>
-            </RadioButton>
         </StackPanel>
-        <TextBlock Text="Radio Button as Pure Card" />
-        <StackPanel Orientation="Horizontal">
-            <RadioButton Width="300" Theme="{DynamicResource PureCardRadioButton}">
-                <StackPanel>
-                    <TextBlock FontWeight="Bold">单选框标题</TextBlock>
-                    <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                </StackPanel>
-            </RadioButton>
-            <RadioButton Width="300" Theme="{DynamicResource PureCardRadioButton}">
-                <StackPanel>
-                    <TextBlock FontWeight="Bold">单选框标题</TextBlock>
-                    <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                </StackPanel>
-            </RadioButton>
-            <RadioButton Width="300" Theme="{DynamicResource PureCardRadioButton}">
-                <StackPanel>
-                    <TextBlock FontWeight="Bold">单选框标题</TextBlock>
-                    <TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
-                </StackPanel>
-            </RadioButton>
-        </StackPanel>
-    </StackPanel>
-</UserControl>
+    </ScrollViewer>
+</UserControl>

demo/Semi.Avalonia.Demo/Pages/ThemeVariantDemo.axaml.cs

@@ -8,7 +8,6 @@ namespace Semi.Avalonia.Demo.Pages;
 
 public partial class ThemeVariantDemo : UserControl
 {
-    private ThemeVariant _variant = ThemeVariant.Default;
     public ThemeVariantDemo()
     {
         InitializeComponent();
@@ -16,15 +15,6 @@ public partial class ThemeVariantDemo : UserControl
 
     private void Switch_OnIsCheckedChanged(object sender, RoutedEventArgs e)
     {
-        if (_variant == ThemeVariant.Dark)
-        {
-            scope.RequestedThemeVariant = ThemeVariant.Default;
-            _variant = ThemeVariant.Default;
-        }
-        else
-        {
-            scope.RequestedThemeVariant = ThemeVariant.Dark;
-            _variant = ThemeVariant.Dark;
-        }
+        scope.RequestedThemeVariant = scope.ActualThemeVariant == ThemeVariant.Dark ? ThemeVariant.Light : ThemeVariant.Dark;
     }
 }

demo/Semi.Avalonia.Demo/Pages/ToggleButtonDemo.axaml

@@ -7,23 +7,36 @@
     d:DesignHeight="450"
     d:DesignWidth="800"
     mc:Ignorable="d">
-    <StackPanel>
-        <TextBlock Text="Toggle Button" />
+    <StackPanel Spacing="20">
+        <TextBlock Text="Toggle Button (Default)" />
         <StackPanel Orientation="Horizontal" Spacing="20">
-            <ToggleButton>Primary</ToggleButton>
+            <ToggleButton>Default</ToggleButton>
+            <ToggleButton Classes="Primary">Primary</ToggleButton>
             <ToggleButton Classes="Secondary">Secondary</ToggleButton>
             <ToggleButton Classes="Tertiary">Tertiary</ToggleButton>
             <ToggleButton Classes="Warning">Warning</ToggleButton>
-            <ToggleButton Classes="Error">Error</ToggleButton>
+            <ToggleButton Classes="Danger">Danger</ToggleButton>
+            <ToggleButton Classes="Danger" IsEnabled="False">Danger</ToggleButton>
         </StackPanel>
-
-        <TextBlock Margin="0,20,0,0" Text="Toggle Button Three State" />
+        <TextBlock Text="Toggle Button Checked State" />
         <StackPanel Orientation="Horizontal" Spacing="20">
-            <ToggleButton Name="button" IsThreeState="True">Primary</ToggleButton>
-            <ToggleButton Classes="Secondary" IsThreeState="True">Secondary</ToggleButton>
-            <ToggleButton Classes="Tertiary" IsThreeState="True">Tertiary</ToggleButton>
-            <ToggleButton Classes="Warning" IsThreeState="True">Warning</ToggleButton>
-            <ToggleButton Classes="Error" IsThreeState="True">Error</ToggleButton>
+            <ToggleButton IsChecked="True">Default</ToggleButton>
+            <ToggleButton Classes="Primary" IsChecked="True">Primary</ToggleButton>
+            <ToggleButton Classes="Secondary" IsChecked="True">Secondary</ToggleButton>
+            <ToggleButton Classes="Tertiary" IsChecked="True">Tertiary</ToggleButton>
+            <ToggleButton Classes="Warning" IsChecked="True">Warning</ToggleButton>
+            <ToggleButton Classes="Danger" IsChecked="True">Danger</ToggleButton>
+            <ToggleButton Classes="Danger" IsChecked="True" IsEnabled="False">Danger</ToggleButton>
+        </StackPanel>
+        <TextBlock Text="Toggle Button Three State" />
+        <StackPanel Orientation="Horizontal" Spacing="20">
+            <ToggleButton IsThreeState="True" IsChecked="{x:Null}">Default</ToggleButton>
+            <ToggleButton Classes="Primary" IsThreeState="True" IsChecked="{x:Null}">Primary</ToggleButton>
+            <ToggleButton Classes="Secondary" IsThreeState="True" IsChecked="{x:Null}">Secondary</ToggleButton>
+            <ToggleButton Classes="Tertiary" IsThreeState="True" IsChecked="{x:Null}">Tertiary</ToggleButton>
+            <ToggleButton Classes="Warning" IsThreeState="True" IsChecked="{x:Null}">Warning</ToggleButton>
+            <ToggleButton Classes="Danger" IsThreeState="True" IsChecked="{x:Null}">Danger</ToggleButton>
+            <ToggleButton Classes="Danger" IsThreeState="True" IsChecked="{x:Null}" IsEnabled="False">Danger</ToggleButton>
         </StackPanel>
     </StackPanel>
-</UserControl>
+</UserControl>

demo/Semi.Avalonia.Demo/Pages/ToolTipDemo.axaml

@@ -11,7 +11,8 @@
         <Border
             Margin="5"
             Padding="50,10"
-            Background="Yellow"
+            Classes="Hover"
+            Theme="{StaticResource CardBorder}"
             ToolTip.Tip="This is a ToolTip">
             <TextBlock>Hover Here</TextBlock>
         </Border>
@@ -23,7 +24,8 @@
             Name="Border"
             Margin="5"
             Padding="50,10"
-            Background="Yellow"
+            Classes="Hover"
+            Theme="{StaticResource CardBorder}"
             ToolTip.Placement="Bottom">
             <ToolTip.Tip>
                 <StackPanel>
@@ -36,7 +38,8 @@
         <Border
             Margin="5"
             Padding="50,10"
-            Background="Yellow"
+            Classes="Hover"
+            Theme="{StaticResource CardBorder}"
             ToolTip.Placement="Top"
             ToolTip.Tip="Hello">
             <Border.Styles>
@@ -60,7 +63,8 @@
         <Border
             Margin="5"
             Padding="50,10"
-            Background="Yellow"
+            Classes="Hover"
+            Theme="{StaticResource CardBorder}"
             ToolTip.Placement="Top"
             ToolTip.Tip="Hello">
             <TextBlock>Top</TextBlock>
@@ -68,7 +72,8 @@
         <Border
             Margin="5"
             Padding="50,10"
-            Background="Yellow"
+            Classes="Hover"
+            Theme="{StaticResource CardBorder}"
             ToolTip.Placement="Left"
             ToolTip.Tip="Hello">
             <TextBlock>Left</TextBlock>
@@ -76,7 +81,8 @@
         <Border
             Margin="5"
             Padding="50,10"
-            Background="Yellow"
+            Classes="Hover"
+            Theme="{StaticResource CardBorder}"
             ToolTip.Placement="Right"
             ToolTip.Tip="Hello">
             <TextBlock>Right</TextBlock>
@@ -84,10 +90,11 @@
         <Border
             Margin="5"
             Padding="50,10"
-            Background="Yellow"
+            Classes="Hover"
+            Theme="{StaticResource CardBorder}"
             ToolTip.Placement="Bottom"
             ToolTip.Tip="Hello">
             <TextBlock>Bottom</TextBlock>
         </Border>
     </StackPanel>
-</UserControl>
+</UserControl>

demo/Semi.Avalonia.Demo/Pages/TreeViewDemo.axaml

@@ -1,9 +1,13 @@
 <UserControl
-    x:Class="Semi.Avalonia.Demo.Pages.TreeViewDemo" 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" d:DesignHeight="450"
-    d:DesignWidth="800" mc:Ignorable="d">
-    <Panel>
+    x:Class="Semi.Avalonia.Demo.Pages.TreeViewDemo"
+    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"
+    d:DesignHeight="450"
+    d:DesignWidth="800"
+    mc:Ignorable="d">
+    <Panel HorizontalAlignment="Left">
         <TreeView>
             <TreeViewItem Header="Level 1">
                 <TreeViewItem Header="Level 2" />

demo/Semi.Avalonia.Demo/Semi.Avalonia.Demo.csproj

@@ -4,19 +4,18 @@
         <Nullable>enable</Nullable>
         <LangVersion>latest</LangVersion>
     </PropertyGroup>
-
+    
     <ItemGroup>
         <AvaloniaResource Include="Assets\**" />
         <TrimmerRootDescriptor Include="Roots.xml" />
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia" Version="11.0.0-preview5" />
-        <PackageReference Include="Avalonia.Controls.DataGrid" Version="11.0.0-preview5" />
+        <PackageReference Include="Avalonia" Version="$(AvaloniaVersion)" />
+        <PackageReference Include="Avalonia.Controls.DataGrid" Version="$(AvaloniaVersion)" />
         <!--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-preview5" />
+        <PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="$(AvaloniaVersion)" />
         <PackageReference Include="CommunityToolkit.Mvvm" Version="8.1.0" />
-        <PackageReference Include="XamlNameReferenceGenerator" Version="1.5.1" />
     </ItemGroup>
 
     <ItemGroup>

demo/Semi.Avalonia.Demo/ViewModels/PaletteDemoViewModel.cs

@@ -11,11 +11,17 @@ namespace Semi.Avalonia.Demo.ViewModels;
 
 public class PaletteDemoViewModel: ObservableObject
 {
-    private readonly string[] _predefinedColorNames = { "Amber","Blue","Cyan","Green","Grey","Indigo","LightBlue","LightGreen","Lime","Orange","Pink","Purple","Red","Teal","Violet","Yellow" };
-    private IResourceDictionary _lightResourceDictionary;
-    private IResourceDictionary _darkResourceDictionary;
+    private readonly string[] _predefinedColorNames =
+    {
+        "Red", "Pink", "Purple", "Violet", "Indigo",
+        "Blue", "LightBlue", "Cyan", "Teal", "Green",
+        "LightGreen", "Lime", "Yellow", "Amber", "Orange",
+        "Grey"
+    };
+    private readonly IResourceDictionary? _lightResourceDictionary;
+    private readonly IResourceDictionary? _darkResourceDictionary;
     
-    private ColorItemViewModel _selectedColor;
+    private ColorItemViewModel _selectedColor = null!;
 
     public ColorItemViewModel SelectedColor
     {
@@ -24,14 +30,14 @@ public class PaletteDemoViewModel: ObservableObject
     }
     
     
-    private ObservableCollection<ColorListViewModel> _lightLists;
-    public ObservableCollection<ColorListViewModel> LightLists
+    private ObservableCollection<ColorListViewModel>? _lightLists;
+    public ObservableCollection<ColorListViewModel>? LightLists
     {
         get => _lightLists;
         set => SetProperty(ref _lightLists, value);
     }
-    private ObservableCollection<ColorListViewModel> _darkLists;
-    public ObservableCollection<ColorListViewModel> DarkLists
+    private ObservableCollection<ColorListViewModel>? _darkLists;
+    public ObservableCollection<ColorListViewModel>? DarkLists
     {
         get => _darkLists;
         set => SetProperty(ref _darkLists, value);
@@ -41,8 +47,8 @@ public class PaletteDemoViewModel: ObservableObject
 
     public PaletteDemoViewModel()
     {
-        _lightResourceDictionary = (ResourceDictionary)AvaloniaXamlLoader.Load(new Uri("avares://Semi.Avalonia/Themes/Light/Palette.axaml"));
-        _darkResourceDictionary = (ResourceDictionary)AvaloniaXamlLoader.Load(new Uri("avares://Semi.Avalonia/Themes/Dark/Palette.axaml"));
+        _lightResourceDictionary = AvaloniaXamlLoader.Load(new Uri("avares://Semi.Avalonia/Themes/Light/Palette.axaml")) as ResourceDictionary;
+        _darkResourceDictionary = AvaloniaXamlLoader.Load(new Uri("avares://Semi.Avalonia/Themes/Dark/Palette.axaml")) as ResourceDictionary;
         WeakReferenceMessenger.Default.Register<PaletteDemoViewModel, ColorItemViewModel>(this, OnClickColorItem);
     }
 
@@ -110,8 +116,12 @@ public class ColorListViewModel: ObservableObject
         set => SetProperty(ref _seriesName, value);
     }
     
-    internal void Initialize(IResourceDictionary resourceDictionary, string color, bool light)
+    internal void Initialize(IResourceDictionary? resourceDictionary, string color, bool light)
     {
+        if (resourceDictionary is null)
+        {
+            return;
+        }
         SeriesName = color;
         Color = new ObservableCollection<ColorItemViewModel>();
         
@@ -124,6 +134,7 @@ public class ColorListViewModel: ObservableObject
                 {
                     string name = color + " " + i;
                     var item = new ColorItemViewModel(name, brush, key, light, i);
+                    item.ColorResourceKey = item.ResourceKey + "Color";
                     Color.Add(item);
                 } 
             }
@@ -134,28 +145,28 @@ public class ColorListViewModel: ObservableObject
 public class ColorItemViewModel : ObservableObject
 {
 
-    private IBrush _brush;
+    private IBrush _brush = null!;
     public IBrush Brush
     {
         get => _brush;
         set => SetProperty(ref _brush, value);
     }
     
-    private IBrush _textBrush;
+    private IBrush _textBrush = null!;
     public IBrush TextBrush
     {
         get => _textBrush;
         set => SetProperty(ref _textBrush, value);
     }
 
-    private string _colorDisplayName;
+    private string _colorDisplayName = null!;
     public string ColorDisplayName
     {
         get => _colorDisplayName;
         set => SetProperty(ref _colorDisplayName, value);
     }
 
-    private string _resourceKey;
+    private string _resourceKey = null!;
 
     public string ResourceKey
     {
@@ -163,7 +174,15 @@ public class ColorItemViewModel : ObservableObject
         set => SetProperty(ref _resourceKey, value);
     }
 
-    private string _hex;
+    private string _colorResourceKey = null!;
+
+    public string ColorResourceKey
+    {
+        get => _colorResourceKey;
+        set => SetProperty(ref _colorResourceKey, value);
+    }
+
+    private string _hex = null!;
 
     public string Hex
     {
@@ -177,7 +196,7 @@ public class ColorItemViewModel : ObservableObject
         Brush = brush;
         ResourceKey = resourceKey;
         Hex = brush.ToString().ToUpperInvariant();
-        if ((light && index < 5) || (!light && index > 5))
+        if ((light && index < 5) || (!light && index >= 5))
         {
             TextBrush = Brushes.Black;
         }
@@ -190,7 +209,7 @@ public class ColorItemViewModel : ObservableObject
 
 public class FunctionalColorGroupViewModel : ObservableObject
 {
-    private string _title;
+    private string _title = null!;
     public string Title
     {
         get => _title;
@@ -200,21 +219,22 @@ public class FunctionalColorGroupViewModel : ObservableObject
     public ObservableCollection<ColorItemViewModel> LightColors { get; set; } = new();
     public ObservableCollection<ColorItemViewModel> DarkColors { get; set; } = new();
 
-    public FunctionalColorGroupViewModel(string title, IResourceDictionary lightDictionary, IResourceDictionary darkDictionary, IReadOnlyList<Tuple<string, string>> tokens)
+    public FunctionalColorGroupViewModel(string title, IResourceDictionary? lightDictionary, IResourceDictionary? darkDictionary, IReadOnlyList<Tuple<string, string>> tokens)
     {
         Title = title;
         foreach (var token in tokens)
         {
             string key = token.Item1;
             string name = token.Item2;
-            if (lightDictionary.TryGetValue(key, out var lightValue))
+            if (lightDictionary?.TryGetValue(key, out var lightValue) ?? false)
             {
                 if (lightValue is ISolidColorBrush lightBrush)
                 {
                     LightColors.Add(new ColorItemViewModel(name, lightBrush, key, true, 0));
                 }
             }
-            if (darkDictionary.TryGetValue(key, out var darkValue))
+
+            if (darkDictionary?.TryGetValue(key, out var darkValue) ?? false)
             {
                 if (darkValue is ISolidColorBrush darkBrush)
                 {

src/Package.props

@@ -3,10 +3,11 @@
         <TargetFrameworks>net6.0;netstandard2.0</TargetFrameworks>
         <Nullable>enable</Nullable>
         <LangVersion>10</LangVersion>
-        <Version>0.1.0-preview5.4</Version>
+        <Version>0.1.0-preview7</Version>
         <Authors>IRIHI Technology</Authors>
         <Description>Avalonia Theme inspired by Semi Design. </Description>
         <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
-        <AvaloniaVersion>11.0.0-preview5</AvaloniaVersion>
+        <AvaloniaVersion>11.0.0-preview7</AvaloniaVersion>
+        <PackageLicenseExpression>MIT</PackageLicenseExpression>
     </PropertyGroup>
 </Project>

src/Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml

@@ -61,7 +61,7 @@
                         </Panel>
                     </DropDownButton.Content>
                     <DropDownButton.Flyout>
-                        <Flyout FlyoutPresenterClasses="nopadding" Placement="Auto">
+                        <Flyout FlyoutPresenterClasses="nopadding" Placement="AnchorAndGravity">
 
                             <!--
                                 The following is copy-pasted from the ColorView's control template.
@@ -188,7 +188,7 @@
                                             Margin="12"
                                             VerticalAlignment="Stretch"
                                             ItemContainerTheme="{DynamicResource ColorViewPaletteListBoxItemTheme}"
-                                            Items="{TemplateBinding PaletteColors}"
+                                            ItemsSource="{TemplateBinding PaletteColors}"
                                             SelectedItem="{Binding Color, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource DoNothingForNullConverter}, Mode=TwoWay}"
                                             Theme="{DynamicResource ColorViewPaletteListBoxTheme}"
                                             UseLayoutRounding="False">

src/Semi.Avalonia.ColorPicker/Controls/ColorSlider.axaml

@@ -10,6 +10,7 @@
 
     <ControlTheme x:Key="ColorSliderThumbTheme" TargetType="Thumb">
         <Setter Property="Background" Value="Transparent" />
+        <Setter Property="UseLayoutRounding" Value="False" />
         <Setter Property="BorderBrush" Value="{DynamicResource ColorSliderDefaultBorderBrush}" />
         <Setter Property="BorderThickness" Value="{DynamicResource ColorSliderThumbBorderBrush}" />
         <Setter Property="CornerRadius" Value="999" />
@@ -17,9 +18,11 @@
             <Setter.Value>
                 <ControlTemplate>
                     <Border
+                        Margin="1"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
+                        BoxShadow="{DynamicResource ColorSliderBoxShadow}"
                         CornerRadius="{TemplateBinding CornerRadius}" />
                 </ControlTemplate>
             </Setter.Value>
@@ -39,6 +42,8 @@
                         CornerRadius="{TemplateBinding CornerRadius}">
                         <Grid Margin="{TemplateBinding Padding}">
                             <Rectangle
+                                Width="{Binding #PART_Track.Bounds.Width}"
+                                Height="{Binding #PART_Track.Bounds.Height}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{DynamicResource ColorControlCheckeredBackgroundBrush}"
@@ -47,6 +52,8 @@
                                 RadiusY="{TemplateBinding CornerRadius,
                                                           Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Rectangle
+                                Width="{Binding #PART_Track.Bounds.Width}"
+                                Height="{Binding #PART_Track.Bounds.Height}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{TemplateBinding Background}"
@@ -56,6 +63,7 @@
                                                           Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Track
                                 Name="PART_Track"
+                                Height="12"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
@@ -125,6 +133,8 @@
                         CornerRadius="{TemplateBinding CornerRadius}">
                         <Grid Margin="{TemplateBinding Padding}">
                             <Rectangle
+                                Width="{Binding #PART_Track.Bounds.Width}"
+                                Height="{Binding #PART_Track.Bounds.Height}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{DynamicResource ColorControlCheckeredBackgroundBrush}"
@@ -133,6 +143,8 @@
                                 RadiusY="{TemplateBinding CornerRadius,
                                                           Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Rectangle
+                                Width="{Binding #PART_Track.Bounds.Width}"
+                                Height="{Binding #PART_Track.Bounds.Height}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{TemplateBinding Background}"
@@ -142,6 +154,7 @@
                                                           Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Track
                                 Name="PART_Track"
+                                Width="12"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
@@ -212,9 +225,11 @@
 
         <Style Selector="^:dark-selector /template/ Thumb#ColorSliderThumb">
             <Setter Property="BorderBrush" Value="{DynamicResource ColorSliderDarkBorderBrush}" />
+            <Setter Property="Foreground" Value="{DynamicResource ColorSliderLightBorderBrush}" />
         </Style>
         <Style Selector="^:light-selector /template/ Thumb#ColorSliderThumb">
             <Setter Property="BorderBrush" Value="{DynamicResource ColorSliderLightBorderBrush}" />
+            <Setter Property="Foreground" Value="{DynamicResource ColorSliderDarkBorderBrush}" />
         </Style>
 
     </ControlTheme>

src/Semi.Avalonia.ColorPicker/Controls/ColorView.axaml

@@ -280,7 +280,7 @@
                                 Margin="12"
                                 VerticalAlignment="Stretch"
                                 ItemContainerTheme="{StaticResource ColorViewPaletteListBoxItemTheme}"
-                                Items="{TemplateBinding PaletteColors}"
+                                ItemsSource="{TemplateBinding PaletteColors}"
                                 SelectedItem="{Binding Color, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource DoNothingForNullConverter}, Mode=TwoWay}"
                                 Theme="{StaticResource ColorViewPaletteListBoxTheme}"
                                 UseLayoutRounding="False">

src/Semi.Avalonia.ColorPicker/Dark.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:colorPicker="clr-namespace:Semi.Avalonia.ColorPicker">
     <!--  Add Resources Here  -->
     <SolidColorBrush x:Key="ColorViewRadioButtonForeground" Color="#54A9FF" />
     <SolidColorBrush x:Key="ColorViewRadioButtonBackground" Color="#1C1F23" />
@@ -29,8 +32,9 @@
     <SolidColorBrush x:Key="ColorSliderDarkBorderBrush" Color="#E4000000" />
 
     <x:Double x:Key="ColorSliderWidth">16</x:Double>
-    <CornerRadius x:Key="ColorSliderCornerRadius">8</CornerRadius>
+    <CornerRadius x:Key="ColorSliderCornerRadius">6</CornerRadius>
     <Thickness x:Key="ColorSliderThumbBorderBrush">2</Thickness>
+    <BoxShadows x:Key="ColorSliderBoxShadow">0 0 2 1 #FFFFFF</BoxShadows>
 
     <SolidColorBrush x:Key="ColorSpectrumBorderBrush" Opacity="0.08" Color="#1C1F23" />
 
@@ -40,4 +44,6 @@
     <CornerRadius x:Key="ColorPreviewerCornerRadius">3</CornerRadius>
 
     <BoxShadows x:Key="ColorPreviewerMainBoxShadow">0 0 14 0 #1AFFFFFF</BoxShadows>
+
+    <colorPicker:SemiColorDarkPalette x:Key="SemiColorPalette" />
 </ResourceDictionary>

src/Semi.Avalonia.ColorPicker/Index.axaml

@@ -3,8 +3,8 @@
     <Styles.Resources>
         <ResourceDictionary>
             <ResourceDictionary.ThemeDictionaries>
-                <ResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.ColorPicker/Light.axaml" />
-                <ResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia.ColorPicker/Dark.axaml" />
+                <MergeResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.ColorPicker/Light.axaml" />
+                <MergeResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia.ColorPicker/Dark.axaml" />
             </ResourceDictionary.ThemeDictionaries>
             <ResourceDictionary.MergedDictionaries>
                 <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml" />

src/Semi.Avalonia.ColorPicker/Light.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:colorPicker="clr-namespace:Semi.Avalonia.ColorPicker">
     <!--  Add Resources Here  -->
     <SolidColorBrush x:Key="ColorViewRadioButtonForeground" Color="#0077FA" />
     <SolidColorBrush x:Key="ColorViewRadioButtonBackground" Color="White" />
@@ -29,8 +32,9 @@
     <SolidColorBrush x:Key="ColorSliderDarkBorderBrush" Color="#E4000000" />
 
     <x:Double x:Key="ColorSliderWidth">16</x:Double>
-    <CornerRadius x:Key="ColorSliderCornerRadius">8</CornerRadius>
+    <CornerRadius x:Key="ColorSliderCornerRadius">6</CornerRadius>
     <Thickness x:Key="ColorSliderThumbBorderBrush">2</Thickness>
+    <BoxShadows x:Key="ColorSliderBoxShadow">0 0 2 1 #1A000000</BoxShadows>
 
     <SolidColorBrush x:Key="ColorSpectrumBorderBrush" Opacity="0.08" Color="#1C1F23" />
 
@@ -40,4 +44,5 @@
     <CornerRadius x:Key="ColorPreviewerCornerRadius">3</CornerRadius>
 
     <BoxShadows x:Key="ColorPreviewerMainBoxShadow">0 0 14 0 #1A000000</BoxShadows>
+    <colorPicker:SemiColorLightPalette x:Key="SemiColorPalette" />
 </ResourceDictionary>

src/Semi.Avalonia.ColorPicker/Semi.Avalonia.ColorPicker.csproj

@@ -1,10 +1,10 @@
 <Project Sdk="Microsoft.NET.Sdk">
 
-    <Import Project="../Package.props"/>
+    <Import Project="../Package.props" />
 
     <PropertyGroup>
         <Title>Semi.Avalonia.ColorPicker</Title>
-        <PackageReleaseNotes>Add Native AOT support.</PackageReleaseNotes>
+        <PackageReleaseNotes>Update to Avalonia 11.0.0-preview7</PackageReleaseNotes>
     </PropertyGroup>
 
     <ItemGroup>

src/Semi.Avalonia.ColorPicker/SemiColorDarkPalette.cs

@@ -0,0 +1,231 @@
+using Avalonia.Controls;
+using Avalonia.Media;
+using Avalonia.Utilities;
+
+namespace Semi.Avalonia.ColorPicker;
+
+public class SemiColorDarkPalette: IColorPalette
+{
+    private static readonly Color[,] Colors = new Color[,]
+    {
+        {
+            //Red
+            Color.FromUInt32(0xFF6C090B),
+            Color.FromUInt32(0xFF901110),
+            Color.FromUInt32(0xFFB42019),
+            Color.FromUInt32(0xFFD73324),
+            Color.FromUInt32(0xFFFB4932),
+            Color.FromUInt32(0xFFFC725A),
+            Color.FromUInt32(0xFFFD9983),
+            Color.FromUInt32(0xFFFDBEAC),
+            Color.FromUInt32(0xFFFEE0D5),
+            Color.FromUInt32(0xFFFFF3EF),
+        },
+        {
+            //Pink
+            Color.FromUInt32(0xFF5C0730),
+            Color.FromUInt32(0xFF800E41),
+            Color.FromUInt32(0xFFA41751),
+            Color.FromUInt32(0xFFC72261),
+            Color.FromUInt32(0xFFEB2F71),
+            Color.FromUInt32(0xFFEF5686),
+            Color.FromUInt32(0xFFF37E9F),
+            Color.FromUInt32(0xFFF7A8BC),
+            Color.FromUInt32(0xFFFBD3DC),
+            Color.FromUInt32(0xFFFDEEF1),
+        },
+        {
+            //Purple
+            Color.FromUInt32(0xFF4A1061),
+            Color.FromUInt32(0xFF5E1776),
+            Color.FromUInt32(0xFF731F8A),
+            Color.FromUInt32(0xFF89289F),
+            Color.FromUInt32(0xFFA033B3),
+            Color.FromUInt32(0xFFB553C2),
+            Color.FromUInt32(0xFFCA78D1),
+            Color.FromUInt32(0xFFDDA0E1),
+            Color.FromUInt32(0xFFEFCEF0),
+            Color.FromUInt32(0xFFF7EBF7),
+        },
+        {
+            //Violet
+            Color.FromUInt32(0xFF401B77),
+            Color.FromUInt32(0xFF4C248C),
+            Color.FromUInt32(0xFF582EA0),
+            Color.FromUInt32(0xFF6439B5),
+            Color.FromUInt32(0xFF7246C9),
+            Color.FromUInt32(0xFF8865D4),
+            Color.FromUInt32(0xFFA288DF),
+            Color.FromUInt32(0xFFBEADE9),
+            Color.FromUInt32(0xFFDDD4F4),
+            Color.FromUInt32(0xFFF1EEFA),
+        },
+        {
+            //Indigo
+            Color.FromUInt32(0xFF171E65),
+            Color.FromUInt32(0xFF20297A),
+            Color.FromUInt32(0xFF29368E),
+            Color.FromUInt32(0xFF3444A3),
+            Color.FromUInt32(0xFF4053B7),
+            Color.FromUInt32(0xFF5F71C5),
+            Color.FromUInt32(0xFF8191D4),
+            Color.FromUInt32(0xFFA7B4E2),
+            Color.FromUInt32(0xFFD1D8F1),
+            Color.FromUInt32(0xFFEDEFF8),
+        },
+        {
+            //Blue
+            Color.FromUInt32(0xFF053170),
+            Color.FromUInt32(0xFF0A4694),
+            Color.FromUInt32(0xFF135CB8),
+            Color.FromUInt32(0xFF1D75DB),
+            Color.FromUInt32(0xFF2990FF),
+            Color.FromUInt32(0xFF54A9FF),
+            Color.FromUInt32(0xFF7FC1FF),
+            Color.FromUInt32(0xFFA9D7FF),
+            Color.FromUInt32(0xFFD4ECFF),
+            Color.FromUInt32(0xFFEFF8FF),
+        },
+        {
+            //LightBlue
+            Color.FromUInt32(0xFF003761),
+            Color.FromUInt32(0xFF004D85),
+            Color.FromUInt32(0xFF0366A9),
+            Color.FromUInt32(0xFF0A81CC),
+            Color.FromUInt32(0xFF139FF0),
+            Color.FromUInt32(0xFF40B4F3),
+            Color.FromUInt32(0xFF6EC8F6),
+            Color.FromUInt32(0xFF9DDCF9),
+            Color.FromUInt32(0xFFCEEEFC),
+            Color.FromUInt32(0xFFEBF8FE),
+        },
+        {
+            //Cyan
+            Color.FromUInt32(0xFF04343D),
+            Color.FromUInt32(0xFF074F5C),
+            Color.FromUInt32(0xFF0A6C7B),
+            Color.FromUInt32(0xFF0E8999),
+            Color.FromUInt32(0xFF13A8B8),
+            Color.FromUInt32(0xFF38BBC6),
+            Color.FromUInt32(0xFF62CDD4),
+            Color.FromUInt32(0xFF91DFE3),
+            Color.FromUInt32(0xFFC6EFF1),
+            Color.FromUInt32(0xFFE7F7F8),
+        },
+        {
+            //Teal
+            Color.FromUInt32(0xFF023C39),
+            Color.FromUInt32(0xFF045A55),
+            Color.FromUInt32(0xFF07776F),
+            Color.FromUInt32(0xFF0A9588),
+            Color.FromUInt32(0xFF0EB3A1),
+            Color.FromUInt32(0xFF33C2B0),
+            Color.FromUInt32(0xFF5ED1C1),
+            Color.FromUInt32(0xFF8EE1D3),
+            Color.FromUInt32(0xFFC4F0E8),
+            Color.FromUInt32(0xFFE6F7F4),
+        },
+        {
+            //Green
+            Color.FromUInt32(0xFF123C19),
+            Color.FromUInt32(0xFF1C5A25),
+            Color.FromUInt32(0xFF277731),
+            Color.FromUInt32(0xFF32953D),
+            Color.FromUInt32(0xFF3EB349),
+            Color.FromUInt32(0xFF5DC264),
+            Color.FromUInt32(0xFF7FD184),
+            Color.FromUInt32(0xFFA6E1A8),
+            Color.FromUInt32(0xFFD0F0D1),
+            Color.FromUInt32(0xFFECF7EC),
+        },
+        {
+            //LightGreen
+            Color.FromUInt32(0xFF263D13),
+            Color.FromUInt32(0xFF3B5C1D),
+            Color.FromUInt32(0xFF517B28),
+            Color.FromUInt32(0xFF679934),
+            Color.FromUInt32(0xFF7FB840),
+            Color.FromUInt32(0xFF97C65F),
+            Color.FromUInt32(0xFFB0D481),
+            Color.FromUInt32(0xFFC9E3A7),
+            Color.FromUInt32(0xFFE4F1D1),
+            Color.FromUInt32(0xFFF3F8ED),
+        },
+        {
+            //Lime
+            Color.FromUInt32(0xFF314603),
+            Color.FromUInt32(0xFF4B6905),
+            Color.FromUInt32(0xFF678D09),
+            Color.FromUInt32(0xFF84B00C),
+            Color.FromUInt32(0xFFA2D311),
+            Color.FromUInt32(0xFFAEDC3A),
+            Color.FromUInt32(0xFFBDE566),
+            Color.FromUInt32(0xFFCFED96),
+            Color.FromUInt32(0xFFE5F6C9),
+            Color.FromUInt32(0xFFF3FBE9),
+        },
+        {
+            //Yellow
+            Color.FromUInt32(0xFF544903),
+            Color.FromUInt32(0xFF7E6C06),
+            Color.FromUInt32(0xFFA88E0A),
+            Color.FromUInt32(0xFFD2AF0F),
+            Color.FromUInt32(0xFFFCCE14),
+            Color.FromUInt32(0xFFFDDE43),
+            Color.FromUInt32(0xFFFDEB71),
+            Color.FromUInt32(0xFFFEF5A0),
+            Color.FromUInt32(0xFFFEFBD0),
+            Color.FromUInt32(0xFFFFFEEC),
+        },
+        {
+            //Amber
+            Color.FromUInt32(0xFF512E09),
+            Color.FromUInt32(0xFF794B0F),
+            Color.FromUInt32(0xFFA16B16),
+            Color.FromUInt32(0xFFCA8F1E),
+            Color.FromUInt32(0xFFF2B726),
+            Color.FromUInt32(0xFFF5CA50),
+            Color.FromUInt32(0xFFF7DB7A),
+            Color.FromUInt32(0xFFFAEAA6),
+            Color.FromUInt32(0xFFFCF6D2),
+            Color.FromUInt32(0xFFFEFBED),
+        },
+        {
+            //Orange
+            Color.FromUInt32(0xFF551F03),
+            Color.FromUInt32(0xFF803506),
+            Color.FromUInt32(0xFFAA500A),
+            Color.FromUInt32(0xFFD56F0F),
+            Color.FromUInt32(0xFFFF9214),
+            Color.FromUInt32(0xFFFFAE43),
+            Color.FromUInt32(0xFFFFC772),
+            Color.FromUInt32(0xFFFFDDA1),
+            Color.FromUInt32(0xFFFFEFD0),
+            Color.FromUInt32(0xFFFFF9ED),
+        },
+        {
+            //Grey
+            Color.FromUInt32(0xFF1C1F23),
+            Color.FromUInt32(0xFF2E3238),
+            Color.FromUInt32(0xFF41464C),
+            Color.FromUInt32(0xFF555B61),
+            Color.FromUInt32(0xFF6B7075),
+            Color.FromUInt32(0xFF888D92),
+            Color.FromUInt32(0xFFA7ABB0),
+            Color.FromUInt32(0xFFC6CACD),
+            Color.FromUInt32(0xFFE6E8EA),
+            Color.FromUInt32(0xFFF9F9F9),
+        },
+    };
+    public Color GetColor(int colorIndex, int shadeIndex)
+    {
+        return Colors[
+            MathUtilities.Clamp(colorIndex, 0, ColorCount - 1),
+            MathUtilities.Clamp(shadeIndex, 0, ShadeCount - 1)
+        ];
+    }
+
+    public int ColorCount => Colors.GetLength(0);
+
+    public int ShadeCount => Colors.GetLength(1);
+}

src/Semi.Avalonia.ColorPicker/SemiColorLightPalette.cs

@@ -0,0 +1,231 @@
+using Avalonia.Controls;
+using Avalonia.Media;
+using Avalonia.Utilities;
+
+namespace Semi.Avalonia.ColorPicker;
+
+public class SemiColorLightPalette: IColorPalette
+{
+    private static readonly Color[,] Colors = new Color[,]
+    {
+        {
+            //Red
+            Color.FromUInt32(0xFFFEF2ED),
+            Color.FromUInt32(0xFFFEDDD2),
+            Color.FromUInt32(0xFFFDB7A5),
+            Color.FromUInt32(0xFFFB9078),
+            Color.FromUInt32(0xFFFA664C),
+            Color.FromUInt32(0xFFF93920),
+            Color.FromUInt32(0xFFD52515),
+            Color.FromUInt32(0xFFB2140C),
+            Color.FromUInt32(0xFF8E0805),
+            Color.FromUInt32(0xFF6A0103),
+        },
+        {
+            //Pink
+            Color.FromUInt32(0xFFFDECEF),
+            Color.FromUInt32(0xFFFBCFD8),
+            Color.FromUInt32(0xFFF6A0B5),
+            Color.FromUInt32(0xFFF27396),
+            Color.FromUInt32(0xFFED487B),
+            Color.FromUInt32(0xFFE91E63),
+            Color.FromUInt32(0xFFC51356),
+            Color.FromUInt32(0xFFA20B48),
+            Color.FromUInt32(0xFF7E053A),
+            Color.FromUInt32(0xFF5A012B),
+        },
+        {
+            //Purple
+            Color.FromUInt32(0xFFF7E9F7),
+            Color.FromUInt32(0xFFEFCAF0),
+            Color.FromUInt32(0xFFDD9BE0),
+            Color.FromUInt32(0xFFC96FD1),
+            Color.FromUInt32(0xFFB449C2),
+            Color.FromUInt32(0xFF9E28B3),
+            Color.FromUInt32(0xFF871E9E),
+            Color.FromUInt32(0xFF71168A),
+            Color.FromUInt32(0xFF5C0F75),
+            Color.FromUInt32(0xFF490A61),
+        },
+        {
+            //Violet
+            Color.FromUInt32(0xFFF3EDF9),
+            Color.FromUInt32(0xFFE2D1F4),
+            Color.FromUInt32(0xFFC4A7E9),
+            Color.FromUInt32(0xFFA67FDD),
+            Color.FromUInt32(0xFF885BD2),
+            Color.FromUInt32(0xFF6A3AC7),
+            Color.FromUInt32(0xFF572FB3),
+            Color.FromUInt32(0xFF46259E),
+            Color.FromUInt32(0xFF361C8A),
+            Color.FromUInt32(0xFF281475),
+        },
+        {
+            //Indigo
+            Color.FromUInt32(0xFFECEFF8),
+            Color.FromUInt32(0xFFD1D8F0),
+            Color.FromUInt32(0xFFA7B3E1),
+            Color.FromUInt32(0xFF8090D3),
+            Color.FromUInt32(0xFF5E6FC4),
+            Color.FromUInt32(0xFF3F51B5),
+            Color.FromUInt32(0xFF3342A1),
+            Color.FromUInt32(0xFF28348C),
+            Color.FromUInt32(0xFF1F2878),
+            Color.FromUInt32(0xFF171D63),
+        },
+        {
+            //Blue
+            Color.FromUInt32(0xFFEAF5FF),
+            Color.FromUInt32(0xFFCBE7FE),
+            Color.FromUInt32(0xFF98CDFD),
+            Color.FromUInt32(0xFF65B2FC),
+            Color.FromUInt32(0xFF3295FB),
+            Color.FromUInt32(0xFF0077FA),
+            Color.FromUInt32(0xFF0062D6),
+            Color.FromUInt32(0xFF004FB3),
+            Color.FromUInt32(0xFF003D8F),
+            Color.FromUInt32(0xFF002C6B),
+        },
+        {
+            //LightBlue
+            Color.FromUInt32(0xFFE9F7FD),
+            Color.FromUInt32(0xFFC9ECFC),
+            Color.FromUInt32(0xFF95D8F8),
+            Color.FromUInt32(0xFF62C3F5),
+            Color.FromUInt32(0xFF30ACF1),
+            Color.FromUInt32(0xFF0095EE),
+            Color.FromUInt32(0xFF007BCA),
+            Color.FromUInt32(0xFF0063A7),
+            Color.FromUInt32(0xFF004B83),
+            Color.FromUInt32(0xFF00355F),
+        },
+        {
+            //Cyan
+            Color.FromUInt32(0xFFE5F7F8),
+            Color.FromUInt32(0xFFC2EFF0),
+            Color.FromUInt32(0xFF8ADDE2),
+            Color.FromUInt32(0xFF58CBD3),
+            Color.FromUInt32(0xFF2CB8C5),
+            Color.FromUInt32(0xFF05A4B6),
+            Color.FromUInt32(0xFF038698),
+            Color.FromUInt32(0xFF016979),
+            Color.FromUInt32(0xFF004D5B),
+            Color.FromUInt32(0xFF00323D),
+        },
+        {
+            //Teal
+            Color.FromUInt32(0xFFE4F7F4),
+            Color.FromUInt32(0xFFC0F0E8),
+            Color.FromUInt32(0xFF87E0D3),
+            Color.FromUInt32(0xFF54D1C1),
+            Color.FromUInt32(0xFF27C2B0),
+            Color.FromUInt32(0xFF00B3A1),
+            Color.FromUInt32(0xFF009589),
+            Color.FromUInt32(0xFF00776F),
+            Color.FromUInt32(0xFF005955),
+            Color.FromUInt32(0xFF003C3A),
+        },
+        {
+            //Green
+            Color.FromUInt32(0xFFECF7EC),
+            Color.FromUInt32(0xFFD0F0D1),
+            Color.FromUInt32(0xFFA4E0A7),
+            Color.FromUInt32(0xFF7DD182),
+            Color.FromUInt32(0xFF5AC262),
+            Color.FromUInt32(0xFF3BB346),
+            Color.FromUInt32(0xFF30953B),
+            Color.FromUInt32(0xFF25772F),
+            Color.FromUInt32(0xFF1B5924),
+            Color.FromUInt32(0xFF113C18),
+        },
+        {
+            //LightGreen
+            Color.FromUInt32(0xFFF3F8EC),
+            Color.FromUInt32(0xFFE3F0D0),
+            Color.FromUInt32(0xFFC8E2A5),
+            Color.FromUInt32(0xFFADD37E),
+            Color.FromUInt32(0xFF93C55B),
+            Color.FromUInt32(0xFF7BB63C),
+            Color.FromUInt32(0xFF649830),
+            Color.FromUInt32(0xFF4E7926),
+            Color.FromUInt32(0xFF395B1B),
+            Color.FromUInt32(0xFF253D12),
+        },
+        {
+            //Lime
+            Color.FromUInt32(0xFFF2FAE6),
+            Color.FromUInt32(0xFFE3F6C5),
+            Color.FromUInt32(0xFFCBED8E),
+            Color.FromUInt32(0xFFB7E35B),
+            Color.FromUInt32(0xFFA7DA2C),
+            Color.FromUInt32(0xFF9BD100),
+            Color.FromUInt32(0xFF7EAE00),
+            Color.FromUInt32(0xFF638B00),
+            Color.FromUInt32(0xFF486800),
+            Color.FromUInt32(0xFF2F4600),
+        },
+        {
+            //Yellow
+            Color.FromUInt32(0xFFFFFDEA),
+            Color.FromUInt32(0xFFFEFBCB),
+            Color.FromUInt32(0xFFFDF398),
+            Color.FromUInt32(0xFFFCE865),
+            Color.FromUInt32(0xFFFBDA32),
+            Color.FromUInt32(0xFFFAC800),
+            Color.FromUInt32(0xFFD0AA00),
+            Color.FromUInt32(0xFFA78B00),
+            Color.FromUInt32(0xFF7D6A00),
+            Color.FromUInt32(0xFF534800),
+        },
+        {
+            //Amber
+            Color.FromUInt32(0xFFFEFBEB),
+            Color.FromUInt32(0xFFFCF5CE),
+            Color.FromUInt32(0xFFF9E89E),
+            Color.FromUInt32(0xFFF6D86F),
+            Color.FromUInt32(0xFFF3C641),
+            Color.FromUInt32(0xFFF0B114),
+            Color.FromUInt32(0xFFC88A0F),
+            Color.FromUInt32(0xFFA0660A),
+            Color.FromUInt32(0xFF784606),
+            Color.FromUInt32(0xFF502B03),
+        },
+        {
+            //Orange
+            Color.FromUInt32(0xFFFFF8EA),
+            Color.FromUInt32(0xFFFEEECC),
+            Color.FromUInt32(0xFFFED998),
+            Color.FromUInt32(0xFFFDC165),
+            Color.FromUInt32(0xFFFDA633),
+            Color.FromUInt32(0xFFFC8800),
+            Color.FromUInt32(0xFFD26700),
+            Color.FromUInt32(0xFFA84A00),
+            Color.FromUInt32(0xFF7E3100),
+            Color.FromUInt32(0xFF541D00),
+        },
+        {
+            //Grey
+            Color.FromUInt32(0xFFF9F9F9),
+            Color.FromUInt32(0xFFE6E8EA),
+            Color.FromUInt32(0xFFC6CACD),
+            Color.FromUInt32(0xFFA7ABB0),
+            Color.FromUInt32(0xFF888D92),
+            Color.FromUInt32(0xFF6B7075),
+            Color.FromUInt32(0xFF555B61),
+            Color.FromUInt32(0xFF41464C),
+            Color.FromUInt32(0xFF2E3238),
+            Color.FromUInt32(0xFF1C1F23),
+        },
+    };
+    public Color GetColor(int colorIndex, int shadeIndex)
+    {
+        return Colors[
+            MathUtilities.Clamp(colorIndex, 0, ColorCount - 1),
+            MathUtilities.Clamp(shadeIndex, 0, ShadeCount - 1)
+        ];
+    }
+
+    public int ColorCount => Colors.GetLength(0);
+
+    public int ShadeCount => Colors.GetLength(1);
+}

src/Semi.Avalonia.DataGrid/Index.axaml

@@ -3,8 +3,8 @@
     <Styles.Resources>
         <ResourceDictionary>
             <ResourceDictionary.ThemeDictionaries>
-                <ResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.DataGrid/Light.axaml" />
-                <ResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia.DataGrid/Dark.axaml" />
+                <MergeResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.DataGrid/Light.axaml" />
+                <MergeResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia.DataGrid/Dark.axaml" />
             </ResourceDictionary.ThemeDictionaries>
             <ResourceDictionary.MergedDictionaries>
                 <ResourceInclude Source="avares://Semi.Avalonia.DataGrid/DataGrid.axaml" />

src/Semi.Avalonia.DataGrid/Semi.Avalonia.DataGrid.csproj

@@ -1,10 +1,10 @@
 <Project Sdk="Microsoft.NET.Sdk">
 
-    <Import Project="../Package.props"/>
+    <Import Project="../Package.props" />
     
     <PropertyGroup>
         <Title>Semi.Avalonia.DataGrid</Title>
-        <PackageReleaseNotes>Add Native AOT support.</PackageReleaseNotes>
+        <PackageReleaseNotes>Update to Avalonia 11.0.0-preview7</PackageReleaseNotes>
     </PropertyGroup>
 
     <ItemGroup>

src/Semi.Avalonia/Controls/Button.axaml

@@ -20,6 +20,7 @@
         <Setter Property="Button.HorizontalContentAlignment" Value="Center" />
         <Setter Property="Button.VerticalContentAlignment" Value="Center" />
         <Setter Property="Button.MinHeight" Value="12" />
+        <Setter Property="Button.Cursor" Value="Hand" />
         <Setter Property="Button.Template">
             <ControlTemplate TargetType="Button">
                 <ContentPresenter

src/Semi.Avalonia/Controls/CalendarDatePicker.axaml

@@ -86,9 +86,6 @@
                                             <Setter Property="Background" Value="Transparent" />
                                             <Setter Property="BorderBrush" Value="Transparent" />
                                         </Style>
-                                        <Style Selector="^ /template/ TextBlock#PART_Watermark">
-                                            <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
-                                        </Style>
                                     </Style>
                                 </TextBox.Styles>
                             </TextBox>
@@ -105,9 +102,15 @@
                                 IsLightDismissEnabled="True"
                                 PlacementTarget="{TemplateBinding}"
                                 VerticalOffset="-4">
-                                <Border Margin="8" BoxShadow="{DynamicResource CalendarDatePickerPopupBoxShadows}">
+                                <Border
+                                    Margin="8"
+                                    Background="Transparent"
+                                    BoxShadow="{DynamicResource CalendarDatePickerPopupBoxShadows}"
+                                    CornerRadius="{DynamicResource CalendarCornerRadius}">
                                     <Calendar
                                         Name="PART_Calendar"
+                                        BorderThickness="0"
+                                        CornerRadius="{Binding $parent[Border].CornerRadius}"
                                         DisplayDate="{TemplateBinding DisplayDate}"
                                         DisplayDateEnd="{TemplateBinding DisplayDateEnd}"
                                         DisplayDateStart="{TemplateBinding DisplayDateStart}"

src/Semi.Avalonia/Controls/Carousel.axaml

@@ -141,8 +141,8 @@
                         HorizontalAlignment="Center"
                         VerticalAlignment="Center"
                         ItemContainerTheme="{DynamicResource CarouselIndicatorDotListBoxItem}"
-                        Items="{TemplateBinding Items,
-                                                Converter={StaticResource ItemsConverter}}"
+                        ItemsSource="{TemplateBinding ItemsSource,
+                                                      Converter={StaticResource ItemsConverter}}"
                         SelectedIndex="{Binding SelectedIndex, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}">
                         <ListBox.ItemsPanel>
                             <ItemsPanelTemplate>

src/Semi.Avalonia/Controls/CheckBox.axaml

@@ -64,11 +64,11 @@
             </ControlTemplate>
         </Setter>
 
-        <!--  Unchecked PointerOver State  -->
+        <!--  Unchecked Pointerover State  -->
         <Style Selector="^:pointerover">
             <Style Selector="^ /template/ Border#NormalRectangle">
-                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPointOverBorderBrush}" />
-                <Setter Property="Background" Value="{DynamicResource CheckBoxPointOverBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPointeroverBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxPointeroverBackground}" />
             </Style>
         </Style>
 
@@ -102,11 +102,11 @@
                 <Setter Property="Opacity" Value="1" />
             </Style>
 
-            <!--  Checked PointerOver State  -->
+            <!--  Checked Pointerover State  -->
             <Style Selector="^:pointerover">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointeroverBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointeroverBackground}" />
                 </Style>
             </Style>
 
@@ -145,11 +145,11 @@
                 <Setter Property="Opacity" Value="1" />
             </Style>
 
-            <!--  Checked PointerOver State  -->
+            <!--  Checked Pointerover State  -->
             <Style Selector="^:pointerover">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointeroverBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointeroverBackground}" />
                 </Style>
             </Style>
 
@@ -180,6 +180,7 @@
 
     <ControlTheme x:Key="CardCheckBox" TargetType="CheckBox">
         <Setter Property="Cursor" Value="Hand" />
+        <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="Padding" Value="{DynamicResource CheckBoxCardPadding}" />
         <Setter Property="BorderThickness" Value="{DynamicResource CheckBoxCardBorderThickness}" />
         <Setter Property="CornerRadius" Value="{DynamicResource CheckBoxCardCornerRadius}" />
@@ -193,7 +194,11 @@
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     CornerRadius="{TemplateBinding CornerRadius}">
-                    <Grid x:Name="RootGrid" ColumnDefinitions="Auto,*">
+                    <Grid
+                        x:Name="RootGrid"
+                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                        ColumnDefinitions="Auto,*">
                         <Grid Grid.Column="0" VerticalAlignment="Top">
                             <Border
                                 x:Name="NormalRectangle"
@@ -215,7 +220,6 @@
                             x:Name="ContentPresenter"
                             Grid.Column="1"
                             Margin="8,0,0,0"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                             VerticalAlignment="Center"
                             Content="{TemplateBinding Content}"
                             ContentTemplate="{TemplateBinding ContentTemplate}"
@@ -228,10 +232,10 @@
             </ControlTemplate>
         </Setter>
 
-        <!--  Unchecked PointerOver State  -->
+        <!--  Unchecked Pointerover State  -->
         <Style Selector="^:pointerover">
             <Style Selector="^ /template/ Border#NormalRectangle">
-                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPointOverBorderBrush}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPointeroverBorderBrush}" />
             </Style>
             <Style Selector="^ /template/ Border#RootBorder">
                 <Setter Property="Background" Value="{DynamicResource CheckBoxCardPointeroverBackground}" />
@@ -274,11 +278,11 @@
                 <Setter Property="Opacity" Value="1" />
             </Style>
 
-            <!--  Checked PointerOver State  -->
+            <!--  Checked Pointerover State  -->
             <Style Selector="^:pointerover">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointeroverBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointeroverBackground}" />
                 </Style>
                 <Style Selector="^ /template/ Border#RootBorder">
                     <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
@@ -329,11 +333,11 @@
                 <Setter Property="Opacity" Value="1" />
             </Style>
 
-            <!--  Checked PointerOver State  -->
+            <!--  Checked Pointerover State  -->
             <Style Selector="^:pointerover">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointeroverBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointeroverBackground}" />
                 </Style>
                 <Style Selector="^ /template/ Border#RootBorder">
                     <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
@@ -376,88 +380,82 @@
         <Setter Property="Padding" Value="{DynamicResource CheckBoxCardPadding}" />
         <Setter Property="BorderThickness" Value="{DynamicResource CheckBoxCardBorderThickness}" />
         <Setter Property="CornerRadius" Value="{DynamicResource CheckBoxCardCornerRadius}" />
+        <Setter Property="CheckBox.VerticalContentAlignment" Value="Center" />
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="CheckBox.Template">
             <ControlTemplate TargetType="CheckBox">
-                <Border
-                    Name="RootBorder"
+                <ContentPresenter
+                    x:Name="PART_ContentPresenter"
+                    Margin="{TemplateBinding Margin}"
                     Padding="{TemplateBinding Padding}"
+                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                     Background="{TemplateBinding Background}"
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
-                    CornerRadius="{TemplateBinding CornerRadius}">
-                    <ContentPresenter
-                        x:Name="ContentPresenter"
-                        Grid.Column="1"
-                        Margin="8,0,0,0"
-                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                        VerticalAlignment="Center"
-                        Content="{TemplateBinding Content}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        IsVisible="{TemplateBinding Content,
-                                                    Converter={x:Static ObjectConverters.IsNotNull}}"
-                        RecognizesAccessKey="True"
-                        TextWrapping="Wrap" />
-                </Border>
+                    Content="{TemplateBinding Content}"
+                    ContentTemplate="{TemplateBinding ContentTemplate}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    RecognizesAccessKey="True"
+                    UseLayoutRounding="False" />
             </ControlTemplate>
         </Setter>
 
-        <!--  Unchecked PointerOver State  -->
+        <!--  Unchecked Pointerover State  -->
         <Style Selector="^:pointerover">
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource CheckBoxCardPointeroverBackground}" />
             </Style>
         </Style>
 
         <!--  Unchecked Pressed State  -->
         <Style Selector="^:pressed">
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource CheckBoxCardPressedBackground}" />
             </Style>
         </Style>
 
         <!--  Unchecked Disabled state  -->
         <Style Selector="^:disabled">
-            <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
             </Style>
         </Style>
 
         <Style Selector="^:checked">
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedBorderBrush}" />
                 <Setter Property="Background" Value="{DynamicResource CheckBoxCardCheckedBackground}" />
             </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
+            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPressedBorderBrush}" />
             </Style>
             <!--  Checked Disabled State  -->
             <Style Selector="^:disabled">
-                <Style Selector="^ /template/ Border#RootBorder">
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                     <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedDisabledBorderBrush}" />
                 </Style>
-                <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                     <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
                 </Style>
             </Style>
         </Style>
 
         <Style Selector="^:indeterminate">
-            <!--  Checked Disabled State  -->
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedBorderBrush}" />
             </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
+            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPressedBorderBrush}" />
             </Style>
             <Style Selector="^:disabled">
-                <Style Selector="^ /template/ Border#RootBorder">
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
                     <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedDisabledBorderBrush}" />
                 </Style>
             </Style>

src/Semi.Avalonia/Controls/ComboBox.axaml

@@ -31,9 +31,7 @@
         <Setter Property="Padding" Value="{DynamicResource ComboBoxSelectorDefaultPadding}" />
         <Setter Property="FocusAdorner" Value="{x:Null}" />
         <Setter Property="MaxDropDownHeight" Value="504" />
-        <Setter Property="Foreground" Value="{DynamicResource ComboBoxForeground}" />
         <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBackground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxBorderBrush}" />
         <Setter Property="BorderThickness" Value="1" />
         <Setter Property="CornerRadius" Value="{DynamicResource ComboBoxSelectorCornerRadius}" />
         <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
@@ -63,6 +61,7 @@
                         Margin="{TemplateBinding Padding}"
                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                        Foreground="{TemplateBinding Foreground}"
                         IsVisible="{TemplateBinding SelectionBoxItem,
                                                     Converter={x:Static ObjectConverters.IsNull}}"
                         Opacity="0.3"
@@ -139,13 +138,13 @@
             <Setter Property="ComboBox.MinHeight" Value="{DynamicResource ComboBoxSmallHeight}" />
         </Style>
 
-        <!--  PointerOver State  -->
+        <!--  Pointerover State  -->
         <Style Selector="^:pointerover">
-            <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorPointerOverBackground}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorPointerOverBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorPointeroverBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorPointeroverBorderBrush}" />
         </Style>
         <Style Selector="^:pointerover /template/ PathIcon#DropDownGlyph">
-            <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconPointerOverForeground}" />
+            <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconPointeroverForeground}" />
         </Style>
 
         <!--  Pressed State  -->
@@ -228,7 +227,7 @@
         </Setter>
 
         <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="Background" Value="{DynamicResource ComboBoxItemPointerOverBackground}" />
+            <Setter Property="Background" Value="{DynamicResource ComboBoxItemPointeroverBackground}" />
         </Style>
 
         <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
@@ -247,7 +246,7 @@
                 <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedDisabledBackground}" />
             </Style>
             <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-                <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedPointerOverBackground}" />
+                <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedPointeroverBackground}" />
             </Style>
         </Style>
     </ControlTheme>

src/Semi.Avalonia/Controls/Controls.axaml

@@ -18,7 +18,8 @@
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/ContextMenu.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/DatePicker.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/DateTimePickerShared.axaml" />
-        <ResourceInclude Source="avares://Semi.Avalonia/Controls/DropdownButton.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia/Controls/DropDownButton.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia/Controls/EmbeddableControlRoot.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/Expander.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/FlyoutPresenter.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/GridSplitter.axaml" />

src/Semi.Avalonia/Controls/DatePicker.axaml

@@ -92,8 +92,7 @@
                                 <PathIcon
                                     Width="12"
                                     Height="12"
-                                    Data="{DynamicResource DateTimePickerAcceptGlyph}"
-                                    Foreground="{Binding $parent[ContentPresenter].Foreground}" />
+                                    Data="{DynamicResource DateTimePickerAcceptGlyph}" />
                             </Button>
                             <Button
                                 Name="PART_DismissButton"
@@ -105,8 +104,7 @@
                                 <PathIcon
                                     Width="12"
                                     Height="12"
-                                    Data="{DynamicResource DateTimePickerDismissGlyph}"
-                                    Foreground="{Binding $parent[ContentPresenter].Foreground}" />
+                                    Data="{DynamicResource DateTimePickerDismissGlyph}" />
                             </Button>
                             <Rectangle
                                 Grid.ColumnSpan="2"
@@ -214,7 +212,7 @@
                     <Popup
                         Name="PART_Popup"
                         IsLightDismissEnabled="True"
-                        PlacementMode="Bottom"
+                        Placement="Bottom"
                         PlacementTarget="{TemplateBinding}"
                         WindowManagerAddShadowHint="False">
                         <DatePickerPresenter Name="PART_PickerPresenter" />

src/Semi.Avalonia/Controls/DateTimePickerShared.axaml

@@ -103,8 +103,7 @@
                     Height="8"
                     HorizontalAlignment="Center"
                     VerticalAlignment="Center"
-                    Data="{DynamicResource DateTimePickerButtonUpGlyph}"
-                    Foreground="{Binding $parent[ContentPresenter].Foreground}" />
+                    Data="{DynamicResource DateTimePickerButtonUpGlyph}" />
             </Template>
         </Setter>
     </ControlTheme>
@@ -125,8 +124,7 @@
                     Height="8"
                     HorizontalAlignment="Center"
                     VerticalAlignment="Center"
-                    Data="{DynamicResource DateTimePickerButtonDownGlyph}"
-                    Foreground="{Binding $parent[ContentPresenter].Foreground}" />
+                    Data="{DynamicResource DateTimePickerButtonDownGlyph}" />
             </Template>
         </Setter>
     </ControlTheme>

src/Semi.Avalonia/Controls/DropDownButton.axaml

@@ -16,6 +16,7 @@
         <Setter Property="DropDownButton.HorizontalContentAlignment" Value="Center" />
         <Setter Property="DropDownButton.VerticalContentAlignment" Value="Center" />
         <Setter Property="DropDownButton.MinHeight" Value="12" />
+        <Setter Property="DropDownButton.Cursor" Value="Hand" />
         <Setter Property="Template">
             <ControlTemplate TargetType="DropDownButton">
                 <Border
@@ -43,8 +44,8 @@
                             Margin="0,0,8,0"
                             HorizontalAlignment="Right"
                             VerticalAlignment="Center"
-                            Data="{DynamicResource DropdownButtonIconGlyph}"
-                            Foreground="{DynamicResource ComboBoxDropDownGlyphForeground}"
+                            Data="{DynamicResource DropDownButtonIconGlyph}"
+                            Foreground="{TemplateBinding Foreground}"
                             IsHitTestVisible="False"
                             UseLayoutRounding="False" />
                     </Grid>
@@ -96,7 +97,7 @@
         </Style>
     </ControlTheme>
 
-    <ControlTheme x:Key="SolidDropdownButton" TargetType="DropDownButton">
+    <ControlTheme x:Key="SolidDropDownButton" TargetType="DropDownButton">
         <Setter Property="DropDownButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
         <Setter Property="DropDownButton.Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
         <Setter Property="DropDownButton.BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
@@ -109,6 +110,7 @@
         <Setter Property="DropDownButton.HorizontalContentAlignment" Value="Center" />
         <Setter Property="DropDownButton.VerticalContentAlignment" Value="Center" />
         <Setter Property="DropDownButton.MinHeight" Value="12" />
+        <Setter Property="DropDownButton.Cursor" Value="Hand" />
         <Setter Property="Template">
             <ControlTemplate TargetType="DropDownButton">
                 <Border
@@ -136,8 +138,8 @@
                             Margin="0,0,8,0"
                             HorizontalAlignment="Right"
                             VerticalAlignment="Center"
-                            Data="{DynamicResource DropdownButtonIconGlyph}"
-                            Foreground="{DynamicResource ComboBoxDropDownGlyphForeground}"
+                            Data="{DynamicResource DropDownButtonIconGlyph}"
+                            Foreground="{TemplateBinding Foreground}"
                             IsHitTestVisible="False"
                             UseLayoutRounding="False" />
                     </Grid>
@@ -223,7 +225,7 @@
     </ControlTheme>
 
     <ControlTheme
-        x:Key="BorderlessDropdownButton"
+        x:Key="BorderlessDropDownButton"
         BasedOn="{StaticResource {x:Type DropDownButton}}"
         TargetType="DropDownButton">
         <Setter Property="DropDownButton.Background" Value="Transparent" />

src/Semi.Avalonia/Controls/EmbeddableControlRoot.axaml

@@ -0,0 +1,26 @@
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <!--  Add Resources Here  -->
+
+    <ControlTheme x:Key="{x:Type EmbeddableControlRoot}" TargetType="EmbeddableControlRoot">
+        <Setter Property="Background" Value="{DynamicResource WindowDefaultBackground}" />
+        <Setter Property="Foreground" Value="{DynamicResource WindowDefaultForeground}" />
+        <Setter Property="FontSize" Value="{DynamicResource DefaultFontSize}" />
+        <Setter Property="FontFamily" Value="{DynamicResource DefaultFontFamily}" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Panel>
+                    <Border Name="PART_TransparencyFallback" IsHitTestVisible="False" />
+                    <Border Background="{TemplateBinding Background}">
+                        <VisualLayerManager>
+                            <ContentPresenter
+                                Name="PART_ContentPresenter"
+                                Margin="{TemplateBinding Padding}"
+                                Content="{TemplateBinding Content}"
+                                ContentTemplate="{TemplateBinding ContentTemplate}" />
+                        </VisualLayerManager>
+                    </Border>
+                </Panel>
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Semi.Avalonia/Controls/GridSplitter.axaml

@@ -6,6 +6,7 @@
         <Setter Property="Focusable" Value="True" />
         <Setter Property="MinWidth" Value="6" />
         <Setter Property="MinHeight" Value="6" />
+        <Setter Property="GridSplitter.ClipToBounds" Value="False" />
         <Setter Property="GridSplitter.Padding" Value="2" />
         <Setter Property="Background" Value="{DynamicResource GridSplitterBackground}" />
         <Setter Property="PreviewContent">

src/Semi.Avalonia/Controls/ListBox.axaml

@@ -70,9 +70,9 @@
             </Style>
         </Style>
 
-        <!--  PointerOver State  -->
+        <!--  Pointerover State  -->
         <Style Selector="^:pointerover">
-            <Setter Property="ListBoxItem.Background" Value="{DynamicResource ListBoxItemPointerOverBackground}" />
+            <Setter Property="ListBoxItem.Background" Value="{DynamicResource ListBoxItemPointeroverBackground}" />
         </Style>
 
         <!--  Pressed State  -->

src/Semi.Avalonia/Controls/ManagedFileChooser.axaml

@@ -31,7 +31,7 @@
                         <ListBox
                             x:Name="PART_QuickLinks"
                             Focusable="False"
-                            Items="{Binding QuickLinks}"
+                            ItemsSource="{Binding QuickLinks}"
                             SelectedIndex="{Binding QuickLinksSelectedIndex}">
                             <ListBox.ItemTemplate>
                                 <DataTemplate>
@@ -74,7 +74,7 @@
                                 Margin="8,0,0,0"
                                 DockPanel.Dock="Right"
                                 IsVisible="{Binding ShowFilters}"
-                                Items="{Binding Filters}"
+                                ItemsSource="{Binding Filters}"
                                 SelectedItem="{Binding SelectedFilter}" />
                             <TextBox
                                 IsVisible="{Binding !SelectingFolder}"
@@ -142,7 +142,7 @@
                             </Grid>
                             <ListBox
                                 Name="PART_Files"
-                                Items="{Binding Items}"
+                                ItemsSource="{Binding Items}"
                                 SelectedItems="{Binding SelectedItems}"
                                 SelectionMode="{Binding SelectionMode}">
                                 <ListBox.ItemTemplate>

src/Semi.Avalonia/Controls/Menu.axaml

@@ -65,25 +65,20 @@
                     <ScrollContentPresenter
                         Name="PART_ContentPresenter"
                         Margin="{TemplateBinding Padding}"
-                        CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
-                        CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
-                        Content="{TemplateBinding Content}"
-                        Extent="{TemplateBinding Extent,
-                                                 Mode=TwoWay}"
-                        Viewport="{TemplateBinding Viewport,
-                                                   Mode=TwoWay}"
-                        Offset="{TemplateBinding Offset,
-                                                 Mode=TwoWay}">
+                        HorizontalSnapPointsAlignment="{TemplateBinding HorizontalSnapPointsAlignment}"
+                        HorizontalSnapPointsType="{TemplateBinding HorizontalSnapPointsType}"
+                        VerticalSnapPointsAlignment="{TemplateBinding VerticalSnapPointsAlignment}"
+                        VerticalSnapPointsType="{TemplateBinding VerticalSnapPointsType}">
                         <ScrollContentPresenter.GestureRecognizers>
-                            <ScrollGestureRecognizer CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
+                            <ScrollGestureRecognizer
+                                CanHorizontallyScroll="{Binding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
+                                CanVerticallyScroll="{Binding CanVerticallyScroll, ElementName=PART_ContentPresenter}"
+                                IsScrollInertiaEnabled="{Binding IsScrollInertiaEnabled, RelativeSource={RelativeSource TemplatedParent}}" />
                         </ScrollContentPresenter.GestureRecognizers>
                     </ScrollContentPresenter>
                 </DockPanel>
             </ControlTemplate>
         </Setter>
-        <Style Selector="^ /template/ RepeatButton:pointerover &gt; PathIcon">
-            <Setter Property="Foreground" Value="{DynamicResource ScrollBarButtonArrowForegroundPointerOver}" />
-        </Style>
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type Separator}" TargetType="Separator">
@@ -179,7 +174,7 @@
                         IsLightDismissEnabled="False"
                         IsOpen="{TemplateBinding IsSubMenuOpen,
                                                  Mode=TwoWay}"
-                        PlacementMode="Right"
+                        Placement="RightEdgeAlignedTop"
                         VerticalOffset="-4"
                         WindowManagerAddShadowHint="False">
                         <Border
@@ -235,7 +230,7 @@
         </Style>
 
         <Style Selector="^:open /template/ PathIcon#PART_ExpandIcon">
-            <Setter Property="Foreground" Value="{DynamicResource MenuFlyoutSubItemChevronSubMenuOpened}" />
+            <Setter Property="Foreground" Value="{DynamicResource MenuItemExpandIconOpenForeground}" />
         </Style>
 
         <Style Selector="^:empty /template/ PathIcon#PART_ExpandIcon">
@@ -281,6 +276,7 @@
                             IsOpen="{TemplateBinding IsSubMenuOpen,
                                                      Mode=TwoWay}"
                             OverlayInputPassThroughElement="{Binding $parent[Menu]}"
+                            Placement="BottomEdgeAlignedLeft"
                             VerticalOffset="-4"
                             WindowManagerAddShadowHint="False">
                             <Border

src/Semi.Avalonia/Controls/NumericUpDown.axaml

@@ -5,6 +5,7 @@
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type NumericUpDown}" TargetType="NumericUpDown">
         <Setter Property="NumericUpDown.VerticalContentAlignment" Value="Center" />
+        <Setter Property="NumericUpDown.MinHeight" Value="{DynamicResource NumericUpDownWrapperDefaultHeight}" />
         <Setter Property="NumericUpDown.CornerRadius" Value="{DynamicResource NumericUpDownCornerRadius}" />
         <Setter Property="NumericUpDown.Template">
             <ControlTemplate TargetType="NumericUpDown">
@@ -21,6 +22,8 @@
                     ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}">
                     <TextBox
                         Name="PART_TextBox"
+                        Height="{TemplateBinding Height}"
+                        MinHeight="{TemplateBinding MinHeight}"
                         HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                         VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                         AcceptsReturn="False"
@@ -34,6 +37,13 @@
                 </ButtonSpinner>
             </ControlTemplate>
         </Setter>
+
+        <Style Selector="^.Large">
+            <Setter Property="MinHeight" Value="{DynamicResource NumericUpDownWrapperLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="MinHeight" Value="{DynamicResource NumericUpDownWrapperSmallHeight}" />
+        </Style>
     </ControlTheme>
 
 </ResourceDictionary>

src/Semi.Avalonia/Controls/RadioButton.axaml

@@ -35,7 +35,7 @@
                     BorderThickness="{TemplateBinding BorderThickness}"
                     CornerRadius="{TemplateBinding CornerRadius}">
                     <Grid ColumnDefinitions="Auto,*">
-                        <Grid Margin="{DynamicResource RadioButtonIconMargin}" VerticalAlignment="Top">
+                        <Grid Margin="{DynamicResource RadioButtonIconMargin}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                             <Ellipse
                                 Name="OuterEllipse"
                                 Width="{DynamicResource RadioButtonIconRadius}"
@@ -72,37 +72,7 @@
             </ControlTemplate>
         </Setter>
 
-        <!--  PointerOver State  -->
-        <Style Selector="^:checked">
-            <Style Selector="^ /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDefaultBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDefaultBackground}" />
-            </Style>
-            <Style Selector="^ /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="1" />
-            </Style>
-            <Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDisabledBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
-            </Style>
-            <Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="1" />
-            </Style>
-            <Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointOverBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointOverBackground}" />
-            </Style>
-            <Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="1" />
-            </Style>
-            <Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPressedBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPressedBackground}" />
-            </Style>
-            <Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="1" />
-            </Style>
-        </Style>
+        <!--  Unchecked State  -->
         <Style Selector="^:unchecked">
             <Style Selector="^ /template/ Ellipse#OuterEllipse">
                 <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}" />
@@ -111,32 +81,95 @@
             <Style Selector="^ /template/ Ellipse#CheckGlyph">
                 <Setter Property="Ellipse.Opacity" Value="0" />
             </Style>
-            <Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDisabledBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDisabledBackground}" />
+
+            <!--  Unchecked Pointerover State  -->
+            <Style Selector="^:pointerover">
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPointeroverBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPointeroverBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="0" />
+                </Style>
             </Style>
-            <Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="0" />
+
+            <!--  Unchecked Pressed State  -->
+            <Style Selector="^:pressed">
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPressedBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPressedBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="0" />
+                </Style>
             </Style>
-            <Style Selector="^:pointerover /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPointOverBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPointOverBackground}" />
+
+            <!--  Unchecked Disabled state  -->
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDisabledBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDisabledBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="0" />
+                </Style>
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
+                </Style>
             </Style>
-            <Style Selector="^:pointerover /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="0" />
+        </Style>
+
+        <!--  Checked State  -->
+        <Style Selector="^:checked">
+            <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDefaultBorderBrush}" />
+                <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDefaultBackground}" />
             </Style>
-            <Style Selector="^:pressed /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPressedBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconPressedBackground}" />
+            <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                <Setter Property="Ellipse.Opacity" Value="1" />
             </Style>
-            <Style Selector="^:pressed /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="0" />
+
+            <!--  Checked Pointerover State  -->
+            <Style Selector="^:pointerover">
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointeroverBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointeroverBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="1" />
+                </Style>
+            </Style>
+
+            <!--  Checked Pressed State  -->
+            <Style Selector="^:pressed">
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPressedBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPressedBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="1" />
+                </Style>
+            </Style>
+
+            <!--  Checked Disabled State  -->
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDisabledBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="1" />
+                </Style>
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
+                </Style>
             </Style>
         </Style>
     </ControlTheme>
 
     <ControlTheme x:Key="ButtonRadioButton" TargetType="RadioButton">
         <Setter Property="RadioButton.CornerRadius" Value="{DynamicResource RadioButtonButtonCornerRadius}" />
+        <Setter Property="RadioButton.VerticalContentAlignment" Value="Center" />
         <Setter Property="RadioButton.Margin" Value="2" />
         <Setter Property="RadioButton.Cursor" Value="Hand" />
         <Setter Property="RadioButton.FontWeight" Value="{DynamicResource RadioButtonButtonFontWeight}" />
@@ -163,15 +196,21 @@
                     UseLayoutRounding="False" />
             </ControlTemplate>
         </Setter>
-        <Style Selector="^:checked">
-            <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonButtonCheckedBackground}" />
-            <Setter Property="RadioButton.Foreground" Value="{DynamicResource RadioButtonButtonCheckedForeground}" />
-        </Style>
         <Style Selector="^:unchecked">
             <Setter Property="RadioButton.Background" Value="Transparent" />
             <Style Selector="^:pointerover">
                 <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonButtonUncheckedPointeroverBackground}" />
             </Style>
+            <Style Selector="^:disabled">
+                <Setter Property="RadioButton.Foreground" Value="{DynamicResource RadioButtonButtonUncheckedDisabledForeground}" />
+            </Style>
+        </Style>
+        <Style Selector="^:checked">
+            <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonButtonCheckedBackground}" />
+            <Setter Property="RadioButton.Foreground" Value="{DynamicResource RadioButtonButtonCheckedForeground}" />
+            <Style Selector="^:disabled">
+                <Setter Property="RadioButton.Foreground" Value="{DynamicResource RadioButtonButtonCheckedDisabledForeground}" />
+            </Style>
         </Style>
         <Style Selector="^.Small">
             <Setter Property="RadioButton.FontSize" Value="{DynamicResource RadioButtonButtonSmallFontSize}" />
@@ -189,7 +228,7 @@
         <Setter Property="RadioButton.CornerRadius" Value="{DynamicResource RadioButtonCardCornerRadius}" />
         <Setter Property="RadioButton.Cursor" Value="Hand" />
         <Setter Property="RadioButton.HorizontalAlignment" Value="Left" />
-        <Setter Property="RadioButton.VerticalAlignment" Value="Top" />
+        <Setter Property="RadioButton.VerticalAlignment" Value="Center" />
         <Setter Property="RadioButton.HorizontalContentAlignment" Value="Left" />
         <Setter Property="RadioButton.VerticalContentAlignment" Value="Center" />
         <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardDefaultBackground}" />
@@ -204,7 +243,10 @@
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     CornerRadius="{TemplateBinding CornerRadius}">
-                    <Grid ColumnDefinitions="Auto,*">
+                    <Grid
+                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
+                        ColumnDefinitions="Auto,*">
                         <Grid Margin="{DynamicResource RadioButtonIconMargin}" VerticalAlignment="Top">
                             <Ellipse
                                 Name="OuterEllipse"
@@ -229,7 +271,6 @@
                         <ContentPresenter
                             Name="PART_ContentPresenter"
                             Grid.Column="1"
-                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                             VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                             Content="{TemplateBinding Content}"
                             ContentTemplate="{TemplateBinding ContentTemplate}"
@@ -242,7 +283,54 @@
             </ControlTemplate>
         </Setter>
 
-        <!--  PointerOver State  -->
+        <!--  Unchecked State  -->
+        <Style Selector="^:unchecked">
+            <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}" />
+                <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDefaultBackground}" />
+            </Style>
+            <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                <Setter Property="Ellipse.Opacity" Value="0" />
+            </Style>
+
+            <!--  Unchecked Pointerover State  -->
+            <Style Selector="^:pointerover">
+                <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardUncheckPointeroverBackground}" />
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPointeroverBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="0" />
+                </Style>
+            </Style>
+
+            <!--  Unchecked Pressed State  -->
+            <Style Selector="^:pressed">
+                <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardUncheckPressedBackground}" />
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPressedBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="0" />
+                </Style>
+            </Style>
+
+            <!--  Unchecked Disabled state  -->
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Ellipse#OuterEllipse">
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDisabledBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDisabledBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Ellipse#CheckGlyph">
+                    <Setter Property="Ellipse.Opacity" Value="0" />
+                </Style>
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
+                </Style>
+            </Style>
+        </Style>
+
+        <!--  Checked State  -->
         <Style Selector="^:checked">
             <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardCheckedBackground}" />
             <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckDefaultBorderBrush}" />
@@ -253,27 +341,24 @@
             <Style Selector="^ /template/ Ellipse#CheckGlyph">
                 <Setter Property="Ellipse.Opacity" Value="1" />
             </Style>
-            <Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDisabledBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
-            </Style>
-            <Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="1" />
-            </Style>
+
+            <!--  Checked Pointerover State  -->
             <Style Selector="^:pointerover">
-                <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckPointOverBorderBrush}" />
+                <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckPointeroverBorderBrush}" />
                 <Style Selector="^ /template/ Ellipse#OuterEllipse">
-                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointOverBorderBrush}" />
-                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointOverBackground}" />
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointeroverBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointeroverBackground}" />
                 </Style>
                 <Style Selector="^ /template/ Ellipse#OuterEllipse">
-                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointOverBorderBrush}" />
-                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointOverBackground}" />
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconPointeroverBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconPointeroverBackground}" />
                 </Style>
                 <Style Selector="^ /template/ Ellipse#CheckGlyph">
                     <Setter Property="Ellipse.Opacity" Value="1" />
                 </Style>
             </Style>
+
+            <!--  Checked Pressed State  -->
             <Style Selector="^:pressed">
                 <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckPressedBorderBrush}" />
                 <Style Selector="^ /template/ Ellipse#OuterEllipse">
@@ -284,38 +369,22 @@
                     <Setter Property="Ellipse.Opacity" Value="1" />
                 </Style>
             </Style>
-        </Style>
-        <Style Selector="^:unchecked">
-            <Style Selector="^ /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDefaultBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDefaultBackground}" />
-            </Style>
-            <Style Selector="^ /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="0" />
-            </Style>
-            <Style Selector="^:disabled /template/ Ellipse#OuterEllipse">
-                <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconDisabledBorderBrush}" />
-                <Setter Property="Fill" Value="{DynamicResource RadioButtonUncheckIconDisabledBackground}" />
-            </Style>
-            <Style Selector="^:disabled /template/ Ellipse#CheckGlyph">
-                <Setter Property="Ellipse.Opacity" Value="0" />
-            </Style>
-            <Style Selector="^:pointerover">
-                <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardUncheckPointOverBackground}" />
+
+            <!--  Checked Disabled State  -->
+            <Style Selector="^:disabled">
                 <Style Selector="^ /template/ Ellipse#OuterEllipse">
-                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPointOverBorderBrush}" />
+                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonCheckIconDisabledBorderBrush}" />
+                    <Setter Property="Fill" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
                 </Style>
                 <Style Selector="^ /template/ Ellipse#CheckGlyph">
-                    <Setter Property="Ellipse.Opacity" Value="0" />
+                    <Setter Property="Ellipse.Opacity" Value="1" />
                 </Style>
-            </Style>
-            <Style Selector="^:pressed">
-                <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardUncheckPressedBackground}" />
-                <Style Selector="^ /template/ Ellipse#OuterEllipse">
-                    <Setter Property="Stroke" Value="{DynamicResource RadioButtonUncheckIconPressedBorderBrush}" />
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource RadioButtonCardCheckedBackground}" />
                 </Style>
-                <Style Selector="^ /template/ Ellipse#CheckGlyph">
-                    <Setter Property="Ellipse.Opacity" Value="0" />
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
                 </Style>
             </Style>
         </Style>
@@ -324,10 +393,10 @@
     <ControlTheme x:Key="PureCardRadioButton" TargetType="RadioButton">
         <Setter Property="RadioButton.CornerRadius" Value="{DynamicResource RadioButtonCardCornerRadius}" />
         <Setter Property="RadioButton.Cursor" Value="Hand" />
+        <Setter Property="RadioButton.VerticalContentAlignment" Value="Center" />
         <Setter Property="RadioButton.BorderThickness" Value="1" />
         <Setter Property="RadioButton.FontSize" Value="{DynamicResource RadioButtonFontSize}" />
         <Setter Property="RadioButton.Padding" Value="{DynamicResource RadioButtonCardPadding}" />
-        <Setter Property="RadioButton.Foreground" Value="{DynamicResource RadioButtonButtonUncheckedForeground}" />
         <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardDefaultBackground}" />
         <Setter Property="RadioButton.Template">
             <ControlTemplate TargetType="RadioButton">
@@ -344,29 +413,40 @@
                     ContentTemplate="{TemplateBinding ContentTemplate}"
                     CornerRadius="{TemplateBinding CornerRadius}"
                     RecognizesAccessKey="True"
-                    TextElement.FontSize="{TemplateBinding FontSize}"
-                    TextElement.FontWeight="{TemplateBinding FontWeight}"
                     UseLayoutRounding="False" />
             </ControlTemplate>
         </Setter>
-        <Style Selector="^:checked">
-            <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardCheckedBackground}" />
-            <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckDefaultBorderBrush}" />
-            <Style Selector="^:pointerover">
-                <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckPointOverBorderBrush}" />
-            </Style>
-            <Style Selector="^:pressed">
-                <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckPressedBorderBrush}" />
-            </Style>
-        </Style>
         <Style Selector="^:unchecked">
             <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardDefaultBorderBrush}" />
             <Style Selector="^:pointerover">
-                <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardUncheckPointOverBackground}" />
+                <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardUncheckPointeroverBackground}" />
             </Style>
             <Style Selector="^:pressed">
                 <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardUncheckPressedBackground}" />
             </Style>
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
+                </Style>
+            </Style>
         </Style>
+        <Style Selector="^:checked">
+            <Setter Property="RadioButton.Background" Value="{DynamicResource RadioButtonCardCheckedBackground}" />
+            <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckDefaultBorderBrush}" />
+            <Style Selector="^:pointerover">
+                <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="RadioButton.BorderBrush" Value="{DynamicResource RadioButtonCardCheckPressedBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled">
+                <Setter Property="BorderBrush" Value="{DynamicResource RadioButtonCheckIconDisabledBackground}" />
+                <Setter Property="Background" Value="{DynamicResource RadioButtonCardCheckedBackground}" />
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource RadioButtonDisabledForeground}" />
+                </Style>
+            </Style>
+        </Style>
+
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/RepeatButton.axaml

@@ -15,6 +15,7 @@
         <Setter Property="RepeatButton.HorizontalContentAlignment" Value="Center" />
         <Setter Property="RepeatButton.VerticalContentAlignment" Value="Center" />
         <Setter Property="RepeatButton.MinHeight" Value="12" />
+        <Setter Property="RepeatButton.Cursor" Value="Hand" />
         <Setter Property="RepeatButton.Template">
             <ControlTemplate TargetType="RepeatButton">
                 <ContentPresenter

src/Semi.Avalonia/Controls/ScrollViewer.axaml

@@ -197,7 +197,7 @@
             <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonDefaultForeground}" />
         </Style>
         <Style Selector="^ /template/ RepeatButton:pointerover &gt; Path">
-            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonPointerOverForeground}" />
+            <Setter Property="Fill" Value="{DynamicResource ScrollBarButtonPointeroverForeground}" />
         </Style>
 
     </ControlTheme>
@@ -210,48 +210,27 @@
                         Name="PART_ContentPresenter"
                         Padding="{TemplateBinding Padding}"
                         Background="{TemplateBinding Background}"
-                        CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
-                        CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
-                        Content="{TemplateBinding Content}"
-                        Extent="{TemplateBinding Extent,
-                                                 Mode=TwoWay}"
-                        IsScrollChainingEnabled="{TemplateBinding IsScrollChainingEnabled}"
-                        Viewport="{TemplateBinding Viewport,
-                                                   Mode=TwoWay}"
-                        Offset="{TemplateBinding Offset,
-                                                 Mode=TwoWay}">
+                        HorizontalSnapPointsAlignment="{TemplateBinding HorizontalSnapPointsAlignment}"
+                        HorizontalSnapPointsType="{TemplateBinding HorizontalSnapPointsType}"
+                        VerticalSnapPointsAlignment="{TemplateBinding VerticalSnapPointsAlignment}"
+                        VerticalSnapPointsType="{TemplateBinding VerticalSnapPointsType}">
                         <ScrollContentPresenter.GestureRecognizers>
-                            <ScrollGestureRecognizer CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}" CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}" />
+                            <ScrollGestureRecognizer
+                                CanHorizontallyScroll="{Binding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
+                                CanVerticallyScroll="{Binding CanVerticallyScroll, ElementName=PART_ContentPresenter}"
+                                IsScrollInertiaEnabled="{Binding IsScrollInertiaEnabled, RelativeSource={RelativeSource TemplatedParent}}" />
                         </ScrollContentPresenter.GestureRecognizers>
                     </ScrollContentPresenter>
                     <ScrollBar
-                        Name="horizontalScrollBar"
+                        Name="PART_HorizontalScrollBar"
                         Grid.Row="1"
                         Grid.Column="0"
-                        Focusable="False"
-                        LargeChange="{Binding LargeChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                        Maximum="{TemplateBinding HorizontalScrollBarMaximum}"
-                        Opacity="0"
-                        Orientation="Horizontal"
-                        SmallChange="{Binding SmallChange.Width, RelativeSource={RelativeSource TemplatedParent}}"
-                        ViewportSize="{TemplateBinding HorizontalScrollBarViewportSize}"
-                        Visibility="{TemplateBinding HorizontalScrollBarVisibility}"
-                        Value="{TemplateBinding HorizontalScrollBarValue,
-                                                Mode=TwoWay}" />
+                        Orientation="Horizontal" />
                     <ScrollBar
-                        Name="verticalScrollBar"
+                        Name="PART_VerticalScrollBar"
                         Grid.Row="0"
                         Grid.Column="1"
-                        Focusable="False"
-                        LargeChange="{Binding LargeChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
-                        Maximum="{TemplateBinding VerticalScrollBarMaximum}"
-                        Opacity="0"
-                        Orientation="Vertical"
-                        SmallChange="{Binding SmallChange.Height, RelativeSource={RelativeSource TemplatedParent}}"
-                        ViewportSize="{TemplateBinding VerticalScrollBarViewportSize}"
-                        Visibility="{TemplateBinding VerticalScrollBarVisibility}"
-                        Value="{TemplateBinding VerticalScrollBarValue,
-                                                Mode=TwoWay}" />
+                        Orientation="Vertical" />
                     <Panel
                         Grid.Row="1"
                         Grid.Column="1"
@@ -304,18 +283,7 @@
                         </RepeatButton.IsVisible>
                         <Path Data="M 0 0 L 4 4 L 8 0 Z" />
                     </RepeatButton>
-                    <ScrollContentPresenter
-                        Name="PART_ContentPresenter"
-                        Margin="{TemplateBinding Padding}"
-                        CanHorizontallyScroll="{TemplateBinding CanHorizontallyScroll}"
-                        CanVerticallyScroll="{TemplateBinding CanVerticallyScroll}"
-                        Content="{TemplateBinding Content}"
-                        Extent="{TemplateBinding Extent,
-                                                 Mode=TwoWay}"
-                        Viewport="{TemplateBinding Viewport,
-                                                   Mode=TwoWay}"
-                        Offset="{TemplateBinding Offset,
-                                                 Mode=TwoWay}" />
+                    <ScrollContentPresenter Name="PART_ContentPresenter" Margin="{TemplateBinding Padding}" />
                 </DockPanel>
             </ControlTemplate>
         </Setter>
@@ -324,7 +292,7 @@
         </Style>
 
         <Style Selector="^ /template/ RepeatButton:pointerover &gt; Path">
-            <Setter Property="Fill" Value="{DynamicResource ColorScrollBarButtonPointerOverForeground}" />
+            <Setter Property="Fill" Value="{DynamicResource ColorScrollBarButtonPointeroverForeground}" />
         </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/SplitButton.axaml

@@ -110,10 +110,100 @@
                 <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
             </Style>
         </Style>
-
+        <Style Selector="^.Large /template/ Button">
+            <Setter Property="Padding" Value="{DynamicResource ButtonLargePadding}" />
+        </Style>
+        <Style Selector="^.Small /template/ Button">
+            <Setter Property="Padding" Value="{DynamicResource ButtonSmallPadding}" />
+        </Style>
         <Style Selector="^:disabled /template/ Button">
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
     </ControlTheme>
+
+    <ControlTheme
+        x:Key="SolidSplitButton"
+        BasedOn="{StaticResource {x:Type SplitButton}}"
+        TargetType="SplitButton">
+        <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+        <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
+        <Style Selector="^ /template/ Button">
+            <Style Selector="^:pointerover">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^.Primary /template/ Button">
+            <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
+            <Style Selector="^:pointerover">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Secondary /template/ Button">
+            <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
+            <Style Selector="^:pointerover">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidSecondaryPointeroverBackground}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidSecondaryPressedBackground}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Tertiary /template/ Button">
+            <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
+            <Style Selector="^:pointerover">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidTertiaryPointeroverBackground}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidTertiaryPressedBackground}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Warning /template/ Button">
+            <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
+            <Style Selector="^:pointerover">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidWarningPointeroverBackground}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidWarningPressedBackground}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Danger /template/ Button">
+            <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
+            <Style Selector="^:pointerover">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidDangerPointeroverBackground}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonSolidDangerPressedBackground}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^:disabled /template/ Button">
+            <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
+            <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme
+        x:Key="BorderlessSplitButton"
+        BasedOn="{StaticResource {x:Type SplitButton}}"
+        TargetType="SplitButton">
+        <Setter Property="SplitButton.Background" Value="Transparent" />
+        <Setter Property="SplitButton.BorderBrush" Value="Transparent" />
+        <Style Selector="^:disabled /template/ Button">
+            <Setter Property="SplitButton.BorderBrush" Value="Transparent" />
+            <Setter Property="SplitButton.Background" Value="Transparent" />
+            <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
+        </Style>
+    </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/TextBox.axaml

@@ -61,7 +61,7 @@
                     </ControlTemplate>
                 </Setter>
                 <Style Selector="^:pointerover">
-                    <Setter Property="Button.Foreground" Value="{DynamicResource TextBoxButtonPointerOverForeground}" />
+                    <Setter Property="Button.Foreground" Value="{DynamicResource TextBoxButtonPointeroverForeground}" />
                 </Style>
             </ControlTheme>
             <ControlTheme x:Key="InputToggleButton" TargetType="ToggleButton">
@@ -94,7 +94,7 @@
         <Setter Property="TextBox.BorderThickness" Value="{DynamicResource TextBoxBorderThickness}" />
         <Setter Property="TextBox.CornerRadius" Value="{DynamicResource TextBoxDefaultCornerRadius}" />
         <Setter Property="TextBox.FontSize" Value="14" />
-        <Setter Property="TextBox.Cursor" Value="IBeam" />
+        <Setter Property="TextBox.Cursor" Value="Ibeam" />
         <Setter Property="TextBox.CaretBrush" Value="{DynamicResource TextBoxTextCaretBrush}" />
         <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperDefaultHeight}" />
         <Setter Property="TextBox.Padding" Value="{DynamicResource TextBoxContentPadding}" />

src/Semi.Avalonia/Controls/TimePicker.axaml

@@ -96,8 +96,7 @@
                                 <PathIcon
                                     Width="12"
                                     Height="12"
-                                    Data="{DynamicResource DateTimePickerAcceptGlyph}"
-                                    Foreground="{Binding $parent[ContentPresenter].Foreground}" />
+                                    Data="{DynamicResource DateTimePickerAcceptGlyph}" />
                             </Button>
                             <Button
                                 Name="PART_DismissButton"
@@ -109,8 +108,7 @@
                                 <PathIcon
                                     Width="12"
                                     Height="12"
-                                    Data="{DynamicResource DateTimePickerDismissGlyph}"
-                                    Foreground="{Binding $parent[ContentPresenter].Foreground}" />
+                                    Data="{DynamicResource DateTimePickerDismissGlyph}" />
                             </Button>
                             <Rectangle
                                 Grid.ColumnSpan="2"
@@ -235,7 +233,7 @@
                     <Popup
                         Name="PART_Popup"
                         IsLightDismissEnabled="True"
-                        PlacementMode="Bottom"
+                        Placement="Bottom"
                         PlacementTarget="{TemplateBinding}"
                         WindowManagerAddShadowHint="False">
                         <TimePickerPresenter Name="PART_PickerPresenter" />

src/Semi.Avalonia/Controls/ToggleButton.axaml

@@ -4,17 +4,17 @@
     x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20">
-            <ToggleButton>Toggle</ToggleButton>
+            <ToggleButton Classes="Primary">Toggle</ToggleButton>
             <ToggleButton Classes="Secondary">Toggle</ToggleButton>
             <ToggleButton Classes="Tertiary">Toggle</ToggleButton>
             <ToggleButton Classes="Warning">Toggle</ToggleButton>
-            <ToggleButton Classes="Error">Toggle</ToggleButton>
+            <ToggleButton Classes="Danger">Toggle</ToggleButton>
 
-            <ToggleButton IsThreeState="True">Toggle 3</ToggleButton>
+            <ToggleButton Classes="Primary" IsThreeState="True">Toggle 3</ToggleButton>
             <ToggleButton Classes="Secondary" IsThreeState="True">Toggle 3</ToggleButton>
             <ToggleButton Classes="Tertiary" IsThreeState="True">Toggle 3</ToggleButton>
             <ToggleButton Classes="Warning" IsThreeState="True">Toggle 3</ToggleButton>
-            <ToggleButton Classes="Error" IsThreeState="True">Toggle 3</ToggleButton>
+            <ToggleButton Classes="Danger" IsThreeState="True">Toggle 3</ToggleButton>
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type ToggleButton}" TargetType="ToggleButton">
@@ -30,6 +30,7 @@
         <Setter Property="ToggleButton.HorizontalContentAlignment" Value="Center" />
         <Setter Property="ToggleButton.VerticalContentAlignment" Value="Center" />
         <Setter Property="ToggleButton.MinHeight" Value="12" />
+        <Setter Property="ToggleButton.Cursor" Value="Hand" />
         <Setter Property="ToggleButton.Template">
             <ControlTemplate TargetType="ToggleButton">
                 <ContentPresenter
@@ -54,25 +55,21 @@
             <Setter Property="RenderTransform" Value="scale(0.98)" />
         </Style>
 
-        <Style Selector="^.Large">
-            <Setter Property="ToggleButton.Padding" Value="{DynamicResource ButtonLargePadding}" />
-        </Style>
-        <Style Selector="^.Small">
-            <Setter Property="ToggleButton.Padding" Value="{DynamicResource ButtonSmallPadding}" />
-        </Style>
-
-
         <Style Selector="^:pointerover">
             <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDefaultPointeroverBackground}" />
         </Style>
+
         <Style Selector="^:pressed">
             <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDefaultPressedBackground}" />
         </Style>
+
         <Style Selector="^:disabled">
-            <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultDisabledForeground}" />
-            <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDefaultDisabledBackground}" />
+            <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonDefaultDisabledBorderBrush}" />
         </Style>
 
+        <Style Selector="^.Primary">
+            <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultPrimaryForeground}" />
+        </Style>
         <Style Selector="^.Secondary">
             <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultSecondaryForeground}" />
         </Style>
@@ -82,13 +79,16 @@
         <Style Selector="^.Warning">
             <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultWarningForeground}" />
         </Style>
-        <Style Selector="^.Error">
-            <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultErrorForeground}" />
+        <Style Selector="^.Danger">
+            <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultDangerForeground}" />
         </Style>
 
         <Style Selector="^:checked">
             <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonCheckedForeground}" />
             <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryCheckedBackground}" />
+            <Style Selector="^.Primary">
+                <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryCheckedBackground}" />
+            </Style>
             <Style Selector="^.Secondary">
                 <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonSecondaryCheckedBackground}" />
             </Style>
@@ -98,11 +98,14 @@
             <Style Selector="^.Warning">
                 <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonWarningCheckedBackground}" />
             </Style>
-            <Style Selector="^.Error">
-                <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonErrorCheckedBackground}" />
+            <Style Selector="^.Danger">
+                <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDangerCheckedBackground}" />
             </Style>
             <Style Selector="^:pointerover">
                 <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryCheckedPointeroverBackground}" />
+                <Style Selector="^.Primary">
+                    <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryCheckedPointeroverBackground}" />
+                </Style>
                 <Style Selector="^.Secondary">
                     <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonSecondaryCheckedPointeroverBackground}" />
                 </Style>
@@ -112,12 +115,15 @@
                 <Style Selector="^.Warning">
                     <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonWarningCheckedPointeroverBackground}" />
                 </Style>
-                <Style Selector="^.Error">
-                    <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonErrorCheckedPointeroverBackground}" />
+                <Style Selector="^.Danger">
+                    <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDangerCheckedPointeroverBackground}" />
                 </Style>
             </Style>
             <Style Selector="^:pressed">
                 <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryCheckedPressedBackground}" />
+                <Style Selector="^.Primary">
+                    <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryCheckedPressedBackground}" />
+                </Style>
                 <Style Selector="^.Secondary">
                     <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonSecondaryCheckedPressedBackground}" />
                 </Style>
@@ -127,15 +133,23 @@
                 <Style Selector="^.Warning">
                     <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonWarningCheckedPressedBackground}" />
                 </Style>
-                <Style Selector="^.Error">
-                    <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonErrorCheckedPressedBackground}" />
+                <Style Selector="^.Danger">
+                    <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDangerCheckedPressedBackground}" />
                 </Style>
             </Style>
+            <Style Selector="^:disabled">
+                <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonDefaultDisabledBorderBrush}" />
+            </Style>
         </Style>
+
         <Style Selector="^:indeterminate">
             <Setter Property="ToggleButton.BorderThickness" Value="1" />
             <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonPrimaryIndeterminateBorderBrush}" />
             <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryIndeterminateBackground}" />
+            <Style Selector="^.Primary">
+                <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonPrimaryIndeterminateBackground}" />
+                <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonPrimaryIndeterminateBorderBrush}" />
+            </Style>
             <Style Selector="^.Secondary">
                 <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonSecondaryIndeterminateBackground}" />
                 <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonSecondaryIndeterminateBorderBrush}" />
@@ -148,41 +162,73 @@
                 <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonWarningIndeterminateBackground}" />
                 <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonWarningIndeterminateBorderBrush}" />
             </Style>
-            <Style Selector="^.Error">
-                <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonErrorIndeterminateBackground}" />
-                <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonErrorIndeterminateBorderBrush}" />
+            <Style Selector="^.Danger">
+                <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDangerIndeterminateBackground}" />
+                <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonDangerIndeterminateBorderBrush}" />
             </Style>
             <Style Selector="^:pointerover">
                 <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePointeroverBorderBrush}" />
+                <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePointeroverForeground}" />
+                <Style Selector="^.Primary">
+                    <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePointeroverBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePointeroverForeground}" />
+                </Style>
                 <Style Selector="^.Secondary">
                     <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonSecondaryIndeterminatePointeroverBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonSecondaryIndeterminatePointeroverForeground}" />
                 </Style>
                 <Style Selector="^.Tertiary">
                     <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonTertiaryIndeterminatePointeroverBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonTertiaryIndeterminatePointeroverForeground}" />
                 </Style>
                 <Style Selector="^.Warning">
                     <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonWarningIndeterminatePointeroverBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonWarningIndeterminatePointeroverForeground}" />
                 </Style>
-                <Style Selector="^.Error">
-                    <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonErrorIndeterminatePointeroverBorderBrush}" />
+                <Style Selector="^.Danger">
+                    <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonDangerIndeterminatePointeroverBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDangerIndeterminatePointeroverForeground}" />
                 </Style>
             </Style>
             <Style Selector="^:pressed">
                 <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePressedBorderBrush}" />
+                <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePressedBorderBrush}" />
+                <Style Selector="^.Primary">
+                    <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePressedBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonPrimaryIndeterminatePressedForeground}" />
+                </Style>
                 <Style Selector="^.Secondary">
                     <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonSecondaryIndeterminatePressedBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonSecondaryIndeterminatePressedForeground}" />
                 </Style>
                 <Style Selector="^.Tertiary">
                     <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonTertiaryIndeterminatePressedBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonTertiaryIndeterminatePressedForeground}" />
                 </Style>
                 <Style Selector="^.Warning">
                     <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonWarningIndeterminatePressedBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonWarningIndeterminatePressedForeground}" />
                 </Style>
-                <Style Selector="^.Error">
-                    <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonErrorIndeterminatePressedBorderBrush}" />
+                <Style Selector="^.Danger">
+                    <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonDangerIndeterminatePressedBorderBrush}" />
+                    <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDangerIndeterminatePressedForeground}" />
                 </Style>
             </Style>
+            <Style Selector="^:disabled">
+                <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonIndeterminateDisabledBorderBrush}" />
+            </Style>
         </Style>
 
+        <Style Selector="^:disabled">
+            <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultDisabledForeground}" />
+            <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDefaultDisabledBackground}" />
+        </Style>
+
+        <Style Selector="^.Large">
+            <Setter Property="ToggleButton.Padding" Value="{DynamicResource ButtonLargePadding}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="ToggleButton.Padding" Value="{DynamicResource ButtonSmallPadding}" />
+        </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/ToggleSwitch.axaml

@@ -11,12 +11,10 @@
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type ToggleSwitch}" TargetType="ToggleSwitch">
-        <Setter Property="Foreground" Value="{DynamicResource ToggleSwitchContentForeground}" />
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="ToggleSwitch">
                 <Grid
@@ -128,7 +126,7 @@
                 <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedDefaultBackground}" />
             </Style>
             <Style Selector="^:pointerover /template/ Border#SwitchBackgroundBorder">
-                <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedPointerOverBackground}" />
+                <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedPointeroverBackground}" />
             </Style>
             <Style Selector="^:pressed /template/ Border#SwitchBackgroundBorder">
                 <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedPressedBackground}" />
@@ -151,7 +149,7 @@
                 <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedDefaultBackground}" />
             </Style>
             <Style Selector="^:pointerover /template/ Border#SwitchBackgroundBorder">
-                <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedPointerOverBackground}" />
+                <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedPointeroverBackground}" />
             </Style>
             <Style Selector="^:pressed /template/ Border#SwitchBackgroundBorder">
                 <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedPressedBackground}" />

src/Semi.Avalonia/Controls/TreeView.axaml

@@ -93,7 +93,6 @@
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type TreeViewItem}" TargetType="TreeViewItem">
-        <Setter Property="TreeViewItem.Padding" Value="0" />
         <Setter Property="TreeViewItem.Background" Value="{DynamicResource TreeViewItemDefaultBackground}" />
         <Setter Property="TreeViewItem.Foreground" Value="{DynamicResource TreeViewItemDefaultForeground}" />
         <Setter Property="TreeViewItem.CornerRadius" Value="3" />
@@ -144,9 +143,9 @@
             </ControlTemplate>
         </Setter>
 
-        <!--  PointerOver state  -->
+        <!--  Pointerover state  -->
         <Style Selector="^ /template/ Border#PART_LayoutRoot:pointerover">
-            <Setter Property="Background" Value="{DynamicResource TreeViewItemPointerOverBackground}" />
+            <Setter Property="Background" Value="{DynamicResource TreeViewItemPointeroverBackground}" />
         </Style>
 
         <!--  Pressed state  -->

src/Semi.Avalonia/Converters/ItemToObjectConverter.cs

@@ -3,6 +3,7 @@ using System.Collections.Generic;
 using System.Globalization;
 using System.Linq;
 using Avalonia.Collections;
+using Avalonia.Controls;
 using Avalonia.Data.Converters;
 
 namespace Semi.Avalonia.Converters;
@@ -11,7 +12,7 @@ public class ItemToObjectConverter: IValueConverter
 {
     public object Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
     {
-        if (value is AvaloniaList<object> list)
+        if (value is ItemCollection list)
         {
             return list.Select(a => new object());
         }

src/Semi.Avalonia/Semi.Avalonia.csproj

@@ -1,10 +1,10 @@
 <Project Sdk="Microsoft.NET.Sdk">
   
-  <Import Project="../Package.props"/>
+  <Import Project="../Package.props" />
   
   <PropertyGroup>
     <Title>Semi.Avalonia</Title>
-    <PackageReleaseNotes>Add new CheckBox Theme, Bug fixes. </PackageReleaseNotes>
+    <PackageReleaseNotes>Update to Avalonia 11.0.0-preview7</PackageReleaseNotes>
   </PropertyGroup>
 
   <ItemGroup>

src/Semi.Avalonia/Themes/Dark/CalendarDatePicker.axaml

@@ -1,6 +1,7 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--    -->
     <SolidColorBrush x:Key="CalendarDatePickerIconForeground" Opacity="0.62" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="CalendarDatePickerForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="CalendarDatePickerIconPointeroverForeground" Color="#F9F9F9" />
     <PathGeometry x:Key="CalendarDatePickerIconGlyph">M4 20V8H20V20H4ZM2 4C2 2.89543 2.89543 2 4 2H20C21.1046 2 22 2.89543 22 4V20C22 21.1046 21.1046 22 20 22H4C2.89543 22 2 21.1046 2 20V4ZM6 10.5C6 10.2239 6.22386 10 6.5 10H8.5C8.77614 10 9 10.2239 9 10.5V12.5C9 12.7761 8.77614 13 8.5 13H6.5C6.22386 13 6 12.7761 6 12.5V10.5ZM6.5 15C6.22386 15 6 15.2239 6 15.5V17.5C6 17.7761 6.22386 18 6.5 18H8.5C8.77614 18 9 17.7761 9 17.5V15.5C9 15.2239 8.77614 15 8.5 15H6.5ZM10.5 10.5C10.5 10.2239 10.7239 10 11 10H13C13.2761 10 13.5 10.2239 13.5 10.5V12.5C13.5 12.7761 13.2761 13 13 13H11C10.7239 13 10.5 12.7761 10.5 12.5V10.5ZM11 15C10.7239 15 10.5 15.2239 10.5 15.5V17.5C10.5 17.7761 10.7239 18 11 18H13C13.2761 18 13.5 17.7761 13.5 17.5V15.5C13.5 15.2239 13.2761 15 13 15H11ZM15 10.5C15 10.2239 15.2239 10 15.5 10H17.5C17.7761 10 18 10.2239 18 10.5V12.5C18 12.7761 17.7761 13 17.5 13H15.5C15.2239 13 15 12.7761 15 12.5V10.5ZM15.5 15C15.2239 15 15 15.2239 15 15.5V17.5C15 17.7761 15.2239 18 15.5 18H17.5C17.7761 18 18 17.7761 18 17.5V15.5C18 15.2239 17.7761 15 17.5 15H15.5Z</PathGeometry>
     <SolidColorBrush x:Key="CalendarDatePickerBackground" Opacity="0.12" Color="White" />

src/Semi.Avalonia/Themes/Dark/CheckBox.axaml

@@ -10,15 +10,15 @@
 
     <SolidColorBrush x:Key="CheckBoxDefaultBackground" Color="Transparent" />
     <SolidColorBrush x:Key="CheckBoxDefaultBorderBrush" Opacity="0.35" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="CheckBoxPointOverBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="CheckBoxPointOverBorderBrush" Color="#54A9FF" />
+    <SolidColorBrush x:Key="CheckBoxPointeroverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="CheckBoxPointeroverBorderBrush" Color="#54A9FF" />
     <SolidColorBrush x:Key="CheckBoxPressedBackground" Color="#A9D7FF" />
     <SolidColorBrush x:Key="CheckBoxPressedBorderBrush" Color="#A9D7FF" />
 
     <SolidColorBrush x:Key="CheckBoxCheckedDefaultBackground" Color="#54A9FF" />
     <SolidColorBrush x:Key="CheckBoxCheckedDefaultBorderBrush" Color="#54A9FF" />
-    <SolidColorBrush x:Key="CheckBoxCheckedPointOverBackground" Color="#7FC1FF" />
-    <SolidColorBrush x:Key="CheckBoxCheckedPointOverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPointeroverBackground" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPointeroverBorderBrush" Color="#7FC1FF" />
     <SolidColorBrush x:Key="CheckBoxCheckedPressedBackground" Color="#A9D7FF" />
     <SolidColorBrush x:Key="CheckBoxCheckedPressedBorderBrush" Color="#A9D7FF" />
 

src/Semi.Avalonia/Themes/Dark/ComboBox.axaml

@@ -1,16 +1,16 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <SolidColorBrush x:Key="ComboBoxSelectorBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="ComboBoxSelectorPointerOverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="ComboBoxSelectorPointeroverBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="ComboBoxSelectorPressedBackground" Opacity="0.20" Color="White" />
     <SolidColorBrush x:Key="ComboBoxSelectorDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
     <SolidColorBrush x:Key="ComboBoxSelectorBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="ComboBoxSelectorPointerOverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorPointeroverBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="ComboBoxSelectorPressedBorderBrush" Color="#A9D7FF" />
 
     <CornerRadius x:Key="ComboBoxSelectorCornerRadius">3</CornerRadius>
 
     <SolidColorBrush x:Key="ComboBoxIconDefaultForeground" Opacity="0.62" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="ComboBoxIconPointerOverForeground" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="ComboBoxIconPointeroverForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="ComboBoxIconPressedForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="ComboBoxIconDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
 
@@ -27,10 +27,10 @@
     <SolidColorBrush x:Key="ComboBoxItemForeground" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="ComboBoxItemBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="ComboBoxItemPointerOverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="ComboBoxItemPointeroverBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="ComboBoxItemPressedBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="ComboBoxItemSelectedBackground" Color="#053170" />
-    <SolidColorBrush x:Key="ComboBoxItemSelectedPointerOverBackground" Color="#0A4694" />
+    <SolidColorBrush x:Key="ComboBoxItemSelectedPointeroverBackground" Color="#0A4694" />
 
     <SolidColorBrush x:Key="ComboBoxItemDisabledBackground" Color="Transparent" />
     <SolidColorBrush x:Key="ComboBoxItemSelectedDisabledBackground" Opacity="0.04" Color="#E6E8EA" />

src/Semi.Avalonia/Themes/Dark/Dark.axaml

@@ -15,7 +15,7 @@
         <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/ComboBox.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/DatePicker.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml" />
-        <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/DropdownButton.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/DropDownButton.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/Expander.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/GridSplitter.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Themes/Dark/Label.axaml" />

src/Semi.Avalonia/Themes/Dark/DateTimePickerShared.axaml

@@ -20,7 +20,7 @@
     <PathGeometry x:Key="DateTimePickerDismissGlyph">M17.6568 19.7782C18.2426 20.3639 19.1924 20.3639 19.7782 19.7782C20.3639 19.1924 20.3639 18.2426 19.7782 17.6568L14.1213 12L19.7782 6.34313C20.3639 5.75734 20.3639 4.8076 19.7782 4.22181C19.1924 3.63602 18.2426 3.63602 17.6568 4.22181L12 9.87866L6.34313 4.22181C5.75734 3.63602 4.8076 3.63602 4.22181 4.22181C3.63602 4.8076 3.63602 5.75734 4.22181 6.34313L9.87866 12L4.22181 17.6568C3.63602 18.2426 3.63602 19.1924 4.22181 19.7782C4.8076 20.3639 5.75734 20.3639 6.34313 19.7782L12 14.1213L17.6568 19.7782Z</PathGeometry>
 
     <SolidColorBrush x:Key="DateTimePickerSeparatorBackground" Opacity="0.08" Color="#F9F9F9" />
-    <sys:Double x:Key="DateTimePickerListBoxItemHeight">28</sys:Double>
+    <sys:Double x:Key="DateTimePickerListBoxItemHeight">30</sys:Double>
 
 
     <SolidColorBrush x:Key="DateTimePickerButtonBorderBrush" Color="Transparent" />
@@ -31,7 +31,7 @@
     <SolidColorBrush x:Key="DateTimePickerEmptyForeground" Opacity="0.5" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="DateTimePickerButtonPointeroverBackground" Opacity="0.16" Color="White" />
-    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBorderBrush" Color="Transparent"  />
+    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledIconForeground" Opacity="0.4" Color="#E6E8EA" />
 

src/Semi.Avalonia/Themes/Dark/DropDownButton.axaml

@@ -1,4 +1,4 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--  Add Resources Here  -->
-    <PathGeometry x:Key="DropdownButtonIconGlyph">M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z</PathGeometry>
+    <PathGeometry x:Key="DropDownButtonIconGlyph">M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z</PathGeometry>
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Dark/ListBox.axaml

@@ -8,7 +8,7 @@
     <SolidColorBrush x:Key="ListBoxItemDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="ListBoxItemDefaultBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="ListBoxItemPointerOverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="ListBoxItemPointeroverBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="ListBoxItemPressedBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="ListBoxItemSelectedBackground" Opacity="0.2" Color="#FF54A9FF" />
     <SolidColorBrush x:Key="ListBoxItemSelectedPointeroverBackground" Opacity="0.3" Color="#FF54A9FF" />

src/Semi.Avalonia/Themes/Dark/Menu.axaml

@@ -37,6 +37,7 @@
 
     <SolidColorBrush x:Key="MenuItemInputGestureTextForeground" Color="Gray" />
     <SolidColorBrush x:Key="MenuItemExpandIconForeground" Opacity="0.62" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="MenuItemExpandIconOpenForeground" Color="#F9F9F9" />
     <Thickness x:Key="MenuItemExpandIconMargin">4 0</Thickness>
 
     <SolidColorBrush x:Key="MenuItemDisabledForeground" Opacity="0.35" Color="#F9F9F9" />

src/Semi.Avalonia/Themes/Dark/NumericUpDown.axaml

@@ -1,4 +1,7 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--  Add Resources Here  -->
     <CornerRadius x:Key="NumericUpDownCornerRadius">3</CornerRadius>
+    <x:Double x:Key="NumericUpDownWrapperDefaultHeight">32</x:Double>
+    <x:Double x:Key="NumericUpDownWrapperSmallHeight">24</x:Double>
+    <x:Double x:Key="NumericUpDownWrapperLargeHeight">40</x:Double>
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Dark/Palette.axaml

@@ -1,231 +1,393 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--  Add Resources Here  -->
-    <SolidColorBrush x:Key="SemiRed0" Color="#6C090B" />
-    <SolidColorBrush x:Key="SemiRed1" Color="#901110" />
-    <SolidColorBrush x:Key="SemiRed2" Color="#B42019" />
-    <SolidColorBrush x:Key="SemiRed3" Color="#D73324" />
-    <SolidColorBrush x:Key="SemiRed4" Color="#FB4932" />
-    <SolidColorBrush x:Key="SemiRed5" Color="#FC725A" />
-    <SolidColorBrush x:Key="SemiRed6" Color="#FD9983" />
-    <SolidColorBrush x:Key="SemiRed7" Color="#FDBEAC" />
-    <SolidColorBrush x:Key="SemiRed8" Color="#FEE0D5" />
-    <SolidColorBrush x:Key="SemiRed9" Color="#FFF3EF" />
-    <SolidColorBrush x:Key="SemiPink0" Color="#5C0730" />
-    <SolidColorBrush x:Key="SemiPink1" Color="#800E41" />
-    <SolidColorBrush x:Key="SemiPink2" Color="#A41751" />
-    <SolidColorBrush x:Key="SemiPink3" Color="#C72261" />
-    <SolidColorBrush x:Key="SemiPink4" Color="#EB2F71" />
-    <SolidColorBrush x:Key="SemiPink5" Color="#EF5686" />
-    <SolidColorBrush x:Key="SemiPink6" Color="#F37E9F" />
-    <SolidColorBrush x:Key="SemiPink7" Color="#F7A8BC" />
-    <SolidColorBrush x:Key="SemiPink8" Color="#FBD3DC" />
-    <SolidColorBrush x:Key="SemiPink9" Color="#FDEEF1" />
-    <SolidColorBrush x:Key="SemiPurple0" Color="#4A1061" />
-    <SolidColorBrush x:Key="SemiPurple1" Color="#5E1776" />
-    <SolidColorBrush x:Key="SemiPurple2" Color="#731F8A" />
-    <SolidColorBrush x:Key="SemiPurple3" Color="#89289F" />
-    <SolidColorBrush x:Key="SemiPurple4" Color="#A033B3" />
-    <SolidColorBrush x:Key="SemiPurple5" Color="#B553C2" />
-    <SolidColorBrush x:Key="SemiPurple6" Color="#CA78D1" />
-    <SolidColorBrush x:Key="SemiPurple7" Color="#DDA0E1" />
-    <SolidColorBrush x:Key="SemiPurple8" Color="#EFCEF0" />
-    <SolidColorBrush x:Key="SemiPurple9" Color="#F7EBF7" />
-    <SolidColorBrush x:Key="SemiViolet0" Color="#401B77" />
-    <SolidColorBrush x:Key="SemiViolet1" Color="#4C248C" />
-    <SolidColorBrush x:Key="SemiViolet2" Color="#582EA0" />
-    <SolidColorBrush x:Key="SemiViolet3" Color="#6439B5" />
-    <SolidColorBrush x:Key="SemiViolet4" Color="#7246C9" />
-    <SolidColorBrush x:Key="SemiViolet5" Color="#8865D4" />
-    <SolidColorBrush x:Key="SemiViolet6" Color="#A288DF" />
-    <SolidColorBrush x:Key="SemiViolet7" Color="#BEADE9" />
-    <SolidColorBrush x:Key="SemiViolet8" Color="#DDD4F4" />
-    <SolidColorBrush x:Key="SemiViolet9" Color="#F1EEFA" />
-    <SolidColorBrush x:Key="SemiIndigo0" Color="#171E65" />
-    <SolidColorBrush x:Key="SemiIndigo1" Color="#20297A" />
-    <SolidColorBrush x:Key="SemiIndigo2" Color="#29368E" />
-    <SolidColorBrush x:Key="SemiIndigo3" Color="#3444A3" />
-    <SolidColorBrush x:Key="SemiIndigo4" Color="#4053B7" />
-    <SolidColorBrush x:Key="SemiIndigo5" Color="#5F71C5" />
-    <SolidColorBrush x:Key="SemiIndigo6" Color="#8191D4" />
-    <SolidColorBrush x:Key="SemiIndigo7" Color="#A7B4E2" />
-    <SolidColorBrush x:Key="SemiIndigo8" Color="#D1D8F1" />
-    <SolidColorBrush x:Key="SemiIndigo9" Color="#EDEFF8" />
-    <SolidColorBrush x:Key="SemiBlue0" Color="#053170" />
-    <SolidColorBrush x:Key="SemiBlue1" Color="#0A4694" />
-    <SolidColorBrush x:Key="SemiBlue2" Color="#135CB8" />
-    <SolidColorBrush x:Key="SemiBlue3" Color="#1D75DB" />
-    <SolidColorBrush x:Key="SemiBlue4" Color="#2990FF" />
-    <SolidColorBrush x:Key="SemiBlue5" Color="#54A9FF" />
-    <SolidColorBrush x:Key="SemiBlue6" Color="#7FC1FF" />
-    <SolidColorBrush x:Key="SemiBlue7" Color="#A9D7FF" />
-    <SolidColorBrush x:Key="SemiBlue8" Color="#D4ECFF" />
-    <SolidColorBrush x:Key="SemiBlue9" Color="#EFF8FF" />
-    <SolidColorBrush x:Key="SemiLightBlue0" Color="#003761" />
-    <SolidColorBrush x:Key="SemiLightBlue1" Color="#004D85" />
-    <SolidColorBrush x:Key="SemiLightBlue2" Color="#0366A9" />
-    <SolidColorBrush x:Key="SemiLightBlue3" Color="#0A81CC" />
-    <SolidColorBrush x:Key="SemiLightBlue4" Color="#139FF0" />
-    <SolidColorBrush x:Key="SemiLightBlue5" Color="#40B4F3" />
-    <SolidColorBrush x:Key="SemiLightBlue6" Color="#6EC8F6" />
-    <SolidColorBrush x:Key="SemiLightBlue7" Color="#9DDCF9" />
-    <SolidColorBrush x:Key="SemiLightBlue8" Color="#CEEEFC" />
-    <SolidColorBrush x:Key="SemiLightBlue9" Color="#EBF8FE" />
-    <SolidColorBrush x:Key="SemiCyan0" Color="#04343D" />
-    <SolidColorBrush x:Key="SemiCyan1" Color="#074F5C" />
-    <SolidColorBrush x:Key="SemiCyan2" Color="#0A6C7B" />
-    <SolidColorBrush x:Key="SemiCyan3" Color="#0E8999" />
-    <SolidColorBrush x:Key="SemiCyan4" Color="#13A8B8" />
-    <SolidColorBrush x:Key="SemiCyan5" Color="#38BBC6" />
-    <SolidColorBrush x:Key="SemiCyan6" Color="#62CDD4" />
-    <SolidColorBrush x:Key="SemiCyan7" Color="#91DFE3" />
-    <SolidColorBrush x:Key="SemiCyan8" Color="#C6EFF1" />
-    <SolidColorBrush x:Key="SemiCyan9" Color="#E7F7F8" />
-    <SolidColorBrush x:Key="SemiTeal0" Color="#023C39" />
-    <SolidColorBrush x:Key="SemiTeal1" Color="#045A55" />
-    <SolidColorBrush x:Key="SemiTeal2" Color="#07776F" />
-    <SolidColorBrush x:Key="SemiTeal3" Color="#0A9588" />
-    <SolidColorBrush x:Key="SemiTeal4" Color="#0EB3A1" />
-    <SolidColorBrush x:Key="SemiTeal5" Color="#33C2B0" />
-    <SolidColorBrush x:Key="SemiTeal6" Color="#5ED1C1" />
-    <SolidColorBrush x:Key="SemiTeal7" Color="#8EE1D3" />
-    <SolidColorBrush x:Key="SemiTeal8" Color="#C4F0E8" />
-    <SolidColorBrush x:Key="SemiTeal9" Color="#E6F7F4" />
-    <SolidColorBrush x:Key="SemiGreen0" Color="#123C19" />
-    <SolidColorBrush x:Key="SemiGreen1" Color="#1C5A25" />
-    <SolidColorBrush x:Key="SemiGreen2" Color="#277731" />
-    <SolidColorBrush x:Key="SemiGreen3" Color="#32953D" />
-    <SolidColorBrush x:Key="SemiGreen4" Color="#3EB349" />
-    <SolidColorBrush x:Key="SemiGreen5" Color="#5DC264" />
-    <SolidColorBrush x:Key="SemiGreen6" Color="#7FD184" />
-    <SolidColorBrush x:Key="SemiGreen7" Color="#A6E1A8" />
-    <SolidColorBrush x:Key="SemiGreen8" Color="#D0F0D1" />
-    <SolidColorBrush x:Key="SemiGreen9" Color="#ECF7EC" />
-    <SolidColorBrush x:Key="SemiLightGreen0" Color="#263D13" />
-    <SolidColorBrush x:Key="SemiLightGreen1" Color="#3B5C1D" />
-    <SolidColorBrush x:Key="SemiLightGreen2" Color="#517B28" />
-    <SolidColorBrush x:Key="SemiLightGreen3" Color="#679934" />
-    <SolidColorBrush x:Key="SemiLightGreen4" Color="#7FB840" />
-    <SolidColorBrush x:Key="SemiLightGreen5" Color="#97C65F" />
-    <SolidColorBrush x:Key="SemiLightGreen6" Color="#B0D481" />
-    <SolidColorBrush x:Key="SemiLightGreen7" Color="#C9E3A7" />
-    <SolidColorBrush x:Key="SemiLightGreen8" Color="#E4F1D1" />
-    <SolidColorBrush x:Key="SemiLightGreen9" Color="#F3F8ED" />
-    <SolidColorBrush x:Key="SemiLime0" Color="#314603" />
-    <SolidColorBrush x:Key="SemiLime1" Color="#4B6905" />
-    <SolidColorBrush x:Key="SemiLime2" Color="#678D09" />
-    <SolidColorBrush x:Key="SemiLime3" Color="#84B00C" />
-    <SolidColorBrush x:Key="SemiLime4" Color="#A2D311" />
-    <SolidColorBrush x:Key="SemiLime5" Color="#AEDC3A" />
-    <SolidColorBrush x:Key="SemiLime6" Color="#BDE566" />
-    <SolidColorBrush x:Key="SemiLime7" Color="#CFED96" />
-    <SolidColorBrush x:Key="SemiLime8" Color="#E5F6C9" />
-    <SolidColorBrush x:Key="SemiLime9" Color="#F3FBE9" />
-    <SolidColorBrush x:Key="SemiYellow0" Color="#544903" />
-    <SolidColorBrush x:Key="SemiYellow1" Color="#7E6C06" />
-    <SolidColorBrush x:Key="SemiYellow2" Color="#A88E0A" />
-    <SolidColorBrush x:Key="SemiYellow3" Color="#D2AF0F" />
-    <SolidColorBrush x:Key="SemiYellow4" Color="#FCCE14" />
-    <SolidColorBrush x:Key="SemiYellow5" Color="#FDDE43" />
-    <SolidColorBrush x:Key="SemiYellow6" Color="#FDEB71" />
-    <SolidColorBrush x:Key="SemiYellow7" Color="#FEF5A0" />
-    <SolidColorBrush x:Key="SemiYellow8" Color="#FEFBD0" />
-    <SolidColorBrush x:Key="SemiYellow9" Color="#FFFEEC" />
-    <SolidColorBrush x:Key="SemiAmber0" Color="#512E09" />
-    <SolidColorBrush x:Key="SemiAmber1" Color="#794B0F" />
-    <SolidColorBrush x:Key="SemiAmber2" Color="#A16B16" />
-    <SolidColorBrush x:Key="SemiAmber3" Color="#CA8F1E" />
-    <SolidColorBrush x:Key="SemiAmber4" Color="#F2B726" />
-    <SolidColorBrush x:Key="SemiAmber5" Color="#F5CA50" />
-    <SolidColorBrush x:Key="SemiAmber6" Color="#F7DB7A" />
-    <SolidColorBrush x:Key="SemiAmber7" Color="#FAEAA6" />
-    <SolidColorBrush x:Key="SemiAmber8" Color="#FCF6D2" />
-    <SolidColorBrush x:Key="SemiAmber9" Color="#FEFBED" />
-    <SolidColorBrush x:Key="SemiOrange0" Color="#551F03" />
-    <SolidColorBrush x:Key="SemiOrange1" Color="#803506" />
-    <SolidColorBrush x:Key="SemiOrange2" Color="#AA500A" />
-    <SolidColorBrush x:Key="SemiOrange3" Color="#D56F0F" />
-    <SolidColorBrush x:Key="SemiOrange4" Color="#FF9214" />
-    <SolidColorBrush x:Key="SemiOrange5" Color="#FFAE43" />
-    <SolidColorBrush x:Key="SemiOrange6" Color="#FFC772" />
-    <SolidColorBrush x:Key="SemiOrange7" Color="#FFDDA1" />
-    <SolidColorBrush x:Key="SemiOrange8" Color="#FFEFD0" />
-    <SolidColorBrush x:Key="SemiOrange9" Color="#FFF9ED" />
-    <SolidColorBrush x:Key="SemiGrey0" Color="#1C1F23" />
-    <SolidColorBrush x:Key="SemiGrey1" Color="#2E3238" />
-    <SolidColorBrush x:Key="SemiGrey2" Color="#41464C" />
-    <SolidColorBrush x:Key="SemiGrey3" Color="#555B61" />
-    <SolidColorBrush x:Key="SemiGrey4" Color="#6B7075" />
-    <SolidColorBrush x:Key="SemiGrey5" Color="#888D92" />
-    <SolidColorBrush x:Key="SemiGrey6" Color="#A7ABB0" />
-    <SolidColorBrush x:Key="SemiGrey7" Color="#C6CACD" />
-    <SolidColorBrush x:Key="SemiGrey8" Color="#E6E8EA" />
-    <SolidColorBrush x:Key="SemiGrey9" Color="#F9F9F9" />
+    <!--  Color Resources  -->
+    <Color x:Key="SemiRed0Color">#6C090B</Color>
+    <Color x:Key="SemiRed1Color">#901110</Color>
+    <Color x:Key="SemiRed2Color">#B42019</Color>
+    <Color x:Key="SemiRed3Color">#D73324</Color>
+    <Color x:Key="SemiRed4Color">#FB4932</Color>
+    <Color x:Key="SemiRed5Color">#FC725A</Color>
+    <Color x:Key="SemiRed6Color">#FD9983</Color>
+    <Color x:Key="SemiRed7Color">#FDBEAC</Color>
+    <Color x:Key="SemiRed8Color">#FEE0D5</Color>
+    <Color x:Key="SemiRed9Color">#FFF3EF</Color>
+    <Color x:Key="SemiPink0Color">#5C0730</Color>
+    <Color x:Key="SemiPink1Color">#800E41</Color>
+    <Color x:Key="SemiPink2Color">#A41751</Color>
+    <Color x:Key="SemiPink3Color">#C72261</Color>
+    <Color x:Key="SemiPink4Color">#EB2F71</Color>
+    <Color x:Key="SemiPink5Color">#EF5686</Color>
+    <Color x:Key="SemiPink6Color">#F37E9F</Color>
+    <Color x:Key="SemiPink7Color">#F7A8BC</Color>
+    <Color x:Key="SemiPink8Color">#FBD3DC</Color>
+    <Color x:Key="SemiPink9Color">#FDEEF1</Color>
+    <Color x:Key="SemiPurple0Color">#4A1061</Color>
+    <Color x:Key="SemiPurple1Color">#5E1776</Color>
+    <Color x:Key="SemiPurple2Color">#731F8A</Color>
+    <Color x:Key="SemiPurple3Color">#89289F</Color>
+    <Color x:Key="SemiPurple4Color">#A033B3</Color>
+    <Color x:Key="SemiPurple5Color">#B553C2</Color>
+    <Color x:Key="SemiPurple6Color">#CA78D1</Color>
+    <Color x:Key="SemiPurple7Color">#DDA0E1</Color>
+    <Color x:Key="SemiPurple8Color">#EFCEF0</Color>
+    <Color x:Key="SemiPurple9Color">#F7EBF7</Color>
+    <Color x:Key="SemiViolet0Color">#401B77</Color>
+    <Color x:Key="SemiViolet1Color">#4C248C</Color>
+    <Color x:Key="SemiViolet2Color">#582EA0</Color>
+    <Color x:Key="SemiViolet3Color">#6439B5</Color>
+    <Color x:Key="SemiViolet4Color">#7246C9</Color>
+    <Color x:Key="SemiViolet5Color">#8865D4</Color>
+    <Color x:Key="SemiViolet6Color">#A288DF</Color>
+    <Color x:Key="SemiViolet7Color">#BEADE9</Color>
+    <Color x:Key="SemiViolet8Color">#DDD4F4</Color>
+    <Color x:Key="SemiViolet9Color">#F1EEFA</Color>
+    <Color x:Key="SemiIndigo0Color">#171E65</Color>
+    <Color x:Key="SemiIndigo1Color">#20297A</Color>
+    <Color x:Key="SemiIndigo2Color">#29368E</Color>
+    <Color x:Key="SemiIndigo3Color">#3444A3</Color>
+    <Color x:Key="SemiIndigo4Color">#4053B7</Color>
+    <Color x:Key="SemiIndigo5Color">#5F71C5</Color>
+    <Color x:Key="SemiIndigo6Color">#8191D4</Color>
+    <Color x:Key="SemiIndigo7Color">#A7B4E2</Color>
+    <Color x:Key="SemiIndigo8Color">#D1D8F1</Color>
+    <Color x:Key="SemiIndigo9Color">#EDEFF8</Color>
+    <Color x:Key="SemiBlue0Color">#053170</Color>
+    <Color x:Key="SemiBlue1Color">#0A4694</Color>
+    <Color x:Key="SemiBlue2Color">#135CB8</Color>
+    <Color x:Key="SemiBlue3Color">#1D75DB</Color>
+    <Color x:Key="SemiBlue4Color">#2990FF</Color>
+    <Color x:Key="SemiBlue5Color">#54A9FF</Color>
+    <Color x:Key="SemiBlue6Color">#7FC1FF</Color>
+    <Color x:Key="SemiBlue7Color">#A9D7FF</Color>
+    <Color x:Key="SemiBlue8Color">#D4ECFF</Color>
+    <Color x:Key="SemiBlue9Color">#EFF8FF</Color>
+    <Color x:Key="SemiLightBlue0Color">#003761</Color>
+    <Color x:Key="SemiLightBlue1Color">#004D85</Color>
+    <Color x:Key="SemiLightBlue2Color">#0366A9</Color>
+    <Color x:Key="SemiLightBlue3Color">#0A81CC</Color>
+    <Color x:Key="SemiLightBlue4Color">#139FF0</Color>
+    <Color x:Key="SemiLightBlue5Color">#40B4F3</Color>
+    <Color x:Key="SemiLightBlue6Color">#6EC8F6</Color>
+    <Color x:Key="SemiLightBlue7Color">#9DDCF9</Color>
+    <Color x:Key="SemiLightBlue8Color">#CEEEFC</Color>
+    <Color x:Key="SemiLightBlue9Color">#EBF8FE</Color>
+    <Color x:Key="SemiCyan0Color">#04343D</Color>
+    <Color x:Key="SemiCyan1Color">#074F5C</Color>
+    <Color x:Key="SemiCyan2Color">#0A6C7B</Color>
+    <Color x:Key="SemiCyan3Color">#0E8999</Color>
+    <Color x:Key="SemiCyan4Color">#13A8B8</Color>
+    <Color x:Key="SemiCyan5Color">#38BBC6</Color>
+    <Color x:Key="SemiCyan6Color">#62CDD4</Color>
+    <Color x:Key="SemiCyan7Color">#91DFE3</Color>
+    <Color x:Key="SemiCyan8Color">#C6EFF1</Color>
+    <Color x:Key="SemiCyan9Color">#E7F7F8</Color>
+    <Color x:Key="SemiTeal0Color">#023C39</Color>
+    <Color x:Key="SemiTeal1Color">#045A55</Color>
+    <Color x:Key="SemiTeal2Color">#07776F</Color>
+    <Color x:Key="SemiTeal3Color">#0A9588</Color>
+    <Color x:Key="SemiTeal4Color">#0EB3A1</Color>
+    <Color x:Key="SemiTeal5Color">#33C2B0</Color>
+    <Color x:Key="SemiTeal6Color">#5ED1C1</Color>
+    <Color x:Key="SemiTeal7Color">#8EE1D3</Color>
+    <Color x:Key="SemiTeal8Color">#C4F0E8</Color>
+    <Color x:Key="SemiTeal9Color">#E6F7F4</Color>
+    <Color x:Key="SemiGreen0Color">#123C19</Color>
+    <Color x:Key="SemiGreen1Color">#1C5A25</Color>
+    <Color x:Key="SemiGreen2Color">#277731</Color>
+    <Color x:Key="SemiGreen3Color">#32953D</Color>
+    <Color x:Key="SemiGreen4Color">#3EB349</Color>
+    <Color x:Key="SemiGreen5Color">#5DC264</Color>
+    <Color x:Key="SemiGreen6Color">#7FD184</Color>
+    <Color x:Key="SemiGreen7Color">#A6E1A8</Color>
+    <Color x:Key="SemiGreen8Color">#D0F0D1</Color>
+    <Color x:Key="SemiGreen9Color">#ECF7EC</Color>
+    <Color x:Key="SemiLightGreen0Color">#263D13</Color>
+    <Color x:Key="SemiLightGreen1Color">#3B5C1D</Color>
+    <Color x:Key="SemiLightGreen2Color">#517B28</Color>
+    <Color x:Key="SemiLightGreen3Color">#679934</Color>
+    <Color x:Key="SemiLightGreen4Color">#7FB840</Color>
+    <Color x:Key="SemiLightGreen5Color">#97C65F</Color>
+    <Color x:Key="SemiLightGreen6Color">#B0D481</Color>
+    <Color x:Key="SemiLightGreen7Color">#C9E3A7</Color>
+    <Color x:Key="SemiLightGreen8Color">#E4F1D1</Color>
+    <Color x:Key="SemiLightGreen9Color">#F3F8ED</Color>
+    <Color x:Key="SemiLime0Color">#314603</Color>
+    <Color x:Key="SemiLime1Color">#4B6905</Color>
+    <Color x:Key="SemiLime2Color">#678D09</Color>
+    <Color x:Key="SemiLime3Color">#84B00C</Color>
+    <Color x:Key="SemiLime4Color">#A2D311</Color>
+    <Color x:Key="SemiLime5Color">#AEDC3A</Color>
+    <Color x:Key="SemiLime6Color">#BDE566</Color>
+    <Color x:Key="SemiLime7Color">#CFED96</Color>
+    <Color x:Key="SemiLime8Color">#E5F6C9</Color>
+    <Color x:Key="SemiLime9Color">#F3FBE9</Color>
+    <Color x:Key="SemiYellow0Color">#544903</Color>
+    <Color x:Key="SemiYellow1Color">#7E6C06</Color>
+    <Color x:Key="SemiYellow2Color">#A88E0A</Color>
+    <Color x:Key="SemiYellow3Color">#D2AF0F</Color>
+    <Color x:Key="SemiYellow4Color">#FCCE14</Color>
+    <Color x:Key="SemiYellow5Color">#FDDE43</Color>
+    <Color x:Key="SemiYellow6Color">#FDEB71</Color>
+    <Color x:Key="SemiYellow7Color">#FEF5A0</Color>
+    <Color x:Key="SemiYellow8Color">#FEFBD0</Color>
+    <Color x:Key="SemiYellow9Color">#FFFEEC</Color>
+    <Color x:Key="SemiAmber0Color">#512E09</Color>
+    <Color x:Key="SemiAmber1Color">#794B0F</Color>
+    <Color x:Key="SemiAmber2Color">#A16B16</Color>
+    <Color x:Key="SemiAmber3Color">#CA8F1E</Color>
+    <Color x:Key="SemiAmber4Color">#F2B726</Color>
+    <Color x:Key="SemiAmber5Color">#F5CA50</Color>
+    <Color x:Key="SemiAmber6Color">#F7DB7A</Color>
+    <Color x:Key="SemiAmber7Color">#FAEAA6</Color>
+    <Color x:Key="SemiAmber8Color">#FCF6D2</Color>
+    <Color x:Key="SemiAmber9Color">#FEFBED</Color>
+    <Color x:Key="SemiOrange0Color">#551F03</Color>
+    <Color x:Key="SemiOrange1Color">#803506</Color>
+    <Color x:Key="SemiOrange2Color">#AA500A</Color>
+    <Color x:Key="SemiOrange3Color">#D56F0F</Color>
+    <Color x:Key="SemiOrange4Color">#FF9214</Color>
+    <Color x:Key="SemiOrange5Color">#FFAE43</Color>
+    <Color x:Key="SemiOrange6Color">#FFC772</Color>
+    <Color x:Key="SemiOrange7Color">#FFDDA1</Color>
+    <Color x:Key="SemiOrange8Color">#FFEFD0</Color>
+    <Color x:Key="SemiOrange9Color">#FFF9ED</Color>
+    <Color x:Key="SemiGrey0Color">#1C1F23</Color>
+    <Color x:Key="SemiGrey1Color">#2E3238</Color>
+    <Color x:Key="SemiGrey2Color">#41464C</Color>
+    <Color x:Key="SemiGrey3Color">#555B61</Color>
+    <Color x:Key="SemiGrey4Color">#6B7075</Color>
+    <Color x:Key="SemiGrey5Color">#888D92</Color>
+    <Color x:Key="SemiGrey6Color">#A7ABB0</Color>
+    <Color x:Key="SemiGrey7Color">#C6CACD</Color>
+    <Color x:Key="SemiGrey8Color">#E6E8EA</Color>
+    <Color x:Key="SemiGrey9Color">#F9F9F9</Color>
+
+    <SolidColorBrush x:Key="SemiRed0" Color="{StaticResource SemiRed0Color}" />
+    <SolidColorBrush x:Key="SemiRed1" Color="{StaticResource SemiRed1Color}" />
+    <SolidColorBrush x:Key="SemiRed2" Color="{StaticResource SemiRed2Color}" />
+    <SolidColorBrush x:Key="SemiRed3" Color="{StaticResource SemiRed3Color}" />
+    <SolidColorBrush x:Key="SemiRed4" Color="{StaticResource SemiRed4Color}" />
+    <SolidColorBrush x:Key="SemiRed5" Color="{StaticResource SemiRed5Color}" />
+    <SolidColorBrush x:Key="SemiRed6" Color="{StaticResource SemiRed6Color}" />
+    <SolidColorBrush x:Key="SemiRed7" Color="{StaticResource SemiRed7Color}" />
+    <SolidColorBrush x:Key="SemiRed8" Color="{StaticResource SemiRed8Color}" />
+    <SolidColorBrush x:Key="SemiRed9" Color="{StaticResource SemiRed9Color}" />
+    <SolidColorBrush x:Key="SemiPink0" Color="{StaticResource SemiPink0Color}" />
+    <SolidColorBrush x:Key="SemiPink1" Color="{StaticResource SemiPink1Color}" />
+    <SolidColorBrush x:Key="SemiPink2" Color="{StaticResource SemiPink2Color}" />
+    <SolidColorBrush x:Key="SemiPink3" Color="{StaticResource SemiPink3Color}" />
+    <SolidColorBrush x:Key="SemiPink4" Color="{StaticResource SemiPink4Color}" />
+    <SolidColorBrush x:Key="SemiPink5" Color="{StaticResource SemiPink5Color}" />
+    <SolidColorBrush x:Key="SemiPink6" Color="{StaticResource SemiPink6Color}" />
+    <SolidColorBrush x:Key="SemiPink7" Color="{StaticResource SemiPink7Color}" />
+    <SolidColorBrush x:Key="SemiPink8" Color="{StaticResource SemiPink8Color}" />
+    <SolidColorBrush x:Key="SemiPink9" Color="{StaticResource SemiPink9Color}" />
+    <SolidColorBrush x:Key="SemiPurple0" Color="{StaticResource SemiPurple0Color}" />
+    <SolidColorBrush x:Key="SemiPurple1" Color="{StaticResource SemiPurple1Color}" />
+    <SolidColorBrush x:Key="SemiPurple2" Color="{StaticResource SemiPurple2Color}" />
+    <SolidColorBrush x:Key="SemiPurple3" Color="{StaticResource SemiPurple3Color}" />
+    <SolidColorBrush x:Key="SemiPurple4" Color="{StaticResource SemiPurple4Color}" />
+    <SolidColorBrush x:Key="SemiPurple5" Color="{StaticResource SemiPurple5Color}" />
+    <SolidColorBrush x:Key="SemiPurple6" Color="{StaticResource SemiPurple6Color}" />
+    <SolidColorBrush x:Key="SemiPurple7" Color="{StaticResource SemiPurple7Color}" />
+    <SolidColorBrush x:Key="SemiPurple8" Color="{StaticResource SemiPurple8Color}" />
+    <SolidColorBrush x:Key="SemiPurple9" Color="{StaticResource SemiPurple9Color}" />
+    <SolidColorBrush x:Key="SemiViolet0" Color="{StaticResource SemiViolet0Color}" />
+    <SolidColorBrush x:Key="SemiViolet1" Color="{StaticResource SemiViolet1Color}" />
+    <SolidColorBrush x:Key="SemiViolet2" Color="{StaticResource SemiViolet2Color}" />
+    <SolidColorBrush x:Key="SemiViolet3" Color="{StaticResource SemiViolet3Color}" />
+    <SolidColorBrush x:Key="SemiViolet4" Color="{StaticResource SemiViolet4Color}" />
+    <SolidColorBrush x:Key="SemiViolet5" Color="{StaticResource SemiViolet5Color}" />
+    <SolidColorBrush x:Key="SemiViolet6" Color="{StaticResource SemiViolet6Color}" />
+    <SolidColorBrush x:Key="SemiViolet7" Color="{StaticResource SemiViolet7Color}" />
+    <SolidColorBrush x:Key="SemiViolet8" Color="{StaticResource SemiViolet8Color}" />
+    <SolidColorBrush x:Key="SemiViolet9" Color="{StaticResource SemiViolet9Color}" />
+    <SolidColorBrush x:Key="SemiIndigo0" Color="{StaticResource SemiIndigo0Color}" />
+    <SolidColorBrush x:Key="SemiIndigo1" Color="{StaticResource SemiIndigo1Color}" />
+    <SolidColorBrush x:Key="SemiIndigo2" Color="{StaticResource SemiIndigo2Color}" />
+    <SolidColorBrush x:Key="SemiIndigo3" Color="{StaticResource SemiIndigo3Color}" />
+    <SolidColorBrush x:Key="SemiIndigo4" Color="{StaticResource SemiIndigo4Color}" />
+    <SolidColorBrush x:Key="SemiIndigo5" Color="{StaticResource SemiIndigo5Color}" />
+    <SolidColorBrush x:Key="SemiIndigo6" Color="{StaticResource SemiIndigo6Color}" />
+    <SolidColorBrush x:Key="SemiIndigo7" Color="{StaticResource SemiIndigo7Color}" />
+    <SolidColorBrush x:Key="SemiIndigo8" Color="{StaticResource SemiIndigo8Color}" />
+    <SolidColorBrush x:Key="SemiIndigo9" Color="{StaticResource SemiIndigo9Color}" />
+    <SolidColorBrush x:Key="SemiBlue0" Color="{StaticResource SemiBlue0Color}" />
+    <SolidColorBrush x:Key="SemiBlue1" Color="{StaticResource SemiBlue1Color}" />
+    <SolidColorBrush x:Key="SemiBlue2" Color="{StaticResource SemiBlue2Color}" />
+    <SolidColorBrush x:Key="SemiBlue3" Color="{StaticResource SemiBlue3Color}" />
+    <SolidColorBrush x:Key="SemiBlue4" Color="{StaticResource SemiBlue4Color}" />
+    <SolidColorBrush x:Key="SemiBlue5" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiBlue6" Color="{StaticResource SemiBlue6Color}" />
+    <SolidColorBrush x:Key="SemiBlue7" Color="{StaticResource SemiBlue7Color}" />
+    <SolidColorBrush x:Key="SemiBlue8" Color="{StaticResource SemiBlue8Color}" />
+    <SolidColorBrush x:Key="SemiBlue9" Color="{StaticResource SemiBlue9Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue0" Color="{StaticResource SemiLightBlue0Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue1" Color="{StaticResource SemiLightBlue1Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue2" Color="{StaticResource SemiLightBlue2Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue3" Color="{StaticResource SemiLightBlue3Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue4" Color="{StaticResource SemiLightBlue4Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue5" Color="{StaticResource SemiLightBlue5Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue6" Color="{StaticResource SemiLightBlue6Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue7" Color="{StaticResource SemiLightBlue7Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue8" Color="{StaticResource SemiLightBlue8Color}" />
+    <SolidColorBrush x:Key="SemiLightBlue9" Color="{StaticResource SemiLightBlue9Color}" />
+    <SolidColorBrush x:Key="SemiCyan0" Color="{StaticResource SemiCyan0Color}" />
+    <SolidColorBrush x:Key="SemiCyan1" Color="{StaticResource SemiCyan1Color}" />
+    <SolidColorBrush x:Key="SemiCyan2" Color="{StaticResource SemiCyan2Color}" />
+    <SolidColorBrush x:Key="SemiCyan3" Color="{StaticResource SemiCyan3Color}" />
+    <SolidColorBrush x:Key="SemiCyan4" Color="{StaticResource SemiCyan4Color}" />
+    <SolidColorBrush x:Key="SemiCyan5" Color="{StaticResource SemiCyan5Color}" />
+    <SolidColorBrush x:Key="SemiCyan6" Color="{StaticResource SemiCyan6Color}" />
+    <SolidColorBrush x:Key="SemiCyan7" Color="{StaticResource SemiCyan7Color}" />
+    <SolidColorBrush x:Key="SemiCyan8" Color="{StaticResource SemiCyan8Color}" />
+    <SolidColorBrush x:Key="SemiCyan9" Color="{StaticResource SemiCyan9Color}" />
+    <SolidColorBrush x:Key="SemiTeal0" Color="{StaticResource SemiTeal0Color}" />
+    <SolidColorBrush x:Key="SemiTeal1" Color="{StaticResource SemiTeal1Color}" />
+    <SolidColorBrush x:Key="SemiTeal2" Color="{StaticResource SemiTeal2Color}" />
+    <SolidColorBrush x:Key="SemiTeal3" Color="{StaticResource SemiTeal3Color}" />
+    <SolidColorBrush x:Key="SemiTeal4" Color="{StaticResource SemiTeal4Color}" />
+    <SolidColorBrush x:Key="SemiTeal5" Color="{StaticResource SemiTeal5Color}" />
+    <SolidColorBrush x:Key="SemiTeal6" Color="{StaticResource SemiTeal6Color}" />
+    <SolidColorBrush x:Key="SemiTeal7" Color="{StaticResource SemiTeal7Color}" />
+    <SolidColorBrush x:Key="SemiTeal8" Color="{StaticResource SemiTeal8Color}" />
+    <SolidColorBrush x:Key="SemiTeal9" Color="{StaticResource SemiTeal9Color}" />
+    <SolidColorBrush x:Key="SemiGreen0" Color="{StaticResource SemiGreen0Color}" />
+    <SolidColorBrush x:Key="SemiGreen1" Color="{StaticResource SemiGreen1Color}" />
+    <SolidColorBrush x:Key="SemiGreen2" Color="{StaticResource SemiGreen2Color}" />
+    <SolidColorBrush x:Key="SemiGreen3" Color="{StaticResource SemiGreen3Color}" />
+    <SolidColorBrush x:Key="SemiGreen4" Color="{StaticResource SemiGreen4Color}" />
+    <SolidColorBrush x:Key="SemiGreen5" Color="{StaticResource SemiGreen5Color}" />
+    <SolidColorBrush x:Key="SemiGreen6" Color="{StaticResource SemiGreen6Color}" />
+    <SolidColorBrush x:Key="SemiGreen7" Color="{StaticResource SemiGreen7Color}" />
+    <SolidColorBrush x:Key="SemiGreen8" Color="{StaticResource SemiGreen8Color}" />
+    <SolidColorBrush x:Key="SemiGreen9" Color="{StaticResource SemiGreen9Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen0" Color="{StaticResource SemiLightGreen0Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen1" Color="{StaticResource SemiLightGreen1Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen2" Color="{StaticResource SemiLightGreen2Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen3" Color="{StaticResource SemiLightGreen3Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen4" Color="{StaticResource SemiLightGreen4Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen5" Color="{StaticResource SemiLightGreen5Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen6" Color="{StaticResource SemiLightGreen6Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen7" Color="{StaticResource SemiLightGreen7Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen8" Color="{StaticResource SemiLightGreen8Color}" />
+    <SolidColorBrush x:Key="SemiLightGreen9" Color="{StaticResource SemiLightGreen9Color}" />
+    <SolidColorBrush x:Key="SemiLime0" Color="{StaticResource SemiLime0Color}" />
+    <SolidColorBrush x:Key="SemiLime1" Color="{StaticResource SemiLime1Color}" />
+    <SolidColorBrush x:Key="SemiLime2" Color="{StaticResource SemiLime2Color}" />
+    <SolidColorBrush x:Key="SemiLime3" Color="{StaticResource SemiLime3Color}" />
+    <SolidColorBrush x:Key="SemiLime4" Color="{StaticResource SemiLime4Color}" />
+    <SolidColorBrush x:Key="SemiLime5" Color="{StaticResource SemiLime5Color}" />
+    <SolidColorBrush x:Key="SemiLime6" Color="{StaticResource SemiLime6Color}" />
+    <SolidColorBrush x:Key="SemiLime7" Color="{StaticResource SemiLime7Color}" />
+    <SolidColorBrush x:Key="SemiLime8" Color="{StaticResource SemiLime8Color}" />
+    <SolidColorBrush x:Key="SemiLime9" Color="{StaticResource SemiLime9Color}" />
+    <SolidColorBrush x:Key="SemiYellow0" Color="{StaticResource SemiYellow0Color}" />
+    <SolidColorBrush x:Key="SemiYellow1" Color="{StaticResource SemiYellow1Color}" />
+    <SolidColorBrush x:Key="SemiYellow2" Color="{StaticResource SemiYellow2Color}" />
+    <SolidColorBrush x:Key="SemiYellow3" Color="{StaticResource SemiYellow3Color}" />
+    <SolidColorBrush x:Key="SemiYellow4" Color="{StaticResource SemiYellow4Color}" />
+    <SolidColorBrush x:Key="SemiYellow5" Color="{StaticResource SemiYellow5Color}" />
+    <SolidColorBrush x:Key="SemiYellow6" Color="{StaticResource SemiYellow6Color}" />
+    <SolidColorBrush x:Key="SemiYellow7" Color="{StaticResource SemiYellow7Color}" />
+    <SolidColorBrush x:Key="SemiYellow8" Color="{StaticResource SemiYellow8Color}" />
+    <SolidColorBrush x:Key="SemiYellow9" Color="{StaticResource SemiYellow9Color}" />
+    <SolidColorBrush x:Key="SemiAmber0" Color="{StaticResource SemiAmber0Color}" />
+    <SolidColorBrush x:Key="SemiAmber1" Color="{StaticResource SemiAmber1Color}" />
+    <SolidColorBrush x:Key="SemiAmber2" Color="{StaticResource SemiAmber2Color}" />
+    <SolidColorBrush x:Key="SemiAmber3" Color="{StaticResource SemiAmber3Color}" />
+    <SolidColorBrush x:Key="SemiAmber4" Color="{StaticResource SemiAmber4Color}" />
+    <SolidColorBrush x:Key="SemiAmber5" Color="{StaticResource SemiAmber5Color}" />
+    <SolidColorBrush x:Key="SemiAmber6" Color="{StaticResource SemiAmber6Color}" />
+    <SolidColorBrush x:Key="SemiAmber7" Color="{StaticResource SemiAmber7Color}" />
+    <SolidColorBrush x:Key="SemiAmber8" Color="{StaticResource SemiAmber8Color}" />
+    <SolidColorBrush x:Key="SemiAmber9" Color="{StaticResource SemiAmber9Color}" />
+    <SolidColorBrush x:Key="SemiOrange0" Color="{StaticResource SemiOrange0Color}" />
+    <SolidColorBrush x:Key="SemiOrange1" Color="{StaticResource SemiOrange1Color}" />
+    <SolidColorBrush x:Key="SemiOrange2" Color="{StaticResource SemiOrange2Color}" />
+    <SolidColorBrush x:Key="SemiOrange3" Color="{StaticResource SemiOrange3Color}" />
+    <SolidColorBrush x:Key="SemiOrange4" Color="{StaticResource SemiOrange4Color}" />
+    <SolidColorBrush x:Key="SemiOrange5" Color="{StaticResource SemiOrange5Color}" />
+    <SolidColorBrush x:Key="SemiOrange6" Color="{StaticResource SemiOrange6Color}" />
+    <SolidColorBrush x:Key="SemiOrange7" Color="{StaticResource SemiOrange7Color}" />
+    <SolidColorBrush x:Key="SemiOrange8" Color="{StaticResource SemiOrange8Color}" />
+    <SolidColorBrush x:Key="SemiOrange9" Color="{StaticResource SemiOrange9Color}" />
+    <SolidColorBrush x:Key="SemiGrey0" Color="{StaticResource SemiGrey0Color}" />
+    <SolidColorBrush x:Key="SemiGrey1" Color="{StaticResource SemiGrey1Color}" />
+    <SolidColorBrush x:Key="SemiGrey2" Color="{StaticResource SemiGrey2Color}" />
+    <SolidColorBrush x:Key="SemiGrey3" Color="{StaticResource SemiGrey3Color}" />
+    <SolidColorBrush x:Key="SemiGrey4" Color="{StaticResource SemiGrey4Color}" />
+    <SolidColorBrush x:Key="SemiGrey5" Color="{StaticResource SemiGrey5Color}" />
+    <SolidColorBrush x:Key="SemiGrey6" Color="{StaticResource SemiGrey6Color}" />
+    <SolidColorBrush x:Key="SemiGrey7" Color="{StaticResource SemiGrey7Color}" />
+    <SolidColorBrush x:Key="SemiGrey8" Color="{StaticResource SemiGrey8Color}" />
+    <SolidColorBrush x:Key="SemiGrey9" Color="{StaticResource SemiGrey9Color}" />
 
     <!--  Primary  -->
-    <SolidColorBrush x:Key="SemiColorPrimary" Color="#FF54A9FF" />
-    <SolidColorBrush x:Key="SemiColorPrimaryPointerover" Color="#FF7FC1FF" />
-    <SolidColorBrush x:Key="SemiColorPrimaryPressed" Color="#FFA9D7FF" />
-    <SolidColorBrush x:Key="SemiColorPrimaryDisabled" Color="#FF135CB8" />
-    <SolidColorBrush x:Key="SemiColorPrimaryLight" Opacity="0.2" Color="#FF54A9FF" />
-    <SolidColorBrush x:Key="SemiColorPrimaryLightPointerover" Opacity="0.3" Color="#FF54A9FF" />
-    <SolidColorBrush x:Key="SemiColorPrimaryLightActive" Opacity="0.4" Color="#FF54A9FF" />
+    <SolidColorBrush x:Key="SemiColorPrimary" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorPrimaryPointerover" Color="{StaticResource SemiBlue6Color}" />
+    <SolidColorBrush x:Key="SemiColorPrimaryPressed" Color="{StaticResource SemiBlue7Color}" />
+    <SolidColorBrush x:Key="SemiColorPrimaryDisabled" Color="{StaticResource SemiBlue2Color}" />
+    <SolidColorBrush x:Key="SemiColorPrimaryLight" Opacity="0.2" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorPrimaryLightPointerover" Opacity="0.3" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorPrimaryLightActive" Opacity="0.4" Color="{StaticResource SemiBlue5Color}" />
     <!--  Secondary  -->
-    <SolidColorBrush x:Key="SemiColorSecondary" Color="#FF40B4F3" />
-    <SolidColorBrush x:Key="SemiColorSecondaryPointerover" Color="#FF6EC8F6" />
-    <SolidColorBrush x:Key="SemiColorSecondaryPressed" Color="#FF9DDCF9" />
-    <SolidColorBrush x:Key="SemiColorSecondaryDisabled" Color="#FF0366A9" />
-    <SolidColorBrush x:Key="SemiColorSecondaryLight" Opacity="0.2" Color="#FF40B4F3" />
-    <SolidColorBrush x:Key="SemiColorSecondaryLightPointerover" Opacity="0.3" Color="#FF40B4F3" />
-    <SolidColorBrush x:Key="SemiColorSecondaryLightActive" Opacity="0.4" Color="#FF40B4F3" />
+    <SolidColorBrush x:Key="SemiColorSecondary" Color="{StaticResource SemiLightBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorSecondaryPointerover" Color="{StaticResource SemiLightBlue6Color}" />
+    <SolidColorBrush x:Key="SemiColorSecondaryPressed" Color="{StaticResource SemiLightBlue7Color}" />
+    <SolidColorBrush x:Key="SemiColorSecondaryDisabled" Color="{StaticResource SemiLightBlue2Color}" />
+    <SolidColorBrush x:Key="SemiColorSecondaryLight" Opacity="0.2" Color="{StaticResource SemiLightBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorSecondaryLightPointerover" Opacity="0.3" Color="{StaticResource SemiLightBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorSecondaryLightActive" Opacity="0.4" Color="{StaticResource SemiLightBlue5Color}" />
     <!--  Tertiary  -->
-    <SolidColorBrush x:Key="SemiColorTertiary" Color="#FF888D92" />
-    <SolidColorBrush x:Key="SemiColorTertiaryPointerover" Color="#FFA7ABB0" />
-    <SolidColorBrush x:Key="SemiColorTertiaryPressed" Color="#FFC6CACD" />
-    <SolidColorBrush x:Key="SemiColorTertiaryLight" Opacity="0.2" Color="#FF888D92" />
-    <SolidColorBrush x:Key="SemiColorTertiaryLightPointerover" Opacity="0.3" Color="#FF888D92" />
-    <SolidColorBrush x:Key="SemiColorTertiaryLightActive" Opacity="0.4" Color="#FF888D92" />
+    <SolidColorBrush x:Key="SemiColorTertiary" Color="{StaticResource SemiGrey5Color}" />
+    <SolidColorBrush x:Key="SemiColorTertiaryPointerover" Color="{StaticResource SemiGrey6Color}" />
+    <SolidColorBrush x:Key="SemiColorTertiaryPressed" Color="{StaticResource SemiGrey7Color}" />
+    <SolidColorBrush x:Key="SemiColorTertiaryLight" Opacity="0.2" Color="{StaticResource SemiGrey5Color}" />
+    <SolidColorBrush x:Key="SemiColorTertiaryLightPointerover" Opacity="0.3" Color="{StaticResource SemiGrey5Color}" />
+    <SolidColorBrush x:Key="SemiColorTertiaryLightActive" Opacity="0.4" Color="{StaticResource SemiGrey5Color}" />
     <!--  Information  -->
-    <SolidColorBrush x:Key="SemiColorInformation" Color="#FF54A9FF" />
-    <SolidColorBrush x:Key="SemiColorInformationPointerover" Color="#FF7FC1FF" />
-    <SolidColorBrush x:Key="SemiColorInformationPressed" Color="#FFA9D7FF" />
-    <SolidColorBrush x:Key="SemiColorInformationDisabled" Color="#FF135CB8" />
-    <SolidColorBrush x:Key="SemiColorInformationLight" Opacity="0.2" Color="#FF54A9FF" />
-    <SolidColorBrush x:Key="SemiColorInformationLightPointerover" Opacity="0.3" Color="#FF54A9FF" />
-    <SolidColorBrush x:Key="SemiColorInformationLightActive" Opacity="0.4" Color="#FF54A9FF" />
+    <SolidColorBrush x:Key="SemiColorInformation" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorInformationPointerover" Color="{StaticResource SemiBlue6Color}" />
+    <SolidColorBrush x:Key="SemiColorInformationPressed" Color="{StaticResource SemiBlue7Color}" />
+    <SolidColorBrush x:Key="SemiColorInformationDisabled" Color="{StaticResource SemiBlue2Color}" />
+    <SolidColorBrush x:Key="SemiColorInformationLight" Opacity="0.2" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorInformationLightPointerover" Opacity="0.3" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorInformationLightActive" Opacity="0.4" Color="{StaticResource SemiBlue5Color}" />
     <!--  Success  -->
-    <SolidColorBrush x:Key="SemiColorSuccess" Color="#FF5DC264" />
-    <SolidColorBrush x:Key="SemiColorSuccessPointerover" Color="#FF7FD184" />
-    <SolidColorBrush x:Key="SemiColorSuccessPressed" Color="#FFA6E1A8" />
-    <SolidColorBrush x:Key="SemiColorSuccessDisabled" Color="#FF277731" />
-    <SolidColorBrush x:Key="SemiColorSuccessLight" Opacity="0.2" Color="#FF5DC264" />
-    <SolidColorBrush x:Key="SemiColorSuccessLightPointerover" Opacity="0.3" Color="#FF5DC264" />
-    <SolidColorBrush x:Key="SemiColorSuccessLightActive" Opacity="0.4" Color="#FF5DC264" />
+    <SolidColorBrush x:Key="SemiColorSuccess" Color="{StaticResource SemiGreen5Color}" />
+    <SolidColorBrush x:Key="SemiColorSuccessPointerover" Color="{StaticResource SemiGreen6Color}" />
+    <SolidColorBrush x:Key="SemiColorSuccessPressed" Color="{StaticResource SemiGreen7Color}" />
+    <SolidColorBrush x:Key="SemiColorSuccessDisabled" Color="{StaticResource SemiGreen2Color}" />
+    <SolidColorBrush x:Key="SemiColorSuccessLight" Opacity="0.2" Color="{StaticResource SemiGreen5Color}" />
+    <SolidColorBrush x:Key="SemiColorSuccessLightPointerover" Opacity="0.3" Color="{StaticResource SemiGreen5Color}" />
+    <SolidColorBrush x:Key="SemiColorSuccessLightActive" Opacity="0.4" Color="{StaticResource SemiGreen5Color}" />
     <!--  Warning  -->
-    <SolidColorBrush x:Key="SemiColorWarning" Color="#FFFFAE43" />
-    <SolidColorBrush x:Key="SemiColorWarningPointerover" Color="#FFFFC772" />
-    <SolidColorBrush x:Key="SemiColorWarningPressed" Color="#FFFFDDA1" />
-    <SolidColorBrush x:Key="SemiColorWarningLight" Opacity="0.2" Color="#FFFFAE43" />
-    <SolidColorBrush x:Key="SemiColorWarningLightPointerover" Opacity="0.3" Color="#FFFFAE43" />
-    <SolidColorBrush x:Key="SemiColorWarningLightActive" Opacity="0.4" Color="#FFFFAE43" />
+    <SolidColorBrush x:Key="SemiColorWarning" Color="{StaticResource SemiOrange5Color}" />
+    <SolidColorBrush x:Key="SemiColorWarningPointerover" Color="{StaticResource SemiOrange6Color}" />
+    <SolidColorBrush x:Key="SemiColorWarningPressed" Color="{StaticResource SemiOrange7Color}" />
+    <SolidColorBrush x:Key="SemiColorWarningLight" Opacity="0.2" Color="{StaticResource SemiOrange5Color}" />
+    <SolidColorBrush x:Key="SemiColorWarningLightPointerover" Opacity="0.3" Color="{StaticResource SemiOrange5Color}" />
+    <SolidColorBrush x:Key="SemiColorWarningLightActive" Opacity="0.4" Color="{StaticResource SemiOrange5Color}" />
     <!--  Danger  -->
-    <SolidColorBrush x:Key="SemiColorDanger" Color="#FFFC725A" />
-    <SolidColorBrush x:Key="SemiColorDangerPointerover" Color="#FFFD9983" />
-    <SolidColorBrush x:Key="SemiColorDangerPressed" Color="#FFFDBEAC" />
-    <SolidColorBrush x:Key="SemiColorDangerLight" Opacity="0.2" Color="#FFFC725A" />
-    <SolidColorBrush x:Key="SemiColorDangerLightPointerover" Opacity="0.3" Color="#FFFC725A" />
-    <SolidColorBrush x:Key="SemiColorDangerLightActive" Opacity="0.4" Color="#FFFC725A" />
+    <SolidColorBrush x:Key="SemiColorDanger" Color="{StaticResource SemiRed5Color}" />
+    <SolidColorBrush x:Key="SemiColorDangerPointerover" Color="{StaticResource SemiRed6Color}" />
+    <SolidColorBrush x:Key="SemiColorDangerPressed" Color="{StaticResource SemiRed7Color}" />
+    <SolidColorBrush x:Key="SemiColorDangerLight" Opacity="0.2" Color="{StaticResource SemiRed5Color}" />
+    <SolidColorBrush x:Key="SemiColorDangerLightPointerover" Opacity="0.3" Color="{StaticResource SemiRed5Color}" />
+    <SolidColorBrush x:Key="SemiColorDangerLightActive" Opacity="0.4" Color="{StaticResource SemiRed5Color}" />
 
     <!--  Text and Icons  -->
-    <SolidColorBrush x:Key="SemiColorText0" Color="#FFF9F9F9" />
-    <SolidColorBrush x:Key="SemiColorText1" Opacity="0.8" Color="#FFF9F9F9" />
-    <SolidColorBrush x:Key="SemiColorText2" Opacity="0.6" Color="#FFF9F9F9" />
-    <SolidColorBrush x:Key="SemiColorText3" Opacity="0.35" Color="#FFF9F9F9" />
+    <SolidColorBrush x:Key="SemiColorText0" Color="{StaticResource SemiGrey9Color}" />
+    <SolidColorBrush x:Key="SemiColorText1" Opacity="0.8" Color="{StaticResource SemiGrey9Color}" />
+    <SolidColorBrush x:Key="SemiColorText2" Opacity="0.6" Color="{StaticResource SemiGrey9Color}" />
+    <SolidColorBrush x:Key="SemiColorText3" Opacity="0.35" Color="{StaticResource SemiGrey9Color}" />
 
     <!--  Link  -->
-    <SolidColorBrush x:Key="SemiColorLink" Color="#FF54A9FF" />
-    <SolidColorBrush x:Key="SemiColorLinkPointerover" Color="#FF7FC1FF" />
-    <SolidColorBrush x:Key="SemiColorLinkActive" Color="#FFA9D7FF" />
-    <SolidColorBrush x:Key="SemiColorLinkVisited" Color="#FF54A9FF" />
+    <SolidColorBrush x:Key="SemiColorLink" Color="{StaticResource SemiBlue5Color}" />
+    <SolidColorBrush x:Key="SemiColorLinkPointerover" Color="{StaticResource SemiBlue6Color}" />
+    <SolidColorBrush x:Key="SemiColorLinkActive" Color="{StaticResource SemiBlue7Color}" />
+    <SolidColorBrush x:Key="SemiColorLinkVisited" Color="{StaticResource SemiBlue5Color}" />
 
     <!--  Background  -->
     <SolidColorBrush x:Key="SemiColorBackground0" Color="#FF16161A" />
@@ -243,8 +405,9 @@
     <SolidColorBrush x:Key="SemiColorBorder" Opacity="0.08" Color="White" />
 
     <!--  Disabled  -->
-    <SolidColorBrush x:Key="SemiColorDisabledText" Opacity="0.35" Color="#FFF9F9F9" />
-    <SolidColorBrush x:Key="SemiColorDisabledBorder" Color="#FF2E3238" />
-    <SolidColorBrush x:Key="SemiColorDisabledBackground" Color="#FF2E3238" />
-    <SolidColorBrush x:Key="SemiColorDisabledFill" Opacity="0.04" Color="#FFE6E8EA" />
+    <SolidColorBrush x:Key="SemiColorDisabledText" Opacity="0.35" Color="{StaticResource SemiGrey9Color}" />
+    <SolidColorBrush x:Key="SemiColorDisabledBorder" Color="{StaticResource SemiGrey1Color}" />
+    <SolidColorBrush x:Key="SemiColorDisabledBackground" Color="{StaticResource SemiGrey1Color}" />
+    <SolidColorBrush x:Key="SemiColorDisabledFill" Opacity="0.04" Color="{StaticResource SemiGrey8Color}" />
+
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Dark/RadioButton.axaml

@@ -7,24 +7,25 @@
     <sys:Double x:Key="RadioButtonFontSize">14</sys:Double>
     <Thickness x:Key="RadioButtonIconMargin">0 2 8 0</Thickness>
 
+    <SolidColorBrush x:Key="RadioButtonDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="RadioButtonUncheckIconDefaultBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="RadioButtonUncheckIconPointOverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="RadioButtonUncheckIconPointeroverBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="RadioButtonUncheckIconPressedBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="RadioButtonUncheckIconDisabledBackground" Opacity="0.12" Color="White" />
 
     <SolidColorBrush x:Key="RadioButtonUncheckIconDefaultBorderBrush" Opacity="0.35" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="RadioButtonUncheckIconPointOverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="RadioButtonUncheckIconPointeroverBorderBrush" Color="#7FC1FF" />
     <SolidColorBrush x:Key="RadioButtonUncheckIconPressedBorderBrush" Color="#A9D7FF" />
     <SolidColorBrush x:Key="RadioButtonUncheckIconDisabledBorderBrush" Opacity="0.08" Color="#F9F9F9" />
 
 
     <SolidColorBrush x:Key="RadioButtonCheckIconDefaultBackground" Color="#54A9FF" />
-    <SolidColorBrush x:Key="RadioButtonCheckIconPointOverBackground" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="RadioButtonCheckIconPointeroverBackground" Color="#7FC1FF" />
     <SolidColorBrush x:Key="RadioButtonCheckIconPressedBackground" Color="#A9D7FF" />
     <SolidColorBrush x:Key="RadioButtonCheckIconDisabledBackground" Color="#135cb8" />
     <SolidColorBrush x:Key="RadioButtonCheckIconDefaultBorderBrush" Color="#54A9FF" />
-    <SolidColorBrush x:Key="RadioButtonCheckIconPointOverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="RadioButtonCheckIconPointeroverBorderBrush" Color="#7FC1FF" />
     <SolidColorBrush x:Key="RadioButtonCheckIconPressedBorderBrush" Color="#A9D7FF" />
     <SolidColorBrush x:Key="RadioButtonCheckIconDisabledBorderBrush" Color="#135cb8" />
 
@@ -46,21 +47,23 @@
     <sys:Double x:Key="RadioButtonButtonDefaultFontSize">12</sys:Double>
     <sys:Double x:Key="RadioButtonButtonLargeFontSize">14</sys:Double>
 
-    <SolidColorBrush x:Key="RadioButtonButtonCheckedForeground" Color="#54A9FF" />
-    <SolidColorBrush x:Key="RadioButtonButtonUncheckedPointeroverBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="RadioButtonButtonUncheckedForeground" Opacity="0.8" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="RadioButtonButtonUncheckedPointeroverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="RadioButtonButtonUncheckedDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
     <SolidColorBrush x:Key="RadioButtonButtonCheckedBackground" Color="#43444A" />
+    <SolidColorBrush x:Key="RadioButtonButtonCheckedForeground" Color="#54A9FF" />
+    <SolidColorBrush x:Key="RadioButtonButtonCheckedDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
 
     <Thickness x:Key="RadioButtonCardPadding">16 12</Thickness>
 
     <SolidColorBrush x:Key="RadioButtonCardDefaultBackground" Color="Transparent" />
     <SolidColorBrush x:Key="RadioButtonCardDefaultBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="RadioButtonCardCheckedBackground" Color="#053170" />
+    <SolidColorBrush x:Key="RadioButtonCardCheckedBackground" Opacity="0.2" Color="#FF54A9FF" />
     <SolidColorBrush x:Key="RadioButtonCardCheckDefaultBorderBrush" Color="#54A9FF" />
-    <SolidColorBrush x:Key="RadioButtonCardCheckPointOverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="RadioButtonCardCheckPointeroverBorderBrush" Color="#7FC1FF" />
     <SolidColorBrush x:Key="RadioButtonCardCheckPressedBorderBrush" Color="#A9D7FF" />
     <SolidColorBrush x:Key="RadioButtonCardCheckDisabledBorderBrush" Color="#135cb8" />
-    <SolidColorBrush x:Key="RadioButtonCardUncheckPointOverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="RadioButtonCardUncheckPointeroverBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="RadioButtonCardUncheckPressedBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="RadioButtonCardUncheckDisabledBackground" Opacity="0.12" Color="White" />
 

src/Semi.Avalonia/Themes/Dark/ScrollViewer.axaml

@@ -6,7 +6,7 @@
     <sys:Double x:Key="ScrollBarThumbThickness">8</sys:Double>
     <SolidColorBrush x:Key="ScrollBarButtonDefaultBackground" Color="Transparent" />
     <SolidColorBrush x:Key="ScrollBarButtonDefaultForeground" Opacity="0.62" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="ScrollBarButtonPointerOverForeground" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="ScrollBarButtonPointeroverForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="ScrollBarThumbForeground" Opacity="0.35" Color="#F9F9F9" />
     <SolidColorBrush x:Key="ScrollBarBackground" Opacity="0.12" Color="White" />
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Dark/TextBox.axaml

@@ -9,14 +9,14 @@
     <SolidColorBrush x:Key="TextBoxPointeroverBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="TextBoxPressedBackground" Opacity="0.2" Color="White" />
     <SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.16" Color="White" />
-    <SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxPointeroverBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#54A9FF" />
     <SolidColorBrush x:Key="TextBoxForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="TextBoxWatermarkForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.6" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.2" Color="#E6E8EA" />
-    <SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Opacity="0.4" Color="#E6E8EA" />
+    <SolidColorBrush x:Key="TextBoxButtonPointeroverForeground" Opacity="0.4" Color="#E6E8EA" />
 
     <SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
     <SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#F9F9F9" />

src/Semi.Avalonia/Themes/Dark/ToggleButton.axaml

@@ -15,7 +15,9 @@
     <SolidColorBrush x:Key="ToggleButtonDefaultBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="ToggleButtonDefaultPointeroverBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="ToggleButtonDefaultPressedBackground" Opacity="0.20" Color="White" />
-    <SolidColorBrush x:Key="ToggleButtonDefaultDisabledBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="ToggleButtonDefaultDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
+    <SolidColorBrush x:Key="ToggleButtonDefaultDisabledBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="ToggleButtonDefaultDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="ToggleButtonDefaultBorderBrush" Color="Transparent" />
 
@@ -23,26 +25,25 @@
     <SolidColorBrush x:Key="ToggleButtonDefaultSecondaryForeground" Color="#40B4F3" />
     <SolidColorBrush x:Key="ToggleButtonDefaultTertiaryForeground" Color="#888D92" />
     <SolidColorBrush x:Key="ToggleButtonDefaultWarningForeground" Color="#FFAE43" />
-    <SolidColorBrush x:Key="ToggleButtonDefaultErrorForeground" Color="#FC725A" />
-    <SolidColorBrush x:Key="ToggleButtonDefaultDisabledForeground" Color="#2E3238" />
+    <SolidColorBrush x:Key="ToggleButtonDefaultDangerForeground" Color="#FC725A" />
 
     <SolidColorBrush x:Key="ToggleButtonPrimaryCheckedBackground" Color="#54A9FF" />
     <SolidColorBrush x:Key="ToggleButtonSecondaryCheckedBackground" Color="#40B4F3" />
     <SolidColorBrush x:Key="ToggleButtonTertiaryCheckedBackground" Color="#888D92" />
     <SolidColorBrush x:Key="ToggleButtonWarningCheckedBackground" Color="#FFAE43" />
-    <SolidColorBrush x:Key="ToggleButtonErrorCheckedBackground" Color="#FC725A" />
+    <SolidColorBrush x:Key="ToggleButtonDangerCheckedBackground" Color="#FC725A" />
 
     <SolidColorBrush x:Key="ToggleButtonPrimaryCheckedPointeroverBackground" Color="#7FC1FF" />
     <SolidColorBrush x:Key="ToggleButtonSecondaryCheckedPointeroverBackground" Color="#6EC8F6" />
     <SolidColorBrush x:Key="ToggleButtonTertiaryCheckedPointeroverBackground" Color="#A7ABB0" />
     <SolidColorBrush x:Key="ToggleButtonWarningCheckedPointeroverBackground" Color="#FFC772" />
-    <SolidColorBrush x:Key="ToggleButtonErrorCheckedPointeroverBackground" Color="#FD9983" />
+    <SolidColorBrush x:Key="ToggleButtonDangerCheckedPointeroverBackground" Color="#FD9983" />
 
     <SolidColorBrush x:Key="ToggleButtonPrimaryCheckedPressedBackground" Color="#A9D7FF" />
     <SolidColorBrush x:Key="ToggleButtonSecondaryCheckedPressedBackground" Color="#9DDCF9" />
     <SolidColorBrush x:Key="ToggleButtonTertiaryCheckedPressedBackground" Color="#C6CACD" />
     <SolidColorBrush x:Key="ToggleButtonWarningCheckedPressedBackground" Color="#FFDDA1" />
-    <SolidColorBrush x:Key="ToggleButtonErrorCheckedPressedBackground" Color="#FDBEAC" />
+    <SolidColorBrush x:Key="ToggleButtonDangerCheckedPressedBackground" Color="#FDBEAC" />
 
     <SolidColorBrush x:Key="ToggleButtonCheckedForeground" Color="Black" />
 
@@ -50,23 +51,37 @@
     <SolidColorBrush x:Key="ToggleButtonSecondaryIndeterminateBackground" Color="#003761" />
     <SolidColorBrush x:Key="ToggleButtonTertiaryIndeterminateBackground" Color="#1C1F23" />
     <SolidColorBrush x:Key="ToggleButtonWarningIndeterminateBackground" Color="#551F03" />
-    <SolidColorBrush x:Key="ToggleButtonErrorIndeterminateBackground" Color="#6C090B" />
+    <SolidColorBrush x:Key="ToggleButtonDangerIndeterminateBackground" Color="#6C090B" />
 
     <SolidColorBrush x:Key="ToggleButtonPrimaryIndeterminateBorderBrush" Color="#54A9FF" />
     <SolidColorBrush x:Key="ToggleButtonSecondaryIndeterminateBorderBrush" Color="#40B4F3" />
     <SolidColorBrush x:Key="ToggleButtonTertiaryIndeterminateBorderBrush" Color="#888D92" />
     <SolidColorBrush x:Key="ToggleButtonWarningIndeterminateBorderBrush" Color="#FFAE43" />
-    <SolidColorBrush x:Key="ToggleButtonErrorIndeterminateBorderBrush" Color="#FC725A" />
+    <SolidColorBrush x:Key="ToggleButtonDangerIndeterminateBorderBrush" Color="#FC725A" />
 
     <SolidColorBrush x:Key="ToggleButtonPrimaryIndeterminatePointeroverBorderBrush" Color="#7FC1FF" />
     <SolidColorBrush x:Key="ToggleButtonSecondaryIndeterminatePointeroverBorderBrush" Color="#6EC8F6" />
     <SolidColorBrush x:Key="ToggleButtonTertiaryIndeterminatePointeroverBorderBrush" Color="#A7ABB0" />
     <SolidColorBrush x:Key="ToggleButtonWarningIndeterminatePointeroverBorderBrush" Color="#FFC772" />
-    <SolidColorBrush x:Key="ToggleButtonErrorIndeterminatePointeroverBorderBrush" Color="#FD9983" />
+    <SolidColorBrush x:Key="ToggleButtonDangerIndeterminatePointeroverBorderBrush" Color="#FD9983" />
 
+    <SolidColorBrush x:Key="ToggleButtonPrimaryIndeterminatePointeroverForeground" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="ToggleButtonSecondaryIndeterminatePointeroverForeground" Color="#6EC8F6" />
+    <SolidColorBrush x:Key="ToggleButtonTertiaryIndeterminatePointeroverForeground" Color="#A7ABB0" />
+    <SolidColorBrush x:Key="ToggleButtonWarningIndeterminatePointeroverForeground" Color="#FFC772" />
+    <SolidColorBrush x:Key="ToggleButtonDangerIndeterminatePointeroverForeground" Color="#FD9983" />
+    
     <SolidColorBrush x:Key="ToggleButtonPrimaryIndeterminatePressedBorderBrush" Color="#A9D7FF" />
     <SolidColorBrush x:Key="ToggleButtonSecondaryIndeterminatePressedBorderBrush" Color="#9DDCF9" />
     <SolidColorBrush x:Key="ToggleButtonTertiaryIndeterminatePressedBorderBrush" Color="#C6CACD" />
     <SolidColorBrush x:Key="ToggleButtonWarningIndeterminatePressedBorderBrush" Color="#FFDDA1" />
-    <SolidColorBrush x:Key="ToggleButtonErrorIndeterminatePressedBorderBrush" Color="#FDBEAC" />
+    <SolidColorBrush x:Key="ToggleButtonDangerIndeterminatePressedBorderBrush" Color="#FDBEAC" />
+
+    <SolidColorBrush x:Key="ToggleButtonPrimaryIndeterminatePressedForeground" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="ToggleButtonSecondaryIndeterminatePressedForeground" Color="#9DDCF9" />
+    <SolidColorBrush x:Key="ToggleButtonTertiaryIndeterminatePressedForeground" Color="#C6CACD" />
+    <SolidColorBrush x:Key="ToggleButtonWarningIndeterminatePressedForeground" Color="#FFDDA1" />
+    <SolidColorBrush x:Key="ToggleButtonDangerIndeterminatePressedForeground" Color="#FDBEAC" />
+
+    <SolidColorBrush x:Key="ToggleButtonIndeterminateDisabledBorderBrush" Opacity="0.35" Color="#F9F9F9" />
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Dark/ToggleSwitch.axaml

@@ -3,14 +3,14 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:sys="clr-namespace:System;assembly=System.Runtime">
     <SolidColorBrush x:Key="ToggleSwitchContainerUnCheckedDefaultBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="ToggleSwitchContainerUnCheckedPointerOverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="ToggleSwitchContainerUnCheckedPointeroverBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="ToggleSwitchContainerUnCheckedPressedBackground" Opacity="0.20" Color="White" />
     <SolidColorBrush x:Key="ToggleSwitchContainerUnCheckedDisabledBackground" Color="Transparent" />
 
     <SolidColorBrush x:Key="ToggleSwitchContainerUnCheckedDisabledBorderBrush" Opacity="0.09" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="ToggleSwitchContainerCheckedDefaultBackground" Color="#5FB346" />
-    <SolidColorBrush x:Key="ToggleSwitchContainerCheckedPointerOverBackground" Color="#7FD184" />
+    <SolidColorBrush x:Key="ToggleSwitchContainerCheckedPointeroverBackground" Color="#7FD184" />
     <SolidColorBrush x:Key="ToggleSwitchContainerCheckedPressedBackground" Color="#A6E1A8" />
     <SolidColorBrush x:Key="ToggleSwitchContainerCheckedDisabledBackground" Color="#277731" />
 

src/Semi.Avalonia/Themes/Dark/TreeView.axaml

@@ -14,12 +14,12 @@
     <SolidColorBrush x:Key="TreeViewItemDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="TreeViewItemDefaultBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="TreeViewItemPointerOverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="TreeViewItemPointeroverBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="TreeViewItemPressedBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="TreeViewItemSelectedBackground" Opacity="0.2" Color="#54A9FF" />
     <SolidColorBrush x:Key="TreeViewItemDisabledBackground" Color="Transparent" />
     <SolidColorBrush x:Key="TreeViewItemSelectedDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
 
     <Thickness x:Key="TreeViewItemIconMargin">8 0</Thickness>
-    <Thickness x:Key="TreeViewItemPadding">0 4 0 4</Thickness>
+    <Thickness x:Key="TreeViewItemPadding">0 4 8 4</Thickness>
 </ResourceDictionary>

src/Semi.Avalonia/Themes/Index.axaml

@@ -2,8 +2,8 @@
     <Styles.Resources>
         <ResourceDictionary>
             <ResourceDictionary.ThemeDictionaries>
-                <ResourceInclude x:Key="Default" Source="avares://Semi.Avalonia/Themes/Light/Light.axaml" />
-                <ResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia/Themes/Dark/Dark.axaml" />
+                <MergeResourceInclude x:Key="Default" Source="avares://Semi.Avalonia/Themes/Light/Light.axaml" />
+                <MergeResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia/Themes/Dark/Dark.axaml" />
             </ResourceDictionary.ThemeDictionaries>
             <ResourceDictionary.MergedDictionaries>
                 <ResourceInclude Source="avares://Semi.Avalonia/Controls/Controls.axaml" />

src/Semi.Avalonia/Themes/Light/CalendarDatePicker.axaml

@@ -1,6 +1,7 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--    -->
     <SolidColorBrush x:Key="CalendarDatePickerIconForeground" Opacity="0.62" Color="#1C1F23" />
+    <SolidColorBrush x:Key="CalendarDatePickerForeground" Color="#1C1F23" />
     <SolidColorBrush x:Key="CalendarDatePickerIconPointeroverForeground" Color="#1C1F23" />
     <PathGeometry x:Key="CalendarDatePickerIconGlyph">M4 20V8H20V20H4ZM2 4C2 2.89543 2.89543 2 4 2H20C21.1046 2 22 2.89543 22 4V20C22 21.1046 21.1046 22 20 22H4C2.89543 22 2 21.1046 2 20V4ZM6 10.5C6 10.2239 6.22386 10 6.5 10H8.5C8.77614 10 9 10.2239 9 10.5V12.5C9 12.7761 8.77614 13 8.5 13H6.5C6.22386 13 6 12.7761 6 12.5V10.5ZM6.5 15C6.22386 15 6 15.2239 6 15.5V17.5C6 17.7761 6.22386 18 6.5 18H8.5C8.77614 18 9 17.7761 9 17.5V15.5C9 15.2239 8.77614 15 8.5 15H6.5ZM10.5 10.5C10.5 10.2239 10.7239 10 11 10H13C13.2761 10 13.5 10.2239 13.5 10.5V12.5C13.5 12.7761 13.2761 13 13 13H11C10.7239 13 10.5 12.7761 10.5 12.5V10.5ZM11 15C10.7239 15 10.5 15.2239 10.5 15.5V17.5C10.5 17.7761 10.7239 18 11 18H13C13.2761 18 13.5 17.7761 13.5 17.5V15.5C13.5 15.2239 13.2761 15 13 15H11ZM15 10.5C15 10.2239 15.2239 10 15.5 10H17.5C17.7761 10 18 10.2239 18 10.5V12.5C18 12.7761 17.7761 13 17.5 13H15.5C15.2239 13 15 12.7761 15 12.5V10.5ZM15.5 15C15.2239 15 15 15.2239 15 15.5V17.5C15 17.7761 15.2239 18 15.5 18H17.5C17.7761 18 18 17.7761 18 17.5V15.5C18 15.2239 17.7761 15 17.5 15H15.5Z</PathGeometry>
     <SolidColorBrush x:Key="CalendarDatePickerBackground" Opacity="0.05" Color="#FF2E3238" />

src/Semi.Avalonia/Themes/Light/CheckBox.axaml

@@ -10,15 +10,15 @@
 
     <SolidColorBrush x:Key="CheckBoxDefaultBackground" Color="Transparent" />
     <SolidColorBrush x:Key="CheckBoxDefaultBorderBrush" Opacity="0.35" Color="#1C1F23" />
-    <SolidColorBrush x:Key="CheckBoxPointOverBackground" Opacity="0.05" Color="#2E3238" />
-    <SolidColorBrush x:Key="CheckBoxPointOverBorderBrush" Color="#0077FA" />
+    <SolidColorBrush x:Key="CheckBoxPointeroverBackground" Opacity="0.05" Color="#2E3238" />
+    <SolidColorBrush x:Key="CheckBoxPointeroverBorderBrush" Color="#0077FA" />
     <SolidColorBrush x:Key="CheckBoxPressedBackground" Color="#004FB3" />
     <SolidColorBrush x:Key="CheckBoxPressedBorderBrush" Color="#004FB3" />
 
     <SolidColorBrush x:Key="CheckBoxCheckedDefaultBackground" Color="#0077FA" />
     <SolidColorBrush x:Key="CheckBoxCheckedDefaultBorderBrush" Color="#0077FA" />
-    <SolidColorBrush x:Key="CheckBoxCheckedPointOverBackground" Color="#0062D6" />
-    <SolidColorBrush x:Key="CheckBoxCheckedPointOverBorderBrush" Color="#0062D6" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPointeroverBackground" Color="#0062D6" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPointeroverBorderBrush" Color="#0062D6" />
     <SolidColorBrush x:Key="CheckBoxCheckedPressedBackground" Color="#004FB3" />
     <SolidColorBrush x:Key="CheckBoxCheckedPressedBorderBrush" Color="#004FB3" />