Merge pull request #436 from irihitech/11.0.7.7

Upgrade to 11.0.7.7

.github/workflows/Pack.yml

@@ -1,58 +0,0 @@
-name: Pack
-
-on:
-  push:
-    branches: [ "action/pack" ]
-  pull_request:
-    branches: [ "action/pack" ]
-
-jobs:
-  nuget_desktop:
-    runs-on: windows-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4.1.1
-
-      - name: Nuget Semi.Avalonia
-        run: dotnet pack ./src/Semi.Avalonia -o ./nugets
-
-      - name: Nuget Semi.Avalonia.ColorPicker
-        run: dotnet pack ./src/Semi.Avalonia.ColorPicker  -o ./nugets
-
-      - name: Nuget Semi.Avalonia.DataGrid
-        run: dotnet pack ./src/Semi.Avalonia.DataGrid  -o ./nugets
-
-      - name: Nuget Semi.Avalonia.TreeDataGrid
-        run: dotnet pack ./src/Semi.Avalonia.TreeDataGrid  -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 a Build Artifact
-        uses: actions/upload-artifact@v4.3.1
-        with:
-          name: nuget_desktop
-          path: |
-            ./nugets
-            ./**/publish/*.exe
-
-  android:
-    runs-on: windows-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4.1.1
-
-      - 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@v4.3.1
-        with:
-          name: android
-          path: ./**/publish/*Signed.apk

.github/workflows/deploy.yml

@@ -2,7 +2,7 @@ name: Deploy to GitHub Pages
 
 env:
   PROJECT_PATH: demo/Semi.Avalonia.Demo.Web/Semi.Avalonia.Demo.Web.csproj
-  OUTPUT_PATH: demo/Semi.Avalonia.Demo.Web/bin/Release/net7.0/browser-wasm/AppBundle
+  OUTPUT_PATH: demo/Semi.Avalonia.Demo.Web/bin/Release/net8.0-browser/publish/wwwroot
 on:
   push:
     branches: [ "action/deploy" ]
@@ -16,19 +16,16 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v4.1.1
 
-      - name: Setup .NET 7
+      - name: Setup .NET 8
         uses: actions/setup-dotnet@v4
         with:
-          dotnet-version: 7.0.405
+          dotnet-version: 8.0.x
 
       - name: Install wasm-tools
-        run: dotnet workload install wasm-tools wasm-tools-net7
+        run: dotnet workload install wasm-tools
-
-      - name: Install DotNetCompress
-        run: dotnet tool install --global DotNetCompress --version 3.0.0 --no-cache
 
       - name: Publish .NET Project
-        run: dotnet publish $PROJECT_PATH -c Release -o release --nologo
+        run: dotnet publish $PROJECT_PATH -c Release --nologo
 
       - name: Change base-tag in index.html
         run: sed -i 's/<base href="\/" \/>/<base href="\/Semi.Avalonia\/" \/>/g' $OUTPUT_PATH/index.html
@@ -36,12 +33,6 @@ jobs:
       - name: copy index.html to 404.html
         run: cp $OUTPUT_PATH/index.html $OUTPUT_PATH/404.html
 
-      - name: Compress Output using Brotli
-        run: DotNetCompress -d $OUTPUT_PATH -p "*.dll" "*.js" "*.wasm" --format br --threads 4
-
-      - name: Compress Output using GZip
-        run: DotNetCompress -d $OUTPUT_PATH -p "*.dll" "*.js" "*.wasm" --format gz --threads 4
-
       - name: Add .nojekyll file
         run: touch $OUTPUT_PATH/.nojekyll
 

.github/workflows/pack.yml

@@ -0,0 +1,32 @@
+name: Pack Nuget
+
+on:
+  push:
+    branches: [ "action/pack" ]
+  pull_request:
+    branches: [ "action/pack" ]
+
+jobs:
+  nuget:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4.1.1
+
+      - name: Nuget Semi.Avalonia
+        run: dotnet pack ./src/Semi.Avalonia -o ./nugets
+
+      - name: Nuget Semi.Avalonia.ColorPicker
+        run: dotnet pack ./src/Semi.Avalonia.ColorPicker  -o ./nugets
+
+      - name: Nuget Semi.Avalonia.DataGrid
+        run: dotnet pack ./src/Semi.Avalonia.DataGrid  -o ./nugets
+
+      - name: Nuget Semi.Avalonia.TreeDataGrid
+        run: dotnet pack ./src/Semi.Avalonia.TreeDataGrid  -o ./nugets
+
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.3.1
+        with:
+          name: nugets
+          path: ./nugets

.github/workflows/publish.yml

@@ -0,0 +1,92 @@
+name: Publish Demo
+
+on:
+  push:
+    branches: [ "action/publish" ]
+  pull_request:
+    branches: [ "action/publish" ]
+
+jobs:
+  windows:
+    runs-on: windows-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4.1.1
+
+      - name: Make upload directory
+        run: mkdir upload
+
+      - name: Publish win-x64
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true -o ./publish/win64
+
+      - name: Zip win-x64
+        run: |
+          $files = Get-ChildItem -Path ./publish/win64/* -Recurse -Exclude *.pdb
+          Compress-Archive -Path $files.FullName -DestinationPath ./upload/Semi.Avalonia.Demo.Desktop.win-x64.zip
+
+      - name: Enable Native AOT in .csproj
+        run: |
+          sed -i 's#<!--<PublishAot>true</PublishAot>-->#<PublishAot>true</PublishAot>#' demo/Semi.Avalonia.Demo.Desktop/Semi.Avalonia.Demo.Desktop.csproj
+          sed -i 's#<!--<IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>-->#<IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>#' demo/Semi.Avalonia.Demo.Desktop/Semi.Avalonia.Demo.Desktop.csproj
+
+      - name: Publish win-x64 AOT
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release -o ./publish/win64-aot
+
+      - name: Zip win-x64 AOT
+        run: |
+          $files = Get-ChildItem -Path ./publish/win64-aot/* -Recurse -Exclude *.pdb
+          Compress-Archive -Path $files.FullName -DestinationPath ./upload/Semi.Avalonia.Demo.Desktop.win-x64.NativeAOT.zip
+
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.3.1
+        with:
+          name: windows
+          path: ./upload
+
+  linux:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4.1.1
+
+      - name: Make upload directory
+        run: mkdir upload
+
+      - name: Publish linux-x64
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r linux-x64 -c Release --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true -o ./publish/linux64
+
+      - name: Zip linux-x64
+        run: zip -j -r ./upload/Semi.Avalonia.Demo.Desktop.linux-x64.zip ./publish/linux64 -x "*.pdb"
+
+      - name: Publish linux-x64 DRM
+        run: dotnet publish demo/Semi.Avalonia.Demo.Drm -r linux-x64 -c Release --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true -o ./publish/drm
+
+      - name: Zip linux-x64 DRM
+        run: zip -j -r ./upload/Semi.Avalonia.Demo.Drm.linux-x64.zip ./publish/drm -x "*.pdb"
+
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.3.1
+        with:
+          name: linux
+          path: ./upload
+
+  android:
+    runs-on: windows-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4.1.1
+
+      - name: CD Android
+        run: cd ./demo/Semi.Avalonia.Demo.Android
+
+      - name: Restore Dependencies
+        run: dotnet restore
+
+      - name: Publish Android
+        run: dotnet publish demo/Semi.Avalonia.Demo.Android -c Release -f net8.0-android --no-restore -o ./publish
+
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.3.1
+        with:
+          name: android
+          path: ./publish/*Signed.apk

.run/SC-Single.run.xml

@@ -1,6 +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" />
+    <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/net8.0/win-x64/publish" target_framework="net8.0" uuid_high="3088527218258560748" uuid_low="-8649338673481336678" />
     <method v="2" />
   </configuration>
 </component>

README.md

@@ -1,24 +1,16 @@
-# Semi Avalonia
+# Semi.Avalonia
 
 [![Semi Avalonia](https://img.shields.io/nuget/v/Semi.Avalonia.svg?color=red&style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia/)
 [![Semi Avalonia](https://img.shields.io/nuget/dt/Semi.Avalonia.svg?style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia/)
 
-[中文](./README_CN.md)
-
 Avalonia Theme inspired by Semi Design
 
-If you are looking for more customized controls, Please try [Ursa](https://github.com/irihitech/Ursa.Avalonia)
+# How to Use
-
-![Light](./docs/demo.jpg)
-
-## How to Use
-
-### Installation
 
+## Installation
 ```bash
-dotnet add package Semi.Avalonia --version 11.0.7
+dotnet add package Semi.Avalonia
 ```
-
 Include Semi Design Styles in application:
 
 ```xaml
@@ -30,13 +22,11 @@ Include Semi Design Styles in application:
 That's all. 
 
 ColorPicker, DataGrid and TreeDataGrid are distributed in separated packages. Please install if you need. 
-
 ```bash
-dotnet add package Semi.Avalonia.ColorPicker --version 11.0.7
+dotnet add package Semi.Avalonia.ColorPicker
-dotnet add package Semi.Avalonia.DataGrid --version 11.0.7
+dotnet add package Semi.Avalonia.DataGrid
-dotnet add package Semi.Avalonia.TreeDataGrid --version 11.0.7
+dotnet add package Semi.Avalonia.TreeDataGrid
 ```
-
 ```xaml
 <Application.Styles>
     <StyleInclude Source="avares://Semi.Avalonia.ColorPicker/Index.axaml" />
@@ -45,56 +35,19 @@ dotnet add package Semi.Avalonia.TreeDataGrid --version 11.0.7
 </Application.Styles>
 ```
 
-If AOT publishing is required, you need to include the rd.xml file in your project:
-
-```xml
-<ItemGroup>
-    <RdXmlFile Include="rd.xml"/>
-</ItemGroup>
-```
-
-The contents of the rd.xml file should be as follows:
-
-```xml
-<?xml version="1.0" encoding="utf-8"?>
-<Directives>
-    <!--
-        This file is part of RdXmlLibrary project.
-        Visit https://github.com/kant2002/rdxmllibrary for latest version.
-        If you have modifications specific to this Nuget package,
-        please contribute back.
-    -->
-    <Application>
-        <Assembly Name="Avalonia.Markup.Xaml" Dynamic="Required All"/>
-        <Assembly Name="Semi.Avalonia" Dynamic="Required All"/>
-        <!-- If you don't use these, please don't include them.
-            <Assembly Name="Semi.Avalonia.DataGrid" Dynamic="Required All"/>
-            <Assembly Name="Semi.Avalonia.ColorPicker" Dynamic="Required All"/>
-        -->
-    </Application>
-</Directives>
-```
-
 ## Demo
 
 You can always download demo executable to play around with Semi Avalonia Themes.
-<https://github.com/irihitech/Semi.Avalonia/releases>
+https://github.com/irihitech/Semi.Avalonia/releases
-
-## Support
-
-We offer limited free community support for Semi Avalonia and Ursa. If you have any question or suggestion, feel free to raise issues and discussions via GitHub, and you are welcomed to join our group via FeiShu(Lark)
-
-![FeiShu](./docs/community-support.png) 
 
 ## Version compatibility
 
 | Semi Design Version | Avalonia Version |
 |:--------------------|:-----------------|
-| 11.0.7              | >=11.0.7         |
+| 11.0.7              | 11.0.7           |
 | 11.0.1              | <=11.0.6         |
 
 ## TODO
-
 * FocusAdorner
 
 ## Credits
@@ -109,3 +62,10 @@ We offer limited free community support for Semi Avalonia and Ursa. If you have
 
 [CommunityToolKit](https://github.com/CommunityToolkit/dotnet)
 
+## Screenshot
+
+Light Mode
+![Light](./docs/Light.png)
+
+Dark Mode
+![Dark](./docs/Dark.png)

README_CN.md

@@ -1,113 +0,0 @@
-# Semi Avalonia
-
-[![Semi Avalonia](https://img.shields.io/nuget/v/Semi.Avalonia.svg?color=red&style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia/)
-[![Semi Avalonia](https://img.shields.io/nuget/dt/Semi.Avalonia.svg?style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia/)
-
-[English](./README.md)
-
-Avalonia UI 控件主题，灵感来自 Semi Design
-
-如果您希望使用更多的拓展控件，欢迎尝试 [Ursa](https://github.com/irihitech/Ursa.Avalonia)
-
-![Light](./docs/demo.jpg)
-
-## 如何使用
-
-### 安装
-
-```bash
-dotnet add package Semi.Avalonia --version 11.0.7
-```
-
-在样式中引用 Semi 主题：
-
-```xaml
-<Application.Styles>
-    <StyleInclude Source="avares://Semi.Avalonia/Themes/Index.axaml" />
-</Application.Styles>
-```
-
-这样就可以了。
-
-ColorPicker， DataGrid 和 TreeDataGrid 的样式单独分发，如果需要请安装并引用。
-
-```bash
-dotnet add package Semi.Avalonia.ColorPicker --version 11.0.7
-dotnet add package Semi.Avalonia.DataGrid --version 11.0.7
-dotnet add package Semi.Avalonia.TreeDataGrid --version 11.0.7
-```
-
-```xaml
-<Application.Styles>
-    <StyleInclude Source="avares://Semi.Avalonia.ColorPicker/Index.axaml" />
-    <StyleInclude Source="avares://Semi.Avalonia.DataGrid/Index.axaml" />
-    <StyleInclude Source="avares://Semi.Avalonia.TreeDataGrid/Index.axaml" />
-</Application.Styles>
-```
-
-如果需要进行 AOT 发布，则需要在项目中包含 rd.xml 文件：
-
-```xml
-<ItemGroup>
-    <RdXmlFile Include="rd.xml"/>
-</ItemGroup>
-```
-
-rd.xml 文件的内容如下：
-
-```xml
-<?xml version="1.0" encoding="utf-8"?>
-<Directives>
-    <!--
-        This file is part of RdXmlLibrary project.
-        Visit https://github.com/kant2002/rdxmllibrary for latest version.
-        If you have modifications specific to this Nuget package,
-        please contribute back.
-    -->
-    <Application>
-        <Assembly Name="Avalonia.Markup.Xaml" Dynamic="Required All"/>
-        <Assembly Name="Semi.Avalonia" Dynamic="Required All"/>
-        <!-- If you don't use these, please don't include them.
-            <Assembly Name="Semi.Avalonia.DataGrid" Dynamic="Required All"/>
-            <Assembly Name="Semi.Avalonia.ColorPicker" Dynamic="Required All"/>
-        -->
-    </Application>
-</Directives>
-```
-
-## 示例
-
-您可以从 Semi Avalonia 的 release 页下载并试用 Semi Avalonia 的展示应用。
-
-<https://github.com/irihitech/Semi.Avalonia/releases>
-
-## 社区支持
-
-我们提供有限度的免费社区支持，如果您有任何问题或建议，除了在GitHub上提交issue或发起讨论，也欢迎加入我们的飞书交流群：
-
-![FeiShu](./docs/community-support.png)
-
-
-## 版本兼容性
-
-| Semi Design Version | Avalonia Version |
-|:--------------------|:-----------------|
-| 11.0.7              | >=11.0.7         |
-| 11.0.1              | <=11.0.6         |
-
-## 代办事项
-
-* FocusAdorner
-
-## 致谢
-
-[Semi Design](https://semi.design/)
-
-[Avalonia](https://github.com/AvaloniaUI/Avalonia)
-
-[FluentAvalonia](https://github.com/amwx/FluentAvalonia)
-
-[Material Design Icons](https://pictogrammers.com/library/mdi/)
-
-[CommunityToolKit](https://github.com/CommunityToolkit/dotnet)
-

demo/Directory.Build.props

@@ -1,6 +1,6 @@
 <Project>
   <PropertyGroup>
     <Nullable>enable</Nullable>
-    <AvaloniaVersion>11.1.0-beta2</AvaloniaVersion>
+    <AvaloniaVersion>11.0.7</AvaloniaVersion>
   </PropertyGroup>
 </Project>

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

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk">
     <PropertyGroup>
         <OutputType>Exe</OutputType>
-        <TargetFramework>net7.0-android</TargetFramework>
+        <TargetFramework>net8.0-android</TargetFramework>
         <SupportedOSPlatformVersion>21</SupportedOSPlatformVersion>
         <ApplicationId>com.irihitech.Semi.Avalonia</ApplicationId>
         <ApplicationVersion>1</ApplicationVersion>
@@ -15,11 +15,11 @@
     <Import Project="../Directory.Build.props" />
 
     <ItemGroup>
-      <PackageReference Include="Avalonia.Android" Version="$(AvaloniaVersion)" />
+        <PackageReference Include="Avalonia.Android" Version="$(AvaloniaVersion)" />
     </ItemGroup>
 
     <ItemGroup>
-      <ProjectReference Include="..\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj" />
+        <ProjectReference Include="..\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj" />
     </ItemGroup>
 
 </Project>

demo/Semi.Avalonia.Demo.Desktop/Roots.xml

@@ -0,0 +1,3 @@
+<linker>
+    <assembly fullname="Semi.Avalonia.Demo" preserve="All"/>
+</linker>

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

@@ -1,14 +1,17 @@
 <Project Sdk="Microsoft.NET.Sdk">
     <PropertyGroup>
         <OutputType>WinExe</OutputType>
-        <TargetFramework>net7.0</TargetFramework>
+        <TargetFramework>net8.0</TargetFramework>
         <Nullable>enable</Nullable>
         <BuiltInComInteropSupport>true</BuiltInComInteropSupport>
         <!-- Uncomment below to enable Native AOT compilation-->
-        <!--
+        <!--<PublishAot>true</PublishAot>-->
-        <PublishAot>true</PublishAot>
+        <!--<IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>-->
-        <IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>
+    </PropertyGroup>
-        -->
+
+    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
+        <IsTrimmable>true</IsTrimmable>
+        <PublishTrimmed>true</PublishTrimmed>
     </PropertyGroup>
 
     <PropertyGroup>
@@ -16,7 +19,7 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <RdXmlFile Include="rd.xml" />
+        <TrimmerRootDescriptor Include="Roots.xml" />
     </ItemGroup>
 
     <ItemGroup>

demo/Semi.Avalonia.Demo.Desktop/rd.xml

@@ -1,16 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<Directives>
-    <!--
-        This file is part of RdXmlLibrary project.
-        Visit https://github.com/kant2002/rdxmllibrary for latest version.
-        If you have modifications specific to this Nuget package,
-        please contribute back.
-    -->
-    <Application>
-        <Assembly Name="Avalonia.Markup.Xaml" Dynamic="Required All"/>
-        <Assembly Name="Semi.Avalonia" Dynamic="Required All"/>
-        <Assembly Name="Semi.Avalonia.DataGrid" Dynamic="Required All"/>
-        <Assembly Name="Semi.Avalonia.ColorPicker" Dynamic="Required All"/>
-        <Assembly Name="Semi.Avalonia.Demo" Dynamic="Required All"/>
-    </Application>
-</Directives>

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

@@ -3,6 +3,7 @@ using System.Globalization;
 using System.Linq;
 using System.Threading;
 using Avalonia;
+using Avalonia.Dialogs;
 
 namespace Semi.Avalonia.Demo.Drm;
 
@@ -28,7 +29,7 @@ class Program
         if (args.Contains("--drm"))
         {
             SilenceConsole();
-            return builder.StartLinuxDrm(args: args, card: "/dev/dri/card1", scaling: GetScaling());
+            return builder.StartLinuxDrm(args, scaling: GetScaling());
         }
 
         return builder.StartWithClassicDesktopLifetime(args);
@@ -37,7 +38,9 @@ class Program
     // Avalonia configuration, don't remove; also used by visual designer.
     public static AppBuilder BuildAvaloniaApp()
         => AppBuilder.Configure<App>()
+            .UseManagedSystemDialogs()
             .UsePlatformDetect()
+            .With(new Win32PlatformOptions())
             .LogToTrace();
 
     private static void SilenceConsole()

demo/Semi.Avalonia.Demo.Drm/README.md

@@ -0,0 +1,162 @@
+# DRM Start Steps
+
+[中文](README_CN.md)
+
+(Ubuntu 20.04 live server linux-x64 Virtual Machine Test Success)  
+(Orange Pi Zero2 Ubuntu20.04-arm64 Test Success)
+
+[Avalonia Official Reference Document](https://docs.avaloniaui.net/docs/next/guides/platforms/rpi/running-on-raspbian-lite-via-drm)
+
+## Setup Running Environment
+
+1. Run the following commands on the Linux side
+```bash
+sudo apt update
+sudo apt upgrade
+sudo reboot
+sudo apt-get install libgbm1 libgl1-mesa-dri libegl1-mesa libinput10
+```
+
+2. Install the test tool (if a colored cube appears, the environment is installed)
+```bash
+sudo apt-get install kmscube
+sudo kmscube
+```
+
+3. [Install .NET Runtime](https://learn.microsoft.com/dotnet/core/install/linux?WT.mc_id=dotnet-35129-website)
+
+4. Add the Avalonia.LinuxFramebuffer package in NuGet
+
+```bash
+dotnet add package Avalonia.LinuxFramebuffer
+```
+
+5. Add StartLinuxDrm code
+
+```csharp
+public static int Main(string[] args)
+{
+    var builder = BuildAvaloniaApp();
+    if (args.Contains("--drm"))
+    {
+        SilenceConsole();
+        // By default, Avalonia will try to detect output card automatically.
+        // But you can specify one, for example "/dev/dri/card1".
+        return builder.StartLinuxDrm(args: args, card: null, scaling: 1.0);
+    }
+
+    return builder.StartWithClassicDesktopLifetime(args);
+}
+
+private static void SilenceConsole()
+{
+    new Thread(() =>
+        {
+            Console.CursorVisible = false;
+            while (true)
+                Console.ReadKey(true);
+        })
+        { IsBackground = true }.Start();
+}
+```
+
+6. Publish the app to Linux
+
+```bash
+dotnet publish demo/Semi.Avalonia.Demo.Drm/Semi.Avalonia.Demo.Drm.csproj -c Release -r linux-x64 --sc -p:PublishSingleFile=true -p:IncludeNativeLibrariesForSelfExtract=true
+```
+
+Add the following code to the csproj file for AOT publishing
+
+```xml
+<PropertyGroup>
+    <PublishAot>true</PublishAot>
+    <IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>
+</PropertyGroup>
+```
+
+```bash
+dotnet publish demo/Semi.Avalonia.Demo.Drm/Semi.Avalonia.Demo.Drm.csproj -c Release -r linu-x64
+```
+
+7. Run the program
+
+```bash
+sudo ./Semi.Avalonia.Demo.Drm --drm
+```
+
+## Troubleshooting
+
+1. Error message
+
+> Unhandled exception. Avalonia.Markup.Xaml.XamlLoadException: No precompiled XAML found for avares://Semi.Avalonia/Themes/Light/Light.axaml (baseUri: avares://Semi.Avalonia/Themes/Index.axaml), make sure to specify x:Class and include your XAML file as AvaloniaResource
+
+Solution:
+
+If you use the Semi release file, do not trim it, otherwise an error will occur.
+
+24.8.18 update: This issue has been fixed.
+
+2. Error message
+
+> Unhandled exception. System.TypeInitializationException: The type initializer for 'SkiaSharp.SKImageInfo' threw an exception.**
+    **--->System.DllNotFoundException: Unable to load shared library 'libSkiaSharp' or one of its dependencies.In order to help diagnose loading problems, consider setting the LD_DEBUG environment variable: liblibSkiaSharp: cannot open shared object file: No such file or directory
+    at SkiaSharp.SkiaApi.sk_colortype_get_default_8888()
+    at SkiaSharp.SKImageInfo..cctor()
+
+Solution:
+
+Linux CLI installation
+
+```bash
+sudo apt-get install -y libfontconfig1  
+```
+[Reference](https://github.com/mono/SkiaSharp/issues/509)
+
+3. Error message
+
+> Permission denied
+
+Solution:
+
+add permission
+
+```bash
+sudo chmod +x ./Semi.Avalonia.Demo.Drm
+```
+
+4. Error message
+
+> Unhandled exception. System.ComponentModel.Win32Exception (95): drmModeGetResources failed
+at Avalonia.LinuxFramebuffer.Output.DrmResources..ctor(Int32 fd, Boolean connectorsForceProbe) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 91
+at Avalonia.LinuxFramebuffer.Output.DrmCard.GetResources(Boolean connectorsForceProbe) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 171
+at Avalonia.LinuxFramebuffer.Output.DrmOutput..ctor(String path, Boolean connectorsForceProbe, DrmOutputOptions options) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmOutput.cs:line 60
+at LinuxFramebufferPlatformExtensions.StartLinuxDrm(AppBuilder builder, String[] args, String card, Double scaling, IInputBackend inputBackend) in /_/src/Linux/Avalonia.LinuxFramebuffer/LinuxFramebufferPlatform.cs:line 166
+at Semi.Avalonia.Demo.Drm.Program.Main(String[] args)
+
+Solution:
+
+The `program.cs` graphics card path is incorrect, it may not be `dev/dri/card1`, see if there are other graphics cards in the `dev/dri` directory such as `card0`.
+
+24.8.18 update: Avalonia will now automatically detect the graphics card path, so you don't need to specify the graphics card path.
+
+```csharp
+return builder.StartLinuxDrm(args: args, card: null, scaling: 1.0);
+```
+
+5. Error message
+>Unhandled exception. System.ComponentModel.Win32Exception (2): Couldn't open /dev/dri/card1
+at Avalonia.LinuxFramebuffer.Output.DrmCard..ctor(String ) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 167
+at Avalonia.LinuxFramebuffer.Output.DrmOutput..ctor(String , Boolean , DrmOutputOptions ) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmOutput.cs:line 58
+at LinuxFramebufferPlatformExtensions.StartLinuxDrm(AppBuilder, String[], String , Double , IInputBackend ) in /_/src/Linux/Avalonia.LinuxFramebuffer/LinuxFramebufferPlatform.cs:line 166
+at Semi.Avalonia.Demo.Drm.Program.Main(String[])
+
+Solution:
+
+Unable to open `/dev/dri/card1`, may be the graphics card is mounted to another folder.
+
+24.8.18 update: Avalonia will now automatically detect the graphics card path, so you don't need to specify the graphics card path.
+
+```csharp
+return builder.StartLinuxDrm(args: args, card: null, scaling: 1.0);
+```

demo/Semi.Avalonia.Demo.Drm/README_CN.md

@@ -0,0 +1,162 @@
+# DRM启动步骤
+
+[English](README.md)
+
+(Ubuntu 20.04 live server linux-x64 虚拟机测试成功)  
+(Orange Pi Zero2 Ubuntu20.04-arm64 测试成功)
+
+[Avalonia 官方参考文档](https://docs.avaloniaui.net/docs/next/guides/platforms/rpi/running-on-raspbian-lite-via-drm)
+
+## 搭建运行环境
+
+1. Linux端运行命令
+```bash
+sudo apt update
+sudo apt upgrade
+sudo reboot
+sudo apt-get install libgbm1 libgl1-mesa-dri libegl1-mesa libinput10
+```
+
+2. 安装测试工具(出现一个彩色立方体说明环境安装完成)  
+```bash
+sudo apt-get install kmscube
+sudo kmscube
+```
+
+3. [安装.net运行时](https://learn.microsoft.com/dotnet/core/install/linux?WT.mc_id=dotnet-35129-website)
+
+4. NuGet里面添加Avalonia.LinuxFramebuffer包
+
+```bash
+dotnet add package Avalonia.LinuxFramebuffer
+```
+
+5. 添加StartLinuxDrm代码
+
+```csharp
+public static int Main(string[] args)
+{
+    var builder = BuildAvaloniaApp();
+    if (args.Contains("--drm"))
+    {
+        SilenceConsole();
+        // By default, Avalonia will try to detect output card automatically.
+        // But you can specify one, for example "/dev/dri/card1".
+        return builder.StartLinuxDrm(args: args, card: null, scaling: 1.0);
+    }
+
+    return builder.StartWithClassicDesktopLifetime(args);
+}
+
+private static void SilenceConsole()
+{
+    new Thread(() =>
+        {
+            Console.CursorVisible = false;
+            while (true)
+                Console.ReadKey(true);
+        })
+        { IsBackground = true }.Start();
+}
+```
+
+6. 发布程序到Linux
+
+```bash
+dotnet publish demo/Semi.Avalonia.Demo.Drm/Semi.Avalonia.Demo.Drm.csproj -c Release -r linux-x64 --sc -p:PublishSingleFile=true -p:IncludeNativeLibrariesForSelfExtract=true
+```
+
+AOT发布需要在csproj文件中添加以下代码
+
+```xml
+<PropertyGroup>
+    <PublishAot>true</PublishAot>
+    <IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>
+</PropertyGroup>
+```
+
+```bash
+dotnet publish demo/Semi.Avalonia.Demo.Drm/Semi.Avalonia.Demo.Drm.csproj -c Release -r linu-x64
+```
+
+7. 运行程序
+
+```bash
+sudo ./Semi.Avalonia.Demo.Drm --drm
+```
+
+## 报错处理
+
+1. 报错内容
+
+> Unhandled exception. Avalonia.Markup.Xaml.XamlLoadException: No precompiled XAML found for avares://Semi.Avalonia/Themes/Light/Light.axaml (baseUri: avares://Semi.Avalonia/Themes/Index.axaml), make sure to specify x:Class and include your XAML file as AvaloniaResource
+
+解决方法：
+
+如果使用Semi发布文件不要裁剪，如果裁剪会报错。
+
+24.8.18更新：现在已经修复了这个问题。
+
+2. 报错内容
+
+> Unhandled exception. System.TypeInitializationException: The type initializer for 'SkiaSharp.SKImageInfo' threw an exception.**
+    **--->System.DllNotFoundException: Unable to load shared library 'libSkiaSharp' or one of its dependencies.In order to help diagnose loading problems, consider setting the LD_DEBUG environment variable: liblibSkiaSharp: cannot open shared object file: No such file or directory
+    at SkiaSharp.SkiaApi.sk_colortype_get_default_8888()
+    at SkiaSharp.SKImageInfo..cctor()
+
+解决方法：
+
+Linux 命令行安装
+
+```bash
+sudo apt-get install -y libfontconfig1  
+```
+
+[参考网址](https://github.com/mono/SkiaSharp/issues/509)
+
+3. 报错内容
+
+> Permission denied
+
+解决方法：
+
+添加执行权限
+```bash
+sudo chmod +x ./Semi.Avalonia.Demo.Drm
+```
+
+4. 报错内容
+
+> Unhandled exception. System.ComponentModel.Win32Exception (95): drmModeGetResources failed
+at Avalonia.LinuxFramebuffer.Output.DrmResources..ctor(Int32 fd, Boolean connectorsForceProbe) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 91
+at Avalonia.LinuxFramebuffer.Output.DrmCard.GetResources(Boolean connectorsForceProbe) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 171
+at Avalonia.LinuxFramebuffer.Output.DrmOutput..ctor(String path, Boolean connectorsForceProbe, DrmOutputOptions options) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmOutput.cs:line 60
+at LinuxFramebufferPlatformExtensions.StartLinuxDrm(AppBuilder builder, String[] args, String card, Double scaling, IInputBackend inputBackend) in /_/src/Linux/Avalonia.LinuxFramebuffer/LinuxFramebufferPlatform.cs:line 166
+at Semi.Avalonia.Demo.Drm.Program.Main(String[] args)
+
+解决方法：
+
+`program.cs`的显卡路径错误，可能不是`dev/dri/card1`，看在`dev/dri`目录下有无其他的显卡如`card0`。
+
+24.8.18更新：现在Avalonia会自动检测显卡路径，所以不需要指定显卡路径。
+
+```csharp
+return builder.StartLinuxDrm(args: args, card: null, scaling: 1.0);
+```
+
+5. 报错内容
+>Unhandled exception. System.ComponentModel.Win32Exception (2): Couldn't open /dev/dri/card1
+at Avalonia.LinuxFramebuffer.Output.DrmCard..ctor(String ) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 167
+at Avalonia.LinuxFramebuffer.Output.DrmOutput..ctor(String , Boolean , DrmOutputOptions ) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmOutput.cs:line 58
+at LinuxFramebufferPlatformExtensions.StartLinuxDrm(AppBuilder, String[], String , Double , IInputBackend ) in /_/src/Linux/Avalonia.LinuxFramebuffer/LinuxFramebufferPlatform.cs:line 166
+at Semi.Avalonia.Demo.Drm.Program.Main(String[])
+
+解决办法：
+
+找不到显卡路径`dev/dri/card1`，可能是显卡挂载到别的文件夹下了。
+
+24.8.18更新：现在Avalonia会自动检测显卡路径，所以不需要指定显卡路径。
+
+```csharp
+return builder.StartLinuxDrm(args: args, card: null, scaling: 1.0);
+```

demo/Semi.Avalonia.Demo.Drm/Roots.xml

@@ -0,0 +1,3 @@
+<linker>
+    <assembly fullname="Semi.Avalonia.Demo" preserve="All"/>
+</linker>

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

@@ -1,22 +1,35 @@
 <Project Sdk="Microsoft.NET.Sdk">
-  <PropertyGroup>
+    <PropertyGroup>
-    <OutputType>WinExe</OutputType>
+        <OutputType>WinExe</OutputType>
-    <TargetFramework>net7.0</TargetFramework>
+        <TargetFramework>net8.0</TargetFramework>
-    <Nullable>enable</Nullable>
+        <Nullable>enable</Nullable>
-    <BuiltInComInteropSupport>true</BuiltInComInteropSupport>
+        <BuiltInComInteropSupport>true</BuiltInComInteropSupport>
-    <ApplicationManifest>app.manifest</ApplicationManifest>
+        <!-- Uncomment below to enable Native AOT compilation-->
-  </PropertyGroup>
+        <!--<PublishAot>true</PublishAot>-->
+        <!--<IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>-->
+    </PropertyGroup>
 
+    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
+        <IsTrimmable>true</IsTrimmable>
+        <PublishTrimmed>true</PublishTrimmed>
+    </PropertyGroup>
 
-  <ItemGroup>
+    <PropertyGroup>
-    <PackageReference Include="Avalonia.Desktop" Version="$(AvaloniaVersion)" />
+        <ApplicationManifest>app.manifest</ApplicationManifest>
-    <!--Condition below is needed to remove Avalonia.Diagnostics package from build output in Release configuration.-->
+    </PropertyGroup>
-    <PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="$(AvaloniaVersion)" />
-    <PackageReference Include="Avalonia.LinuxFramebuffer" Version="$(AvaloniaVersion)" />
-  </ItemGroup>
 
+    <ItemGroup>
+        <TrimmerRootDescriptor Include="Roots.xml" />
+    </ItemGroup>
 
-  <ItemGroup>
+    <ItemGroup>
-    <ProjectReference Include="..\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj" />
+        <PackageReference Include="Avalonia.Desktop" Version="$(AvaloniaVersion)" />
-  </ItemGroup>
+        <!--Condition below is needed to remove Avalonia.Diagnostics package from build output in Release configuration.-->
+        <PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="$(AvaloniaVersion)" />
+        <PackageReference Include="Avalonia.LinuxFramebuffer" Version="$(AvaloniaVersion)" />
+    </ItemGroup>
+
+    <ItemGroup>
+        <ProjectReference Include="..\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj" />
+    </ItemGroup>
 </Project>

demo/Semi.Avalonia.Demo.Drm/使用方法.md

@@ -1,77 +0,0 @@
-# DRM启动步骤
-
-(Ubuntu18.04Server版本 虚拟机测试OK)  
-(Orange Pi Zero2 Ubuntu20.04-arm64 测试OK)
-
-Avalonia官方参考文档：https://docs.avaloniaui.net/docs/next/guides/platforms/rpi/running-on-raspbian-lite-via-drm
-
-1.Linux端运行命令  
-```
-sudo apt update  
-sudo apt upgrade  
-sudo reboot  
-sudo apt - get install libgbm1 libgl1 - mesa - dri libegl1 - mesa libinput10
-```
-
-2.安装测试工具测试(出现一个彩色立方体说明环境安装完成)  
-```
-sudo apt-get install kmscube
-sudo kmscube
-```
-
-3.安装.net运行时(参考网址：https://learn.microsoft.com/zh-cn/dotnet/core/install/linux?WT.mc_id=dotnet-35129-website)
-
-4.新建一个Avalonia项目，nuget里面添加Avalonia.LinuxFramebuffer包
-
-5.添加StartLinuxDrm代码(不知道怎么添加看Semi.Avalonia.Demo.Drm项目代码)
-
-6.发布程序到Linux(安装.net，怎么运行这些省略)
-            
-7.运行 ./Semi.Avalonia.Demo.Drm --drm
-
-## 报错处理：
-
-1. 报错内容
-
->Unhandled exception. Avalonia.Markup.Xaml.XamlLoadException: No precompiled XAML found for avares://Semi.Avalonia/Themes/Light/Light.axaml (baseUri: avares://Semi.Avalonia/Themes/Index.axaml), make sure to specify x:Class and include your XAML file as AvaloniaResource
-
- 解决方法：
->如果使用Semi发布文件不要裁剪，如果裁剪会报错
-         
-
-2. 报错内容
->Unhandled exception. System.TypeInitializationException: The type initializer for 'SkiaSharp.SKImageInfo' threw an exception.**
-    **--->System.DllNotFoundException: Unable to load shared library 'libSkiaSharp' or one of its dependencies.In order to help diagnose loading problems, consider setting the LD_DEBUG environment variable: liblibSkiaSharp: cannot open shared object file: No such file or directory
-    at SkiaSharp.SkiaApi.sk_colortype_get_default_8888()
-    at SkiaSharp.SKImageInfo..cctor()
-
-解决方法：
->Linux命令行安装一下 apt-get install -y libfontconfig1  
-参考网址：https://github.com/mono/SkiaSharp/issues/509
-
-3. 报错内容
->Permission denied
-
-解决方法：  
->sudo chmod +x ./Semi.Avalonia.Demo.Drm
-
-4. 报错内容
->Unhandled exception. System.ComponentModel.Win32Exception (95): drmModeGetResources failed
-at Avalonia.LinuxFramebuffer.Output.DrmResources..ctor(Int32 fd, Boolean connectorsForceProbe) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 91
-at Avalonia.LinuxFramebuffer.Output.DrmCard.GetResources(Boolean connectorsForceProbe) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 171
-at Avalonia.LinuxFramebuffer.Output.DrmOutput..ctor(String path, Boolean connectorsForceProbe, DrmOutputOptions options) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmOutput.cs:line 60
-at LinuxFramebufferPlatformExtensions.StartLinuxDrm(AppBuilder builder, String[] args, String card, Double scaling, IInputBackend inputBackend) in /_/src/Linux/Avalonia.LinuxFramebuffer/LinuxFramebufferPlatform.cs:line 166
-at Semi.Avalonia.Demo.Drm.Program.Main(String[] args)
-
-解决方法：
->`program.cs`的显卡路径错误，可能不是`dev/dri/card1`，看在`dev/dri`目录下有无其他的显卡如`card0`。
-
-5. 报错内容
->Unhandled exception. System.ComponentModel.Win32Exception (2): Couldn't open /dev/dri/card1
-at Avalonia.LinuxFramebuffer.Output.DrmCard..ctor(String ) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmBindings.cs:line 167
-at Avalonia.LinuxFramebuffer.Output.DrmOutput..ctor(String , Boolean , DrmOutputOptions ) in /_/src/Linux/Avalonia.LinuxFramebuffer/Output/DrmOutput.cs:line 58
-at LinuxFramebufferPlatformExtensions.StartLinuxDrm(AppBuilder, String[], String , Double , IInputBackend ) in /_/src/Linux/Avalonia.LinuxFramebuffer/LinuxFramebufferPlatform.cs:line 166
-at Semi.Avalonia.Demo.Drm.Program.Main(String[])
-
-解决办法：
->找不到显卡路径`dev/dri/card1`，可能是显卡挂载到别的文件夹下了，待解决。

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

@@ -0,0 +1,16 @@
+using Avalonia;
+using Avalonia.Media;
+
+namespace Semi.Avalonia.Demo.Web;
+
+public static class AvaloniaAppBuilderExtensions
+{
+    private static string DefaultFontFamily => "avares://Semi.Avalonia.Demo.Web/Assets#Source Han Sans CN";
+
+    public static AppBuilder WithSourceHanSansCNFont(this AppBuilder builder) =>
+        builder.With(new FontManagerOptions
+        {
+            DefaultFamilyName = DefaultFontFamily,
+            FontFallbacks = new[] { new FontFallback { FontFamily = new FontFamily(DefaultFontFamily) } }
+        });
+}

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

@@ -10,6 +10,7 @@ namespace Semi.Avalonia.Demo.Web;
 internal sealed partial class Program
 {
     private static Task Main(string[] args) => BuildAvaloniaApp()
+        .WithSourceHanSansCNFont()
         .StartBrowserAppAsync("out");
 
     public static AppBuilder BuildAvaloniaApp()

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

@@ -1,21 +1,18 @@
-<Project Sdk="Microsoft.NET.Sdk">
+<Project Sdk="Microsoft.NET.Sdk.WebAssembly">
     <PropertyGroup>
         <OutputType>Exe</OutputType>
         <TargetFramework>net8.0-browser</TargetFramework>
-        <RuntimeIdentifier>browser-wasm</RuntimeIdentifier>
-        <WasmMainJSPath>wwwroot\main.js</WasmMainJSPath>
-        <WasmRuntimeAssetsLocation>./_framework</WasmRuntimeAssetsLocation>
     </PropertyGroup>
 
     <ItemGroup>
-        <WasmExtraFilesToDeploy Include="wwwroot\**"/>
+        <AvaloniaResource Include="Assets\**"/>
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Browser" Version="$(AvaloniaVersion)" />
+        <PackageReference Include="Avalonia.Browser" Version="$(AvaloniaVersion)"/>
     </ItemGroup>
 
     <ItemGroup>
-        <ProjectReference Include="..\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj" />
+        <ProjectReference Include="..\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj"/>
     </ItemGroup>
 </Project>

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

@@ -45,7 +45,7 @@
                                     <DataGridTextColumn
                                         Width="*"
                                         x:DataType="viewModels:ColorItemViewModel"
-                                        Binding="{Binding ColorDisplayName}"
+                                        Binding="{ReflectionBinding ColorDisplayName}"
                                         CanUserSort="False"
                                         Header="Name" />
                                     <DataGridTemplateColumn Width="100" Header="Hex">
@@ -99,7 +99,7 @@
                                     <DataGridTextColumn
                                         Width="*"
                                         x:DataType="viewModels:ColorItemViewModel"
-                                        Binding="{Binding ColorDisplayName}"
+                                        Binding="{ReflectionBinding ColorDisplayName}"
                                         CanUserSort="False"
                                         Header="Name" />
                                     <DataGridTemplateColumn Width="100" Header="Hex">

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

@@ -17,72 +17,58 @@
         <StackPanel.Styles>
             <Style Selector="AutoCompleteBox">
                 <Setter Property="Width" Value="300" />
-                <Setter Property="ItemsSource">
-                    <Binding Path="States" />
-                </Setter>
-                <Setter Property="ItemTemplate">
-                    <DataTemplate DataType="local:StateData">
-                        <TextBlock Text="{Binding Name}" />
-                    </DataTemplate>
-                </Setter>
             </Style>
         </StackPanel.Styles>
-
         <AutoCompleteBox
-            Watermark="Please select a State"
+            ItemsSource="{Binding States}"
-            ValueMemberBinding="{Binding Name}" />
+            ValueMemberBinding="{Binding Name}"
+            Watermark="Please select a State">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
         <AutoCompleteBox
             Classes="Large"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ItemsSource="{Binding States}"
+            ValueMemberBinding="{ReflectionBinding Name}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
         <AutoCompleteBox
             Classes="Small"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ItemsSource="{Binding States}"
+            ValueMemberBinding="{ReflectionBinding Name}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
         <AutoCompleteBox
             Classes="Bordered"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ItemsSource="{Binding States}"
+            ValueMemberBinding="{ReflectionBinding Name}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
         <AutoCompleteBox
             IsEnabled="False"
-            Watermark="Disabled"
+            ItemsSource="{Binding States}"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ValueMemberBinding="{ReflectionBinding Name}"
-        <AutoCompleteBox
+            Watermark="Disabled">
-            InnerLeftContent="https://"
+            <AutoCompleteBox.ItemTemplate>
-            InnerRightContent=".com"
+                <DataTemplate DataType="local:StateData">
-            ValueMemberBinding="{ReflectionBinding Name}" />
+                    <TextBlock Text="{Binding Name}" />
-
+                </DataTemplate>
-        <StackPanel Orientation="Horizontal">
+            </AutoCompleteBox.ItemTemplate>
-            <AutoCompleteBox
+        </AutoCompleteBox>
-                Width="100"
-                Classes="Large"
-                Watermark="Large"
-                ValueMemberBinding="{ReflectionBinding Name}" />
-            <AutoCompleteBox
-                Width="100"
-                Watermark="Default"
-                ValueMemberBinding="{ReflectionBinding Name}" />
-            <AutoCompleteBox
-                Width="100"
-                Classes="Small"
-                Watermark="Small"
-                ValueMemberBinding="{ReflectionBinding Name}" />
-        </StackPanel>
-
-        <StackPanel Orientation="Horizontal">
-            <AutoCompleteBox
-                Width="100"
-                IsEnabled="False"
-                Watermark="Disabled"
-                ValueMemberBinding="{ReflectionBinding Name}" />
-            <AutoCompleteBox
-                Width="100"
-                Classes="Bordered"
-                Watermark="Bordered"
-                ValueMemberBinding="{ReflectionBinding Name}" />
-            <AutoCompleteBox
-                Width="100"
-                Classes="Bordered"
-                IsEnabled="False"
-                ValueMemberBinding="{ReflectionBinding Name}" />
-        </StackPanel>
-
     </StackPanel>
 </UserControl>

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

@@ -44,11 +44,6 @@
                 <Button Classes="Danger">Danger</Button>
                 <Button Classes="Danger" IsEnabled="False">Disabled</Button>
             </StackPanel>
-            <StackPanel Orientation="Horizontal" Spacing="20">
-                <Button Classes="Primary Small">Small</Button>
-                <Button Classes="Primary">Default</Button>
-                <Button Classes="Primary Large">Large</Button>
-            </StackPanel>
             <TextBlock>Solid</TextBlock>
             <StackPanel Orientation="Horizontal" Spacing="20">
                 <Button Classes="Primary" Theme="{DynamicResource SolidButton}">Primary</Button>
@@ -64,6 +59,16 @@
                     Disabled
                 </Button>
             </StackPanel>
+            <TextBlock>Outline</TextBlock>
+            <StackPanel Orientation="Horizontal" Spacing="20">
+                <Button Classes="Primary" Theme="{DynamicResource OutlineButton}">Primary</Button>
+                <Button Classes="Secondary" Theme="{DynamicResource OutlineButton}">Secondary</Button>
+                <Button Classes="Tertiary" Theme="{DynamicResource OutlineButton}">Tertiary</Button>
+                <Button Classes="Success" Theme="{DynamicResource OutlineButton}">Success</Button>
+                <Button Classes="Warning" Theme="{DynamicResource OutlineButton}">Warning</Button>
+                <Button Classes="Danger" Theme="{DynamicResource OutlineButton}">Danger</Button>
+                <Button Classes="Danger" Theme="{DynamicResource OutlineButton}" IsEnabled="False">Disabled</Button>
+            </StackPanel>
             <TextBlock>Borderless</TextBlock>
             <StackPanel Orientation="Horizontal" Spacing="20">
                 <Button Classes="Primary" Theme="{DynamicResource BorderlessButton}">Primary</Button>
@@ -79,6 +84,19 @@
                     Disabled
                 </Button>
             </StackPanel>
+            <TextBlock>Disabled</TextBlock>
+            <StackPanel Background="{DynamicResource SemiColorBackground1}" Orientation="Horizontal" Spacing="20">
+                <Button IsEnabled="False">Light</Button>
+                <Button IsEnabled="False" Theme="{DynamicResource SolidButton}">Solid</Button>
+                <Button IsEnabled="False" Theme="{DynamicResource OutlineButton}">Outline</Button>
+                <Button IsEnabled="False" Theme="{DynamicResource BorderlessButton}">Borderless</Button>
+            </StackPanel>
+            <TextBlock>Size Classes</TextBlock>
+            <StackPanel Orientation="Horizontal" Spacing="20">
+                <Button Classes="Primary Small">Small</Button>
+                <Button Classes="Primary">Default</Button>
+                <Button Classes="Primary Large">Large</Button>
+            </StackPanel>
 
             <TextBlock>DropDownButton</TextBlock>
             <StackPanel Orientation="Horizontal" Spacing="8">
@@ -96,9 +114,11 @@
             <StackPanel Orientation="Horizontal" Spacing="8">
                 <DropDownButton Content="Default" Classes="Success"/>
                 <DropDownButton Content="Solid" Theme="{DynamicResource SolidDropDownButton}" Classes="Success"/>
+                <DropDownButton Content="Outline" Theme="{DynamicResource OutlineDropDownButton}" Classes="Success"/>
                 <DropDownButton Content="Borderless" Theme="{DynamicResource BorderlessDropDownButton}" Classes="Success"/>
                 <DropDownButton Content="Default" Classes="Success" IsEnabled="False"/>
                 <DropDownButton Content="Solid" Theme="{DynamicResource SolidDropDownButton}" Classes="Success" IsEnabled="False"/>
+                <DropDownButton Content="Outline" Theme="{DynamicResource OutlineDropDownButton}" Classes="Success" IsEnabled="False"/>
                 <DropDownButton Content="Borderless" Theme="{DynamicResource BorderlessDropDownButton}" Classes="Success" IsEnabled="False"/>
             </StackPanel>
             <StackPanel Orientation="Horizontal" Spacing="8">
@@ -119,11 +139,13 @@
             </StackPanel>
             <StackPanel Orientation="Horizontal" Spacing="8">
                 <SplitButton Content="Default" Classes="Success" />
-                <SplitButton Theme="{DynamicResource SolidSplitButton}" Content="Solid" Classes="Success" />
+                <SplitButton Content="Solid" Theme="{DynamicResource SolidSplitButton}"  Classes="Success" />
-                <SplitButton Theme="{DynamicResource BorderlessSplitButton}" Content="Borderless" Classes="Success" />
+                <SplitButton Content="Outline" Theme="{DynamicResource OutlineSplitButton}" Classes="Success" />
+                <SplitButton Content="Borderless" Theme="{DynamicResource BorderlessSplitButton}" Classes="Success" />
                 <SplitButton Content="Default" Classes="Success" IsEnabled="False" />
-                <SplitButton Theme="{DynamicResource SolidSplitButton}" Content="Solid" Classes="Success" IsEnabled="False" />
+                <SplitButton Content="Solid" Theme="{DynamicResource SolidSplitButton}" Classes="Success" IsEnabled="False" />
-                <SplitButton Theme="{DynamicResource BorderlessSplitButton}" Content="Borderless" Classes="Success" IsEnabled="False" />
+                <SplitButton Content="Outline" Theme="{DynamicResource OutlineSplitButton}" Classes="Success" IsEnabled="False" />
+                <SplitButton Content="Borderless" Theme="{DynamicResource BorderlessSplitButton}" Classes="Success" IsEnabled="False" />
             </StackPanel>
             <StackPanel Orientation="Horizontal" Spacing="8">
                 <SplitButton Classes="Small" Content="Small" />
@@ -141,6 +163,12 @@
                 <ToggleSplitButton Classes="Danger" Content="Danger" />
                 <ToggleSplitButton Classes="Danger" Content="Disabled" IsEnabled="False" />
             </StackPanel>
+            <StackPanel Orientation="Horizontal" Spacing="8">
+                <ToggleSplitButton Content="Default" Classes="Success" />
+                <ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True"  />
+                <ToggleSplitButton Content="Default" Classes="Success" IsEnabled="False" />
+                <ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True" IsEnabled="False" />
+            </StackPanel>
             <StackPanel Orientation="Horizontal" Spacing="8">
                 <ToggleSplitButton Classes="Small" Content="Small" />
                 <ToggleSplitButton Content="Default" />

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

@@ -29,12 +29,6 @@
                     <colorPicker:SemiColorLightPalette />
                 </ColorPicker.Palette>
             </ColorPicker>
-            
-            <ColorPicker ColorSpectrumShape="Box" Theme="{DynamicResource HexColorPicker}">
-                <ColorPicker.Palette>
-                    <colorPicker:SemiColorLightPalette />
-                </ColorPicker.Palette>
-            </ColorPicker>
         </StackPanel>
     </StackPanel>
 </UserControl>

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

@@ -14,7 +14,10 @@
     <TabControl>
         <TabItem Header="DataGrid">
            <Grid RowDefinitions="Auto, *">
-               <ToggleSwitch Grid.Row="0" Content="Disable" Name="DisableToggle"></ToggleSwitch>
+               <StackPanel Grid.Row="0" Orientation="Horizontal">
+                   <ToggleSwitch Content="Disable" Name="DisableToggle" />
+                   <ToggleSwitch Content="ScrollViewerHide" Name="ScrollViewerHide" />
+               </StackPanel>
                <DataGrid Grid.Row="1"
                          Margin="8"
                          CanUserReorderColumns="True"
@@ -22,6 +25,7 @@
                          CanUserSortColumns="True"
                          HeadersVisibility="All"
                          IsReadOnly="True"
+                         ScrollViewer.AllowAutoHide="{Binding #ScrollViewerHide.IsChecked}"
                          IsEnabled="{Binding #DisableToggle.IsChecked}"
                          ItemsSource="{Binding GridData1}">
                    <DataGrid.Columns>

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

@@ -14,16 +14,5 @@
         <DatePicker IsEnabled="False" />
         <DatePicker Classes="Large" />
         <DatePicker Classes="Small" />
-        <StackPanel Orientation="Horizontal">
-            <DatePicker Classes="Large" />
-            <DatePicker />
-            <DatePicker Classes="Small" />
-        </StackPanel>
-        <StackPanel Orientation="Horizontal">
-            <DatePicker IsEnabled="False" />
-            <DatePicker Classes="Bordered" />
-            <DatePicker Classes="Bordered" IsEnabled="False" />
-        </StackPanel>
-
     </StackPanel>
 </UserControl>

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

@@ -10,7 +10,6 @@
     <UserControl.Styles>
         <Style Selector="Button">
             <Setter Property="Margin" Value="8" />
-            <Setter Property="HorizontalAlignment" Value="Stretch" />
         </Style>
     </UserControl.Styles>
     <Grid

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

@@ -1,43 +0,0 @@
-<UserControl
-    d:DesignHeight="450"
-    d:DesignWidth="800"
-    mc:Ignorable="d"
-    x:Class="Semi.Avalonia.Demo.Pages.HyperlinkButtonDemo"
-    xmlns="https://github.com/avaloniaui"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <StackPanel HorizontalAlignment="Left" Spacing="20">
-        <StackPanel Orientation="Horizontal">
-            <HyperlinkButton Height="20" NavigateUri="http://www.irihi.tech/">
-                <TextBlock
-                    HorizontalAlignment="Center"
-                    Text="iRihi Homepage"
-                    TextDecorations="Underline"
-                    VerticalAlignment="Center" />
-            </HyperlinkButton>
-        </StackPanel>
-        <StackPanel Orientation="Horizontal">
-            <HyperlinkButton Height="20" IsEnabled="False">
-                <TextBlock
-                    HorizontalAlignment="Center"
-                    Text="Not Enabled"
-                    TextDecorations="Underline"
-                    VerticalAlignment="Center" />
-            </HyperlinkButton>
-        </StackPanel>
-        <StackPanel Orientation="Horizontal">
-            <HyperlinkButton
-                BorderThickness="1"
-                Classes="WithIcon"
-                Height="20"
-                NavigateUri="http://www.irihi.tech/">
-                <TextBlock
-                    HorizontalAlignment="Center"
-                    Text="Link with Icon"
-                    TextDecorations="Underline"
-                    VerticalAlignment="Center" />
-            </HyperlinkButton>
-        </StackPanel>
-    </StackPanel>
-</UserControl>

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

@@ -1,14 +0,0 @@
-using System;
-using Avalonia;
-using Avalonia.Controls;
-using Avalonia.Markup.Xaml;
-
-namespace Semi.Avalonia.Demo.Pages;
-
-public partial class HyperlinkButtonDemo : UserControl
-{
-    public HyperlinkButtonDemo()
-    {
-        InitializeComponent();
-    }
-}

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

@@ -78,8 +78,8 @@
                     <StackPanel Orientation="Horizontal">
                         <Border HorizontalAlignment="Left" Theme="{StaticResource RadioButtonGroupBorder}">
                             <ListBox Theme="{DynamicResource ButtonRadioGroupListBox}">
-                                <ListBoxItem Classes="Large" IsSelected="True">Small 1</ListBoxItem>
+                                <ListBoxItem Classes="Large" IsSelected="True">Large 1</ListBoxItem>
-                                <ListBoxItem Classes="Large">Small 2</ListBoxItem>
+                                <ListBoxItem Classes="Large">Large 2</ListBoxItem>
                             </ListBox>
                         </Border>
                         <Border
@@ -87,8 +87,8 @@
                             HorizontalAlignment="Left"
                             Theme="{StaticResource RadioButtonGroupBorder}">
                             <ListBox Theme="{DynamicResource ButtonRadioGroupListBox}" IsEnabled="False">
-                                <ListBoxItem Classes="Large" IsSelected="True">Small 1</ListBoxItem>
+                                <ListBoxItem Classes="Large" IsSelected="True">Large 1</ListBoxItem>
-                                <ListBoxItem Classes="Large">Small 2</ListBoxItem>
+                                <ListBoxItem Classes="Large">Large 2</ListBoxItem>
                             </ListBox>
                         </Border>
                     </StackPanel>

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

@@ -13,8 +13,8 @@
                 <Setter Property="HorizontalAlignment" Value="Stretch" />
             </Style>
         </StackPanel.Styles>
-        <Button Name="openFileDialog">Open File</Button>
+        <Button Name="OpenFileButton" Content="Open File" />
-        <Button Name="selectFolderDialog">Select Folder</Button>
+        <Button Name="SelectFolderButton" Content="Select Folder" />
-        <Button Name="saveFileDialog">Save File</Button>
+        <Button Name="SaveFileButton" Content="Save File" />
     </StackPanel>
 </UserControl>

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

@@ -1,10 +1,6 @@
-using System;
 using System.Collections.Generic;
-using Avalonia;
 using Avalonia.Controls;
-using Avalonia.Dialogs;
 using Avalonia.Interactivity;
-using Avalonia.Markup.Xaml;
 using Avalonia.Platform.Storage;
 
 namespace Semi.Avalonia.Demo.Pages;
@@ -14,14 +10,14 @@ public partial class ManagedFileChooserDemo : UserControl
     public ManagedFileChooserDemo()
     {
         InitializeComponent();
-        openFileDialog.Click += OpenFileDialog;
+        OpenFileButton.Click += OpenFileDialog;
-        selectFolderDialog.Click += SelectFolderDialog;
+        SelectFolderButton.Click += SelectFolderDialog;
-        saveFileDialog.Click += SaveFileDialog;
+        SaveFileButton.Click += SaveFileDialog;
     }
 
-    private async void OpenFileDialog(object sender, RoutedEventArgs args)
+    private async void OpenFileDialog(object? sender, RoutedEventArgs args)
     {
-        IStorageProvider? sp = GetStorageProvider();
+        var sp = GetStorageProvider();
         if (sp is null) return;
         var result = await sp.OpenFilePickerAsync(new FilePickerOpenOptions()
         {
@@ -30,9 +26,10 @@ public partial class ManagedFileChooserDemo : UserControl
             AllowMultiple = true,
         });
     }
-    private async void SelectFolderDialog(object sender, RoutedEventArgs args)
+
+    private async void SelectFolderDialog(object? sender, RoutedEventArgs args)
     {
-        IStorageProvider? sp = GetStorageProvider();
+        var sp = GetStorageProvider();
         if (sp is null) return;
         var result = await sp.OpenFolderPickerAsync(new FolderPickerOpenOptions()
         {
@@ -40,13 +37,14 @@ public partial class ManagedFileChooserDemo : UserControl
             AllowMultiple = true,
         });
     }
-    private async void SaveFileDialog(object sender, RoutedEventArgs args)
+
+    private async void SaveFileDialog(object? sender, RoutedEventArgs args)
     {
-        IStorageProvider? sp = GetStorageProvider();
+        var sp = GetStorageProvider();
         if (sp is null) return;
         var result = await sp.SaveFilePickerAsync(new FilePickerSaveOptions()
         {
-            Title = "Open File",
+            Title = "Save File",
         });
     }
 
@@ -58,10 +56,10 @@ public partial class ManagedFileChooserDemo : UserControl
 
     List<FilePickerFileType>? GetFileTypes()
     {
-        return new List<FilePickerFileType>
+        return
-        {
+        [
             FilePickerFileTypes.All,
             FilePickerFileTypes.TextPlain
-        };
+        ];
     }
 }

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

@@ -25,30 +25,14 @@
                         <MenuItem Header="Submenu Level 2" />
                     </MenuItem>
                 </MenuItem>
-                <MenuItem Header="Menu Item with _Icon">
+                <MenuItem Header="Menu Item with _Checkbox">
                     <MenuItem.Icon>
                         <TextBlock>😊</TextBlock>
                     </MenuItem.Icon>
                 </MenuItem>
-                <MenuItem Header="Menu Item with _Checkbox" ToggleType="CheckBox" />
             </MenuItem>
             <MenuItem Header="_Second">
                 <MenuItem Header="Second _Menu Item" />
-                <MenuItem IsChecked="True" Header="Second Menu toggle item" ToggleType="CheckBox" />
-                <Separator />
-                <MenuItem GroupName="A" Header="Radio 1 - group" ToggleType="Radio" />
-                <MenuItem IsChecked="True" GroupName="A" Header="Radio 2 - group" ToggleType="Radio" />
-                <MenuItem GroupName="A" Header="Radio 3 - group" ToggleType="Radio">
-                    <MenuItem Header="Radio 4 - group" ToggleType="Radio" GroupName="A" />
-                    <MenuItem Header="Radio 5 - group" ToggleType="Radio" GroupName="A" />
-                </MenuItem>
-                <Separator />
-                <MenuItem Header="Radio 1" ToggleType="Radio" />
-                <MenuItem IsChecked="True" Header="Radio 2" ToggleType="Radio" />
-                <MenuItem Header="Radio 3" ToggleType="Radio">
-                    <MenuItem Header="Radio 4" ToggleType="Radio" />
-                    <MenuItem Header="Radio 5" ToggleType="Radio" />
-                </MenuItem>
             </MenuItem>
             <MenuItem Header="Parent">
                 <MenuItem Header="Child 1" />
@@ -102,7 +86,7 @@
                         <MenuItem Header="Submenu _1" />
                         <MenuItem Header="Submenu _2" />
                     </MenuItem>
-                    <MenuItem Header="Menu Item with _Icon">
+                    <MenuItem Header="Menu Item with _Checkbox">
                         <MenuItem.Icon>
                             <CheckBox
                                 Padding="0"
@@ -111,7 +95,6 @@
                                 IsHitTestVisible="False" />
                         </MenuItem.Icon>
                     </MenuItem>
-                    <MenuItem Header="Menu Item with _Checkbox" ToggleType="CheckBox" />
                     <MenuItem Header="Menu Item that won't close on click" StaysOpenOnClick="True" />
                 </ContextMenu>
             </Border.ContextMenu>
@@ -130,7 +113,7 @@
                         <MenuItem Header="Submenu _1" />
                         <MenuItem Header="Submenu _2" />
                     </MenuItem>
-                    <MenuItem Header="Menu Item with _Icon">
+                    <MenuItem Header="Menu Item with _Checkbox">
                         <MenuItem.Icon>
                             <CheckBox
                                 Padding="0"
@@ -139,7 +122,6 @@
                                 IsHitTestVisible="False" />
                         </MenuItem.Icon>
                     </MenuItem>
-                    <MenuItem Header="Menu Item with _Checkbox" ToggleType="CheckBox" />
                 </MenuFlyout>
             </Border.ContextFlyout>
             <TextBlock Text="Right Click to show Context Flyout" />

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

@@ -7,18 +7,23 @@
     d:DesignHeight="450"
     d:DesignWidth="800"
     mc:Ignorable="d">
-    <StackPanel HorizontalAlignment="Left" Spacing="20">
+    <StackPanel Spacing="20">
-        <StackPanel.Styles>
+        <UniformGrid Rows="2" Columns="2" Width="500" HorizontalAlignment="Left">
-            <Style Selector="Button">
+            <UniformGrid.Styles>
-                <Setter Property="Theme" Value="{DynamicResource SolidButton}" />
+                <Style Selector="RadioButton">
-                <Setter Property="HorizontalAlignment" Value="Stretch" />
+                    <Setter Property="Theme" Value="{DynamicResource PureCardRadioButton}" />
-            </Style>
+                </Style>
-        </StackPanel.Styles>
+            </UniformGrid.Styles>
-
+            <RadioButton Click="PositionButton_OnClick" Content="TopLeft" />
-        <Button Click="InfoButton_OnClick" Content="Default" />
+            <RadioButton Click="PositionButton_OnClick" Content="TopRight" IsChecked="True" />
-        <Button Click="InfoButton_OnClick" Content="Information" />
+            <RadioButton Click="PositionButton_OnClick" Content="BottomLeft" />
-        <Button Click="InfoButton_OnClick" Content="Success" Classes="Success" />
+            <RadioButton Click="PositionButton_OnClick" Content="BottomRight" />
-        <Button Click="InfoButton_OnClick" Content="Warning" Classes="Warning" />
+        </UniformGrid>
-        <Button Click="InfoButton_OnClick" Content="Error" Classes="Danger" />
+        <StackPanel Orientation="Horizontal" Spacing="20">
+            <Button Click="NormalButton_OnClick" Content="Information" />
+            <Button Click="NormalButton_OnClick" Content="Success" Classes="Success" />
+            <Button Click="NormalButton_OnClick" Content="Warning" Classes="Warning" />
+            <Button Click="NormalButton_OnClick" Content="Error" Classes="Danger" />
+        </StackPanel>
     </StackPanel>
 </UserControl>

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

@@ -22,13 +22,22 @@ public partial class NotificationDemo : UserControl
         _manager = new WindowNotificationManager(topLevel) { MaxItems = 3 };
     }
 
-    private void InfoButton_OnClick(object? sender, RoutedEventArgs e)
+    private void NormalButton_OnClick(object? sender, RoutedEventArgs e)
     {
         if (sender is Button b && b.Content is string s)
         {
-            _manager?.Show(Enum.TryParse<NotificationType>(s, out NotificationType t)
+            _manager?.Show(Enum.TryParse<NotificationType>(s, out var t)
                 ? new Notification(t.ToString(), "This is message", t)
                 : new Notification(s, "This is message"));
         }
     }
+
+    private void PositionButton_OnClick(object? sender, RoutedEventArgs e)
+    {
+        if (sender is RadioButton b && b.Content is string s)
+        {
+            Enum.TryParse<NotificationPosition>(s, out var t);
+            _manager.Position = t;
+        }
+    }
 }

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

@@ -4,53 +4,38 @@
     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="800"
+    d:DesignHeight="450"
     d:DesignWidth="800"
     mc:Ignorable="d">
     <StackPanel HorizontalAlignment="Left" Spacing="20">
-        <StackPanel.Styles>
+        <NumericUpDown
-            <Style Selector="NumericUpDown">
+            Width="200"
-                <Setter Property="Width" Value="300" />
+            Maximum="100"
-                <Setter Property="Maximum" Value="100" />
+            Minimum="0" />
-                <Setter Property="Minimum" Value="0" />
+        <NumericUpDown
-            </Style>
+            Width="200"
-        </StackPanel.Styles>
+            Increment="10"
-
+            Maximum="100"
-        <NumericUpDown />
+            Minimum="0" />
-        <NumericUpDown Increment="10" />
+        <NumericUpDown
-        <NumericUpDown ButtonSpinnerLocation="Left" />
+            Width="200"
-        <NumericUpDown ShowButtonSpinner="False" />
+            ButtonSpinnerLocation="Left"
-        <NumericUpDown Classes="Large" />
+            Maximum="100"
-        <NumericUpDown Classes="Small" />
+            Minimum="0" />
-        <NumericUpDown InnerLeftContent="Price" InnerRightContent="$" />
+        <NumericUpDown
-
+            Width="200"
-        <StackPanel Orientation="Horizontal">
+            Maximum="100"
-            <NumericUpDown
+            Minimum="0"
-                Width="100"
+            ShowButtonSpinner="False" />
-                Classes="Large"
+        <NumericUpDown
-                Watermark="Large"
+            Width="200"
-                ButtonSpinnerLocation="Left" />
+            Classes="Large"
-            <NumericUpDown
+            Maximum="100"
-                Width="100"
+            Minimum="0" />
-                Watermark="Default"
+        <NumericUpDown
-                ShowButtonSpinner="False" />
+            Width="200"
-            <NumericUpDown
+            Classes="Small"
-                Width="100"
+            Maximum="100"
-                Watermark="Small"
+            Minimum="0" />
-                Classes="Small" />
-        </StackPanel>
-
-        <StackPanel Orientation="Horizontal">
-            <NumericUpDown Width="100" ButtonSpinnerLocation="Left" />
-            <NumericUpDown Width="100" ShowButtonSpinner="False" />
-            <NumericUpDown Width="100" />
-        </StackPanel>
-
-        <StackPanel Orientation="Horizontal">
-            <NumericUpDown Width="100" ShowButtonSpinner="False" />
-            <NumericUpDown Width="100" IsEnabled="False" />
-            <NumericUpDown Width="100" ButtonSpinnerLocation="Left" />
-        </StackPanel>
-
     </StackPanel>
 </UserControl>

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

@@ -87,37 +87,31 @@
                                 Margin="0,8"
                                 Classes="Primary"
                                 Content="Primary"
-                                HorizontalAlignment="Stretch"
                                 Theme="{DynamicResource SolidButton}" />
                             <Button
                                 Margin="0,8"
                                 Classes="Secondary"
                                 Content="Secondary"
-                                HorizontalAlignment="Stretch"
                                 Theme="{DynamicResource SolidButton}" />
                             <Button
                                 Margin="0,8"
                                 Classes="Tertiary"
                                 Content="Tertiary"
-                                HorizontalAlignment="Stretch"
                                 Theme="{DynamicResource SolidButton}" />
                             <Button
                                 Margin="0,8"
                                 Classes="Success"
                                 Content="Success"
-                                HorizontalAlignment="Stretch"
                                 Theme="{DynamicResource SolidButton}" />
                             <Button
                                 Margin="0,8"
                                 Classes="Warning"
                                 Content="Warning"
-                                HorizontalAlignment="Stretch"
                                 Theme="{DynamicResource SolidButton}" />
                             <Button
                                 Margin="0,8"
                                 Classes="Danger"
                                 Content="Danger"
-                                HorizontalAlignment="Stretch"
                                 Theme="{DynamicResource SolidButton}" />
                         </StackPanel>
                         <Calendar Margin="16,0" />
@@ -200,32 +194,26 @@
                         <StackPanel Margin="16,0">
                             <Button
                                 Margin="0,8"
-                                HorizontalAlignment="Stretch"
                                 Classes="Primary"
                                 Content="Primary" />
                             <Button
                                 Margin="0,8"
-                                HorizontalAlignment="Stretch"
                                 Classes="Secondary"
                                 Content="Secondary" />
                             <Button
                                 Margin="0,8"
-                                HorizontalAlignment="Stretch"
                                 Classes="Tertiary"
                                 Content="Tertiary" />
                             <Button
                                 Margin="0,8"
-                                HorizontalAlignment="Stretch"
                                 Classes="Success"
                                 Content="Success" />
                             <Button
                                 Margin="0,8"
-                                HorizontalAlignment="Stretch"
                                 Classes="Warning"
                                 Content="Warning" />
                             <Button
                                 Margin="0,8"
-                                HorizontalAlignment="Stretch"
                                 Classes="Danger"
                                 Content="Danger" />
                         </StackPanel>

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

@@ -155,7 +155,7 @@
                 Value="60" />
             <ProgressBar
                 Width="200"
-                Classes="Error"
+                Classes="Danger"
                 Maximum="100"
                 Minimum="0"
                 ShowProgressText="True"

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

@@ -4,24 +4,12 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    xmlns:pages="clr-namespace:Semi.Avalonia.Demo.Pages"
     d:DesignHeight="450"
     d:DesignWidth="800"
-    x:DataType="pages:RefreshContainerDemoViewModel"
-    x:CompileBindings="True"
     mc:Ignorable="d">
-    <DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Top">
+    <StackPanel HorizontalAlignment="Left" Spacing="20">
-        <Label DockPanel.Dock="Top">A control that supports pull to refresh</Label>
+        <RefreshContainer Name="container">
-        <RefreshContainer Name="Refresh"
+            <TextBlock Text="Content" />
-                          DockPanel.Dock="Bottom"
-                          HorizontalAlignment="Stretch"
-                          VerticalAlignment="Stretch"
-                          PullDirection="TopToBottom"
-                          RefreshRequested="RefreshContainerPage_RefreshRequested"
-                          Margin="5">
-            <ListBox HorizontalAlignment="Stretch"
-                     VerticalAlignment="Top"
-                     ItemsSource="{Binding Items}" />
         </RefreshContainer>
-    </DockPanel>
+    </StackPanel>
 </UserControl>

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

@@ -1,46 +1,14 @@
-using System.Collections.ObjectModel;
+using Avalonia;
-using System.Linq;
-using System.Threading.Tasks;
 using Avalonia.Controls;
-using CommunityToolkit.Mvvm.ComponentModel;
+using Avalonia.Interactivity;
+using Avalonia.Markup.Xaml;
 
 namespace Semi.Avalonia.Demo.Pages;
 
 public partial class RefreshContainerDemo : UserControl
 {
-    private RefreshContainerDemoViewModel _viewModel;
-
     public RefreshContainerDemo()
     {
         InitializeComponent();
-
-        _viewModel = new RefreshContainerDemoViewModel();
-
-        DataContext = _viewModel;
-    }
-
-    private async void RefreshContainerPage_RefreshRequested(object? sender, RefreshRequestedEventArgs e)
-    {
-        var deferral = e.GetDeferral();
-
-        await _viewModel.AddToTop();
-
-        deferral.Complete();
-    }
-}
-
-public class RefreshContainerDemoViewModel : ObservableObject
-{
-    public ObservableCollection<string> Items { get; }
-
-    public RefreshContainerDemoViewModel()
-    {
-        Items = new ObservableCollection<string>(Enumerable.Range(1, 200).Select(i => $"Item {i}"));
-    }
-
-    public async Task AddToTop()
-    {
-        await Task.Delay(1000);
-        Items.Insert(0, $"Item {200 - Items.Count}");
     }
 }

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

@@ -33,6 +33,21 @@
                 Disabled
             </RepeatButton>
         </StackPanel>
+        <TextBlock>Outline</TextBlock>
+        <StackPanel Orientation="Horizontal" Spacing="20">
+            <RepeatButton Classes="Primary" Theme="{DynamicResource OutlineRepeatButton}">Primary</RepeatButton>
+            <RepeatButton Classes="Secondary" Theme="{DynamicResource OutlineRepeatButton}">Secondary</RepeatButton>
+            <RepeatButton Classes="Tertiary" Theme="{DynamicResource OutlineRepeatButton}">Tertiary</RepeatButton>
+            <RepeatButton Classes="Success" Theme="{DynamicResource OutlineRepeatButton}">Success</RepeatButton>
+            <RepeatButton Classes="Warning" Theme="{DynamicResource OutlineRepeatButton}">Warning</RepeatButton>
+            <RepeatButton Classes="Danger" Theme="{DynamicResource OutlineRepeatButton}">Danger</RepeatButton>
+            <RepeatButton
+                Classes="Danger"
+                IsEnabled="False"
+                Theme="{DynamicResource OutlineRepeatButton}">
+                Disabled
+            </RepeatButton>
+        </StackPanel>
         <TextBlock>Borderless</TextBlock>
         <StackPanel Orientation="Horizontal" Spacing="20">
             <RepeatButton Classes="Primary" Theme="{DynamicResource BorderlessRepeatButton}">Primary</RepeatButton>
@@ -48,7 +63,15 @@
                 Disabled
             </RepeatButton>
         </StackPanel>
-        <StackPanel Orientation="Horizontal" Spacing="8">
+        <TextBlock>Disabled</TextBlock>
+        <StackPanel Background="{DynamicResource SemiColorBackground1}" Orientation="Horizontal" Spacing="20">
+            <Button IsEnabled="False">Light</Button>
+            <Button IsEnabled="False" Theme="{DynamicResource SolidButton}">Solid</Button>
+            <Button IsEnabled="False" Theme="{DynamicResource OutlineButton}">Outline</Button>
+            <Button IsEnabled="False" Theme="{DynamicResource BorderlessButton}">Borderless</Button>
+        </StackPanel>
+        <TextBlock>Size Classes</TextBlock>
+        <StackPanel Orientation="Horizontal" Spacing="20">
             <RepeatButton Classes="Small">Small</RepeatButton>
             <RepeatButton>Default</RepeatButton>
             <RepeatButton Classes="Large">Large</RepeatButton>

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

@@ -46,7 +46,7 @@
                         Grid.Row="2" Grid.Column="1"
                         OffContent="Left"
                         OnContent="Right"
-                        IsChecked="{Binding #SplitView.PanePlacement}" />
+                        IsChecked="{Binding #SplitView.PanePlacement, Mode=OneWayToSource}" />
 
                     <Label
                         Grid.Row="3" Grid.Column="0"

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

@@ -5,7 +5,7 @@
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:system="clr-namespace:System;assembly=netstandard"
-    d:DesignHeight="800"
+    d:DesignHeight="450"
     d:DesignWidth="800"
     mc:Ignorable="d">
     <ScrollViewer>
@@ -24,8 +24,9 @@
             <TextBox Width="300" PasswordChar="*" />
             <TextBox
                 Width="300"
-                Classes="revealPasswordButton"
+                Classes="ClearButton RevealPasswordButton"
-                PasswordChar="*" />
+                PasswordChar="*"
+                Text="123456" />
             <TextBox
                 Width="500"
                 InnerLeftContent="http://"
@@ -42,41 +43,7 @@
                 InnerLeftContent="http://"
                 InnerRightContent=".com"
                 IsEnabled="False" />
-            <StackPanel Orientation="Horizontal">
-                <TextBox
-                    Width="150"
-                    Classes="Large"
-                    Watermark="Large" />
-                <TextBox
-                    Width="150"
-                    Watermark="Default" />
-                <TextBox
-                    Width="150"
-                    Classes="Small"
-                    Watermark="Small" />
-            </StackPanel>
-
-            <StackPanel Orientation="Horizontal">
-                <TextBox
-                    Width="150"
-                    IsEnabled="False"
-                    Watermark="Disabled" />
-                <TextBox
-                    Width="150"
-                    Classes="Bordered"
-                    Watermark="Bordered" />
-                <TextBox
-                    Width="150"
-                    Classes="Bordered"
-                    IsEnabled="False" />
-            </StackPanel>
             <TextBox Width="300" Classes="TextArea" />
-            <TextBox
-                Width="300"
-                Theme="{StaticResource LooklessTextBox}"
-                Watermark="Lookless TextBox"
-                InnerLeftContent="http://"
-                InnerRightContent=".com" />
         </StackPanel>
     </ScrollViewer>
 </UserControl>

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

@@ -15,16 +15,5 @@
         <TimePicker ClockIdentifier="12HourClock" IsEnabled="False" />
         <TimePicker Classes="Large" />
         <TimePicker Classes="Small" />
-        <StackPanel Orientation="Horizontal">
-            <TimePicker Classes="Large" ClockIdentifier="12HourClock"/>
-            <TimePicker ClockIdentifier="12HourClock"/>
-            <TimePicker Classes="Small" ClockIdentifier="12HourClock"/>
-        </StackPanel>
-        <StackPanel Orientation="Horizontal">
-            <TimePicker IsEnabled="False" />
-            <TimePicker Classes="Bordered" />
-            <TimePicker Classes="Bordered" IsEnabled="False" />
-        </StackPanel>
-
     </StackPanel>
 </UserControl>

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

@@ -82,7 +82,14 @@
                 Disabled
             </ToggleButton>
         </StackPanel>
-        <StackPanel Orientation="Horizontal">
+        <TextBlock Text="Toggle Button Disabled State" />
+        <StackPanel Background="{DynamicResource SemiColorBackground1}" Orientation="Horizontal" Spacing="20">
+            <ToggleButton IsThreeState="True" IsEnabled="False">Default</ToggleButton>
+            <ToggleButton IsThreeState="True" IsEnabled="False" IsChecked="True">Checked</ToggleButton>
+            <ToggleButton IsThreeState="True" IsEnabled="False" IsChecked="{x:Null}">Indeterminate</ToggleButton>
+        </StackPanel>
+        <TextBlock Text="Toggle Button Size" />
+        <StackPanel Orientation="Horizontal" Spacing="20">
             <ToggleButton Classes="Small" IsThreeState="True">Small</ToggleButton>
             <ToggleButton IsThreeState="True">Default</ToggleButton>
             <ToggleButton Classes="Large" IsThreeState="True">Large</ToggleButton>

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

@@ -7,7 +7,7 @@
     d:DesignHeight="450"
     d:DesignWidth="800"
     mc:Ignorable="d">
-    <StackPanel Spacing="20">
+    <StackPanel Spacing="8" Margin="20">
         <ToggleSwitch
             Content="Content"
             OffContent="OffContent"
@@ -24,11 +24,42 @@
             IsEnabled="False"
             OffContent="OffContent"
             OnContent="OnContent" />
-        <ToggleSwitch
+        <StackPanel Orientation="Horizontal">
-            Theme="{DynamicResource SimpleToggleSwitch}"
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small" />
-            Content="Content"
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small" IsChecked="True" />
-            OffContent="OffContent"
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small Loading" />
-            OnContent="OnContent" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Small Loading" IsChecked="True" />
+        </StackPanel>
+        <StackPanel Orientation="Horizontal">
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" IsChecked="True" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Loading" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Loading" IsChecked="True" />
+        </StackPanel>
+        <StackPanel Orientation="Horizontal">
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Large" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Large" IsChecked="True" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Large Loading" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" Classes="Large Loading" IsChecked="True" />
+        </StackPanel>
+
+        <StackPanel Orientation="Horizontal">
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开"/>
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜"/>
+        </StackPanel>
+        <StackPanel Orientation="Horizontal">
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开" IsChecked="True" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜" IsChecked="True" />
+        </StackPanel>
+        <StackPanel Orientation="Horizontal">
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开" Classes="Large" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜" Classes="Large" />
+        </StackPanel>
+        <StackPanel Orientation="Horizontal">
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="关" OnContent="开" Classes="Large" IsChecked="True" />
+            <ToggleSwitch Theme="{StaticResource SimpleToggleSwitch}" OffContent="〇" OnContent="｜" Classes="Large" IsChecked="True" />
+        </StackPanel>
+
         <ToggleSwitch Theme="{DynamicResource ButtonToggleSwitch}">
             <ToggleSwitch.OnContent>
                 <PathIcon

demo/Semi.Avalonia.Demo/Roots.xml

@@ -1,5 +0,0 @@
-<linker>
-  <!-- Can be removed if CompiledBinding and no reflection are used -->
-  <assembly fullname="Semi.Avalonia.Demo" preserve="All" />
-  <assembly fullname="Avalonia.Themes.Fluent" preserve="All" />
-</linker>

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

@@ -7,7 +7,6 @@
 
     <ItemGroup>
         <AvaloniaResource Include="Assets\**" />
-        <TrimmerRootDescriptor Include="Roots.xml" />
     </ItemGroup>
 
     <ItemGroup>
@@ -19,8 +18,8 @@
     </ItemGroup>
 
     <ItemGroup>
-      <ProjectReference Include="..\..\src\Semi.Avalonia.ColorPicker\Semi.Avalonia.ColorPicker.csproj" />
+        <ProjectReference Include="..\..\src\Semi.Avalonia.ColorPicker\Semi.Avalonia.ColorPicker.csproj" />
-      <ProjectReference Include="..\..\src\Semi.Avalonia.DataGrid\Semi.Avalonia.DataGrid.csproj" />
+        <ProjectReference Include="..\..\src\Semi.Avalonia.DataGrid\Semi.Avalonia.DataGrid.csproj" />
-      <ProjectReference Include="..\..\src\Semi.Avalonia\Semi.Avalonia.csproj" />
+        <ProjectReference Include="..\..\src\Semi.Avalonia\Semi.Avalonia.csproj" />
     </ItemGroup>
 </Project>

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

@@ -47,8 +47,8 @@ public class PaletteDemoViewModel: ObservableObject
 
     public PaletteDemoViewModel()
     {
-        _lightResourceDictionary = AvaloniaXamlLoader.Load(new Uri("avares://Semi.Avalonia/Themes/Light/Palette.axaml")) as ResourceDictionary;
+        _lightResourceDictionary  = new Light.Palette();
-        _darkResourceDictionary = AvaloniaXamlLoader.Load(new Uri("avares://Semi.Avalonia/Themes/Dark/Palette.axaml")) as ResourceDictionary;
+        _darkResourceDictionary = new Dark.Palette();
         WeakReferenceMessenger.Default.Register<PaletteDemoViewModel, ColorItemViewModel>(this, OnClickColorItem);
     }
 
@@ -251,7 +251,7 @@ public static class ColorTokens
     {
         new ("SemiColorPrimary", "Primary"),
         new ("SemiColorPrimaryPointerover", "Primary Pointerover"),
-        new ("SemiColorPrimaryPressed", "Primary Pressed"),
+        new ("SemiColorPrimaryActive", "Primary Active"),
         new ("SemiColorPrimaryDisabled", "Primary Disabled"),
         new ("SemiColorPrimaryLight", "Primary Light"),
         new ("SemiColorPrimaryLightPointerover", "Primary Light Pointerover"),
@@ -262,7 +262,7 @@ public static class ColorTokens
     {
         new ("SemiColorSecondary", "Secondary"),
         new ("SemiColorSecondaryPointerover", "Secondary Pointerover"),
-        new ("SemiColorSecondaryPressed", "Secondary Pressed"),
+        new ("SemiColorSecondaryActive", "Secondary Active"),
         new ("SemiColorSecondaryDisabled", "Secondary Disabled"),
         new ("SemiColorSecondaryLight", "Secondary Light"),
         new ("SemiColorSecondaryLightPointerover", "Secondary Light Pointerover"),
@@ -273,7 +273,7 @@ public static class ColorTokens
     {
         new ("SemiColorTertiary", "Tertiary"),
         new ("SemiColorTertiaryPointerover", "Tertiary Pointerover"),
-        new ("SemiColorTertiaryPressed", "Tertiary Pressed"),
+        new ("SemiColorTertiaryActive", "Tertiary Active"),
         new ("SemiColorTertiaryLight", "Tertiary Light"),
         new ("SemiColorTertiaryLightPointerover", "Tertiary Light Pointerover"),
         new ("SemiColorTertiaryLightActive", "Tertiary Light Active"),
@@ -283,7 +283,7 @@ public static class ColorTokens
     {
         new ("SemiColorInformation", "Information"),
         new ("SemiColorInformationPointerover", "Information Pointerover"),
-        new ("SemiColorInformationPressed", "Information Pressed"),
+        new ("SemiColorInformationActive", "Information Active"),
         new ("SemiColorInformationDisabled", "Information Disabled"),
         new ("SemiColorInformationLight", "Information Light"),
         new ("SemiColorInformationLightPointerover", "Information Light Pointerover"),
@@ -294,7 +294,7 @@ public static class ColorTokens
     {
         new ("SemiColorSuccess", "Success"),
         new ("SemiColorSuccessPointerover", "Success Pointerover"),
-        new ("SemiColorSuccessPressed", "Success Pressed"),
+        new ("SemiColorSuccessActive", "Success Active"),
         new ("SemiColorSuccessDisabled", "Success Disabled"),
         new ("SemiColorSuccessLight", "Success Light"),
         new ("SemiColorSuccessLightPointerover", "Success Light Pointerover"),
@@ -305,7 +305,7 @@ public static class ColorTokens
     {
         new ("SemiColorWarning", "Warning"),
         new ("SemiColorWarningPointerover", "Warning Pointerover"),
-        new ("SemiColorWarningPressed", "Warning Pressed"),
+        new ("SemiColorWarningActive", "Warning Active"),
         new ("SemiColorWarningLight", "Warning Light"),
         new ("SemiColorWarningLightPointerover", "Warning Light Pointerover"),
         new ("SemiColorWarningLightActive", "Warning Light Active"),
@@ -315,7 +315,7 @@ public static class ColorTokens
     {
         new ("SemiColorDanger", "Danger"),
         new ("SemiColorDangerPointerover", "Danger Pointerover"),
-        new ("SemiColorDangerPressed", "Danger Pressed"),
+        new ("SemiColorDangerActive", "Danger Active"),
         new ("SemiColorDangerLight", "Danger Light"),
         new ("SemiColorDangerLightPointerover", "Danger Light Pointerover"),
         new ("SemiColorDangerLightActive", "Danger Light Active"),

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

@@ -1,13 +1,13 @@
 <UserControl
-    d:DesignHeight="450"
-    d:DesignWidth="800"
-    mc:Ignorable="d"
     x:Class="Semi.Avalonia.Demo.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"
     xmlns:pages="using:Semi.Avalonia.Demo.Pages"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    d:DesignHeight="450"
+    d:DesignWidth="800"
+    mc:Ignorable="d">
     <UserControl.Resources>
         <ResourceDictionary>
             <ResourceDictionary.MergedDictionaries>
@@ -21,52 +21,52 @@
             Margin="8"
             Padding="12,4"
             Theme="{DynamicResource CardBorder}">
-            <Grid ColumnDefinitions="*, Auto" VerticalAlignment="Center">
+            <Grid VerticalAlignment="Center" ColumnDefinitions="*, Auto">
                 <StackPanel Grid.Column="0" Orientation="Horizontal">
                     <TextBlock
+                        VerticalAlignment="Center"
                         Classes="H6"
                         Text="Semi Avalonia"
-                        Theme="{DynamicResource TitleTextBlock}"
+                        Theme="{DynamicResource TitleTextBlock}" />
-                        VerticalAlignment="Center" />
                     <TextBlock
                         Margin="8,0"
-                        Text="/"
+                        VerticalAlignment="Center"
-                        VerticalAlignment="Center" />
+                        Text="/" />
                     <TextBlock
+                        Margin="8,0"
+                        VerticalAlignment="Center"
                         Classes="Secondary"
-                        Margin="8,0"
+                        Text="{Binding #tab.SelectedItem.Header}" />
-                        Text="{Binding #tab.SelectedItem.Header}"
-                        VerticalAlignment="Center" />
                 </StackPanel>
                 <ToggleSwitch
                     Grid.Column="1"
-                    IsCheckedChanged="ToggleButton_OnIsCheckedChanged"
                     Padding="4"
+                    IsCheckedChanged="ToggleButton_OnIsCheckedChanged"
                     Theme="{DynamicResource ButtonToggleSwitch}">
                     <ToggleSwitch.OnContent>
                         <PathIcon
-                            Data="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z"
+                            Width="16"
-                            Foreground="{DynamicResource ButtonDefaultTertiaryForeground}"
                             Height="16"
-                            Width="16" />
+                            Data="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z"
+                            Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
                     </ToggleSwitch.OnContent>
                     <ToggleSwitch.OffContent>
                         <PathIcon
-                            Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13"
+                            Width="16"
-                            Foreground="{DynamicResource ButtonDefaultTertiaryForeground}"
                             Height="16"
-                            Width="16" />
+                            Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13"
+                            Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
                     </ToggleSwitch.OffContent>
                 </ToggleSwitch>
             </Grid>
 
         </Border>
         <TabControl
-            Grid.Row="1"
-            HorizontalAlignment="Stretch"
-            Margin="8"
             Name="tab"
+            Grid.Row="1"
+            Margin="8"
             Padding="20,0,0,0"
+            HorizontalAlignment="Stretch"
             TabStripPlacement="Left"
             Theme="{DynamicResource NavigationTab}">
             <TabItem Header="Overview">
@@ -126,9 +126,6 @@
             <TabItem Header="HeaderedContentControl">
                 <pages:HeaderedContentControlDemo />
             </TabItem>
-            <TabItem Header="HyperlinkButton">
-                <pages:HyperlinkButtonDemo />
-            </TabItem>
             <TabItem Header="Label">
                 <pages:LabelDemo />
             </TabItem>
@@ -148,7 +145,7 @@
                 <pages:NumericUpDownDemo />
             </TabItem>
             <TabItem Header="PathIcon">
-                <pages:PathIconDemo />
+                <pages:PathIconDemo/>
             </TabItem>
             <TabItem Header="ProgressBar">
                 <pages:ProgressBarDemo />

demo/global.json

@@ -1,5 +1,5 @@
 {
     "sdk": {
-        "version": "7.0"
+        "version": "8.0"
     }
 }

global.json

@@ -1,6 +1,6 @@
 {
   "sdk": {
-    "version": "7.0.0",
+    "version": "8.0.0",
     "rollForward": "latestMajor",
     "allowPrerelease": true
   }

src/Package.props

@@ -1,16 +1,16 @@
 <Project>
     <PropertyGroup>
-        <TargetFrameworks>net6.0;netstandard2.0</TargetFrameworks>
+        <TargetFrameworks>net6.0;net8.0;netstandard2.0</TargetFrameworks>
         <Nullable>enable</Nullable>
         <LangVersion>latest</LangVersion>
-        <Version>11.1.0-beta2</Version>
+        <Version>11.0.7.7</Version>
         <Authors>IRIHI Technology Co., Ltd.</Authors>
         <Description>Avalonia Theme inspired by Semi Design.</Description>
         <RepositoryUrl>https://github.com/irihitech/Semi.Avalonia</RepositoryUrl>
         <PackageLicenseExpression>MIT</PackageLicenseExpression>
         <PackageIcon>irihi.png</PackageIcon>
         <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
-        <AvaloniaVersion>11.1.0-beta2</AvaloniaVersion>
+        <AvaloniaVersion>11.0.7</AvaloniaVersion>
     </PropertyGroup>
 
     <ItemGroup>

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

@@ -17,33 +17,10 @@
     <converters:ToBrushConverter x:Key="ToBrushConverter" />
 
     <ControlTheme x:Key="{x:Type ColorPicker}" TargetType="ColorPicker">
-        <Setter Property="CornerRadius" Value="3" />
+        <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
         <Setter Property="Height" Value="32" />
         <Setter Property="Width" Value="64" />
         <Setter Property="MinWidth" Value="64" />
-        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
-        <Setter Property="VerticalContentAlignment" Value="Stretch" />
-        <Setter Property="Content">
-            <Template>
-                <Panel>
-                    <Border
-                        Margin="1,1,0,1"
-                        HorizontalAlignment="Stretch"
-                        VerticalAlignment="Stretch"
-                        Background="{DynamicResource ColorControlCheckeredBackgroundBrush}"
-                        CornerRadius="{TemplateBinding CornerRadius,
-                                                       Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
-                    <Border
-                        Margin="1,1,0,1"
-                        HorizontalAlignment="Stretch"
-                        VerticalAlignment="Stretch"
-                        Background="{TemplateBinding HsvColor,
-                                                     Converter={StaticResource ToBrushConverter}}"
-                        CornerRadius="{TemplateBinding CornerRadius,
-                                                       Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
-                </Panel>
-            </Template>
-        </Setter>
         <Setter Property="Palette">
             <controls:FluentColorPalette />
         </Setter>
@@ -56,8 +33,6 @@
                     HorizontalContentAlignment="Stretch"
                     VerticalContentAlignment="Stretch"
                     ClipToBounds="True"
-                    Content="{TemplateBinding Content}"
-                    ContentTemplate="{TemplateBinding ContentTemplate}"
                     CornerRadius="{TemplateBinding CornerRadius}"
                     UseLayoutRounding="False">
                     <DropDownButton.Styles>
@@ -65,6 +40,26 @@
                             <Setter Property="Padding" Value="0" />
                         </Style>
                     </DropDownButton.Styles>
+                    <DropDownButton.Content>
+                        <!--  Preview color  -->
+                        <Panel>
+                            <Border
+                                Margin="1,1,0,1"
+                                HorizontalAlignment="Stretch"
+                                VerticalAlignment="Stretch"
+                                Background="{DynamicResource ColorControlCheckeredBackgroundBrush}"
+                                CornerRadius="{TemplateBinding CornerRadius,
+                                                               Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+                            <Border
+                                Margin="1,1,0,1"
+                                HorizontalAlignment="Stretch"
+                                VerticalAlignment="Stretch"
+                                Background="{TemplateBinding HsvColor,
+                                                             Converter={StaticResource ToBrushConverter}}"
+                                CornerRadius="{TemplateBinding CornerRadius,
+                                                               Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+                        </Panel>
+                    </DropDownButton.Content>
                     <DropDownButton.Flyout>
                         <Flyout FlyoutPresenterClasses="nopadding" Placement="{DynamicResource ColorPickerFlyoutPlacement}">
 
@@ -172,7 +167,7 @@
                                                 Orientation="Vertical">
                                                 <primitives:ColorSlider.IsVisible>
                                                     <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                                        <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                                        <ReflectionBinding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                                     </MultiBinding>
                                                 </primitives:ColorSlider.IsVisible>
                                             </primitives:ColorSlider>
@@ -430,8 +425,8 @@
                                                 Value="{Binding Value, ElementName=AlphaComponentSlider}">
                                                 <NumericUpDown.IsVisible>
                                                     <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                                        <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                                        <ReflectionBinding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
-                                                        <Binding Path="IsComponentTextInputVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                                        <ReflectionBinding Path="IsComponentTextInputVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                                     </MultiBinding>
                                                 </NumericUpDown.IsVisible>
                                             </NumericUpDown>
@@ -452,8 +447,8 @@
                                                 TickFrequency="1">
                                                 <primitives:ColorSlider.IsVisible>
                                                     <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                                        <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                                        <ReflectionBinding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
-                                                        <Binding Path="IsComponentSliderVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                                        <ReflectionBinding Path="IsComponentSliderVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                                     </MultiBinding>
                                                 </primitives:ColorSlider.IsVisible>
                                             </primitives:ColorSlider>
@@ -476,42 +471,4 @@
         </Setter>
     </ControlTheme>
 
-    <ControlTheme
-        x:Key="HexColorPicker"
-        BasedOn="{StaticResource {x:Type ColorPicker}}"
-        TargetType="ColorPicker">
-        <Setter Property="Width" Value="200" />
-        <Setter Property="Content">
-            <Template>
-                <Grid ColumnDefinitions="Auto, *">
-                    <Border
-                        Grid.Column="0"
-                        Width="{Binding $self.Bounds.Height}"
-                        Margin="1,1,0,1"
-                        HorizontalAlignment="Stretch"
-                        VerticalAlignment="Stretch"
-                        Background="{DynamicResource ColorControlCheckeredBackgroundBrush}"
-                        CornerRadius="{TemplateBinding CornerRadius}" />
-                    <Border
-                        Grid.Column="0"
-                        Width="{Binding $self.Bounds.Height}"
-                        Margin="1,1,0,1"
-                        HorizontalAlignment="Stretch"
-                        VerticalAlignment="Stretch"
-                        Background="{TemplateBinding HsvColor,
-                                                     Converter={StaticResource ToBrushConverter}}"
-                        CornerRadius="{TemplateBinding CornerRadius}" />
-                    <TextBlock
-                        Grid.Column="1"
-                        Margin="8,0,0,0"
-                        HorizontalAlignment="Left"
-                        VerticalAlignment="Center"
-                        FontWeight="Regular"
-                        Foreground="{DynamicResource TextBlockDefaultForeground}"
-                        Text="{Binding $parent[ColorPicker].Color}" />
-                </Grid>
-            </Template>
-        </Setter>
-    </ControlTheme>
-
 </ResourceDictionary>

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

@@ -260,7 +260,7 @@
                                     Orientation="Vertical">
                                     <primitives:ColorSlider.IsVisible>
                                         <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                            <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                            <ReflectionBinding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                         </MultiBinding>
                                     </primitives:ColorSlider.IsVisible>
                                 </primitives:ColorSlider>
@@ -490,8 +490,8 @@
                                     Value="{Binding Value, ElementName=AlphaComponentSlider}">
                                     <NumericUpDown.IsVisible>
                                         <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                            <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                            <ReflectionBinding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
-                                            <Binding Path="IsComponentTextInputVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                            <ReflectionBinding Path="IsComponentTextInputVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                         </MultiBinding>
                                     </NumericUpDown.IsVisible>
                                 </NumericUpDown>
@@ -512,8 +512,8 @@
                                     TickFrequency="1">
                                     <primitives:ColorSlider.IsVisible>
                                         <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                            <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                            <ReflectionBinding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
-                                            <Binding Path="IsComponentSliderVisible" RelativeSource="{RelativeSource TemplatedParent}" />
+                                            <ReflectionBinding Path="IsComponentSliderVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                         </MultiBinding>
                                     </primitives:ColorSlider.IsVisible>
                                 </primitives:ColorSlider>

src/Semi.Avalonia.ColorPicker/Index.axaml

@@ -2,8 +2,8 @@
     <Styles.Resources>
         <ResourceDictionary>
             <ResourceDictionary.ThemeDictionaries>
-                <MergeResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.ColorPicker/Light.axaml" />
+                <ResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.ColorPicker/Light.axaml" />
-                <MergeResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia.ColorPicker/Dark.axaml" />
+                <ResourceInclude 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/Semi.Avalonia.ColorPicker.csproj

@@ -4,7 +4,11 @@
 
     <PropertyGroup>
         <Title>Semi.Avalonia.ColorPicker</Title>
-        <PackageReleaseNotes>Update to 11.0.7</PackageReleaseNotes>
+        <PackageReleaseNotes>Update to 11.0.7.7</PackageReleaseNotes>
+    </PropertyGroup>
+
+    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
+        <IsAotCompatible>true</IsAotCompatible>
     </PropertyGroup>
 
     <ItemGroup>

src/Semi.Avalonia.DataGrid/Dark.axaml

@@ -9,6 +9,7 @@
 
     <SolidColorBrush x:Key="DataGridColumnHeaderForeground" Opacity="0.6" Color="#F9F9F9" />
     <SolidColorBrush x:Key="DataGridColumnHeaderBackground" Color="Transparent" />
+
     <SolidColorBrush x:Key="DataGridColumnHeaderPointeroverBackground" Opacity="0.16" Color="White" />
     <SolidColorBrush x:Key="DataGridColumnHeaderPressedBackground" Opacity="0.20" Color="White" />
 

src/Semi.Avalonia.DataGrid/DataGrid.axaml

@@ -292,7 +292,7 @@
                             Name="BackgroundBorder"
                             Grid.RowSpan="2"
                             Grid.ColumnSpan="2"
-                            Margin="2"
+                            Margin="{DynamicResource DataGridRowMargin}"
                             Background="{DynamicResource DataGridRowBackground}"
                             CornerRadius="3" />
                         <Rectangle
@@ -471,6 +471,7 @@
         <Setter Property="VerticalScrollBarVisibility" Value="Auto" />
         <Setter Property="SelectionMode" Value="Extended" />
         <Setter Property="GridLinesVisibility" Value="None" />
+        <Setter Property="ScrollViewer.AllowAutoHide" Value="True" />
         <Setter Property="HorizontalGridLinesBrush" Value="{DynamicResource DataGridLineBrush}" />
         <Setter Property="VerticalGridLinesBrush" Value="{DynamicResource DataGridLineBrush}" />
         <Setter Property="DropLocationIndicatorTemplate">
@@ -570,5 +571,15 @@
                 <Setter Property="IsVisible" Value="False" />
             </Style>
         </Style>
+
+        <Style Selector="^[(ScrollViewer.AllowAutoHide)=False]">
+            <Style Selector="^ /template/ DataGridRowsPresenter#PART_RowsPresenter">
+                <Setter Property="Grid.RowSpan" Value="1" />
+                <Setter Property="Grid.ColumnSpan" Value="2" />
+            </Style>
+            <Style Selector="^ /template/ DataGridColumnHeadersPresenter#PART_ColumnHeadersPresenter">
+                <Setter Property="Grid.ColumnSpan" Value="1" />
+            </Style>
+        </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia.DataGrid/Index.axaml

@@ -2,8 +2,8 @@
     <Styles.Resources>
         <ResourceDictionary>
             <ResourceDictionary.ThemeDictionaries>
-                <MergeResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.DataGrid/Light.axaml" />
+                <ResourceInclude x:Key="Default" Source="avares://Semi.Avalonia.DataGrid/Light.axaml" />
-                <MergeResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia.DataGrid/Dark.axaml" />
+                <ResourceInclude 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/Light.axaml

@@ -18,8 +18,8 @@
     <SolidColorBrush x:Key="DataGridDetailsPresenterBackground" Color="Transparent" />
 
     <SolidColorBrush x:Key="DataGridRowPointeroverBackground" Opacity="0.09" Color="#2E3238" />
-    <SolidColorBrush x:Key="DataGridRowSelectedBackground" Opacity="0.2" Color="#EAF5FF" />
+    <SolidColorBrush x:Key="DataGridRowSelectedBackground" Color="#EAF5FF" />
-    <SolidColorBrush x:Key="DataGridRowSelectedPointeroverBackground" Opacity="0.3" Color="#CBE7FE" />
+    <SolidColorBrush x:Key="DataGridRowSelectedPointeroverBackground" Color="#CBE7FE" />
     <SolidColorBrush x:Key="DataGridRowGroupHeaderExpandIconForeground" Opacity="0.62" Color="#1C1F23" />
     <SolidColorBrush x:Key="DataGridRowGroupHeaderBackground" Opacity="0.05" Color="#2E3238" />
 

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

@@ -4,7 +4,11 @@
 
     <PropertyGroup>
         <Title>Semi.Avalonia.DataGrid</Title>
-        <PackageReleaseNotes>Update to 11.0.7</PackageReleaseNotes>
+        <PackageReleaseNotes>Update to 11.0.7.7</PackageReleaseNotes>
+    </PropertyGroup>
+
+    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
+        <IsAotCompatible>true</IsAotCompatible>
     </PropertyGroup>
 
     <ItemGroup>

src/Semi.Avalonia.DataGrid/Shared.axaml

@@ -12,6 +12,7 @@
     <StreamGeometry x:Key="DataGridColumnHeaderDescendingGlyph">M17.549 15.659L12.753 21.139C12.6591 21.2464 12.5434 21.3325 12.4135 21.3915C12.2836 21.4505 12.1427 21.481 12 21.481C11.8574 21.481 11.7164 21.4505 11.5865 21.3915C11.4566 21.3325 11.3409 21.2464 11.247 21.139L6.45101 15.659C5.88501 15.011 6.34501 14 7.20401 14H16.796C17.656 14 18.115 15.012 17.549 15.659Z</StreamGeometry>
 
     <Thickness x:Key="DataGridRowHeaderMargin">8 0</Thickness>
+    <Thickness x:Key="DataGridRowMargin">2</Thickness>
 
     <StreamGeometry x:Key="DataGridRowGroupHeaderExpandIconGlyph">M7.43934 19.7957C6.85355 19.2099 6.85355 18.2601 7.43934 17.6744L13.0962 12.0175L7.43934 6.36065C6.85355 5.77486 6.85355 4.82511 7.43934 4.23933C8.02513 3.65354 8.97487 3.65354 9.56066 4.23933L16.2782 10.9568C16.864 11.5426 16.864 12.4924 16.2782 13.0782L9.56066 19.7957C8.97487 20.3815 8.02513 20.3815 7.43934 19.7957Z</StreamGeometry>
 

src/Semi.Avalonia.TreeDataGrid/Semi.Avalonia.TreeDataGrid.csproj

@@ -4,14 +4,18 @@
         <TargetFramework>net6.0</TargetFramework>
         <Nullable>enable</Nullable>
         <LangVersion>latest</LangVersion>
-        <Version>11.0.1</Version>
+        <Version>11.0.10</Version>
         <Authors>IRIHI Technology Co., Ltd.</Authors>
         <Description>Avalonia Theme inspired by Semi Design.</Description>
         <RepositoryUrl>https://github.com/irihitech/Semi.Avalonia</RepositoryUrl>
         <PackageLicenseExpression>MIT</PackageLicenseExpression>
         <PackageIcon>irihi.png</PackageIcon>
         <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
-        <AvaloniaVersion>11.0.0</AvaloniaVersion>
+        <AvaloniaVersion>11.0.10</AvaloniaVersion>
+    </PropertyGroup>
+
+    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
+        <IsAotCompatible>true</IsAotCompatible>
     </PropertyGroup>
 
     <ItemGroup>

src/Semi.Avalonia.TreeDataGrid/Shared.axaml

@@ -5,4 +5,5 @@
     </StreamGeometry>
     <StreamGeometry x:Key="TreeDataGridSortIconAscendingPath">M6.45096 8.34102L11.247 2.86102C11.3408 2.75361 11.4566 2.66753 11.5865 2.60854C11.7163 2.54956 11.8573 2.51904 12 2.51904C12.1426 2.51904 12.2836 2.54956 12.4135 2.60854C12.5433 2.66753 12.6591 2.75361 12.753 2.86102L17.549 8.34102C18.115 8.98802 17.655 10 16.796 10H7.20396C6.34396 10 5.88496 8.98802 6.45096 8.34102Z</StreamGeometry>
     <StreamGeometry x:Key="TreeDataGridItemCollapsedChevronPathData">M9.65618 3.44015L18.6322 11.2454C19.0906 11.644 19.0906 12.356 18.6322 12.7546L9.65618 20.5598C9.00895 21.1226 8 20.6629 8 19.8052V4.19475C8 3.33705 9.00895 2.87734 9.65618 3.44015Z</StreamGeometry>
+    <Thickness x:Key="TreeDataGridRowMargin">2</Thickness>
 </ResourceDictionary>

src/Semi.Avalonia.TreeDataGrid/TreeDataGrid.axaml

@@ -149,7 +149,7 @@
                 <Panel>
                     <Border
                         Name="RowBorder"
-                        Margin="2"
+                        Margin="{DynamicResource TreeDataGridRowMargin}"
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"
                         Background="{TemplateBinding Background}"
@@ -183,8 +183,7 @@
                     <CheckBox
                         HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
                         VerticalAlignment="Center"
-                        IsChecked="{TemplateBinding Value,
+                        IsChecked="{TemplateBinding Value, Mode=TwoWay}"
-                                                    Mode=TwoWay}"
                         IsEnabled="{Binding !IsReadOnly, RelativeSource={RelativeSource TemplatedParent}}"
                         IsThreeState="{TemplateBinding IsThreeState}"
                         Theme="{DynamicResource SimpleCheckBox}" />
@@ -239,8 +238,7 @@
                             DockPanel.Dock="Left">
                             <ToggleButton
                                 Focusable="False"
-                                IsChecked="{TemplateBinding IsExpanded,
+                                IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}"
-                                                            Mode=TwoWay}"
                                 IsVisible="{TemplateBinding ShowExpander}"
                                 Theme="{StaticResource TreeDataGridExpandCollapseChevron}" />
                         </Border>
@@ -287,8 +285,7 @@
                         <TextBox
                             Name="PART_Edit"
                             Classes="Small"
-                            Text="{TemplateBinding Value,
+                            Text="{TemplateBinding Value, Mode=TwoWay}" />
-                                                   Mode=TwoWay}" />
                     </Border>
                 </ControlTemplate>
             </Setter>

src/Semi.Avalonia/Controls/AdornerLayer.axaml

@@ -5,11 +5,8 @@
     <ControlTheme x:Key="{x:Type AdornerLayer}" TargetType="AdornerLayer">
         <Setter Property="DefaultFocusAdorner">
             <FocusAdornerTemplate>
-                <Rectangle
+                <Border BorderThickness="{DynamicResource AdornerLayerBorderThickness}"
-                    Margin="{DynamicResource AdornerLayerMargin}"
+                        BorderBrush="{DynamicResource AdornerLayerStroke}" />
-                    Stroke="{DynamicResource AdornerLayerBackground}"
-                    StrokeDashArray="1,2"
-                    StrokeThickness="{DynamicResource AdornerLayerThickness}" />
             </FocusAdornerTemplate>
         </Setter>
     </ControlTheme>

src/Semi.Avalonia/Controls/AutoCompleteBox.axaml

@@ -9,8 +9,6 @@
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
-        <Setter Property="AutoCompleteBox.VerticalAlignment" Value="Center" />
-        <Setter Property="AutoCompleteBox.MinHeight" Value="{DynamicResource AutoCompleteBoxDefaultHeight}" />
         <Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="{DynamicResource AutoCompleteMaxDropdownHeight}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="AutoCompleteBox">
@@ -18,12 +16,9 @@
                     <Panel>
                         <TextBox
                             Name="PART_TextBox"
-                            VerticalAlignment="Stretch"
+                            VerticalAlignment="Center"
-                            MinHeight="{TemplateBinding MinHeight}"
                             DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                             Theme="{DynamicResource NonErrorTextBox}"
-                            InnerLeftContent="{TemplateBinding InnerLeftContent}"
-                            InnerRightContent="{TemplateBinding InnerRightContent}"
                             Watermark="{TemplateBinding Watermark}" />
                         <Popup
                             Name="PART_Popup"
@@ -58,8 +53,7 @@
                     <Panel>
                         <TextBox
                             Name="PART_TextBox"
-                            VerticalAlignment="Stretch"
+                            VerticalAlignment="Center"
-                            MinHeight="0"
                             Classes="Bordered"
                             DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                             Watermark="{TemplateBinding Watermark}" />
@@ -89,11 +83,15 @@
                 </ControlTemplate>
             </Setter>
         </Style>
-        <Style Selector="^.Large">
+        <Style Selector="^.Large /template/ TextBox">
             <Setter Property="MinHeight" Value="{DynamicResource AutoCompleteBoxLargeHeight}" />
         </Style>
-        <Style Selector="^.Small">
+        <Style Selector="^.Small /template/ TextBox">
             <Setter Property="MinHeight" Value="{DynamicResource AutoCompleteBoxSmallHeight}" />
         </Style>
     </ControlTheme>
+
+
+
+
 </ResourceDictionary>

src/Semi.Avalonia/Controls/Button.axaml

@@ -2,38 +2,34 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
-    <!--  Button Theme Key: Solid Light Border Borderless; Default is Light  -->
+    <!--  Button Theme Key: Light, Solid, Outline, Borderless; Default is Light  -->
-    <!--  Button Default Classes: Primary Secondary, Tertiary, Warning, Danger; Default is Primary  -->
+    <!--  Button Default Classes: Primary, Secondary, Tertiary, Success, Warning, Danger; Default is Primary  -->
-    <!--  State： default pointerover pressed disabled  -->
+    <!--  State: default, pointerover, pressed, disabled  -->
 
     <!--  Button Light  -->
     <ControlTheme x:Key="{x:Type Button}" TargetType="Button">
-        <Setter Property="Background" Value="{DynamicResource ButtonDefaultBackground}" />
+        <Setter Property="Button.Background" Value="{DynamicResource ButtonDefaultBackground}" />
-        <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
+        <Setter Property="Button.Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
+        <Setter Property="Button.BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
+        <Setter Property="Button.CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
+        <Setter Property="Button.BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
-        <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
+        <Setter Property="Button.Padding" Value="{DynamicResource ButtonDefaultPadding}" />
-        <Setter Property="HorizontalAlignment" Value="Center" />
+        <Setter Property="Button.RenderTransform" Value="none" />
-        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="Button.FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
-        <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="Button.FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
-        <Setter Property="FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
+        <Setter Property="Button.HorizontalContentAlignment" Value="Center" />
-        <Setter Property="FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
+        <Setter Property="Button.VerticalContentAlignment" Value="Center" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
+        <Setter Property="Button.MinHeight" Value="12" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="Button.Cursor" Value="Hand" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="Button.Template">
-        <Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
-        <Setter Property="Cursor" Value="Hand" />
-        <Setter Property="Template">
             <ControlTemplate TargetType="Button">
                 <ContentPresenter
                     x:Name="PART_ContentPresenter"
                     Padding="{TemplateBinding Padding}"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
                     HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                     VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                    BackgroundSizing="{TemplateBinding BackgroundSizing}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     Content="{TemplateBinding Content}"
                     ContentTemplate="{TemplateBinding ContentTemplate}"
@@ -49,11 +45,6 @@
             <Setter Property="RenderTransform" Value="scale(0.98)" />
         </Style>
 
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
-            <Setter Property="Background" Value="{TemplateBinding Background}" />
-        </Style>
-
         <Style Selector="^.Primary">
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
         </Style>
@@ -73,28 +64,25 @@
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDangerForeground}" />
         </Style>
 
-        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pointerover">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
         </Style>
 
-        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pressed">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPressedBorderBrush}" />
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
         </Style>
 
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:disabled">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
 
         <Style Selector="^.Large">
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonLargeHeight}" />
             <Setter Property="Padding" Value="{DynamicResource ButtonLargePadding}" />
         </Style>
         <Style Selector="^.Small">
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonSmallHeight}" />
             <Setter Property="Padding" Value="{DynamicResource ButtonSmallPadding}" />
         </Style>
     </ControlTheme>
@@ -103,115 +91,131 @@
         x:Key="SolidButton"
         BasedOn="{StaticResource {x:Type Button}}"
         TargetType="Button">
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Button.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Setter Property="Button.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+        <Setter Property="Button.Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
-            <Setter Property="Button.Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
+        <Setter Property="Button.BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
-            <Setter Property="Button.BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
-        </Style>
 
-        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pointerover">
             <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPointeroverBorderBrush}" />
         </Style>
-        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pressed">
             <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPressedBorderBrush}" />
         </Style>
 
         <Style Selector="^.Primary">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Secondary">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Tertiary">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Success">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Warning">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Danger">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerPressedBorderBrush}" />
             </Style>
         </Style>
 
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:disabled">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
+            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme
+        x:Key="OutlineButton"
+        BasedOn="{StaticResource {x:Type Button}}"
+        TargetType="Button">
+        <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        <Style Selector="^:pointerover">
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlinePointeroverBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        </Style>
+        <Style Selector="^:pressed">
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlinePressedBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        </Style>
+        <Style Selector="^.Success">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineSuccessBorderBrush}" />
+        </Style>
+        <Style Selector="^.Warning">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineWarningBorderBrush}" />
+        </Style>
+        <Style Selector="^.Danger">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
+        </Style>
+        <Style Selector="^:disabled">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
     </ControlTheme>
@@ -220,11 +224,9 @@
         x:Key="BorderlessButton"
         BasedOn="{StaticResource {x:Type Button}}"
         TargetType="Button">
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="Button.Background" Value="Transparent" />
-            <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Button.BorderBrush" Value="Transparent" />
-            <Setter Property="BorderBrush" Value="Transparent" />
+        <Style Selector="^:disabled">
-        </Style>
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="BorderBrush" Value="Transparent" />
             <Setter Property="Background" Value="Transparent" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />

src/Semi.Avalonia/Controls/ButtonSpinner.axaml

@@ -41,7 +41,6 @@
         <Setter Property="ButtonSpinner.BorderBrush" Value="{DynamicResource ButtonSpinnerRepeatButtonBorderBrush}" />
         <Setter Property="ButtonSpinner.BorderThickness" Value="0" />
         <Setter Property="ButtonSpinner.MinWidth" Value="300" />
-        <!--  Add Resource  -->
         <Setter Property="ButtonSpinner.Template">
             <ControlTemplate TargetType="ButtonSpinner">
                 <Grid ColumnDefinitions="Auto, *, Auto">
@@ -49,8 +48,7 @@
                         Grid.Column="1"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}"
+                        CornerRadius="{TemplateBinding CornerRadius}">
-                        UseLayoutRounding="False">
                         <ContentPresenter
                             Name="PART_ContentPresenter"
                             Padding="{TemplateBinding Padding}"

src/Semi.Avalonia/Controls/Calendar.axaml

@@ -31,6 +31,7 @@
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type CalendarItem}" TargetType="CalendarItem">
+        <Setter Property="CalendarItem.MinWidth" Value="{DynamicResource CalendarMinWidth}" />
         <Setter Property="CalendarItem.MinHeight" Value="{DynamicResource CalendarMinHeight}" />
         <Setter Property="CalendarItem.DayTitleTemplate">
             <Template>
@@ -53,7 +54,7 @@
                     BorderThickness="{TemplateBinding BorderThickness}"
                     CornerRadius="{TemplateBinding CornerRadius}">
                     <Grid
-                        MinWidth="{DynamicResource CalendarMinWidth}"
+                        MinWidth="{TemplateBinding MinWidth}"
                         MinHeight="{TemplateBinding MinHeight}"
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"

src/Semi.Avalonia/Controls/CalendarDatePicker.axaml

@@ -9,14 +9,12 @@
         <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrush}" />
         <Setter Property="BorderThickness" Value="{DynamicResource CalendarDatePickerBorderThickness}" />
         <Setter Property="CornerRadius" Value="{DynamicResource CalendarDatePickerCornerRadius}" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge"/>
         <Setter Property="IsTodayHighlighted" Value="True" />
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="Padding" Value="8 0" />
-        <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerDefaultHeight}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="CalendarDatePicker">
                 <DataValidationErrors>
@@ -26,7 +24,6 @@
                         VerticalAlignment="Stretch">
                         <Border
                             x:Name="Background"
-                            BackgroundSizing="{TemplateBinding BackgroundSizing}"
                             Background="{TemplateBinding Background}"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
@@ -34,14 +31,13 @@
                         <Grid
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"
-                            ColumnDefinitions="*, Auto, Auto">
+                            ColumnDefinitions="*, Auto">
                             <TextBox
                                 Name="PART_TextBox"
                                 Grid.Column="0"
-                                Grid.ColumnSpan="2"
+                                MinHeight="{DynamicResource CalendarDatePickerDefaultHeight}"
-                                MinHeight="{TemplateBinding MinHeight}"
                                 HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
+                                VerticalAlignment="Center"
                                 HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                 VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                 Background="Transparent"
@@ -85,7 +81,7 @@
                                 Theme="{DynamicResource InnerIconButton}" />
                             <Button
                                 Name="PART_Button"
-                                Grid.Column="2"
+                                Grid.Column="1"
                                 Padding="0,0,8,0"
                                 Content="{DynamicResource CalendarDatePickerIconGlyph}"
                                 Focusable="False"
@@ -125,15 +121,18 @@
 
         <Style Selector="^.clearButton, ^.ClearButton">
             <Style Selector="^:pointerover /template/ Button#ClearButton">
-                <Setter Property="IsVisible" Value="{Binding $parent[CalendarDatePicker].SelectedDate, Converter={x:Static ObjectConverters.IsNotNull}}"></Setter>
+                <Setter Property="IsVisible" Value="{Binding $parent[CalendarDatePicker].SelectedDate, Converter={x:Static ObjectConverters.IsNotNull}}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Button#PART_Button">
+                <Setter Property="IsVisible" Value="{Binding $parent[CalendarDatePicker].SelectedDate, Converter={x:Static ObjectConverters.IsNull}}" />
             </Style>
         </Style>
 
-        <Style Selector="^.Large">
+        <Style Selector="^.Large /template/ TextBox#PART_TextBox">
-            <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerLargeHeight}" />
+            <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerInnerLargeHeight}" />
         </Style>
-        <Style Selector="^.Small">
+        <Style Selector="^.Small /template/ TextBox#PART_TextBox">
-            <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerSmallHeight}" />
+            <Setter Property="MinHeight" Value="{DynamicResource CalendarDatePickerInnerSmallHeight}" />
         </Style>
 
         <Style Selector="^:pointerover">

src/Semi.Avalonia/Controls/CheckBox.axaml

@@ -26,6 +26,7 @@
                     <Grid x:Name="RootGrid" ColumnDefinitions="Auto,*">
                         <Grid
                             Grid.Column="0"
+                            TemplatedControl.IsTemplateFocusTarget="True"
                             Margin="0,0,0,0"
                             VerticalAlignment="Center">
                             <Border
@@ -123,8 +124,8 @@
                     <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
-                <Style Selector="^ /template/ Path#CheckGlyph">
+                <Style Selector="^ /template/ PathIcon#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
                 </Style>
             </Style>
         </Style>
@@ -166,8 +167,8 @@
                     <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
-                <Style Selector="^ /template/ Path#CheckGlyph">
+                <Style Selector="^ /template/ PathIcon#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
                 </Style>
             </Style>
         </Style>
@@ -275,8 +276,8 @@
                     <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
-                <Style Selector="^ /template/ Path#CheckGlyph">
+                <Style Selector="^ /template/ PathIcon#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
                 </Style>
             </Style>
         </Style>
@@ -315,8 +316,8 @@
                     <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
-                <Style Selector="^ /template/ Path#CheckGlyph">
+                <Style Selector="^ /template/ PathIcon#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
                 </Style>
             </Style>
         </Style>
@@ -457,8 +458,8 @@
                     <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
-                <Style Selector="^ /template/ Path#CheckGlyph">
+                <Style Selector="^ /template/ PathIcon#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
                 </Style>
             </Style>
         </Style>
@@ -512,8 +513,8 @@
                     <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
-                <Style Selector="^ /template/ Path#CheckGlyph">
+                <Style Selector="^ /template/ PathIcon#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
                 </Style>
             </Style>
         </Style>

src/Semi.Avalonia/Controls/ComboBox.axaml

@@ -32,7 +32,6 @@
         <Setter Property="FocusAdorner" Value="{x:Null}" />
         <Setter Property="MaxDropDownHeight" Value="504" />
         <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBackground}" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
         <Setter Property="BorderThickness" Value="1" />
         <Setter Property="Cursor" Value="Hand" />
         <Setter Property="CornerRadius" Value="{DynamicResource ComboBoxSelectorCornerRadius}" />
@@ -46,13 +45,12 @@
         <Setter Property="Template">
             <ControlTemplate TargetType="ComboBox">
                 <DataValidationErrors>
-                    <Grid ColumnDefinitions="*, Auto, 32">
+                    <Grid ColumnDefinitions="*, Auto">
                         <Border
                             x:Name="Background"
                             Grid.Column="0"
-                            Grid.ColumnSpan="3"
+                            Grid.ColumnSpan="2"
                             Background="{TemplateBinding Background}"
-                            BackgroundSizing="{TemplateBinding BackgroundSizing}"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
                             CornerRadius="{TemplateBinding CornerRadius}"
@@ -80,13 +78,15 @@
                         <Button
                             Name="ClearButton"
                             Grid.Column="1"
+                            Margin="0,0,8,0"
                             Command="{Binding $parent[ComboBox].Clear}"
                             Content="{DynamicResource IconButtonClearData}"
+                            Focusable="False"
                             IsVisible="False"
                             Theme="{DynamicResource InnerIconButton}" />
                         <Border
                             x:Name="DropDownOverlay"
-                            Grid.Column="2"
+                            Grid.Column="1"
                             Width="30"
                             Margin="0,1,1,1"
                             HorizontalAlignment="Right"
@@ -95,12 +95,10 @@
 
                         <PathIcon
                             x:Name="DropDownGlyph"
-                            Grid.Column="2"
+                            Grid.Column="1"
                             Width="12"
                             Height="12"
-                            Margin="0,0,10,0"
+                            Margin="0,0,12,0"
-                            HorizontalAlignment="Right"
-                            VerticalAlignment="Center"
                             Data="{DynamicResource ComboBoxIcon}"
                             Foreground="{DynamicResource ComboBoxIconDefaultForeground}"
                             IsHitTestVisible="False"
@@ -148,6 +146,9 @@
             <Style Selector="^:pointerover /template/ Button#ClearButton">
                 <Setter Property="IsVisible" Value="{Binding $parent[ComboBox].SelectionBoxItem, Converter={x:Static ObjectConverters.IsNotNull}}" />
             </Style>
+            <Style Selector="^:pointerover /template/ PathIcon#DropDownGlyph">
+                <Setter Property="IsVisible" Value="{Binding $parent[ComboBox].SelectionBoxItem, Converter={x:Static ObjectConverters.IsNull}}"/>
+            </Style>
         </Style>
 
         <Style Selector="^.Large">

src/Semi.Avalonia/Controls/ContentControl.axaml

@@ -0,0 +1,22 @@
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
+    <ControlTheme x:Key="{x:Type ContentControl}" TargetType="ContentControl">
+        <Setter Property="Template">
+            <ControlTemplate TargetType="ContentControl">
+                <ContentPresenter
+                    Name="PART_ContentPresenter"
+                    Padding="{TemplateBinding Padding}"
+                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    Content="{TemplateBinding Content}"
+                    ContentTemplate="{TemplateBinding ContentTemplate}"
+                    CornerRadius="{TemplateBinding CornerRadius}" />
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Semi.Avalonia/Controls/ContextMenu.axaml

@@ -26,7 +26,7 @@
                     BorderThickness="{TemplateBinding BorderThickness}"
                     BoxShadow="{DynamicResource MenuFlyoutBorderBoxShadow}"
                     CornerRadius="{TemplateBinding CornerRadius}">
-                    <ScrollViewer Theme="{DynamicResource MenuScrollViewer}">
+                    <ScrollViewer Theme="{DynamicResource MenuScrollViewer}" CornerRadius="{TemplateBinding CornerRadius}">
                         <ItemsPresenter
                             Name="PART_ItemsPresenter"
                             Grid.IsSharedSizeScope="True"

src/Semi.Avalonia/Controls/DatePicker.axaml

@@ -132,7 +132,6 @@
         <Setter Property="CornerRadius" Value="{DynamicResource DateTimePickerButtonCornerRadius}" />
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
-        <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonDefaultHeight}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="DatePicker">
                 <DataValidationErrors>
@@ -146,7 +145,7 @@
                             Grid.ColumnSpan="2"
                             Width="298"
                             MinWidth="298"
-                            MinHeight="{TemplateBinding MinHeight}"
+                            MinHeight="{DynamicResource DateTimePickerButtonDefaultHeight}"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"
                             Background="{TemplateBinding Background}"
@@ -166,45 +165,40 @@
                                     ColumnDefinitions="78*,Auto,132*,Auto,78*">
                                     <TextBlock
                                         Name="PART_DayTextBlock"
-                                        Padding="12,0"
+                                        Padding="12,4"
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
-                                        FontWeight="{TemplateBinding FontWeight}"
+                                        FontWeight="{TemplateBinding FontWeight}" />
-                                        Text="{DynamicResource STRING_DATEPICKER_DAY_TEXT}" />
                                     <TextBlock
                                         Name="PART_MonthTextBlock"
-                                        Padding="12,0"
+                                        Padding="12,4"
                                         VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
                                         FontWeight="{TemplateBinding FontWeight}"
-                                        Text="{DynamicResource STRING_DATEPICKER_MONTH_TEXT}"
                                         TextAlignment="Left" />
                                     <TextBlock
                                         Name="PART_YearTextBlock"
-                                        Padding="12,0"
+                                        Padding="12,4"
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
-                                        FontWeight="{TemplateBinding FontWeight}"
+                                        FontWeight="{TemplateBinding FontWeight}" />
-                                        Text="{DynamicResource STRING_DATEPICKER_YEAR_TEXT}" />
                                     <Rectangle
                                         x:Name="PART_FirstSpacer"
                                         Grid.Column="1"
                                         Width="1"
-                                        Height="{TemplateBinding Height}"
+                                        Margin="0,4"
-                                        MinHeight="{TemplateBinding MinHeight}"
                                         HorizontalAlignment="Center"
                                         Fill="{DynamicResource DateTimePickerSeparatorBackground}" />
                                     <Rectangle
                                         x:Name="PART_SecondSpacer"
                                         Grid.Column="3"
                                         Width="1"
-                                        Height="{TemplateBinding Height}"
+                                        Margin="0,4"
-                                        MinHeight="{TemplateBinding MinHeight}"
                                         HorizontalAlignment="Center"
                                         Fill="{DynamicResource DateTimePickerSeparatorBackground}" />
                                 </Grid>
@@ -258,10 +252,10 @@
         <Style Selector="^:hasnodate /template/ Button#PART_FlyoutButton TextBlock">
             <Setter Property="Foreground" Value="{DynamicResource DateTimePickerEmptyForeground}" />
         </Style>
-        <Style Selector="^.Large">
+        <Style Selector="^.Large /template/ Button#PART_FlyoutButton">
             <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonLargeHeight}" />
         </Style>
-        <Style Selector="^.Small">
+        <Style Selector="^.Small /template/ Button#PART_FlyoutButton">
             <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonSmallHeight}" />
         </Style>
     </ControlTheme>

src/Semi.Avalonia/Controls/DateTimePickerShared.axaml

@@ -6,8 +6,7 @@
 
     <ControlTheme x:Key="DateTimePickerFlyoutButton" TargetType="Button">
         <Setter Property="RenderTransform" Value="none" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
+        <Setter Property="Button.VerticalAlignment" Value="Stretch" />
-        <Setter Property="VerticalAlignment" Value="Stretch" />
         <Setter Property="Template">
             <ControlTemplate>
                 <ContentPresenter
@@ -15,7 +14,6 @@
                     HorizontalContentAlignment="Stretch"
                     VerticalContentAlignment="Stretch"
                     Background="{TemplateBinding Background}"
-                    BackgroundSizing="{TemplateBinding BackgroundSizing}"
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     Content="{TemplateBinding Content}"

src/Semi.Avalonia/Controls/DropDownButton.axaml

@@ -4,29 +4,25 @@
     x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type DropDownButton}" TargetType="DropDownButton">
-        <Setter Property="Background" Value="{DynamicResource ButtonDefaultBackground}" />
+        <Setter Property="DropDownButton.Background" Value="{DynamicResource ButtonDefaultBackground}" />
-        <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
+        <Setter Property="DropDownButton.Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
+        <Setter Property="DropDownButton.BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
+        <Setter Property="DropDownButton.CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
+        <Setter Property="DropDownButton.BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
-        <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
+        <Setter Property="DropDownButton.Padding" Value="{DynamicResource ButtonDefaultPadding}" />
-        <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="DropDownButton.RenderTransform" Value="none" />
-        <Setter Property="HorizontalAlignment" Value="Center" />
+        <Setter Property="DropDownButton.FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
-        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="DropDownButton.FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
-        <Setter Property="FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
+        <Setter Property="DropDownButton.HorizontalContentAlignment" Value="Center" />
-        <Setter Property="FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
+        <Setter Property="DropDownButton.VerticalContentAlignment" Value="Center" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="DropDownButton.MinHeight" Value="12" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="DropDownButton.Cursor" Value="Hand" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
-        <Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
-        <Setter Property="Cursor" Value="Hand" />
         <Setter Property="Template">
             <ControlTemplate TargetType="DropDownButton">
                 <Border
                     x:Name="RootBorder"
-                    HorizontalAlignment="Stretch"
+                    Background="{TemplateBinding Background}"
-                    VerticalAlignment="Stretch"
+                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BackgroundSizing="{TemplateBinding BackgroundSizing}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     ClipToBounds="True"
                     CornerRadius="{TemplateBinding CornerRadius}">
@@ -39,7 +35,6 @@
                             VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                             Content="{TemplateBinding Content}"
                             ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Foreground="{TemplateBinding Foreground}"
                             RecognizesAccessKey="True" />
                         <PathIcon
                             x:Name="DropDownGlyph"
@@ -62,21 +57,6 @@
             <Setter Property="RenderTransform" Value="scale(0.98)" />
         </Style>
 
-        <Style Selector="^ /template/ Border#RootBorder">
-            <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
-            <Setter Property="Background" Value="{TemplateBinding Background}" />
-        </Style>
-
-        <Style Selector="^:pointerover /template/ Border#RootBorder">
-            <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
-        </Style>
-
-        <Style Selector="^:pressed /template/ Border#RootBorder">
-            <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPressedBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
-        </Style>
-
         <Style Selector="^.Primary">
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
         </Style>
@@ -96,145 +76,195 @@
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDangerForeground}" />
         </Style>
 
-        <Style Selector="^:pointerover /template/ Border#RootBorder">
+        <Style Selector="^:pointerover">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
         </Style>
 
-        <Style Selector="^:pressed /template/ Border#RootBorder">
+        <Style Selector="^:pressed">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPressedBorderBrush}" />
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
         </Style>
+
         <Style Selector="^:disabled">
-            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
-        </Style>
-        <Style Selector="^:disabled /template/ Border#RootBorder">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
+            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
 
         <Style Selector="^.Large">
             <Setter Property="Padding" Value="{DynamicResource ButtonLargePadding}" />
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonLargeHeight}" />
         </Style>
         <Style Selector="^.Small">
             <Setter Property="Padding" Value="{DynamicResource ButtonSmallPadding}" />
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonSmallHeight}" />
         </Style>
     </ControlTheme>
 
-    <ControlTheme
+    <ControlTheme x:Key="SolidDropDownButton" TargetType="DropDownButton">
-        x:Key="SolidDropDownButton"
+        <Setter Property="DropDownButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-        BasedOn="{StaticResource {x:Type DropDownButton}}"
+        <Setter Property="DropDownButton.Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
-        TargetType="DropDownButton">
+        <Setter Property="DropDownButton.BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
-        <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+        <Setter Property="DropDownButton.CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
-        <Style Selector="^ /template/ Border#RootBorder">
+        <Setter Property="DropDownButton.BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
+        <Setter Property="DropDownButton.Padding" Value="{DynamicResource ButtonDefaultPadding}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
+        <Setter Property="DropDownButton.RenderTransform" Value="none" />
-        </Style>
+        <Setter Property="DropDownButton.FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
-        <Style Selector="^:pointerover /template/ Border#RootBorder">
+        <Setter Property="DropDownButton.FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
+        <Setter Property="DropDownButton.HorizontalContentAlignment" Value="Center" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPointeroverBorderBrush}" />
+        <Setter Property="DropDownButton.VerticalContentAlignment" Value="Center" />
-        </Style>
+        <Setter Property="DropDownButton.MinHeight" Value="12" />
-        <Style Selector="^:pressed /template/ Border#RootBorder">
+        <Setter Property="DropDownButton.Cursor" Value="Hand" />
-            <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
+        <Setter Property="Template">
-            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPressedBorderBrush}" />
+            <ControlTemplate TargetType="DropDownButton">
+                <Border
+                    x:Name="RootBorder"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    ClipToBounds="True"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <Grid x:Name="InnerGrid" ColumnDefinitions="*,Auto">
+                        <ContentPresenter
+                            x:Name="PART_ContentPresenter"
+                            Grid.Column="0"
+                            Padding="{TemplateBinding Padding}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            RecognizesAccessKey="True" />
+                        <PathIcon
+                            x:Name="DropDownGlyph"
+                            Grid.Column="1"
+                            Width="12"
+                            Height="12"
+                            Margin="0,0,8,0"
+                            HorizontalAlignment="Right"
+                            VerticalAlignment="Center"
+                            Data="{DynamicResource DropDownButtonIconGlyph}"
+                            Foreground="{TemplateBinding Foreground}"
+                            IsHitTestVisible="False"
+                            UseLayoutRounding="False" />
+                    </Grid>
+                </Border>
+            </ControlTemplate>
+        </Setter>
+
+        <Style Selector="^:pressed">
+            <Setter Property="RenderTransform" Value="scale(0.98)" />
         </Style>
+
         <Style Selector="^.Primary">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Secondary">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Tertiary">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Success">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Warning">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Danger">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Style Selector="^ /template/ Border#RootBorder">
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ Border#RootBorder">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ Border#RootBorder">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerPressedBorderBrush}" />
             </Style>
         </Style>
-        <Style Selector="^:disabled /template/ Border#RootBorder">
+
+        <Style Selector="^:disabled">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
+            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme
+        x:Key="OutlineDropDownButton"
+        BasedOn="{StaticResource {x:Type DropDownButton}}"
+        TargetType="DropDownButton">
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        <Style Selector="^:pointerover">
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlinePointeroverBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        </Style>
+        <Style Selector="^:pressed">
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlinePressedBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        </Style>
+        <Style Selector="^.Success">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineSuccessBorderBrush}" />
+        </Style>
+        <Style Selector="^.Warning">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineWarningBorderBrush}" />
+        </Style>
+        <Style Selector="^.Danger">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
         </Style>
         <Style Selector="^:disabled">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
     </ControlTheme>
@@ -243,13 +273,12 @@
         x:Key="BorderlessDropDownButton"
         BasedOn="{StaticResource {x:Type DropDownButton}}"
         TargetType="DropDownButton">
-        <Style Selector="^ /template/ Border#RootBorder">
+        <Setter Property="DropDownButton.Background" Value="Transparent" />
-            <Setter Property="DropDownButton.Background" Value="Transparent" />
+        <Setter Property="DropDownButton.BorderBrush" Value="Transparent" />
-            <Setter Property="DropDownButton.BorderBrush" Value="Transparent" />
+        <Style Selector="^:disabled">
-        </Style>
-        <Style Selector="^:disabled /template/ Border#RootBorder">
             <Setter Property="BorderBrush" Value="Transparent" />
             <Setter Property="Background" Value="Transparent" />
+            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/HyperlinkButton.axaml

@@ -1,118 +0,0 @@
-<ResourceDictionary
-    x:CompileBindings="True"
-    xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme TargetType="HyperlinkButton" x:Key="{x:Type HyperlinkButton}">
-        <Setter Property="Padding" Value="0,0,0,0" />
-        <Setter Property="HorizontalAlignment" Value="Left" />
-        <Setter Property="VerticalAlignment" Value="Top" />
-        <Setter Property="Cursor" Value="Hand" />
-        <Setter Property="HorizontalContentAlignment" Value="Left" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="FontSize" Value="{DynamicResource HyperlinkButtonFontSize}" />
-        <Setter Property="MinHeight" Value="32" />
-        <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonForeground}" />
-        <Setter Property="Background" Value="{DynamicResource HyperlinkButtonDefaultBackground}" />
-        <Setter Property="Template">
-            <ControlTemplate TargetType="HyperlinkButton">
-                <Grid ColumnDefinitions="Auto,*" x:Name="RootGrid">
-                    <Grid
-                        Grid.Column="0"
-                        IsVisible="False"
-                        Margin="0,0,8,0"
-                        VerticalAlignment="Center"
-                        x:Name="IconGrid">
-                        <Border
-                            Background="{DynamicResource HyperlinkButtonDefaultBackground}"
-                            Height="{DynamicResource HyperlinkButtonIconHeight}"
-                            Opacity="0"
-                            UseLayoutRounding="False"
-                            Width="{DynamicResource HyperlinkButtonIconWidth}"
-                            x:Name="BackgroundRectangle" />
-                        <PathIcon
-                            Data="{DynamicResource HyperlinkButtonLinkGlyph}"
-                            Foreground="{DynamicResource HyperlinkButtonForeground}"
-                            Height="{DynamicResource HyperlinkButtonLinkGlyphHeight}"
-                            Name="LinkGlyph"
-                            VerticalAlignment="Center"
-                            Width="{DynamicResource HyperlinkButtonLinkGlyphWidth}" />
-                    </Grid>
-                    <ContentPresenter
-                        Content="{TemplateBinding Content}"
-                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                        Cursor="{TemplateBinding Cursor}"
-                        Grid.Column="1"
-                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                        Padding="0,0,0,0"
-                        RecognizesAccessKey="True"
-                        VerticalAlignment="Center"
-                        x:Name="ContentPresenter" />
-                </Grid>
-            </ControlTemplate>
-        </Setter>
-
-        <Style Selector="^:pointerover">
-            <Style Selector="^ /template/ PathIcon#LinkGlyph">
-                <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonOverForeground}" />
-            </Style>
-            <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonOverForeground}" />
-            </Style>
-        </Style>
-
-        <!--  Unvisited Pressed State  -->
-        <Style Selector="^:pressed">
-            <Setter Property="RenderTransform" Value="scale(0.98)" />
-        </Style>
-
-        <!--  Unvisited Disabled state  -->
-        <Style Selector="^:disabled">
-            <Style Selector="^ /template/ PathIcon#LinkGlyph">
-                <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonDisabledForeground}" />
-            </Style>
-            <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonDisabledForeground}" />
-            </Style>
-        </Style>
-
-        <Style Selector="^:visited">
-            <Style Selector="^ /template/ PathIcon#LinkGlyph">
-                <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonVisitedForeground}" />
-            </Style>
-            <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonVisitedForeground}" />
-            </Style>
-
-            <!--  Visited Pointerover State  -->
-            <Style Selector="^:pointerover">
-                <Style Selector="^ /template/ PathIcon#LinkGlyph">
-                    <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonOverForeground}" />
-                </Style>
-                <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                    <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonOverForeground}" />
-                </Style>
-            </Style>
-
-            <!--  Visited Pressed State  -->
-            <Style Selector="^:pressed">
-                <Setter Property="RenderTransform" Value="scale(0.98)" />
-            </Style>
-
-            <!--  Visited Disabled State  -->
-            <Style Selector="^:disabled">
-                <Style Selector="^ /template/ PathIcon#LinkGlyph">
-                    <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonDisabledForeground}" />
-                </Style>
-                <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                    <Setter Property="Foreground" Value="{DynamicResource HyperlinkButtonDisabledForeground}" />
-                </Style>
-            </Style>
-        </Style>
-
-        <Style Selector="^.WithIcon">
-            <Style Selector="^ /template/ Grid#IconGrid">
-                <Setter Property="IsVisible" Value="True" />
-            </Style>
-        </Style>
-    </ControlTheme>
-</ResourceDictionary>

src/Semi.Avalonia/Controls/Menu.axaml

@@ -10,73 +10,83 @@
         <Setter Property="Background" Value="Transparent" />
         <Setter Property="Template">
             <ControlTemplate TargetType="ScrollViewer">
-                <DockPanel>
+                <Border 
-                    <DockPanel.Styles>
+                    ClipToBounds="True"
-                        <Style Selector="RepeatButton:pressed">
+                    CornerRadius="{TemplateBinding CornerRadius}">
-                            <Setter Property="RenderTransform" Value="{x:Null}" />
+                    <DockPanel>
-                        </Style>
+                        <DockPanel.Styles>
-                    </DockPanel.Styles>
+                            <Style Selector="RepeatButton:pressed">
-                    <RepeatButton
+                                <Setter Property="RenderTransform" Value="{x:Null}" />
-                        HorizontalAlignment="Stretch"
+                            </Style>
-                        HorizontalContentAlignment="Center"
+                        </DockPanel.Styles>
-                        Background="Transparent"
+                        <RepeatButton
-                        BorderThickness="0"
+                            HorizontalAlignment="Stretch"
-                        Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}"
+                            HorizontalContentAlignment="Center"
-                        CornerRadius="0"
+                            Background="Transparent"
-                        DockPanel.Dock="Top"
+                            BorderThickness="0"
-                        RenderTransform="{x:Null}">
+                            Command="{Binding LineUp, RelativeSource={RelativeSource TemplatedParent}}"
-                        <RepeatButton.IsVisible>
+                            CornerRadius="0"
-                            <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="0">
+                            DockPanel.Dock="Top"
-                                <Binding Path="VerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}" />
+                            RenderTransform="{x:Null}">
-                                <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
+                            <RepeatButton.IsVisible>
-                                <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <MultiBinding
-                                <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                                    Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
-                            </MultiBinding>
+                                    ConverterParameter="0">
-                        </RepeatButton.IsVisible>
+                                    <Binding Path="VerticalScrollBarVisibility"
-                        <PathIcon
+                                             RelativeSource="{RelativeSource TemplatedParent}" />
-                            Width="8"
+                                    <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
-                            Height="8"
+                                    <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                            Data="{DynamicResource MenuScrollViewerUpButtonGlyph}"
+                                    <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                            Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
+                                </MultiBinding>
-                    </RepeatButton>
+                            </RepeatButton.IsVisible>
-                    <RepeatButton
+                            <PathIcon
-                        HorizontalAlignment="Stretch"
+                                Width="8"
-                        HorizontalContentAlignment="Center"
+                                Height="8"
-                        Background="Transparent"
+                                Data="{DynamicResource MenuScrollViewerUpButtonGlyph}"
-                        BorderThickness="0"
+                                Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
-                        Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}"
+                        </RepeatButton>
-                        CornerRadius="0"
+                        <RepeatButton
-                        DockPanel.Dock="Bottom"
+                            HorizontalAlignment="Stretch"
-                        RenderTransform="{x:Null}">
+                            HorizontalContentAlignment="Center"
-                        <RepeatButton.IsVisible>
+                            Background="Transparent"
-                            <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="100">
+                            BorderThickness="0"
-                                <Binding Path="VerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}" />
+                            Command="{Binding LineDown, RelativeSource={RelativeSource TemplatedParent}}"
-                                <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
+                            CornerRadius="0"
-                                <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                            DockPanel.Dock="Bottom"
-                                <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                            RenderTransform="{x:Null}">
-                            </MultiBinding>
+                            <RepeatButton.IsVisible>
-                        </RepeatButton.IsVisible>
+                                <MultiBinding
-                        <PathIcon
+                                    Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}"
-                            Width="8"
+                                    ConverterParameter="100">
-                            Height="8"
+                                    <Binding Path="VerticalScrollBarVisibility"
-                            Data="{DynamicResource MenuScrollViewerDownButtonGlyph}"
+                                             RelativeSource="{RelativeSource TemplatedParent}" />
-                            Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
+                                    <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
-                    </RepeatButton>
+                                    <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                    <ScrollContentPresenter
+                                    <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                        Name="PART_ContentPresenter"
+                                </MultiBinding>
-                        Margin="{TemplateBinding Padding}"
+                            </RepeatButton.IsVisible>
-                        HorizontalSnapPointsAlignment="{TemplateBinding HorizontalSnapPointsAlignment}"
+                            <PathIcon
-                        HorizontalSnapPointsType="{TemplateBinding HorizontalSnapPointsType}"
+                                Width="8"
-                        VerticalSnapPointsAlignment="{TemplateBinding VerticalSnapPointsAlignment}"
+                                Height="8"
-                        VerticalSnapPointsType="{TemplateBinding VerticalSnapPointsType}">
+                                Data="{DynamicResource MenuScrollViewerDownButtonGlyph}"
-                        <ScrollContentPresenter.GestureRecognizers>
+                                Foreground="{DynamicResource MenuFlyoutScrollViewerIconForeground}" />
-                            <ScrollGestureRecognizer
+                        </RepeatButton>
-                                CanHorizontallyScroll="{Binding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
+                        <ScrollContentPresenter
-                                CanVerticallyScroll="{Binding CanVerticallyScroll, ElementName=PART_ContentPresenter}"
+                            Name="PART_ContentPresenter"
-                                IsScrollInertiaEnabled="{Binding IsScrollInertiaEnabled, RelativeSource={RelativeSource TemplatedParent}}" />
+                            Margin="{TemplateBinding Padding}"
-                        </ScrollContentPresenter.GestureRecognizers>
+                            HorizontalSnapPointsAlignment="{TemplateBinding HorizontalSnapPointsAlignment}"
-                    </ScrollContentPresenter>
+                            HorizontalSnapPointsType="{TemplateBinding HorizontalSnapPointsType}"
-                </DockPanel>
+                            VerticalSnapPointsAlignment="{TemplateBinding VerticalSnapPointsAlignment}"
+                            VerticalSnapPointsType="{TemplateBinding VerticalSnapPointsType}">
+                            <ScrollContentPresenter.GestureRecognizers>
+                                <ScrollGestureRecognizer
+                                    CanHorizontallyScroll="{Binding CanHorizontallyScroll, ElementName=PART_ContentPresenter}"
+                                    CanVerticallyScroll="{Binding CanVerticallyScroll, ElementName=PART_ContentPresenter}"
+                                    IsScrollInertiaEnabled="{Binding IsScrollInertiaEnabled, RelativeSource={RelativeSource TemplatedParent}}" />
+                            </ScrollContentPresenter.GestureRecognizers>
+                        </ScrollContentPresenter>
+                    </DockPanel>
+                </Border>
             </ControlTemplate>
         </Setter>
     </ControlTheme>
@@ -120,26 +130,14 @@
                         CornerRadius="{TemplateBinding CornerRadius}">
                         <Grid>
                             <Grid.ColumnDefinitions>
-                                <ColumnDefinition Width="Auto" SharedSizeGroup="ToggleIcon" />
                                 <ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIcon" />
                                 <ColumnDefinition Width="*" />
                                 <ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGT" />
                                 <ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemChevron" />
                             </Grid.ColumnDefinitions>
 
-                            <ContentControl
-                                Name="PART_ToggleIconPresenter"
-                                Grid.Column="0"
-                                Width="16"
-                                Height="16"
-                                Margin="{DynamicResource MenuItemIconMargin}"
-                                HorizontalAlignment="Center"
-                                VerticalAlignment="Center"
-                                IsVisible="False" />
-
                             <Viewbox
                                 Name="PART_IconPresenter"
-                                Grid.Column="1"
                                 Width="16"
                                 Height="16"
                                 Margin="{DynamicResource MenuItemIconMargin}"
@@ -155,14 +153,15 @@
 
                             <ContentPresenter
                                 Name="PART_HeaderPresenter"
-                                Grid.Column="2"
+                                Grid.Column="1"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Center"
                                 Content="{TemplateBinding Header}"
+                                ContentTemplate="{TemplateBinding HeaderTemplate}"
                                 RecognizesAccessKey="True" />
                             <TextBlock
                                 x:Name="PART_InputGestureText"
-                                Grid.Column="3"
+                                Grid.Column="2"
                                 Margin="{DynamicResource MenuItemInputGestureTextMargin}"
                                 HorizontalAlignment="Right"
                                 VerticalAlignment="Center"
@@ -171,7 +170,7 @@
                                                        Converter={StaticResource KeyGestureConverter}}" />
                             <PathIcon
                                 Name="PART_ExpandIcon"
-                                Grid.Column="4"
+                                Grid.Column="3"
                                 Width="8"
                                 Height="8"
                                 Margin="{DynamicResource MenuItemExpandIconMargin}"
@@ -202,7 +201,7 @@
                             BorderThickness="{DynamicResource MenuFlyoutBorderThickness}"
                             BoxShadow="{DynamicResource MenuFlyoutBorderBoxShadow}"
                             CornerRadius="{DynamicResource MenuFlyoutCornerRadius}">
-                            <ScrollViewer Theme="{StaticResource MenuScrollViewer}">
+                            <ScrollViewer Theme="{StaticResource MenuScrollViewer}" CornerRadius="{DynamicResource MenuFlyoutCornerRadius}">
                                 <ItemsPresenter
                                     Name="PART_ItemsPresenter"
                                     Grid.IsSharedSizeScope="True"
@@ -256,27 +255,6 @@
                 </ControlTemplate>
             </Setter>
         </Style>
-
-        <Style Selector="^:checked:toggle /template/ ContentControl#PART_ToggleIconPresenter">
-            <Setter Property="IsVisible" Value="True" />
-            <Setter Property="Content">
-                <Template>
-                    <PathIcon
-                        Foreground="{Binding $parent[MenuItem].Foreground}"
-                        Data="{StaticResource MenuCheckGlyph}" />
-                </Template>
-            </Setter>
-        </Style>
-
-        <Style Selector="^:checked:radio /template/ ContentControl#PART_ToggleIconPresenter">
-            <Setter Property="IsVisible" Value="True" />
-            <Setter Property="Content">
-                <Template>
-                    <Ellipse Fill="{Binding $parent[MenuItem].Foreground}"
-                             Margin="4" Width="8" Height="8" />
-                </Template>
-            </Setter>
-        </Style>
     </ControlTheme>
 
     <ControlTheme x:Key="TopLevelMenuItem" TargetType="MenuItem">
@@ -300,6 +278,7 @@
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Center"
                             Content="{TemplateBinding Header}"
+                            ContentTemplate="{TemplateBinding HeaderTemplate}"
                             RecognizesAccessKey="True" />
                         <Popup
                             Name="PART_Popup"
@@ -325,7 +304,7 @@
                                 BorderThickness="{DynamicResource MenuFlyoutBorderThickness}"
                                 BoxShadow="{DynamicResource MenuFlyoutBorderBoxShadow}"
                                 CornerRadius="{DynamicResource MenuFlyoutCornerRadius}">
-                                <ScrollViewer Theme="{StaticResource MenuScrollViewer}">
+                                <ScrollViewer Theme="{StaticResource MenuScrollViewer}" CornerRadius="{DynamicResource MenuFlyoutCornerRadius}">
                                     <ItemsPresenter
                                         Name="PART_ItemsPresenter"
                                         Grid.IsSharedSizeScope="True"

src/Semi.Avalonia/Controls/MenuFlyoutPresenter.axaml

@@ -2,7 +2,21 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
-    <!--  Add Resources Here  -->
+    <Design.PreviewWith>
+        <ThemeVariantScope RequestedThemeVariant="Dark">
+            <MenuFlyoutPresenter>
+                <MenuFlyoutPresenter.Items>
+                    <MenuItem Header="Menu Item 1" />
+                    <MenuItem Header="Menu Item 2" />
+                    <MenuItem Header="Menu Item 3" />
+                    <MenuItem Header="Menu Item 4" />
+                    <MenuItem Header="Menu Item 5" />
+                    <MenuItem Header="Menu Item 6" />
+                </MenuFlyoutPresenter.Items>
+            </MenuFlyoutPresenter>
+        </ThemeVariantScope>
+    </Design.PreviewWith>
+
     <ControlTheme x:Key="{x:Type MenuFlyoutPresenter}" TargetType="MenuFlyoutPresenter">
         <Setter Property="MenuFlyoutPresenter.Background" Value="{DynamicResource MenuFlyoutBackground}" />
         <Setter Property="MenuFlyoutPresenter.BorderBrush" Value="{DynamicResource MenuFlyoutBorderBrush}" />
@@ -23,12 +37,13 @@
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     BoxShadow="{DynamicResource MenuFlyoutBorderBoxShadow}"
-                    ClipToBounds="False"
+                    ClipToBounds="True"
                     CornerRadius="{TemplateBinding CornerRadius}"
                     UseLayoutRounding="False">
                     <ScrollViewer
-                        HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                         Theme="{StaticResource MenuScrollViewer}"
+                        CornerRadius="{TemplateBinding CornerRadius}"
+                        HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                         VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
                         <ItemsPresenter
                             Name="PART_ItemsPresenter"

src/Semi.Avalonia/Controls/NotificationCard.axaml

@@ -3,65 +3,69 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
     <Design.PreviewWith>
-        <NotificationCard>
+        <ThemeVariantScope RequestedThemeVariant="Dark">
-            <TextBlock Text="Hello World" />
+            <StackPanel>
-        </NotificationCard>
+                <NotificationCard />
+                <NotificationCard>
+                    Hello, Semi.Avalonia!
+                </NotificationCard>
+            </StackPanel>
+        </ThemeVariantScope>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type NotificationCard}" TargetType="NotificationCard">
         <Setter Property="UseLayoutRounding" Value="True" />
-        <Setter Property="MinWidth" Value="{DynamicResource NotificationCardWidth}" />
-        <Setter Property="FontSize" Value="14" />
-        <Setter Property="Foreground" Value="{DynamicResource NotificationCardForeground}" />
-        <Setter Property="RenderTransformOrigin" Value="50%,75%" />
         <Setter Property="BorderThickness" Value="{DynamicResource NotificationCardBorderThickness}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardBorderBrush}" />
         <Setter Property="Background" Value="{DynamicResource NotificationCardBackground}" />
         <Setter Property="CornerRadius" Value="{DynamicResource NotificationCardCornerRadius}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="NotificationCard">
                 <LayoutTransformControl Name="PART_LayoutTransformControl" UseRenderTransform="True">
                     <Border
-                        Margin="8"
+                        Margin="{DynamicResource NotificationCardMargin}"
-                        BoxShadow="{DynamicResource NotificationCardBoxShadows}"
+                        Background="{TemplateBinding Background}"
                         CornerRadius="{TemplateBinding CornerRadius}">
                         <Border
-                            Background="{TemplateBinding Background}"
+                            x:Name="PART_RootBorder"
+                            Padding="{DynamicResource NotificationCardPadding}"
+                            BoxShadow="{DynamicResource NotificationCardBoxShadows}"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
-                            ClipToBounds="True"
                             CornerRadius="{TemplateBinding CornerRadius}">
-                            <DockPanel>
+                            <DockPanel MinWidth="{DynamicResource NotificationCardMinWidth}">
                                 <PathIcon
                                     Name="NotificationIcon"
-                                    Width="16"
+                                    Width="{DynamicResource NotificationCardIconWidth}"
-                                    Height="16"
+                                    Height="{DynamicResource NotificationCardIconHeight}"
-                                    Margin="16,16,12,0"
+                                    Margin="{DynamicResource NotificationCardIconMargin}"
                                     VerticalAlignment="Top"
                                     IsVisible="False"
-                                    Data="{DynamicResource NotificationCardInformationIconPathData}"/>
+                                    Data="{DynamicResource NotificationCardInformationIconPathData}" />
                                 <ContentControl
                                     Name="PART_Content"
-                                    MinHeight="64"
                                     Content="{TemplateBinding Content}">
                                     <ContentControl.DataTemplates>
                                         <DataTemplate DataType="INotification">
-                                            <StackPanel Margin="0,8,8,8" Spacing="8">
+                                            <StackPanel Spacing="{DynamicResource NotificationCardTitleSpacing}">
-                                                <TextBlock
+                                                <SelectableTextBlock
-                                                    FontSize="16"
+                                                    Foreground="{DynamicResource NotificationCardTitleForeground}"
-                                                    FontWeight="600"
+                                                    FontSize="{DynamicResource NotificationCardTitleFontSize}"
+                                                    FontWeight="{DynamicResource NotificationCardTitleFontWeight}"
+                                                    IsVisible="{Binding Title, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
                                                     Text="{Binding Title}" />
-                                                <TextBlock
+                                                <SelectableTextBlock
-                                                    MaxHeight="80"
+                                                    Foreground="{DynamicResource NotificationCardMessageForeground}"
-                                                    Margin="0,0,8,0"
+                                                    FontSize="{DynamicResource NotificationCardMessageFontSize}"
-                                                    FontSize="14"
+                                                    FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
-                                                    FontWeight="400"
+                                                    IsVisible="{Binding Message, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
                                                     Text="{Binding Message}"
                                                     TextWrapping="Wrap" />
                                             </StackPanel>
                                         </DataTemplate>
                                         <DataTemplate DataType="x:String">
-                                            <TextBlock
+                                            <SelectableTextBlock
-                                                Margin="12"
+                                                Foreground="{DynamicResource NotificationCardMessageForeground}"
+                                                FontSize="{DynamicResource NotificationCardMessageFontSize}"
+                                                FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
                                                 Text="{Binding}"
                                                 TextWrapping="Wrap" />
                                         </DataTemplate>

src/Semi.Avalonia/Controls/NumericUpDown.axaml

@@ -4,10 +4,8 @@
     x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type NumericUpDown}" TargetType="NumericUpDown">
-        <Setter Property="NumericUpDown.VerticalAlignment" Value="Center" />
         <Setter Property="NumericUpDown.VerticalContentAlignment" Value="Center" />
         <Setter Property="NumericUpDown.CornerRadius" Value="{DynamicResource NumericUpDownCornerRadius}" />
-        <Setter Property="NumericUpDown.MinHeight" Value="{DynamicResource NumericUpDownDefaultHeight}" />
         <Setter Property="NumericUpDown.Template">
             <ControlTemplate TargetType="NumericUpDown">
                 <DataValidationErrors>
@@ -25,32 +23,29 @@
                         <TextBox
                             Name="PART_TextBox"
                             Height="{TemplateBinding Height}"
-                            MinHeight="{TemplateBinding MinHeight}"
+                            MinHeight="{DynamicResource NumericUpDownWrapperDefaultHeight}"
-                            VerticalAlignment="Stretch"
                             HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                             VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                             AcceptsReturn="False"
                             CornerRadius="{TemplateBinding CornerRadius}"
-                            DataValidationErrors.Errors="{Binding $parent[NumericUpDown].(DataValidationErrors.Errors)}"
+                            DataValidationErrors.Errors="{ReflectionBinding $parent[NumericUpDown].(DataValidationErrors.Errors)}"
                             FontSize="{TemplateBinding FontSize}"
                             Foreground="{TemplateBinding Foreground}"
                             IsReadOnly="{TemplateBinding IsReadOnly}"
                             Text="{TemplateBinding Text}"
                             TextWrapping="NoWrap"
                             Theme="{DynamicResource NonErrorTextBox}"
-                            InnerLeftContent="{TemplateBinding InnerLeftContent}"
-                            InnerRightContent="{TemplateBinding InnerRightContent}"
                             Watermark="{TemplateBinding Watermark}" />
                     </ButtonSpinner>
                 </DataValidationErrors>
             </ControlTemplate>
         </Setter>
 
-        <Style Selector="^.Large">
+        <Style Selector="^.Large /template/ TextBox#PART_TextBox">
-            <Setter Property="MinHeight" Value="{DynamicResource NumericUpDownLargeHeight}" />
+            <Setter Property="MinHeight" Value="{DynamicResource NumericUpDownWrapperLargeHeight}" />
         </Style>
-        <Style Selector="^.Small">
+        <Style Selector="^.Small /template/ TextBox#PART_TextBox">
-            <Setter Property="MinHeight" Value="{DynamicResource NumericUpDownSmallHeight}" />
+            <Setter Property="MinHeight" Value="{DynamicResource NumericUpDownWrapperSmallHeight}" />
         </Style>
 
         <Style Selector="^:error">

src/Semi.Avalonia/Controls/ProgressBar.axaml

@@ -159,7 +159,7 @@
                             <TextBlock.Text>
                                 <MultiBinding Converter="{StaticResource StringFormatConverter}">
                                     <TemplateBinding Property="ProgressTextFormat" />
-                                    <Binding Path="Value" RelativeSource="{RelativeSource TemplatedParent}" />
+                                    <ReflectionBinding Path="Value" RelativeSource="{RelativeSource TemplatedParent}" />
                                     <TemplateBinding Property="Percentage" />
                                     <TemplateBinding Property="Minimum" />
                                     <TemplateBinding Property="Maximum" />
@@ -185,6 +185,10 @@
         <Style Selector="^.Warning">
             <Setter Property="Foreground" Value="{DynamicResource ProgressBarWarningForeground}" />
         </Style>
+        <Style Selector="^.Danger">
+            <Setter Property="Foreground" Value="{DynamicResource ProgressBarDangerForeground}" />
+        </Style>
+        <!-- Error style is obsolete, use Danger instead -->
         <Style Selector="^.Error">
             <Setter Property="Foreground" Value="{DynamicResource ProgressBarErrorForeground}" />
         </Style>
@@ -411,6 +415,10 @@
         <Style Selector="^.Warning">
             <Setter Property="Foreground" Value="{DynamicResource ProgressBarWarningForeground}" />
         </Style>
+        <Style Selector="^.Danger">
+            <Setter Property="Foreground" Value="{DynamicResource ProgressBarDangerForeground}" />
+        </Style>
+        <!-- Error style is obsolete, use Danger instead -->
         <Style Selector="^.Error">
             <Setter Property="Foreground" Value="{DynamicResource ProgressBarErrorForeground}" />
         </Style>

src/Semi.Avalonia/Controls/RadioButton.axaml

@@ -39,7 +39,11 @@
                     BorderThickness="{TemplateBinding BorderThickness}"
                     CornerRadius="{TemplateBinding CornerRadius}">
                     <Grid ColumnDefinitions="Auto,*">
-                        <Grid Margin="{DynamicResource RadioButtonIconMargin}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
+                        <Grid
+                            Grid.Column="0"
+                            TemplatedControl.IsTemplateFocusTarget="True"
+                            Margin="{DynamicResource RadioButtonIconMargin}"
+                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                             <Ellipse
                                 Name="OuterEllipse"
                                 Width="{DynamicResource RadioButtonIconRadius}"

src/Semi.Avalonia/Controls/RefreshContainer.axaml

@@ -28,26 +28,20 @@
         <Setter Property="IsTabStop" Value="False" />
         <Setter Property="IsHitTestVisible" Value="False" />
         <Setter Property="Height" Value="100" />
-        <Setter Property="Background" Value="{DynamicResource RefreshVisualizerIconBackground}" />
+        <Setter Property="Background" Value="{DynamicResource RefreshContainerIconBackground}" />
-        <Setter Property="Foreground" Value="{DynamicResource RefreshVisualizerIconForeground}" />
+        <Setter Property="Foreground" Value="{DynamicResource RefreshContainerIconForeground}" />
-        <Setter Property="Content">
-            <Template>
-                <Arc
-                    Name="PART_Icon"
-                    Width="{DynamicResource RefreshVisualizerIconSize}"
-                    Height="{DynamicResource RefreshVisualizerIconSize}"
-                    StartAngle="0"
-                    Stroke="{DynamicResource RefreshVisualizerIconForeground}"
-                    StrokeThickness="3"
-                    StrokeLineCap="Round"
-                    SweepAngle="270" />
-            </Template>
-        </Setter>
         <Setter Property="Template">
             <ControlTemplate>
-                <Grid Name="PART_Root"
+                <Grid
-                      MinHeight="80"
+                    Name="PART_Root"
-                      Background="{TemplateBinding Background}" />
+                    MinHeight="80"
+                    Background="{TemplateBinding Background}">
+                    <Grid.Styles>
+                        <Style Selector="PathIcon#PART_Icon">
+                            <Setter Property="Data" Value="{DynamicResource RefreshContainerIconGlyph}" />
+                        </Style>
+                    </Grid.Styles>
+                </Grid>
             </ControlTemplate>
         </Setter>
     </ControlTheme>

src/Semi.Avalonia/Controls/RepeatButton.axaml

@@ -3,32 +3,28 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type RepeatButton}" TargetType="RepeatButton">
-        <Setter Property="Background" Value="{DynamicResource ButtonDefaultBackground}" />
+        <Setter Property="RepeatButton.Background" Value="{DynamicResource ButtonDefaultBackground}" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
+        <Setter Property="RepeatButton.Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
-        <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
+        <Setter Property="RepeatButton.BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
+        <Setter Property="RepeatButton.CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
+        <Setter Property="RepeatButton.BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
+        <Setter Property="RepeatButton.Padding" Value="{DynamicResource ButtonDefaultPadding}" />
-        <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
+        <Setter Property="RepeatButton.RenderTransform" Value="none" />
-        <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="RepeatButton.FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
-        <Setter Property="HorizontalAlignment" Value="Center" />
+        <Setter Property="RepeatButton.FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
-        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="RepeatButton.HorizontalContentAlignment" Value="Center" />
-        <Setter Property="FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
+        <Setter Property="RepeatButton.VerticalContentAlignment" Value="Center" />
-        <Setter Property="FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
+        <Setter Property="RepeatButton.MinHeight" Value="12" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="RepeatButton.Cursor" Value="Hand" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="RepeatButton.Template">
-        <Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
-        <Setter Property="Cursor" Value="Hand" />
-        <Setter Property="Template">
             <ControlTemplate TargetType="RepeatButton">
                 <ContentPresenter
-                    Name="PART_ContentPresenter"
+                    x:Name="PART_ContentPresenter"
                     Padding="{TemplateBinding Padding}"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
                     HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                     VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                    BackgroundSizing="{TemplateBinding BackgroundSizing}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     Content="{TemplateBinding Content}"
                     ContentTemplate="{TemplateBinding ContentTemplate}"
@@ -44,11 +40,6 @@
             <Setter Property="RenderTransform" Value="scale(0.98)" />
         </Style>
 
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
-            <Setter Property="Background" Value="{TemplateBinding Background}" />
-        </Style>
-
         <Style Selector="^.Primary">
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
         </Style>
@@ -68,29 +59,26 @@
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDangerForeground}" />
         </Style>
 
-        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pointerover">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
         </Style>
 
-        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:pressed">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPressedBorderBrush}" />
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
         </Style>
 
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:disabled">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
 
         <Style Selector="^.Large">
             <Setter Property="Padding" Value="{DynamicResource ButtonLargePadding}" />
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonLargeHeight}" />
         </Style>
         <Style Selector="^.Small">
             <Setter Property="Padding" Value="{DynamicResource ButtonSmallPadding}" />
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonSmallHeight}" />
         </Style>
     </ControlTheme>
 
@@ -98,105 +86,122 @@
         x:Key="SolidRepeatButton"
         BasedOn="{StaticResource {x:Type RepeatButton}}"
         TargetType="RepeatButton">
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="RepeatButton.Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+        <Setter Property="RepeatButton.Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
+        <Setter Property="RepeatButton.BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
+
+        <Style Selector="^.Primary">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
             <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
-        </Style>
+            <Style Selector="^:pointerover">
-        <Style Selector="^.Primary">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryBorderBrush}" />
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidPrimaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Secondary">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSecondaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Tertiary">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidTertiaryPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Success">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidSuccessPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Warning">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidWarningPressedBorderBrush}" />
             </Style>
         </Style>
         <Style Selector="^.Danger">
-            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
-                <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerBorderBrush}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerBorderBrush}" />
+            <Style Selector="^:pointerover">
-            </Style>
-            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerPointeroverBorderBrush}" />
             </Style>
-            <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+            <Style Selector="^:pressed">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPressedBackground}" />
                 <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidDangerPressedBorderBrush}" />
             </Style>
         </Style>
 
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
+        <Style Selector="^:disabled">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultDisabledBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
+            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme
+        x:Key="OutlineRepeatButton"
+        BasedOn="{StaticResource {x:Type RepeatButton}}"
+        TargetType="RepeatButton">
+        <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        <Style Selector="^:pointerover">
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlinePointeroverBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        </Style>
+        <Style Selector="^:pressed">
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlinePressedBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        </Style>
+        <Style Selector="^.Success">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineSuccessBorderBrush}" />
+        </Style>
+        <Style Selector="^.Warning">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineWarningBorderBrush}" />
+        </Style>
+        <Style Selector="^.Danger">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
+        </Style>
+        <Style Selector="^:disabled">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
     </ControlTheme>
@@ -205,11 +210,9 @@
         x:Key="BorderlessRepeatButton"
         BasedOn="{StaticResource {x:Type RepeatButton}}"
         TargetType="RepeatButton">
-        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+        <Setter Property="RepeatButton.Background" Value="Transparent" />
-            <Setter Property="RepeatButton.Background" Value="Transparent" />
+        <Setter Property="RepeatButton.BorderBrush" Value="Transparent" />
-            <Setter Property="RepeatButton.BorderBrush" Value="Transparent" />
+        <Style Selector="^:disabled">
-        </Style>
-        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="BorderBrush" Value="Transparent" />
             <Setter Property="Background" Value="Transparent" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />

src/Semi.Avalonia/Controls/ScrollViewer.axaml

@@ -319,10 +319,10 @@
                         DockPanel.Dock="Top">
                         <RepeatButton.IsVisible>
                             <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="0">
-                                <Binding Path="VerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="VerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}" />
-                                <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
-                                <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                                <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
                             </MultiBinding>
                         </RepeatButton.IsVisible>
                         <Path Data="M 0 4 L 8 4 L 4 0 Z" />
@@ -334,10 +334,10 @@
                         DockPanel.Dock="Bottom">
                         <RepeatButton.IsVisible>
                             <MultiBinding Converter="{x:Static converters:MenuScrollingVisibilityConverter.Instance}" ConverterParameter="100">
-                                <Binding Path="VerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="VerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}" />
-                                <Binding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="Offset.Y" RelativeSource="{RelativeSource TemplatedParent}" />
-                                <Binding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="Extent.Height" RelativeSource="{RelativeSource TemplatedParent}" />
-                                <Binding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
+                                <ReflectionBinding Path="Viewport.Height" RelativeSource="{RelativeSource TemplatedParent}" />
                             </MultiBinding>
                         </RepeatButton.IsVisible>
                         <Path Data="M 0 0 L 4 4 L 8 0 Z" />

src/Semi.Avalonia/Controls/SplitButton.axaml

@@ -2,135 +2,79 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     x:CompileBindings="True">
-    <Design.PreviewWith>
-        <StackPanel Margin="20">
-            <SplitButton>Hello</SplitButton>
-        </StackPanel>
-    </Design.PreviewWith>
-
-    <ControlTheme x:Key="SemiSplitButtonElement" TargetType="Button">
-        <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
-        <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
-        <Setter Property="HorizontalAlignment" Value="Center" />
-        <Setter Property="VerticalAlignment" Value="Center" />
-        <Setter Property="RenderTransform" Value="none" />
-        <Setter Property="FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
-        <Setter Property="FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="Cursor" Value="Hand" />
-        <Setter Property="Template">
-            <ControlTemplate TargetType="Button">
-                <ContentPresenter
-                    x:Name="PART_ContentPresenter"
-                    Padding="{TemplateBinding Padding}"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
-                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                    Background="{TemplateBinding Background}"
-                    BackgroundSizing="{TemplateBinding BackgroundSizing}"
-                    BorderBrush="{TemplateBinding BorderBrush}"
-                    BorderThickness="{TemplateBinding BorderThickness}"
-                    Content="{TemplateBinding Content}"
-                    ContentTemplate="{TemplateBinding ContentTemplate}"
-                    CornerRadius="{TemplateBinding CornerRadius}"
-                    RecognizesAccessKey="True"
-                    TextElement.FontSize="{TemplateBinding FontSize}"
-                    TextElement.FontWeight="{TemplateBinding FontWeight}"
-                    UseLayoutRounding="False" />
-            </ControlTemplate>
-        </Setter>
-    </ControlTheme>
 
     <ControlTheme x:Key="{x:Type SplitButton}" TargetType="SplitButton">
-        <Setter Property="Background" Value="{DynamicResource ButtonDefaultBackground}" />
+        <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonDefaultBackground}" />
-        <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
+        <Setter Property="SplitButton.Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
+        <Setter Property="SplitButton.BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
+        <Setter Property="SplitButton.CornerRadius" Value="{DynamicResource ButtonCornerRadius}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
+        <Setter Property="SplitButton.BorderThickness" Value="{DynamicResource ButtonBorderThickness}" />
-        <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
+        <Setter Property="SplitButton.Padding" Value="{DynamicResource ButtonDefaultPadding}" />
-        <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="SplitButton.RenderTransform" Value="none" />
-        <Setter Property="HorizontalAlignment" Value="Center" />
+        <Setter Property="SplitButton.FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
-        <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="SplitButton.FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
-        <Setter Property="FontSize" Value="{DynamicResource ButtonDefaultFontSize}" />
+        <Setter Property="SplitButton.HorizontalContentAlignment" Value="Center" />
-        <Setter Property="FontWeight" Value="{DynamicResource ButtonDefaultFontWeight}" />
+        <Setter Property="SplitButton.VerticalContentAlignment" Value="Center" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="SplitButton.MinHeight" Value="12" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="SplitButton">
-                <Border
+                <Grid ColumnDefinitions="*,Auto,Auto">
-                    BackgroundSizing="OuterBorderEdge"
+                    <Button
-                    ClipToBounds="True"
+                        x:Name="PART_PrimaryButton"
-                    CornerRadius="{TemplateBinding CornerRadius}">
+                        Grid.Column="0"
-                    <DockPanel>
+                        Padding="{TemplateBinding Padding}"
-                        <Button
+                        HorizontalAlignment="Stretch"
-                            x:Name="PART_SecondaryButton"
+                        VerticalAlignment="Stretch"
-                            Padding="4,0"
+                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                            VerticalAlignment="Stretch"
+                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                            HorizontalContentAlignment="Center"
+                        Background="{TemplateBinding Background}"
-                            VerticalContentAlignment="Center"
+                        BorderBrush="{TemplateBinding BorderBrush}"
-                            BorderThickness="{TemplateBinding BorderThickness}"
+                        BorderThickness="{TemplateBinding BorderThickness}"
-                            CornerRadius="0"
+                        Command="{TemplateBinding Command}"
-                            DockPanel.Dock="Right"
+                        CommandParameter="{TemplateBinding CommandParameter}"
-                            Focusable="False"
+                        Content="{TemplateBinding Content}"
-                            KeyboardNavigation.IsTabStop="False"
+                        ContentTemplate="{TemplateBinding ContentTemplate}"
-                            Theme="{DynamicResource SemiSplitButtonElement}">
+                        CornerRadius="3 0 0 3"
-                            <PathIcon
+                        Focusable="False"
-                                Width="12"
+                        FontFamily="{TemplateBinding FontFamily}"
-                                Height="12"
+                        FontSize="{TemplateBinding FontSize}"
-                                Data="{DynamicResource SplitButtonIconGlyph}"
+                        FontWeight="{TemplateBinding FontWeight}"
-                                Foreground="{Binding $parent[Button].Foreground}" />
+                        Foreground="{TemplateBinding Foreground}"
-                        </Button>
+                        KeyboardNavigation.IsTabStop="False" />
-                        <Rectangle
+
-                            x:Name="SeparatorBorder"
+                    <Border
-                            Width="{DynamicResource SplitButtonSeparatorWidth}"
+                        x:Name="SeparatorBorder"
-                            VerticalAlignment="Stretch"
+                        Grid.Column="1"
-                            DockPanel.Dock="Right"
+                        Width="{DynamicResource SplitButtonSeparatorWidth}"
-                            Fill="{TemplateBinding BorderBrush}"
+                        Background="Transparent"
-                            StrokeThickness="0" />
+                        BorderBrush="{TemplateBinding BorderBrush}"
-                        <Button
+                        BorderThickness="0.5" />
-                            x:Name="PART_PrimaryButton"
+
-                            Padding="{TemplateBinding Padding}"
+                    <Button
-                            HorizontalAlignment="Stretch"
+                        x:Name="PART_SecondaryButton"
-                            VerticalAlignment="Stretch"
+                        Grid.Column="2"
-                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                        Padding="4,0"
-                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                        HorizontalAlignment="Stretch"
-                            BorderThickness="{TemplateBinding BorderThickness}"
+                        VerticalAlignment="Stretch"
-                            Command="{TemplateBinding Command}"
+                        HorizontalContentAlignment="Center"
-                            CommandParameter="{TemplateBinding CommandParameter}"
+                        VerticalContentAlignment="Center"
-                            Content="{TemplateBinding Content}"
+                        Background="{TemplateBinding Background}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                        BorderBrush="{TemplateBinding BorderBrush}"
-                            CornerRadius="0"
+                        BorderThickness="{TemplateBinding BorderThickness}"
-                            Focusable="False"
+                        CornerRadius="0 3 3 0"
-                            FontFamily="{TemplateBinding FontFamily}"
+                        Focusable="False"
-                            FontSize="{TemplateBinding FontSize}"
+                        Foreground="{TemplateBinding Foreground}"
-                            FontWeight="{TemplateBinding FontWeight}"
+                        KeyboardNavigation.IsTabStop="False">
-                            KeyboardNavigation.IsTabStop="False"
+                        <PathIcon
-                            Theme="{DynamicResource SemiSplitButtonElement}" />
+                            Width="12"
-                    </DockPanel>
+                            Height="12"
-                </Border>
+                            Data="{DynamicResource SplitButtonIconGlyph}"
+                            Foreground="{Binding $parent[Button].Foreground}" />
+                    </Button>
+                </Grid>
             </ControlTemplate>
         </Setter>
 
-        <Style Selector="^ /template/ Button">
-            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultBorderBrush}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultBackground}" />
-            <Style Selector="^:pointerover">
-                <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
-            </Style>
-            <Style Selector="^:pressed">
-                <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPressedBorderBrush}" />
-            </Style>
-        </Style>
-        
 
         <Style Selector="^.Secondary /template/ Button">
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultSecondaryForeground}" />
@@ -151,86 +95,50 @@
             <Style Selector="^ /template/ Button">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
                 <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                <Style Selector="^:pointerover">
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
-                </Style>
-                <Style Selector="^:pressed">
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPressedBackground}" />
-                </Style>
             </Style>
-            
             <Style Selector="^.Secondary /template/ Button">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
-                <Style Selector="^:pointerover">
+                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPointeroverBackground}" />
-                </Style>
-                <Style Selector="^:pressed">
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryPressedBackground}" />
-                </Style>
             </Style>
             <Style Selector="^.Tertiary /template/ Button">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
-                <Style Selector="^:pointerover">
+                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPointeroverBackground}" />
-                </Style>
-                <Style Selector="^:pressed">
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryPressedBackground}" />
-                </Style>
             </Style>
             <Style Selector="^.Success /template/ Button">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessBackground}" />
-                <Style Selector="^:pointerover">
+                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPointeroverBackground}" />
-                </Style>
-                <Style Selector="^:pressed">
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidSuccessPressedBackground}" />
-                </Style>
             </Style>
             <Style Selector="^.Warning /template/ Button">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
-                <Style Selector="^:pointerover">
+                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPointeroverBackground}" />
-                </Style>
-                <Style Selector="^:pressed">
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidWarningPressedBackground}" />
-                </Style>
             </Style>
             <Style Selector="^.Danger /template/ Button">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
-                <Style Selector="^:pointerover">
+                <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPointeroverBackground}" />
-                </Style>
-                <Style Selector="^:pressed">
-                    <Setter Property="Background" Value="{DynamicResource ButtonSolidDangerPressedBackground}" />
-                </Style>
             </Style>
         </Style>
-        <Style Selector="^.Large /template/ Button#PART_PrimaryButton">
+        <Style Selector="^.Large /template/ Button">
             <Setter Property="Padding" Value="{DynamicResource ButtonLargePadding}" />
         </Style>
-        <Style Selector="^.Large">
+        <Style Selector="^.Small /template/ Button">
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonLargeHeight}" />
-        </Style>
-        <Style Selector="^.Small /template/ Button#PART_PrimaryButton">
             <Setter Property="Padding" Value="{DynamicResource ButtonSmallPadding}" />
         </Style>
-        <Style Selector="^.Small">
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonSmallHeight}" />
-        </Style>
         <Style Selector="^:disabled /template/ Button">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
+        <!-- only for ToggleSplitButton -->
+        <Style Selector="^:checked:disabled /template/ Button">
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
+        </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">
-            <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
-            <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
-            
             <Style Selector="^:pointerover">
                 <Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryPointeroverBackground}" />
             </Style>
@@ -301,7 +209,37 @@
         </Style>
 
         <Style Selector="^:disabled /template/ Button">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
+            <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme
+        x:Key="OutlineSplitButton"
+        BasedOn="{StaticResource {x:Type SplitButton}}"
+        TargetType="SplitButton">
+        <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+        <Style Selector="^ /template/ Button">
+            <Style Selector="^:pointerover">
+                <Setter Property="Background" Value="{DynamicResource ButtonOutlinePointeroverBackground}" />
+            </Style>
+            <Style Selector="^:pressed">
+                <Setter Property="Background" Value="{DynamicResource ButtonOutlinePressedBackground}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Success /template/ Button">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineSuccessBorderBrush}" />
+        </Style>
+        <Style Selector="^.Warning /template/ Button">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineWarningBorderBrush}" />
+        </Style>
+        <Style Selector="^.Danger /template/ Button">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
+        </Style>
+        <Style Selector="^:disabled /template/ Button">
+            <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
         </Style>
     </ControlTheme>
@@ -310,10 +248,8 @@
         x:Key="BorderlessSplitButton"
         BasedOn="{StaticResource {x:Type SplitButton}}"
         TargetType="SplitButton">
-        <Style Selector="^ /template/ Button">
+        <Setter Property="SplitButton.Background" Value="Transparent" />
-            <Setter Property="Background" Value="Transparent" />
+        <Setter Property="SplitButton.BorderBrush" Value="Transparent" />
-            <Setter Property="BorderBrush" Value="Transparent" />
-        </Style>
         <Style Selector="^:disabled /template/ Button">
             <Setter Property="BorderBrush" Value="Transparent" />
             <Setter Property="Background" Value="Transparent" />

src/Semi.Avalonia/Controls/SplitView.axaml

@@ -129,7 +129,7 @@
                                 x:Name="PART_ContentPresenter"
                                 Content="{TemplateBinding Content}"
                                 ContentTemplate="{TemplateBinding ContentTemplate}" />
-                            <Rectangle Name="LightDismissLayer" IsVisible="False" />
+                            <Rectangle Name="LightDismissLayer" />
                         </Panel>
 
                     </Grid>
@@ -235,8 +235,8 @@
             </Style>
         </Style>
 
-        <Style Selector="^:lightDismiss /template/ Rectangle#LightDismissLayer">
+        <Style Selector="^:lightdismiss /template/ Rectangle#LightDismissLayer">
-            <Setter Property="Fill" Value="{DynamicResource SplitViewMaskBrush}" />
+            <Setter Property="Fill" Value="#99000000" />
         </Style>
         <Style Selector="^:overlay:open /template/ Rectangle#LightDismissLayer">
             <Setter Property="IsVisible" Value="True" />

src/Semi.Avalonia/Controls/TextBox.axaml

@@ -24,43 +24,17 @@
     </MenuFlyout>
 
     <ControlTheme x:Key="{x:Type TextBox}" TargetType="TextBox">
-        <ControlTheme.Resources>
-            <ControlTheme x:Key="InputToggleButton" TargetType="ToggleButton">
-                <Setter Property="ToggleButton.Foreground" Value="{DynamicResource TextBoxButtonDefaultForeground}" />
-                <Setter Property="ToggleButton.Cursor" Value="Hand" />
-                <Setter Property="ToggleButton.Template">
-                    <ControlTemplate TargetType="ToggleButton">
-                        <!--  Background must be transparent or hit test will fail  -->
-                        <Panel Background="Transparent">
-                            <PathIcon
-                                Width="16"
-                                Height="16"
-                                Data="{DynamicResource PasswordBoxRevealButtonData}"
-                                IsVisible="{Binding $parent[ToggleButton].IsChecked, Converter={x:Static BoolConverters.Not}}" />
-                            <PathIcon
-                                Width="16"
-                                Height="16"
-                                Data="{DynamicResource PasswordBoxHideButtonData}"
-                                IsVisible="{Binding $parent[ToggleButton].IsChecked}" />
-                        </Panel>
-                    </ControlTemplate>
-                </Setter>
-            </ControlTheme>
-        </ControlTheme.Resources>
         <Setter Property="TextBox.Foreground" Value="{DynamicResource TextBoxForeground}" />
         <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDefaultBackground}" />
         <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDefaultBorderBrush}" />
         <Setter Property="TextBox.SelectionBrush" Value="{DynamicResource TextBoxSelectionBackground}" />
         <Setter Property="TextBox.SelectionForegroundBrush" Value="{DynamicResource TextBoxSelectionForeground}" />
         <Setter Property="TextBox.BorderThickness" Value="{DynamicResource TextBoxBorderThickness}" />
-        <Setter Property="TextBox.BackgroundSizing" Value="OuterBorderEdge" />
         <Setter Property="TextBox.CornerRadius" Value="{DynamicResource TextBoxDefaultCornerRadius}" />
         <Setter Property="TextBox.FontSize" Value="14" />
         <Setter Property="TextBox.Cursor" Value="Ibeam" />
         <Setter Property="TextBox.CaretBrush" Value="{DynamicResource TextBoxTextCaretBrush}" />
         <Setter Property="TextBox.Padding" Value="{DynamicResource TextBoxContentPadding}" />
-        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxDefaultHeight}" />
-        <Setter Property="TextBox.VerticalAlignment" Value="Center" />
         <Setter Property="TextBox.VerticalContentAlignment" Value="Center" />
         <Setter Property="TextBox.FocusAdorner" Value="{x:Null}" />
         <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
@@ -70,9 +44,8 @@
                 <DataValidationErrors>
                     <Border
                         Name="PART_ContentPresenterBorder"
-                        MinHeight="{TemplateBinding MinHeight}"
+                        MinHeight="{DynamicResource TextBoxWrapperDefaultHeight}"
                         Background="{TemplateBinding Background}"
-                        BackgroundSizing="{TemplateBinding BackgroundSizing}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
                         CornerRadius="{TemplateBinding CornerRadius}">
@@ -101,15 +74,14 @@
                                         TextWrapping="{TemplateBinding TextWrapping}">
                                         <TextBlock.IsVisible>
                                             <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                                <Binding ElementName="PART_TextPresenter" Path="PreeditText" Converter="{x:Static StringConverters.IsNullOrEmpty}"/>
+                                                <Binding ElementName="PART_TextPresenter" Path="PreeditText" Converter="{x:Static StringConverters.IsNullOrEmpty}" />
-                                                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Text" Converter="{x:Static StringConverters.IsNullOrEmpty}"/>
+                                                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Text" Converter="{x:Static StringConverters.IsNullOrEmpty}" />
                                             </MultiBinding>
                                         </TextBlock.IsVisible>
                                     </TextBlock>
                                     <TextPresenter
                                         Name="PART_TextPresenter"
                                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                        CaretBlinkInterval="{TemplateBinding CaretBlinkInterval}"
                                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                         CaretBrush="{TemplateBinding CaretBrush}"
                                         CaretIndex="{TemplateBinding CaretIndex}"
@@ -120,8 +92,7 @@
                                         SelectionEnd="{TemplateBinding SelectionEnd}"
                                         SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
                                         SelectionStart="{TemplateBinding SelectionStart}"
-                                        Text="{TemplateBinding Text,
+                                        Text="{TemplateBinding Text, Mode=TwoWay}"
-                                                               Mode=TwoWay}"
                                         TextAlignment="{TemplateBinding TextAlignment}"
                                         TextWrapping="{TemplateBinding TextWrapping}" />
                                 </Panel>
@@ -137,8 +108,7 @@
                                 Name="PART_RevealButton"
                                 Grid.Column="3"
                                 Margin="4,0,0,0"
-                                IsChecked="{TemplateBinding RevealPassword,
+                                IsChecked="{TemplateBinding RevealPassword, Mode=TwoWay}"
-                                                            Mode=TwoWay}"
                                 IsVisible="False"
                                 Theme="{StaticResource InputToggleButton}" />
                             <ContentPresenter
@@ -203,11 +173,11 @@
                 <Setter Property="IsVisible" Value="True" />
             </Style>
         </Style>
-        <Style Selector="^.Large">
+        <Style Selector="^.Large /template/ Border#PART_ContentPresenterBorder">
-            <Setter Property="MinHeight" Value="{DynamicResource TextBoxLargeHeight}" />
+            <Setter Property="MinHeight" Value="{DynamicResource TextBoxWrapperLargeHeight}" />
         </Style>
-        <Style Selector="^.Small">
+        <Style Selector="^.Small /template/ Border#PART_ContentPresenterBorder">
-            <Setter Property="MinHeight" Value="{DynamicResource TextBoxSmallHeight}" />
+            <Setter Property="MinHeight" Value="{DynamicResource TextBoxWrapperSmallHeight}" />
         </Style>
 
         <Style Selector="^.Bordered">
@@ -247,10 +217,10 @@
         </Style>
 
         <Style Selector="^.TextArea">
-            <Setter Property="AcceptsReturn" Value="True"></Setter>
+            <Setter Property="AcceptsReturn" Value="True" />
-            <Setter Property="VerticalContentAlignment" Value="Top"></Setter>
+            <Setter Property="VerticalContentAlignment" Value="Top" />
-            <Setter Property="TextBox.Padding" Value="{DynamicResource TextBoxTextAreaContentPadding}"></Setter>
+            <Setter Property="Padding" Value="{DynamicResource TextBoxTextAreaContentPadding}" />
-            <Setter Property="MinHeight" Value="{DynamicResource TextBoxTextAreaHeight}"></Setter>
+            <Setter Property="MinHeight" Value="{DynamicResource TextBoxTextAreaHeight}" />
         </Style>
     </ControlTheme>
 
@@ -260,15 +230,13 @@
         <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDefaultBorderBrush}" />
         <Setter Property="TextBox.SelectionBrush" Value="{DynamicResource TextBoxSelectionBackground}" />
         <Setter Property="TextBox.SelectionForegroundBrush" Value="{DynamicResource TextBoxSelectionForeground}" />
-        <Setter Property="TextBox.BackgroundSizing" Value="OuterBorderEdge" />
         <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.CaretBrush" Value="{DynamicResource TextBoxTextCaretBrush}" />
         <Setter Property="TextBox.Padding" Value="{DynamicResource TextBoxContentPadding}" />
-        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxDefaultHeight}" />
+        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperDefaultHeight}" />
-        <Setter Property="TextBox.VerticalAlignment" Value="Center" />
         <Setter Property="TextBox.VerticalContentAlignment" Value="Center" />
         <Setter Property="TextBox.FocusAdorner" Value="{x:Null}" />
         <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
@@ -280,11 +248,10 @@
                         Name="PART_ContentPresenterBorder"
                         MinHeight="{TemplateBinding MinHeight}"
                         Background="{TemplateBinding Background}"
-                        BackgroundSizing="{TemplateBinding BackgroundSizing}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
                         CornerRadius="{TemplateBinding CornerRadius}">
-                        <Grid Margin="{TemplateBinding Padding}" ColumnDefinitions="Auto, *, Auto">
+                        <Grid Margin="{TemplateBinding Padding}" ColumnDefinitions="Auto, *, Auto, Auto, Auto">
                             <ContentPresenter
                                 Grid.Column="0"
                                 Padding="{DynamicResource TextBoxInnerLeftContentPadding}"
@@ -303,17 +270,21 @@
                                         Name="PART_Watermark"
                                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                        IsVisible="{TemplateBinding Text,
-                                                                    Converter={x:Static StringConverters.IsNullOrEmpty}}"
                                         Opacity="0.5"
                                         Text="{TemplateBinding Watermark}"
                                         TextAlignment="{TemplateBinding TextAlignment}"
-                                        TextWrapping="{TemplateBinding TextWrapping}" />
+                                        TextWrapping="{TemplateBinding TextWrapping}">
+                                        <TextBlock.IsVisible>
+                                            <MultiBinding Converter="{x:Static BoolConverters.And}">
+                                                <Binding ElementName="PART_TextPresenter" Path="PreeditText" Converter="{x:Static StringConverters.IsNullOrEmpty}" />
+                                                <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Text" Converter="{x:Static StringConverters.IsNullOrEmpty}" />
+                                            </MultiBinding>
+                                        </TextBlock.IsVisible>
+                                    </TextBlock>
                                     <TextPresenter
                                         Name="PART_TextPresenter"
                                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                        CaretBlinkInterval="{TemplateBinding CaretBlinkInterval}"
                                         CaretBrush="{TemplateBinding CaretBrush}"
                                         CaretIndex="{TemplateBinding CaretIndex}"
                                         LineHeight="{TemplateBinding LineHeight}"
@@ -323,14 +294,27 @@
                                         SelectionEnd="{TemplateBinding SelectionEnd}"
                                         SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
                                         SelectionStart="{TemplateBinding SelectionStart}"
-                                        Text="{TemplateBinding Text,
+                                        Text="{TemplateBinding Text, Mode=TwoWay}"
-                                                               Mode=TwoWay}"
                                         TextAlignment="{TemplateBinding TextAlignment}"
                                         TextWrapping="{TemplateBinding TextWrapping}" />
                                 </Panel>
                             </ScrollViewer>
-                            <ContentPresenter
+                            <Button
+                                Name="PART_ClearButton"
                                 Grid.Column="2"
+                                Command="{Binding $parent[TextBox].Clear}"
+                                Content="{DynamicResource IconButtonClearData}"
+                                IsVisible="False"
+                                Theme="{StaticResource InnerIconButton}" />
+                            <ToggleButton
+                                Name="PART_RevealButton"
+                                Grid.Column="3"
+                                Margin="4,0,0,0"
+                                IsChecked="{TemplateBinding RevealPassword, Mode=TwoWay}"
+                                IsVisible="False"
+                                Theme="{StaticResource InputToggleButton}" />
+                            <ContentPresenter
+                                Grid.Column="4"
                                 Padding="{DynamicResource TextBoxInnerRightContentPadding}"
                                 VerticalAlignment="Center"
                                 Content="{TemplateBinding InnerRightContent}"
@@ -377,81 +361,98 @@
                 <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsSelectedBorderBrush}" />
             </Style>
         </Style>
-    </ControlTheme>
 
-    <ControlTheme x:Key="LooklessTextBox" TargetType="TextBox">
+        <Style Selector="^.clearButton, ^.ClearButton">
-        <Setter Property="TextBox.Foreground" Value="{DynamicResource TextBoxForeground}" />
+            <Style
-        <Setter Property="TextBox.SelectionBrush" Value="{DynamicResource TextBoxSelectionBackground}" />
+                Selector="^[AcceptsReturn=False][IsReadOnly=False]:focus:not(:empty) /template/ Button#PART_ClearButton">
-        <Setter Property="TextBox.SelectionForegroundBrush" Value="{DynamicResource TextBoxSelectionForeground}" />
+                <Setter Property="IsVisible" Value="True" />
-        <Setter Property="TextBox.FontSize" Value="14" />
+            </Style>
-        <Setter Property="TextBox.Cursor" Value="Ibeam" />
+            <Style
-        <Setter Property="TextBox.CaretBrush" Value="{DynamicResource TextBoxTextCaretBrush}" />
+                Selector="^[AcceptsReturn=False][IsReadOnly=False]:pointerover:not(:empty) /template/ Button#PART_ClearButton">
-        <Setter Property="TextBox.Padding" Value="{DynamicResource TextBoxContentPadding}" />
+                <Setter Property="IsVisible" Value="True" />
-        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxDefaultHeight}" />
+            </Style>
-        <Setter Property="TextBox.VerticalAlignment" Value="Center" />
+        </Style>
-        <Setter Property="TextBox.VerticalContentAlignment" Value="Center" />
+        <Style Selector="^.revealPasswordButton, ^.RevealPasswordButton">
-        <Setter Property="TextBox.FocusAdorner" Value="{x:Null}" />
+            <Style Selector="^ /template/ ToggleButton#PART_RevealButton">
-        <Setter Property="ScrollViewer.IsScrollChainingEnabled" Value="True" />
+                <Setter Property="IsVisible" Value="True" />
-        <Setter Property="TextBox.Template">
+            </Style>
-            <ControlTemplate TargetType="TextBox">
+        </Style>
-                <Border Name="PART_ContentPresenterBorder" MinHeight="{TemplateBinding MinHeight}">
+        <Style Selector="^.Large /template/ Border#PART_ContentPresenterBorder">
-                    <Grid Margin="{TemplateBinding Padding}" ColumnDefinitions="Auto, *, Auto">
+            <Setter Property="MinHeight" Value="{DynamicResource TextBoxWrapperLargeHeight}" />
-                        <ContentPresenter
+        </Style>
-                            Grid.Column="0"
+        <Style Selector="^.Small /template/ Border#PART_ContentPresenterBorder">
-                            Padding="{DynamicResource TextBoxInnerLeftContentPadding}"
+            <Setter Property="MinHeight" Value="{DynamicResource TextBoxWrapperSmallHeight}" />
-                            VerticalAlignment="Center"
+        </Style>
-                            Content="{TemplateBinding InnerLeftContent}"
-                            Foreground="{DynamicResource TextBoxInnerForeground}"
-                            IsVisible="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=InnerLeftContent, Converter={x:Static ObjectConverters.IsNotNull}}" />
-                        <ScrollViewer
-                            Grid.Column="1"
-                            AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}"
-                            HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
-                            IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
-                            VerticalScrollBarVisibility="{TemplateBinding (ScrollViewer.VerticalScrollBarVisibility)}">
-                            <Panel>
-                                <TextBlock
-                                    Name="PART_Watermark"
-                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                    IsVisible="{TemplateBinding Text, Converter={x:Static StringConverters.IsNullOrEmpty}}"
-                                    Opacity="0.5"
-                                    Text="{TemplateBinding Watermark}"
-                                    TextAlignment="{TemplateBinding TextAlignment}"
-                                    TextWrapping="{TemplateBinding TextWrapping}" />
-                                <TextPresenter
-                                    Name="PART_TextPresenter"
-                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
-                                    CaretBrush="{TemplateBinding CaretBrush}"
-                                    CaretIndex="{TemplateBinding CaretIndex}"
-                                    LineHeight="{TemplateBinding LineHeight}"
-                                    PasswordChar="{TemplateBinding PasswordChar}"
-                                    RevealPassword="{TemplateBinding RevealPassword}"
-                                    SelectionBrush="{TemplateBinding SelectionBrush}"
-                                    SelectionEnd="{TemplateBinding SelectionEnd}"
-                                    SelectionForegroundBrush="{TemplateBinding SelectionForegroundBrush}"
-                                    SelectionStart="{TemplateBinding SelectionStart}"
-                                    Text="{TemplateBinding Text, Mode=TwoWay}"
-                                    TextAlignment="{TemplateBinding TextAlignment}"
-                                    TextWrapping="{TemplateBinding TextWrapping}" />
-                            </Panel>
-                        </ScrollViewer>
-                        <ContentPresenter
-                            Grid.Column="2"
-                            Padding="{DynamicResource TextBoxInnerRightContentPadding}"
-                            VerticalAlignment="Center"
-                            Content="{TemplateBinding InnerRightContent}"
-                            Foreground="{DynamicResource TextBoxInnerForeground}"
-                            IsVisible="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=InnerRightContent, Converter={x:Static ObjectConverters.IsNotNull}}" />
-                    </Grid>
-                </Border>
-            </ControlTemplate>
-        </Setter>
 
-        <Style Selector="^:disabled">
+        <Style Selector="^.Bordered">
-            <Setter Property="Foreground" Value="{DynamicResource TextBoxDisabledForeground}" />
+            <Setter Property="Background" Value="{DynamicResource TextBoxBorderedDefaultBackground}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource TextBoxBorderedDefaultBorderBrush}" />
+            <Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
+                <Setter Property="Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:focus">
+                <Setter Property="Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled /template/ Border#PART_ContentPresenterBorder">
+                <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
+                <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
+            </Style>
+
+            <Style Selector="^:error">
+                <Style Selector="^ /template/ Border#PART_ContentPresenterBorder">
+                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsBorderBrush}" />
+                </Style>
+                <Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
+                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointerOverBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsPointerOverBorderBrush}" />
+                </Style>
+                <Style Selector="^:pressed /template/ Border#PART_ContentPresenterBorder">
+                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPressedBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsPressedBorderBrush}" />
+                </Style>
+                <Style Selector="^:focus /template/ Border#PART_ContentPresenterBorder">
+                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsSelectedBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsSelectedBorderBrush}" />
+                </Style>
+            </Style>
+        </Style>
+
+        <Style Selector="^.TextArea">
+            <Setter Property="AcceptsReturn" Value="True" />
+            <Setter Property="VerticalContentAlignment" Value="Top" />
+            <Setter Property="Padding" Value="{DynamicResource TextBoxTextAreaContentPadding}" />
+            <Setter Property="MinHeight" Value="{DynamicResource TextBoxTextAreaHeight}" />
         </Style>
     </ControlTheme>
 
+    <ControlTheme x:Key="InputToggleButton" TargetType="ToggleButton">
+        <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ButtonInputInnerForeground}" />
+        <Setter Property="ToggleButton.Cursor" Value="Hand" />
+        <Setter Property="ToggleButton.Template">
+            <ControlTemplate TargetType="ToggleButton">
+                <!--  Background must be transparent or hit test will fail  -->
+                <Panel Background="Transparent">
+                    <PathIcon
+                        Width="16"
+                        Height="16"
+                        Data="{DynamicResource PasswordBoxRevealButtonData}"
+                        IsVisible="{Binding $parent[ToggleButton].IsChecked, Converter={x:Static BoolConverters.Not}}" />
+                    <PathIcon
+                        Width="16"
+                        Height="16"
+                        Data="{DynamicResource PasswordBoxHideButtonData}"
+                        IsVisible="{Binding $parent[ToggleButton].IsChecked}" />
+                </Panel>
+            </ControlTemplate>
+        </Setter>
+        <Style Selector="^:pointerover">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonInputInnerPointeroverForeground}" />
+        </Style>
+        <Style Selector="^:pressed">
+            <Setter Property="Foreground" Value="{DynamicResource ButtonInputInnerPressedForeground}" />
+        </Style>
+    </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/TimePicker.axaml

@@ -136,7 +136,6 @@
         <Setter Property="CornerRadius" Value="3" />
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
-        <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonDefaultHeight}" />
         <Setter Property="Template">
             <ControlTemplate>
                 <DataValidationErrors>
@@ -150,7 +149,7 @@
                             Grid.ColumnSpan="2"
                             Width="242"
                             MinWidth="242"
-                            MinHeight="{TemplateBinding MinHeight}"
+                            MinHeight="{DynamicResource DateTimePickerButtonDefaultHeight}"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"
                             Background="{TemplateBinding Background}"
@@ -172,19 +171,19 @@
                                         VerticalAlignment="Stretch">
                                         <TextBlock
                                             x:Name="PART_HourTextBlock"
-                                            Padding="12,0"
+                                            Padding="12,4"
                                             HorizontalAlignment="Center"
                                             VerticalAlignment="Center"
                                             FontFamily="{TemplateBinding FontFamily}"
                                             FontSize="{TemplateBinding FontSize}"
-                                            FontWeight="{TemplateBinding FontWeight}"
+                                            FontWeight="{TemplateBinding FontWeight}" />
-                                            Text="{DynamicResource STRING_TIMEPICKER_HOUR_TEXT}" />
                                     </Border>
 
                                     <Rectangle
                                         Name="PART_FirstColumnDivider"
                                         Grid.Column="1"
                                         Width="1"
+                                        Margin="0,4"
                                         HorizontalAlignment="Center"
                                         Fill="{DynamicResource DateTimePickerSeparatorBackground}" />
 
@@ -195,19 +194,19 @@
                                         VerticalAlignment="Stretch">
                                         <TextBlock
                                             x:Name="PART_MinuteTextBlock"
-                                            Padding="12,0"
+                                            Padding="12,4"
                                             HorizontalAlignment="Center"
                                             VerticalAlignment="Center"
                                             FontFamily="{TemplateBinding FontFamily}"
                                             FontSize="{TemplateBinding FontSize}"
-                                            FontWeight="{TemplateBinding FontWeight}"
+                                            FontWeight="{TemplateBinding FontWeight}" />
-                                            Text="{DynamicResource STRING_TIMEPICKER_MINUTE_TEXT}" />
                                     </Border>
 
                                     <Rectangle
                                         Name="PART_SecondColumnDivider"
                                         Grid.Column="3"
                                         Width="1"
+                                        Margin="0,4"
                                         HorizontalAlignment="Center"
                                         Fill="{DynamicResource DateTimePickerSeparatorBackground}" />
 
@@ -218,7 +217,7 @@
                                         VerticalAlignment="Stretch">
                                         <TextBlock
                                             x:Name="PART_PeriodTextBlock"
-                                            Padding="12,0"
+                                            Padding="12,4"
                                             HorizontalAlignment="Center"
                                             VerticalAlignment="Center"
                                             FontFamily="{TemplateBinding FontFamily}"
@@ -279,10 +278,10 @@
             <Setter Property="Foreground" Value="{DynamicResource DateTimePickerEmptyForeground}" />
         </Style>
 
-        <Style Selector="^.Large">
+        <Style Selector="^.Large /template/ Button#PART_FlyoutButton">
             <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonLargeHeight}" />
         </Style>
-        <Style Selector="^.Small">
+        <Style Selector="^.Small /template/ Button#PART_FlyoutButton">
             <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonSmallHeight}" />
         </Style>
     </ControlTheme>

src/Semi.Avalonia/Controls/ToggleButton.axaml

@@ -20,30 +20,24 @@
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type ToggleButton}" TargetType="ToggleButton">
-        <Setter Property="Background" Value="{DynamicResource ToggleButtonDefaultBackground}" />
+        <Setter Property="ToggleButton.Background" Value="{DynamicResource ToggleButtonDefaultBackground}" />
-        <Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
+        <Setter Property="ToggleButton.Foreground" Value="{DynamicResource ToggleButtonDefaultPrimaryForeground}" />
-        <Setter Property="Foreground" Value="{DynamicResource ToggleButtonDefaultPrimaryForeground}" />
+        <Setter Property="ToggleButton.BorderBrush" Value="{DynamicResource ToggleButtonDefaultBorderBrush}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonDefaultBorderBrush}" />
+        <Setter Property="ToggleButton.CornerRadius" Value="{DynamicResource ToggleButtonCornerRadius}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource ToggleButtonCornerRadius}" />
+        <Setter Property="ToggleButton.BorderThickness" Value="{DynamicResource ToggleButtonBorderThickness}" />
-        <Setter Property="BorderThickness" Value="{DynamicResource ToggleButtonBorderThickness}" />
+        <Setter Property="ToggleButton.Padding" Value="{DynamicResource ToggleButtonDefaultPadding}" />
-        <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
+        <Setter Property="ToggleButton.RenderTransform" Value="none" />
-        <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="ToggleButton.FontSize" Value="{DynamicResource ToggleButtonDefaultFontSize}" />
-        <Setter Property="FontSize" Value="{DynamicResource ToggleButtonDefaultFontSize}" />
+        <Setter Property="ToggleButton.FontWeight" Value="{DynamicResource ToggleButtonDefaultFontWeight}" />
-        <Setter Property="FontWeight" Value="{DynamicResource ToggleButtonDefaultFontWeight}" />
+        <Setter Property="ToggleButton.HorizontalContentAlignment" Value="Center" />
-        <Setter Property="HorizontalAlignment" Value="Center"/>
+        <Setter Property="ToggleButton.VerticalContentAlignment" Value="Center" />
-        <Setter Property="VerticalAlignment" Value="Center"/>
+        <Setter Property="ToggleButton.MinHeight" Value="12" />
-        <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="ToggleButton.Cursor" Value="Hand" />
-        <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="ToggleButton.Template">
-        <Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
-        <Setter Property="Cursor" Value="Hand" />
-        <Setter Property="Template">
             <ControlTemplate TargetType="ToggleButton">
                 <ContentPresenter
                     x:Name="PART_ContentPresenter"
-                    BackgroundSizing="{TemplateBinding BackgroundSizing}"
                     Padding="{TemplateBinding Padding}"
-                    HorizontalAlignment="Stretch"
-                    VerticalAlignment="Stretch"
                     HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                     VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                     Background="{TemplateBinding Background}"
@@ -73,6 +67,7 @@
 
         <Style Selector="^:disabled">
             <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonDefaultDisabledBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource ToggleButtonDefaultBackground}" />
         </Style>
 
         <Style Selector="^.Primary">
@@ -159,6 +154,7 @@
             </Style>
             <Style Selector="^:disabled">
                 <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonDefaultDisabledBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource ToggleButtonCheckedDisabledBackground}" />
             </Style>
         </Style>
 
@@ -248,21 +244,19 @@
             </Style>
             <Style Selector="^:disabled">
                 <Setter Property="BorderBrush" Value="{DynamicResource ToggleButtonIndeterminateDisabledBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource ToggleButtonDefaultBackground}" />
             </Style>
         </Style>
 
         <Style Selector="^:disabled">
             <Setter Property="Foreground" Value="{DynamicResource ToggleButtonDefaultDisabledForeground}" />
-            <Setter Property="Background" Value="{DynamicResource ToggleButtonDefaultDisabledBackground}" />
         </Style>
 
         <Style Selector="^.Large">
             <Setter Property="Padding" Value="{DynamicResource ButtonLargePadding}" />
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonLargeHeight}" />
         </Style>
         <Style Selector="^.Small">
             <Setter Property="Padding" Value="{DynamicResource ButtonSmallPadding}" />
-            <Setter Property="MinHeight" Value="{DynamicResource ButtonSmallHeight}" />
         </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/ToggleSwitch.axaml

@@ -15,6 +15,13 @@
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
+        <Setter Property="FocusAdorner">
+            <FocusAdornerTemplate>
+                <Border BorderThickness="{DynamicResource AdornerLayerBorderThickness}"
+                        BorderBrush="{DynamicResource AdornerLayerStroke}" 
+                        CornerRadius="100"/>
+            </FocusAdornerTemplate>
+        </Setter>
         <Setter Property="KnobTransitions">
             <Transitions>
                 <DoubleTransition
@@ -28,81 +35,99 @@
                 <Grid
                     Background="{TemplateBinding Background}"
                     Cursor="Hand"
-                    RowDefinitions="Auto,*">
+                    RowDefinitions="Auto,*"
+                    ColumnDefinitions="Auto, *">
                     <ContentPresenter
                         x:Name="PART_ContentPresenter"
-                        Grid.Row="0"
+                        Grid.Row="0" Grid.Column="0"
+                        Grid.ColumnSpan="2"
                         Margin="{DynamicResource ToggleSwitchHeaderMargin}"
                         VerticalAlignment="Top"
                         Content="{TemplateBinding Content}"
                         ContentTemplate="{TemplateBinding ContentTemplate}"
-                        IsVisible="{TemplateBinding Content,
+                        IsVisible="{TemplateBinding Content, Converter={x:Static ObjectConverters.IsNotNull}}"
-                                                    Converter={x:Static ObjectConverters.IsNotNull}}"
                         RecognizesAccessKey="True" />
-                    <Grid
+
-                        Grid.Row="1"
+                    <Border
-                        Background="Transparent"
+                        x:Name="SwitchBackgroundBorder"
-                        ColumnDefinitions="Auto, *">
+                        Grid.Row="1" Grid.Column="0"
-                        <Grid
+                        TemplatedControl.IsTemplateFocusTarget="True"
-                            Grid.Column="0"
+                        Width="{DynamicResource ToggleSwitchDefaultWidth}"
-                            Grid.ColumnSpan="2"
+                        Height="{DynamicResource ToggleSwitchDefaultHeight}"
-                            TemplatedControl.IsTemplateFocusTarget="True" />
+                        CornerRadius="100">
-                        <Border
+                        <Border.Transitions>
-                            Name="SwitchBackgroundBorder"
+                            <Transitions>
-                            Grid.Column="0"
+                                <BrushTransition Property="Background" Duration="0:0:0.2" />
-                            Width="40"
+                            </Transitions>
-                            Height="20"
+                        </Border.Transitions>
-                            CornerRadius="100">
-                            <Border.Transitions>
-                                <Transitions>
-                                    <BrushTransition Property="Background" Duration="0:0:0.2" />
-                                </Transitions>
-                            </Border.Transitions>
-                        </Border>
                         <Canvas
                             x:Name="PART_SwitchKnob"
-                            Grid.Column="0"
+                            Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
-                            Width="20"
+                            Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
-                            Height="20"
                             HorizontalAlignment="Left">
                             <Grid
                                 x:Name="PART_MovingKnobs"
-                                Width="20"
+                                Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
-                                Height="20">
+                                Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
+                                Margin="{DynamicResource ToggleSwitchIndicatorDefaultMargin}">
                                 <Border
                                     x:Name="SwitchKnobIndicator"
-                                    Width="14"
-                                    Height="14"
                                     Background="White"
-                                    BorderBrush="{DynamicResource ToggleSwitchIndicatorBorderBrush}"
-                                    BorderThickness="0.5"
                                     BoxShadow="0 0 1 1 #222E3238"
                                     CornerRadius="100" />
+                                <Arc
+                                    x:Name="SwitchKnobLoadingIndicator"
+                                    IsVisible="False"
+                                    StrokeThickness="2"
+                                    StartAngle="0"
+                                    SweepAngle="140"
+                                    StrokeJoin="Round"
+                                    StrokeLineCap="Round">
+                                    <Arc.Stroke>
+                                        <ConicGradientBrush>
+                                            <GradientStops>
+                                                <GradientStop Offset="0.1" Color="Transparent" />
+                                                <GradientStop Offset="0.7" Color="White" />
+                                            </GradientStops>
+                                        </ConicGradientBrush>
+                                    </Arc.Stroke>
+                                    <Arc.Styles>
+                                        <Style Selector="Arc[IsVisible=True]">
+                                            <Style.Animations>
+                                                <Animation IterationCount="Infinite" Duration="0:0:0.6">
+                                                    <KeyFrame Cue="0%">
+                                                        <Setter Property="RotateTransform.Angle" Value="0.0" />
+                                                    </KeyFrame>
+                                                    <KeyFrame Cue="100%">
+                                                        <Setter Property="RotateTransform.Angle" Value="360.0" />
+                                                    </KeyFrame>
+                                                </Animation>
+                                            </Style.Animations>
+                                        </Style>
+                                    </Arc.Styles>
+                                </Arc>
                             </Grid>
                         </Canvas>
+                    </Border>
 
-                        <ContentPresenter
+                    <ContentPresenter
-                            x:Name="PART_OnContentPresenter"
+                        x:Name="PART_OnContentPresenter"
-                            Grid.Column="1"
+                        Grid.Row="1" Grid.Column="1"
-                            Margin="{DynamicResource ToggleSwitchOnContentMargin}"
+                        Margin="{DynamicResource ToggleSwitchOnContentMargin}"
-                            HorizontalAlignment="Left"
+                        HorizontalAlignment="Left"
-                            VerticalAlignment="Center"
+                        VerticalAlignment="Center"
-                            VerticalContentAlignment="Center"
+                        VerticalContentAlignment="Center"
-                            Content="{TemplateBinding OnContent}"
+                        Content="{TemplateBinding OnContent}"
-                            ContentTemplate="{TemplateBinding OnContentTemplate}"
+                        ContentTemplate="{TemplateBinding OnContentTemplate}" />
-                            IsVisible="True" />
+                    <ContentPresenter
-                        <ContentPresenter
+                        x:Name="PART_OffContentPresenter"
-                            x:Name="PART_OffContentPresenter"
+                        Grid.Row="1" Grid.Column="1"
-                            Grid.Column="1"
+                        Margin="{DynamicResource ToggleSwitchOnContentMargin}"
-                            Margin="{DynamicResource ToggleSwitchOnContentMargin}"
+                        HorizontalAlignment="Left"
-                            HorizontalAlignment="Left"
+                        VerticalAlignment="Center"
-                            VerticalAlignment="Center"
+                        VerticalContentAlignment="Center"
-                            VerticalContentAlignment="Center"
+                        Content="{TemplateBinding OffContent}"
-                            Content="{TemplateBinding OffContent}"
+                        ContentTemplate="{TemplateBinding OffContentTemplate}" />
-                            ContentTemplate="{TemplateBinding OffContentTemplate}"
-                            IsVisible="False" />
-
-                    </Grid>
                 </Grid>
             </ControlTemplate>
         </Setter>
@@ -154,6 +179,58 @@
                 <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerCheckedDisabledBackground}" />
             </Style>
         </Style>
+
+        <Style Selector="^.Loading">
+            <Style Selector="^ /template/ Border#SwitchKnobIndicator">
+                <Setter Property="IsVisible" Value="False" />
+            </Style>
+            <Style Selector="^ /template/ Arc#SwitchKnobLoadingIndicator">
+                <Setter Property="IsVisible" Value="True" />
+            </Style>
+            <Style Selector="^:unchecked /template/ Border#SwitchBackgroundBorder">
+                <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerUnCheckedPointeroverBackground}" />
+            </Style>
+            <Style Selector="^:checked /template/ Border#SwitchBackgroundBorder">
+                <Setter Property="Background" Value="{DynamicResource ToggleSwitchContainerCheckedPointeroverBackground}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^.Small">
+            <Style Selector="^ /template/ Border#SwitchBackgroundBorder">
+                <Setter Property="Width" Value="{DynamicResource ToggleSwitchSmallWidth}" />
+                <Setter Property="Height" Value="{DynamicResource ToggleSwitchSmallHeight}" />
+            </Style>
+            <Style Selector="^ /template/ Canvas#PART_SwitchKnob">
+                <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
+                <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
+            </Style>
+            <Style Selector="^ /template/ Grid#PART_MovingKnobs">
+                <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
+                <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorSmallWidth}" />
+                <Setter Property="Margin" Value="{DynamicResource ToggleSwitchIndicatorSmallMargin}"/>
+            </Style>
+            <Style Selector="^ /template/ Arc#SwitchKnobLoadingIndicator">
+                <Setter Property="StrokeThickness" Value="{DynamicResource ToggleSwitchLoadingIndicatorSmallStrokeThickness}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Large">
+            <Style Selector="^ /template/ Border#SwitchBackgroundBorder">
+                <Setter Property="Width" Value="{DynamicResource ToggleSwitchLargeWidth}" />
+                <Setter Property="Height" Value="{DynamicResource ToggleSwitchLargeHeight}" />
+            </Style>
+            <Style Selector="^ /template/ Canvas#PART_SwitchKnob">
+                <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
+                <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
+            </Style>
+            <Style Selector="^ /template/ Grid#PART_MovingKnobs">
+                <Setter Property="Width" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
+                <Setter Property="Height" Value="{DynamicResource ToggleSwitchIndicatorLargeWidth}" />
+                <Setter Property="Margin" Value="{DynamicResource ToggleSwitchIndicatorLargeMargin}"/>
+            </Style>
+            <Style Selector="^ /template/ Arc#SwitchKnobLoadingIndicator">
+                <Setter Property="StrokeThickness" Value="{DynamicResource ToggleSwitchLoadingIndicatorLargeStrokeThickness}" />
+            </Style>
+        </Style>
     </ControlTheme>
 
     <ControlTheme
@@ -163,6 +240,12 @@
         <Setter Property="Padding" Value="8" />
         <Setter Property="CornerRadius" Value="3" />
         <Setter Property="Background" Value="Transparent" />
+        <Setter Property="FocusAdorner">
+            <FocusAdornerTemplate>
+                <Border BorderThickness="{DynamicResource AdornerLayerBorderThickness}"
+                        BorderBrush="{DynamicResource AdornerLayerStroke}" />
+            </FocusAdornerTemplate>
+        </Setter>
         <Setter Property="Template">
             <ControlTemplate TargetType="ToggleSwitch">
                 <Border
@@ -171,9 +254,9 @@
                     Background="{TemplateBinding Background}"
                     CornerRadius="{TemplateBinding CornerRadius}"
                     Cursor="Hand">
-                    <Grid ColumnDefinitions="Auto">
+                    <Panel>
-                        <Grid x:Name="PART_SwitchKnob" />
+                        <Panel x:Name="PART_SwitchKnob" />
-                        <Grid x:Name="PART_MovingKnobs" />
+                        <Panel x:Name="PART_MovingKnobs" />
                         <ContentPresenter
                             x:Name="PART_OnContentPresenter"
                             Margin="{DynamicResource ToggleSwitchOnContentMargin}"
@@ -184,7 +267,7 @@
                             Margin="{DynamicResource ToggleSwitchOnContentMargin}"
                             Content="{TemplateBinding OffContent}"
                             ContentTemplate="{TemplateBinding OffContentTemplate}" />
-                    </Grid>
+                    </Panel>
                 </Border>
             </ControlTemplate>
         </Setter>
@@ -200,56 +283,110 @@
         x:Key="SimpleToggleSwitch"
         BasedOn="{StaticResource {x:Type ToggleSwitch}}"
         TargetType="ToggleSwitch">
+        <Setter Property="OnContent" Value="{x:Null}" />
+        <Setter Property="OffContent" Value="{x:Null}" />
+        <Setter Property="FontSize" Value="{DynamicResource SimpleToggleSwitchFontSize}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="ToggleSwitch">
-                <Grid
+                <Border
+                    x:Name="SwitchBackgroundBorder"
                     Background="{TemplateBinding Background}"
                     Cursor="Hand"
-                    RowDefinitions="*">
+                    Width="{DynamicResource ToggleSwitchDefaultWidth}"
+                    Height="{DynamicResource ToggleSwitchDefaultHeight}"
+                    CornerRadius="100">
+                    <Border.Transitions>
+                        <Transitions>
+                            <BrushTransition Property="Background" Duration="0:0:0.2" />
+                        </Transitions>
+                    </Border.Transitions>
                     <Grid
-                        Grid.Row="0"
+                        ColumnDefinitions="*,*">
-                        Background="Transparent"
-                        ColumnDefinitions="Auto, *">
-                        <Grid
-                            Grid.Column="0"
-                            Grid.ColumnSpan="2"
-                            TemplatedControl.IsTemplateFocusTarget="True" />
-                        <Border
-                            Name="SwitchBackgroundBorder"
-                            Grid.Column="0"
-                            Width="40"
-                            Height="20"
-                            CornerRadius="100">
-                            <Border.Transitions>
-                                <Transitions>
-                                    <BrushTransition Property="Background" Duration="0:0:0.2" />
-                                </Transitions>
-                            </Border.Transitions>
-                        </Border>
                         <Canvas
                             x:Name="PART_SwitchKnob"
                             Grid.Column="0"
-                            Width="20"
+                            Grid.ColumnSpan="2"
-                            Height="20"
+                            Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
+                            Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
                             HorizontalAlignment="Left">
                             <Grid
                                 x:Name="PART_MovingKnobs"
-                                Width="20"
+                                Width="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
-                                Height="20">
+                                Height="{DynamicResource ToggleSwitchIndicatorDefaultWidth}"
+                                Margin="{DynamicResource ToggleSwitchIndicatorDefaultMargin}">
                                 <Border
                                     x:Name="SwitchKnobIndicator"
-                                    Width="14"
-                                    Height="14"
                                     Background="White"
-                                    BorderBrush="{DynamicResource ToggleSwitchIndicatorBorderBrush}"
-                                    BorderThickness="0.5"
                                     BoxShadow="0 0 1 1 #222E3238"
                                     CornerRadius="100" />
+                                <Arc
+                                    x:Name="SwitchKnobLoadingIndicator"
+                                    IsVisible="False"
+                                    StrokeThickness="2"
+                                    StartAngle="0"
+                                    SweepAngle="140"
+                                    StrokeJoin="Round"
+                                    StrokeLineCap="Round">
+                                    <Arc.Stroke>
+                                        <ConicGradientBrush>
+                                            <GradientStops>
+                                                <GradientStop Offset="0.1" Color="Transparent" />
+                                                <GradientStop Offset="0.7" Color="White" />
+                                            </GradientStops>
+                                        </ConicGradientBrush>
+                                    </Arc.Stroke>
+                                    <Arc.Styles>
+                                        <Style Selector="Arc[IsVisible=True]">
+                                            <Style.Animations>
+                                                <Animation IterationCount="Infinite" Duration="0:0:0.6">
+                                                    <KeyFrame Cue="0%">
+                                                        <Setter Property="RotateTransform.Angle" Value="0.0" />
+                                                    </KeyFrame>
+                                                    <KeyFrame Cue="100%">
+                                                        <Setter Property="RotateTransform.Angle" Value="360.0" />
+                                                    </KeyFrame>
+                                                </Animation>
+                                            </Style.Animations>
+                                        </Style>
+                                    </Arc.Styles>
+                                </Arc>
                             </Grid>
                         </Canvas>
+                        <ContentPresenter
+                            x:Name="PART_OnContentPresenter"
+                            Grid.Column="0"
+                            VerticalAlignment="Center"
+                            HorizontalAlignment="Center"
+                            FontSize="{TemplateBinding FontSize}"
+                            Foreground="{TemplateBinding Foreground}"
+                            Content="{TemplateBinding OnContent}"
+                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
+                        <ContentPresenter
+                            x:Name="PART_OffContentPresenter"
+                            Grid.Column="1"
+                            VerticalAlignment="Center"
+                            HorizontalAlignment="Center"
+                            FontSize="{TemplateBinding FontSize}"
+                            Foreground="{TemplateBinding Foreground}"
+                            Content="{TemplateBinding OffContent}"
+                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
                     </Grid>
-                </Grid>
+                </Border>
             </ControlTemplate>
         </Setter>
+        <Style Selector="^:unchecked">
+            <Setter Property="Foreground" Value="{DynamicResource SimpleToggleSwitchContainerUnCheckedForeground}" />
+        </Style>
+        <Style Selector="^:checked">
+            <Setter Property="Foreground" Value="{DynamicResource SimpleToggleSwitchContainerCheckedForeground}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Style Selector="^ /template/ ContentPresenter#PART_OnContentPresenter">
+                <Setter Property="IsVisible" Value="False" />
+            </Style>
+            <Style Selector="^ /template/ ContentPresenter#PART_OffContentPresenter">
+                <Setter Property="IsVisible" Value="False" />
+            </Style>
+        </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/UserControl.axaml

@@ -0,0 +1,23 @@
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
+    <!--  Add Resources Here  -->
+    <ControlTheme x:Key="{x:Type UserControl}" TargetType="UserControl">
+        <Setter Property="Template">
+            <ControlTemplate TargetType="UserControl">
+                <ContentPresenter
+                    Name="PART_ContentPresenter"
+                    Padding="{TemplateBinding Padding}"
+                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    Content="{TemplateBinding Content}"
+                    ContentTemplate="{TemplateBinding ContentTemplate}"
+                    CornerRadius="{TemplateBinding CornerRadius}" />
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Semi.Avalonia/Controls/_index.axaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
-    x:CompileBindings="True"
     xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ResourceDictionary.MergedDictionaries>
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/AdornerLayer.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/AutoCompleteBox.axaml" />
@@ -14,6 +14,7 @@
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/Carousel.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/CheckBox.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/ComboBox.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia/Controls/ContentControl.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/ContextMenu.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/DataValidationErrors.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/DatePicker.axaml" />
@@ -24,7 +25,6 @@
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/FlyoutPresenter.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/GridSplitter.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/HeaderedContentControl.axaml" />
-        <ResourceInclude Source="avares://Semi.Avalonia/Controls/HyperlinkButton.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/ItemsControl.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/Label.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/ListBox.axaml" />
@@ -57,6 +57,7 @@
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/Tooltip.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/TransitioningContentControl.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/TreeView.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia/Controls/UserControl.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/Window.axaml" />
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/WindowNotificationManager.axaml" />
     </ResourceDictionary.MergedDictionaries>