Sync 45 new icons from Semi Design commit ba384587 (#761)

* Initial plan

* Sync 45 new icons from Semi Design commit ba384587

Co-authored-by: zdpcdt <54255897+zdpcdt@users.noreply.github.com>

* fix: correct geometry paths for Semi icons.

* fix: update EyeClosedSolidStroked & IconHornStroked paths for Semi icons in StrokedIcons.axaml.

* fix: resolve copilot review.

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: zdpcdt <54255897+zdpcdt@users.noreply.github.com>

.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/net8.0-browser/publish/wwwroot
+  OUTPUT_PATH: demo/Semi.Avalonia.Demo.Web/bin/Release/net10.0-browser/publish/wwwroot
 on:
   workflow_dispatch:
 
@@ -11,12 +11,13 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4.1.1
+        uses: actions/checkout@v5
 
-      - name: Setup .NET 8
+      - name: Setup dotnet
-        uses: actions/setup-dotnet@v4
+        uses: actions/setup-dotnet@v5
         with:
-          dotnet-version: 8.0.x
+          dotnet-version: |
+            10.0.x
 
       - name: Install wasm-tools
         run: dotnet workload install wasm-tools

.github/workflows/pack-nightly.yml

@@ -10,23 +10,19 @@ on:
         type: string
       Semi_Avalonia:
         description: 'Pack Semi.Avalonia'
-        required: true
+        default: true
-        default: 'true'
         type: boolean
       Semi_Avalonia_ColorPicker:
         description: 'Pack Semi.Avalonia.ColorPicker'
-        required: true
+        default: true
-        default: 'true'
         type: boolean
       Semi_Avalonia_DataGrid:
         description: 'Pack Semi.Avalonia.DataGrid'
-        required: true
+        default: false
-        default: 'false'
         type: boolean
       Semi_Avalonia_TreeDataGrid:
         description: 'Pack Semi.Avalonia.TreeDataGrid'
-        required: true
+        default: false
-        default: 'false'
         type: boolean
 
 jobs:
@@ -35,28 +31,28 @@ jobs:
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v4.1.1
+        uses: actions/checkout@v5
 
       - name: Get Version
         run: |
           VERSION_TIMESTAMP=$(date +'%Y%m%d%H%M%S')
-          VERSION="${{ github.event.inputs.Version_Prefix }}-nightly-${VERSION_TIMESTAMP}"
+          VERSION="${{ inputs.Version_Prefix }}-nightly-${VERSION_TIMESTAMP}"
           echo "VERSION=$VERSION" >> $GITHUB_ENV
 
       - name: Pack Semi.Avalonia
-        if: ${{ github.event.inputs.Semi_Avalonia == 'true' }}
+        if: ${{ inputs.Semi_Avalonia }}
         run: dotnet pack src/Semi.Avalonia -o nugets /p:Version=${{ env.VERSION }}
 
       - name: Pack Semi.Avalonia.ColorPicker
-        if: ${{ github.event.inputs.Semi_Avalonia_ColorPicker == 'true' }}
+        if: ${{ inputs.Semi_Avalonia_ColorPicker }}
         run: dotnet pack src/Semi.Avalonia.ColorPicker -o nugets /p:Version=${{ env.VERSION }}
 
       - name: Pack Semi.Avalonia.DataGrid
-        if: ${{ github.event.inputs.Semi_Avalonia_DataGrid == 'true' }}
+        if: ${{ inputs.Semi_Avalonia_DataGrid }}
         run: dotnet pack src/Semi.Avalonia.DataGrid -o nugets /p:Version=${{ env.VERSION }}
 
       - name: Pack Semi.Avalonia.TreeDataGrid
-        if: ${{ github.event.inputs.Semi_Avalonia_TreeDataGrid == 'true' }}
+        if: ${{ inputs.Semi_Avalonia_TreeDataGrid }}
         run: dotnet pack src/Semi.Avalonia.TreeDataGrid -o nugets /p:Version=${{ env.VERSION }}
 
       - name: Add NuGet Source
@@ -66,7 +62,7 @@ jobs:
         run: dotnet nuget push "nugets/*.nupkg" --api-key ${{ secrets.IRIHI_NUGET_API_KEY }} --source irihi.tech --skip-duplicate
 
       - name: Upload a Build Artifact
-        uses: actions/upload-artifact@v4.3.1
+        uses: actions/upload-artifact@v4.6.2
         with:
           name: nugets
           path: nugets

.github/workflows/pack.yml

@@ -3,26 +3,43 @@ name: Pack to NuGet
 on:
   workflow_dispatch:
     inputs:
+      Upload_to_NuGet:
+        description: 'Upload to NuGet'
+        default: true
+        type: boolean
       Semi_Avalonia:
         description: 'Pack Semi.Avalonia'
-        required: true
+        default: true
-        default: 'true'
         type: boolean
       Semi_Avalonia_ColorPicker:
         description: 'Pack Semi.Avalonia.ColorPicker'
-        required: true
+        default: true
-        default: 'true'
         type: boolean
       Semi_Avalonia_DataGrid:
         description: 'Pack Semi.Avalonia.DataGrid'
-        required: true
+        default: false
-        default: 'false'
         type: boolean
       Semi_Avalonia_TreeDataGrid:
         description: 'Pack Semi.Avalonia.TreeDataGrid'
-        required: true
+        default: false
-        default: 'false'
         type: boolean
+  workflow_call:
+    inputs:
+      Upload_to_NuGet:
+        type: boolean
+        default: false
+      Semi_Avalonia:
+        type: boolean
+        default: true
+      Semi_Avalonia_ColorPicker:
+        type: boolean
+        default: true
+      Semi_Avalonia_DataGrid:
+        type: boolean
+        default: true
+      Semi_Avalonia_TreeDataGrid:
+        type: boolean
+        default: true
 
 jobs:
   Pack_to_NuGet:
@@ -30,29 +47,30 @@ jobs:
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v4.1.1
+        uses: actions/checkout@v5
 
       - name: Pack Semi.Avalonia
-        if: ${{ github.event.inputs.Semi_Avalonia == 'true' }}
+        if: ${{ inputs.Semi_Avalonia }}
         run: dotnet pack src/Semi.Avalonia -o nugets
 
       - name: Pack Semi.Avalonia.ColorPicker
-        if: ${{ github.event.inputs.Semi_Avalonia_ColorPicker == 'true' }}
+        if: ${{ inputs.Semi_Avalonia_ColorPicker }}
         run: dotnet pack src/Semi.Avalonia.ColorPicker -o nugets
 
       - name: Pack Semi.Avalonia.DataGrid
-        if: ${{ github.event.inputs.Semi_Avalonia_DataGrid == 'true' }}
+        if: ${{ inputs.Semi_Avalonia_DataGrid }}
         run: dotnet pack src/Semi.Avalonia.DataGrid -o nugets
 
       - name: Pack Semi.Avalonia.TreeDataGrid
-        if: ${{ github.event.inputs.Semi_Avalonia_TreeDataGrid == 'true' }}
+        if: ${{ inputs.Semi_Avalonia_TreeDataGrid }}
         run: dotnet pack src/Semi.Avalonia.TreeDataGrid -o nugets
 
-      - name: Publish NuGet package
+      - name: Upload to NuGet
+        if: ${{ inputs.Upload_to_NuGet }}
         run: dotnet nuget push "nugets/*.nupkg" --api-key ${{ secrets.NUGET_ORG_API_KEY }} --source https://api.nuget.org/v3/index.json --skip-duplicate
 
       - name: Upload a Build Artifact
-        uses: actions/upload-artifact@v4.3.1
+        uses: actions/upload-artifact@v4.6.2
         with:
           name: nugets
           path: nugets

.github/workflows/publish.yml

@@ -3,130 +3,223 @@ name: Publish Demo
 on:
   workflow_dispatch:
     inputs:
-      platform:
+      win-x64:
-        description: 'Platform to publish'
-        required: true
-        default: 'all'
-        type: choice
-        options:
-          - 'windows'
-          - 'linux'
-          - 'android'
-          - 'all'
-      win64:
         description: 'Windows x64'
-        required: true
+        default: false
-        default: true
         type: boolean
-      win64_aot:
+      win-x64-aot:
         description: 'Windows x64 AOT'
-        required: true
+        default: false
-        default: true
         type: boolean
-      linux64:
+      linux-x64:
         description: 'Linux x64'
-        required: true
+        default: false
-        default: true
         type: boolean
-      linux64_drm:
+      linux-x64-aot:
-        description: 'Linux x64 DRM'
+        description: 'Linux x64 AOT'
-        required: true
+        default: false
-        default: true
         type: boolean
+      drm-linux-x64:
+        description: 'DRM Linux x64'
+        default: false
+        type: boolean
+      drm-linux-x64-aot:
+        description: 'DRM Linux x64 AOT'
+        default: false
+        type: boolean
+      osx-arm64:
+        description: 'macOS arm64'
+        default: false
+        type: boolean
+      osx-arm64-aot:
+        description: 'macOS arm64 AOT'
+        default: false
+        type: boolean
+      android-arm64:
+        description: 'Android arm64'
+        default: false
+        type: boolean
+  workflow_call:
+    inputs:
+      win-x64:
+        type: boolean
+        default: true
+      win-x64-aot:
+        type: boolean
+        default: true
+      linux-x64:
+        type: boolean
+        default: true
+      linux-x64-aot:
+        type: boolean
+        default: true
+      drm-linux-x64:
+        type: boolean
+        default: true
+      drm-linux-x64-aot:
+        type: boolean
+        default: true
+      osx-arm64:
+        type: boolean
+        default: true
+      osx-arm64-aot:
+        type: boolean
+        default: true
+      android-arm64:
+        type: boolean
+        default: true
 
 jobs:
-  windows:
+  win-x64:
-    if: ${{ github.event.inputs.platform == 'windows' || github.event.inputs.platform == 'all' }}
+    if: ${{inputs.win-x64}}
     runs-on: windows-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4.1.1
+        uses: actions/checkout@v5
-
-      - name: Make upload directory
-        run: mkdir upload
-
       - name: Publish win-x64
-        if: ${{ github.event.inputs.win64 == 'true' }}
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release -o publish --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release -o publish/win64 --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-
-      - name: Zip win-x64
-        if: ${{ github.event.inputs.win64 == 'true' }}
-        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
-        if: ${{ github.event.inputs.win64_aot == 'true' }}
-        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
-        if: ${{ github.event.inputs.win64_aot == 'true' }}
-        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release -o publish/win64-aot
-
-      - name: Zip win-x64 AOT
-        if: ${{ github.event.inputs.win64_aot == 'true' }}
-        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
+        uses: actions/upload-artifact@v4.6.2
         with:
-          name: windows
+          name: Semi.Avalonia.Demo.Desktop.win-x64
-          path: upload
+          path: |
+            publish
+            !publish/*.pdb
 
-  linux:
+  win-x64-aot:
-    if: ${{ github.event.inputs.platform == 'linux' || github.event.inputs.platform == 'all' }}
+    if: ${{inputs.win-x64-aot}}
+    runs-on: windows-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - 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
+      - name: Publish win-x64 AOT
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release -o publish
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.6.2
+        with:
+          name: Semi.Avalonia.Demo.Desktop.win-x64.NativeAOT
+          path: |
+            publish
+            !publish/*.pdb
+
+  linux-x64:
+    if: ${{inputs.linux-x64}}
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4.1.1
+        uses: actions/checkout@v5
-
-      - name: Make upload directory
-        run: mkdir upload
-
       - name: Publish linux-x64
-        if: ${{ github.event.inputs.linux64 == 'true' }}
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r linux-x64 -c Release -o publish --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r linux-x64 -c Release -o publish/linux64 --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-
-      - name: Zip linux-x64
-        if: ${{ github.event.inputs.linux64 == 'true' }}
-        run: zip -j -r upload/Semi.Avalonia.Demo.Desktop.linux-x64.zip publish/linux64 -x "*.pdb"
-
-      - name: Publish linux-x64 DRM
-        if: ${{ github.event.inputs.linux64_drm == 'true' }}
-        run: dotnet publish demo/Semi.Avalonia.Demo.Drm -r linux-x64 -c Release -o publish/drm --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-
-      - name: Zip linux-x64 DRM
-        if: ${{ github.event.inputs.linux64_drm == 'true' }}
-        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
+        uses: actions/upload-artifact@v4.6.2
         with:
-          name: linux
+          name: Semi.Avalonia.Demo.Desktop.linux-x64
-          path: upload
+          path: |
+            publish
+            !publish/*.pdb
 
-  android:
+  linux-x64-aot:
-    if: ${{ github.event.inputs.platform == 'android' || github.event.inputs.platform == 'all' }}
+    if: ${{inputs.linux-x64-aot}}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - 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
+      - name: Publish linux-x64 AOT
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r linux-x64 -c Release -o publish
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.6.2
+        with:
+          name: Semi.Avalonia.Demo.Desktop.linux-x64.NativeAOT
+          path: |
+            publish
+            !publish/*.pdb
+
+  drm-linux-x64:
+    if: ${{inputs.drm-linux-x64}}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - name: Publish linux-x64 DRM
+        run: dotnet publish demo/Semi.Avalonia.Demo.Drm -r linux-x64 -c Release -o publish --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.6.2
+        with:
+          name: Semi.Avalonia.Demo.Drm.linux-x64
+          path: |
+            publish
+            !publish/*.pdb
+
+  drm-linux-x64-aot:
+    if: ${{inputs.drm-linux-x64-aot}}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - name: Enable Native AOT in .csproj
+        run: sed -i 's#<!--<PublishAot>true</PublishAot>-->#<PublishAot>true</PublishAot>#' demo/Semi.Avalonia.Demo.Drm/Semi.Avalonia.Demo.Drm.csproj
+      - name: Publish linux-x64 AOT
+        run: dotnet publish demo/Semi.Avalonia.Demo.Drm -r linux-x64 -c Release -o publish
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.6.2
+        with:
+          name: Semi.Avalonia.Demo.Drm.linux-x64.NativeAOT
+          path: |
+            publish
+            !publish/*.pdb
+
+  osx-arm64:
+    if: ${{inputs.osx-arm64}}
+    runs-on: macos-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - name: Publish osx-arm64
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r osx-arm64 -c Release -o publish --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.6.2
+        with:
+          name: Semi.Avalonia.Demo.Desktop.osx-arm64
+          path: |
+            publish
+            !publish/*.pdb
+
+  osx-arm64-aot:
+    if: ${{inputs.osx-arm64-aot}}
+    runs-on: macos-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - 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
+      - name: Publish osx-arm64 AOT
+        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r osx-arm64 -c Release -o publish
+      - name: Upload a Build Artifact
+        uses: actions/upload-artifact@v4.6.2
+        with:
+          name: Semi.Avalonia.Demo.Desktop.osx-arm64.NativeAOT
+          path: |
+            publish
+            !publish/*.pdb
+
+  android-arm64:
+    if: ${{inputs.android-arm64 }}
     runs-on: windows-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4.1.1
+        uses: actions/checkout@v5
-
+      - name: Install Android workload
-      - name: CD Android
+        run: dotnet workload install android
-        run: cd demo/Semi.Avalonia.Demo.Android
-
       - name: Restore Dependencies
-        run: dotnet restore
+        run: dotnet restore demo/Semi.Avalonia.Demo.Android
-
       - name: Publish Android
-        run: dotnet publish demo/Semi.Avalonia.Demo.Android -c Release -f net8.0-android --no-restore -o publish -p:RuntimeIdentifier=android-arm64
+        run: dotnet publish demo/Semi.Avalonia.Demo.Android -c Release -f net10.0-android --no-restore -o publish /p:RuntimeIdentifier=android-arm64
-
       - name: Upload a Build Artifact
-        uses: actions/upload-artifact@v4.3.1
+        uses: actions/upload-artifact@v4.6.2
         with:
-          name: android
+          name: android-arm64
           path: publish/*Signed.apk

.github/workflows/release-tag.yml

@@ -1,146 +1,73 @@
 name: Release Tag
 
 on:
-  push:
-    tags:
-      - "v[0-9]+.[0-9]+.[0-9]+.[0-9]+"
   workflow_dispatch:
+    inputs:
+      Upload_to_NuGet:
+        description: 'Upload to NuGet'
+        default: false
+        type: boolean
+      Semi_Avalonia:
+        description: 'Pack Semi.Avalonia'
+        default: true
+        type: boolean
+      Semi_Avalonia_ColorPicker:
+        description: 'Pack Semi.Avalonia.ColorPicker'
+        default: true
+        type: boolean
+      Semi_Avalonia_DataGrid:
+        description: 'Pack Semi.Avalonia.DataGrid'
+        default: false
+        type: boolean
+      Semi_Avalonia_TreeDataGrid:
+        description: 'Pack Semi.Avalonia.TreeDataGrid'
+        default: false
+        type: boolean
 
 jobs:
-  pack:
+  nuget:
-    runs-on: ubuntu-latest
+    uses: ./.github/workflows/pack.yml
+    with:
+      Upload_to_NuGet: ${{ inputs.Upload_to_NuGet }}
+      Semi_Avalonia: ${{ inputs.Semi_Avalonia }}
+      Semi_Avalonia_ColorPicker: ${{ inputs.Semi_Avalonia_ColorPicker }}
+      Semi_Avalonia_DataGrid: ${{ inputs.Semi_Avalonia_DataGrid }}
+      Semi_Avalonia_TreeDataGrid: ${{ inputs.Semi_Avalonia_TreeDataGrid }}
 
-    steps:
+  publish:
-      - name: Checkout
+    uses: ./.github/workflows/publish.yml
-        uses: actions/checkout@v4
-
-      - name: Pack Semi.Avalonia
-        run: dotnet pack src/Semi.Avalonia -o nugets
-
-      - name: Pack Semi.Avalonia.ColorPicker
-        run: dotnet pack src/Semi.Avalonia.ColorPicker -o nugets
-
-      - name: Upload a Build Artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: nugets
-          path: nugets
-
-  publish-windows:
-    runs-on: windows-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-
-      - name: Make upload directory
-        run: mkdir upload
-
-      - name: Publish win-x64
-        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r win-x64 -c Release -o publish/win64 --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-
-      - 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
-        with:
-          name: windows
-          path: upload
-
-  publish-linux:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-
-      - name: Make upload directory
-        run: mkdir upload
-
-      - name: Publish linux-x64
-        run: dotnet publish demo/Semi.Avalonia.Demo.Desktop -r linux-x64 -c Release -o publish/linux64 --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-
-      - 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 -o publish/drm --sc /p:PublishSingleFile=true /p:IncludeNativeLibrariesForSelfExtract=true
-
-      - 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
-        with:
-          name: linux
-          path: upload
-
-  publish-android:
-    runs-on: windows-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-
-      - 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 -p:RuntimeIdentifier=android-arm64
-
-      - name: Upload a Build Artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: android
-          path: publish/*Signed.apk
 
   draft-release:
-    needs: [ pack, publish-windows, publish-linux, publish-android ]
+    needs: [ nuget,publish ]
     runs-on: ubuntu-latest
     steps:
-      - name: Download nugets Artifacts
+      - uses: actions/download-artifact@v4.3.0
-        uses: actions/download-artifact@v4
-        with:
-          name: nugets
 
-      - name: Download windows Artifacts
+      - name: Display structure of downloaded files
-        uses: actions/download-artifact@v4
+        run: ls -R
-        with:
-          name: windows
 
-      - name: Download linux Artifacts
+      - name: Zip artifacts
-        uses: actions/download-artifact@v4
+        run: |
-        with:
+          zip -rj Semi.Avalonia.Demo.Desktop.win-x64.zip Semi.Avalonia.Demo.Desktop.win-x64
-          name: linux
+          zip -rj Semi.Avalonia.Demo.Desktop.win-x64.NativeAOT.zip Semi.Avalonia.Demo.Desktop.win-x64.NativeAOT
+          zip -rj Semi.Avalonia.Demo.Desktop.linux-x64.zip Semi.Avalonia.Demo.Desktop.linux-x64
+          zip -rj Semi.Avalonia.Demo.Desktop.linux-x64.NativeAOT.zip Semi.Avalonia.Demo.Desktop.linux-x64.NativeAOT
+          zip -rj Semi.Avalonia.Demo.Drm.linux-x64.zip Semi.Avalonia.Demo.Drm.linux-x64
+          zip -rj Semi.Avalonia.Demo.Drm.linux-x64.NativeAOT.zip Semi.Avalonia.Demo.Drm.linux-x64.NativeAOT
+          zip -rj Semi.Avalonia.Demo.Desktop.osx-arm64.zip Semi.Avalonia.Demo.Desktop.osx-arm64
+          cd Semi.Avalonia.Demo.Desktop.osx-arm64.NativeAOT
+          zip -r ../Semi.Avalonia.Demo.Desktop.osx-arm64.NativeAOT.zip .
 
-      - name: Download android Artifacts
+      - name: Display structure of zipped files
-        uses: actions/download-artifact@v4
+        run: ls -R
-        with:
-          name: android
 
       - name: Release
-        uses: softprops/action-gh-release@v2
+        uses: softprops/action-gh-release@v2.3.2
         if: startsWith(github.ref, 'refs/tags/') || github.event_name == 'workflow_dispatch'
         with:
           generate_release_notes: true
           draft: true
           files: |
-            *.nupkg
+            nugets/*.nupkg
-            *.zip
+            android-arm64/*.apk
-            *.apk
+            *.zip

README.md

@@ -38,12 +38,15 @@ Include Semi Design Styles in application:
 
 That's all.
 
-ColorPicker, DataGrid and TreeDataGrid are distributed in separated packages. Please install if you need.
+ColorPicker, DataGrid, TreeDataGrid, Dock, Tabalonia and AvaloniaEdit are distributed in separated packages. Please install if you need.
 
 ```bash
 dotnet add package Semi.Avalonia.ColorPicker
 dotnet add package Semi.Avalonia.DataGrid
 dotnet add package Semi.Avalonia.TreeDataGrid
+dotnet add package Semi.Avalonia.Dock
+dotnet add package Semi.Avalonia.Tabalonia
+dotnet add package Semi.Avalonia.AvaloniaEdit
 ```
 
 ```xaml
@@ -51,9 +54,14 @@ dotnet add package Semi.Avalonia.TreeDataGrid
     <semi:ColorPickerSemiTheme />
     <semi:DataGridSemiTheme />
     <semi:TreeDataGridSemiTheme />
+    <semi:DockSemiTheme />
+    <semi:TabaloniaSemiTheme />
+    <semi:AvaloniaEditSemiTheme />
 </Application.Styles>
 ```
 
+Notice: Dock, Tabalonia and AvaloniaEdit are delivered via nuget for free, but not open source. Please read the license and agree to continue use these packages. If you need source code, please contact us via email: [contact@irihi.tech](contact@irihi.tech)
+
 ## Demo
 
 You can always download demo executable to play around with Semi Avalonia Themes.
@@ -63,17 +71,16 @@ You can always download demo executable to play around with Semi Avalonia Themes
 
 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) 
+![FeiShu](./docs/community-support.png)
 
 ## Version compatibility
 
-| Semi Design Version | Avalonia Version |
+| Semi Avalonia Version | Avalonia Version |
-|:--------------------|:-----------------|
+|:----------------------|:-----------------|
-| 11.2.1              | >=11.2.1         |
+| 11.3.7                | >=11.3.7         |
-| 11.2.0              | 11.2.0           |
+| 11.2.1                | >=11.2.1         |
-| 11.1.0              | >=11.1.0         |
+| 11.2.0                | End of Life      |
-| 11.0.7              | >=11.0.7         |
+| 11.1.x                | End of Life      |
-| 11.0.1              | <=11.0.6         |
 
 ## Credits
 

README_CN.md

@@ -38,12 +38,15 @@ dotnet add package Semi.Avalonia
 
 这样就可以了。
 
-ColorPicker、DataGrid 和 TreeDataGrid 的样式单独分发，如果需要请安装并引用。
+ColorPicker、DataGrid、TreeDataGrid、Dock、Tabalonia 和 AvaloniaEdit 的样式单独分发，如果需要请安装并引用。
 
 ```bash
 dotnet add package Semi.Avalonia.ColorPicker
 dotnet add package Semi.Avalonia.DataGrid
 dotnet add package Semi.Avalonia.TreeDataGrid
+dotnet add package Semi.Avalonia.Dock
+dotnet add package Semi.Avalonia.Tabalonia
+dotnet add package Semi.Avalonia.AvaloniaEdit
 ```
 
 ```xaml
@@ -51,9 +54,14 @@ dotnet add package Semi.Avalonia.TreeDataGrid
     <semi:ColorPickerSemiTheme />
     <semi:DataGridSemiTheme />
     <semi:TreeDataGridSemiTheme />
+    <semi:DockSemiTheme />
+    <semi:TabaloniaSemiTheme />
+    <semi:AvaloniaEditSemiTheme />
 </Application.Styles>
 ```
 
+注意：Dock、Tabalonia 和 AvaloniaEdit 是通过 NuGet 免费分发的，但不是开源的。请阅读许可协议并同意后继续使用这些包。如果您需要源代码，请通过电子邮件联系我们：[contact@irihi.tech](contact@irihi.tech)
+
 ## 示例
 
 您可以从 Semi Avalonia 的 release 页下载并试用 Semi Avalonia 的展示应用。
@@ -67,13 +75,12 @@ dotnet add package Semi.Avalonia.TreeDataGrid
 
 ## 版本兼容性
 
-| Semi Design Version | Avalonia Version |
+| Semi Avalonia Version | Avalonia Version |
-|:--------------------|:-----------------|
+|:----------------------|:-----------------|
-| 11.2.1              | >=11.2.1         |
+| 11.3.7                | >=11.3.7         |
-| 11.2.0              | 11.2.0           |
+| 11.2.1                | >=11.2.1         |
-| 11.1.0              | >=11.1.0         |
+| 11.2.0                | End of Life      |
-| 11.0.7              | >=11.0.7         |
+| 11.1.x                | End of Life      |
-| 11.0.1              | <=11.0.6         |
 
 ## 致谢
 

Semi.Avalonia.sln

@@ -1,99 +0,0 @@
-
-Microsoft Visual Studio Solution File, Format Version 12.00
-# Visual Studio Version 17
-VisualStudioVersion = 17.3.32929.385
-MinimumVisualStudioVersion = 10.0.40219.1
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia", "src\Semi.Avalonia\Semi.Avalonia.csproj", "{90D0B063-BC64-40AB-A56C-AC11909CF410}"
-EndProject
-Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Files", "Solution Files", "{B1E6A7D4-0AFB-4D32-9969-5FBDAC0CFF3E}"
-	ProjectSection(SolutionItems) = preProject
-		demo\Directory.Build.props = demo\Directory.Build.props
-		demo\global.json = demo\global.json
-		src\Package.props = src\Package.props
-	EndProjectSection
-EndProject
-Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "GitHub Action", "GitHub Action", "{318534A1-1CC3-40FB-B4AE-736F94465232}"
-	ProjectSection(SolutionItems) = preProject
-		.github\workflows\deploy.yml = .github\workflows\deploy.yml
-		.github\workflows\pack.yml = .github\workflows\pack.yml
-		.github\workflows\pack-nightly.yml = .github\workflows\pack-nightly.yml
-		.github\workflows\publish.yml = .github\workflows\publish.yml
-		.github\workflows\release-tag.yml = .github\workflows\release-tag.yml
-	EndProjectSection
-EndProject
-Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Demo", "Demo", "{43091528-9509-43CB-A003-9C5C11E96DD6}"
-EndProject
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.Demo.Desktop", "demo\Semi.Avalonia.Demo.Desktop\Semi.Avalonia.Demo.Desktop.csproj", "{2ADCA724-2B6D-46EC-87F7-604D7918B89A}"
-EndProject
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.Demo.Web", "demo\Semi.Avalonia.Demo.Web\Semi.Avalonia.Demo.Web.csproj", "{69A2C77D-6DB7-4AE4-B179-D1F5CF5E2DF0}"
-EndProject
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.Demo", "demo\Semi.Avalonia.Demo\Semi.Avalonia.Demo.csproj", "{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0}"
-EndProject
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.DataGrid", "src\Semi.Avalonia.DataGrid\Semi.Avalonia.DataGrid.csproj", "{8A90C292-8761-4F70-8E1F-EFC097FEADB3}"
-EndProject
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.ColorPicker", "src\Semi.Avalonia.ColorPicker\Semi.Avalonia.ColorPicker.csproj", "{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}"
-EndProject
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Semi.Avalonia.Demo.Android", "demo\Semi.Avalonia.Demo.Android\Semi.Avalonia.Demo.Android.csproj", "{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}"
-EndProject
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Semi.Avalonia.Demo.Drm", "demo\Semi.Avalonia.Demo.Drm\Semi.Avalonia.Demo.Drm.csproj", "{86D93406-412A-4429-93B2-92AAD0407784}"
-EndProject
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Semi.Avalonia.TreeDataGrid", "src\Semi.Avalonia.TreeDataGrid\Semi.Avalonia.TreeDataGrid.csproj", "{398D2998-0835-41F5-99A3-608CAB8051E2}"
-EndProject
-Global
-	GlobalSection(SolutionConfigurationPlatforms) = preSolution
-		Debug|Any CPU = Debug|Any CPU
-		Release|Any CPU = Release|Any CPU
-	EndGlobalSection
-	GlobalSection(ProjectConfigurationPlatforms) = postSolution
-		{90D0B063-BC64-40AB-A56C-AC11909CF410}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{90D0B063-BC64-40AB-A56C-AC11909CF410}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{90D0B063-BC64-40AB-A56C-AC11909CF410}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{90D0B063-BC64-40AB-A56C-AC11909CF410}.Release|Any CPU.Build.0 = Release|Any CPU
-		{2ADCA724-2B6D-46EC-87F7-604D7918B89A}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{2ADCA724-2B6D-46EC-87F7-604D7918B89A}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{2ADCA724-2B6D-46EC-87F7-604D7918B89A}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{2ADCA724-2B6D-46EC-87F7-604D7918B89A}.Release|Any CPU.Build.0 = Release|Any CPU
-		{69A2C77D-6DB7-4AE4-B179-D1F5CF5E2DF0}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{69A2C77D-6DB7-4AE4-B179-D1F5CF5E2DF0}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{69A2C77D-6DB7-4AE4-B179-D1F5CF5E2DF0}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{69A2C77D-6DB7-4AE4-B179-D1F5CF5E2DF0}.Release|Any CPU.Build.0 = Release|Any CPU
-		{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0}.Release|Any CPU.Build.0 = Release|Any CPU
-		{8A90C292-8761-4F70-8E1F-EFC097FEADB3}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{8A90C292-8761-4F70-8E1F-EFC097FEADB3}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{8A90C292-8761-4F70-8E1F-EFC097FEADB3}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{8A90C292-8761-4F70-8E1F-EFC097FEADB3}.Release|Any CPU.Build.0 = Release|Any CPU
-		{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{0B64C2F2-FDCD-48E4-AB9D-7CCC63B006CA}.Release|Any CPU.Build.0 = Release|Any CPU
-		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Debug|Any CPU.Deploy.0 = Debug|Any CPU
-		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F}.Release|Any CPU.Build.0 = Release|Any CPU
-		{86D93406-412A-4429-93B2-92AAD0407784}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{86D93406-412A-4429-93B2-92AAD0407784}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{86D93406-412A-4429-93B2-92AAD0407784}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{86D93406-412A-4429-93B2-92AAD0407784}.Release|Any CPU.Build.0 = Release|Any CPU
-		{398D2998-0835-41F5-99A3-608CAB8051E2}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
-		{398D2998-0835-41F5-99A3-608CAB8051E2}.Debug|Any CPU.Build.0 = Debug|Any CPU
-		{398D2998-0835-41F5-99A3-608CAB8051E2}.Release|Any CPU.ActiveCfg = Release|Any CPU
-		{398D2998-0835-41F5-99A3-608CAB8051E2}.Release|Any CPU.Build.0 = Release|Any CPU
-	EndGlobalSection
-	GlobalSection(SolutionProperties) = preSolution
-		HideSolutionNode = FALSE
-	EndGlobalSection
-	GlobalSection(NestedProjects) = preSolution
-		{2ADCA724-2B6D-46EC-87F7-604D7918B89A} = {43091528-9509-43CB-A003-9C5C11E96DD6}
-		{69A2C77D-6DB7-4AE4-B179-D1F5CF5E2DF0} = {43091528-9509-43CB-A003-9C5C11E96DD6}
-		{D789AEDB-EBDF-4450-8E8E-B4A03FB257B0} = {43091528-9509-43CB-A003-9C5C11E96DD6}
-		{0C81FC1C-5D2D-478A-9876-923A0C85EC2F} = {43091528-9509-43CB-A003-9C5C11E96DD6}
-		{86D93406-412A-4429-93B2-92AAD0407784} = {43091528-9509-43CB-A003-9C5C11E96DD6}
-	EndGlobalSection
-	GlobalSection(ExtensibilityGlobals) = postSolution
-		SolutionGuid = {7CA41ED3-2CED-40CC-AA21-28C3B42B1E86}
-	EndGlobalSection
-EndGlobal

Semi.Avalonia.slnx

@@ -0,0 +1,28 @@
+<Solution>
+    <Folder Name="/Demo/">
+        <Project Path="demo/Semi.Avalonia.Demo.Android/Semi.Avalonia.Demo.Android.csproj"/>
+        <Project Path="demo/Semi.Avalonia.Demo.Desktop/Semi.Avalonia.Demo.Desktop.csproj"/>
+        <Project Path="demo/Semi.Avalonia.Demo.Drm/Semi.Avalonia.Demo.Drm.csproj"/>
+        <Project Path="demo/Semi.Avalonia.Demo.Web/Semi.Avalonia.Demo.Web.csproj"/>
+        <Project Path="demo/Semi.Avalonia.Demo/Semi.Avalonia.Demo.csproj"/>
+    </Folder>
+    <Folder Name="/GitHub Action/">
+        <File Path=".github/workflows/deploy.yml"/>
+        <File Path=".github/workflows/pack-nightly.yml"/>
+        <File Path=".github/workflows/pack.yml"/>
+        <File Path=".github/workflows/publish.yml"/>
+        <File Path=".github/workflows/release-tag.yml"/>
+    </Folder>
+    <Folder Name="/Solution Items/Demo/">
+        <File Path="demo/Directory.Packages.props"/>
+        <File Path="demo/global.json"/>
+    </Folder>
+    <Folder Name="/Solution Items/Package/">
+        <File Path="src/Directory.Packages.props"/>
+        <File Path="src/Directory.Build.props"/>
+    </Folder>
+    <Project Path="src/Semi.Avalonia.ColorPicker/Semi.Avalonia.ColorPicker.csproj"/>
+    <Project Path="src/Semi.Avalonia.DataGrid/Semi.Avalonia.DataGrid.csproj"/>
+    <Project Path="src/Semi.Avalonia.TreeDataGrid/Semi.Avalonia.TreeDataGrid.csproj"/>
+    <Project Path="src/Semi.Avalonia/Semi.Avalonia.csproj"/>
+</Solution>

demo/Directory.Build.props

@@ -1,7 +0,0 @@
-<Project>
-    <PropertyGroup>
-        <AvaloniaVersion>11.3.0</AvaloniaVersion>
-        <DataGridVersion>11.3.0</DataGridVersion>
-        <CommunityToolkitVersion>8.4.0</CommunityToolkitVersion>
-    </PropertyGroup>
-</Project>

demo/Directory.Packages.props

@@ -0,0 +1,27 @@
+<Project>
+    <PropertyGroup>
+        <ManagePackageVersionsCentrally>true</ManagePackageVersionsCentrally>
+        <AvaloniaVersion>11.3.11</AvaloniaVersion>
+        <DataGridVersion>11.3.11</DataGridVersion>
+        <SkiaSharpVersion>3.119.1</SkiaSharpVersion>
+    </PropertyGroup>
+    <ItemGroup>
+        <PackageVersion Include="Avalonia" Version="$(AvaloniaVersion)"/>
+        <PackageVersion Include="Avalonia.Diagnostics" Version="$(AvaloniaVersion)" />
+        <PackageVersion Include="Avalonia.Desktop" Version="$(AvaloniaVersion)" />
+        <PackageVersion Include="Avalonia.LinuxFramebuffer" Version="$(AvaloniaVersion)"/>
+        <PackageVersion Include="Avalonia.iOS" Version="$(AvaloniaVersion)" />
+        <PackageVersion Include="Avalonia.Browser" Version="$(AvaloniaVersion)" />
+        <PackageVersion Include="Avalonia.Android" Version="$(AvaloniaVersion)" />
+        <PackageVersion Include="Avalonia.Controls.ColorPicker" Version="$(AvaloniaVersion)"/>
+        <PackageVersion Include="Avalonia.Controls.DataGrid" Version="$(DataGridVersion)"/>
+
+        <PackageVersion Include="SkiaSharp" Version="$(SkiaSharpVersion)"/>
+        <PackageVersion Include="SkiaSharp.NativeAssets.WebAssembly" Version="$(SkiaSharpVersion)"/>
+
+        <PackageVersion Include="Xamarin.AndroidX.Core.SplashScreen" Version="1.2.0"/>
+
+        <PackageVersion Include="CommunityToolkit.Mvvm" Version="8.4.0"/>
+        <PackageVersion Include="Irihi.Avalonia.Shared" Version="0.3.1"/>
+    </ItemGroup>
+</Project>

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

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

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

@@ -1,5 +1,6 @@
 using Android.App;
 using Android.Content.PM;
+using Avalonia;
 using Avalonia.Android;
 
 namespace Semi.Avalonia.Demo.Android;
@@ -13,4 +14,9 @@ namespace Semi.Avalonia.Demo.Android;
     ConfigurationChanges = ConfigChanges.Orientation | ConfigChanges.ScreenSize | ConfigChanges.UiMode)]
 public class MainActivity : AvaloniaMainActivity<App>
 {
+    protected override AppBuilder CustomizeAppBuilder(AppBuilder builder)
+    {
+        return base.CustomizeAppBuilder(builder)
+            .WithSourceHanSansCNFont();
+    }
 }

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

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk">
     <PropertyGroup>
         <OutputType>Exe</OutputType>
-        <TargetFramework>net8.0-android</TargetFramework>
+        <TargetFramework>net10.0-android</TargetFramework>
         <SupportedOSPlatformVersion>21</SupportedOSPlatformVersion>
         <Nullable>enable</Nullable>
         <ApplicationId>com.irihitech.Semi.Avalonia</ApplicationId>
@@ -14,14 +14,13 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <AndroidResource Include="Icon.png">
+        <AndroidResource Include="Icon.png" Link="Resources\drawable\Icon.png"/>
-            <Link>Resources\drawable\Icon.png</Link>
+        <AvaloniaResource Include="..\Fonts\*" Link="Assets\Fonts\%(Filename)%(Extension)" />
-        </AndroidResource>
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Android" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia.Android"/>
-        <PackageReference Include="Xamarin.AndroidX.Core.SplashScreen" Version="1.0.1.1"/>
+        <PackageReference Include="Xamarin.AndroidX.Core.SplashScreen"/>
     </ItemGroup>
 
     <ItemGroup>

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

@@ -4,9 +4,9 @@
         <TargetFramework>net8.0</TargetFramework>
         <Nullable>enable</Nullable>
         <BuiltInComInteropSupport>true</BuiltInComInteropSupport>
+        <ApplicationIcon>..\Semi.Avalonia.Demo\Assets\irihi.ico</ApplicationIcon>
         <!-- Uncomment below to enable Native AOT compilation-->
         <!--<PublishAot>true</PublishAot>-->
-        <!--<IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>-->
     </PropertyGroup>
 
     <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
@@ -23,7 +23,7 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Desktop" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia.Desktop"/>
     </ItemGroup>
 
     <ItemGroup>

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

@@ -63,7 +63,7 @@ private static void SilenceConsole()
 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
+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

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

@@ -63,7 +63,7 @@ private static void SilenceConsole()
 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
+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文件中添加以下代码

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

@@ -4,9 +4,9 @@
         <TargetFramework>net8.0</TargetFramework>
         <Nullable>enable</Nullable>
         <BuiltInComInteropSupport>true</BuiltInComInteropSupport>
+        <ApplicationIcon>..\Semi.Avalonia.Demo\Assets\irihi.ico</ApplicationIcon>
         <!-- Uncomment below to enable Native AOT compilation-->
         <!--<PublishAot>true</PublishAot>-->
-        <!--<IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>-->
     </PropertyGroup>
 
     <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
@@ -23,8 +23,8 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Desktop" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia.Desktop"/>
-        <PackageReference Include="Avalonia.LinuxFramebuffer" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia.LinuxFramebuffer"/>
     </ItemGroup>
 
     <ItemGroup>

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

@@ -1,17 +1,19 @@
 <Project Sdk="Microsoft.NET.Sdk.WebAssembly">
     <PropertyGroup>
-        <TargetFramework>net8.0-browser</TargetFramework>
+        <TargetFramework>net10.0-browser</TargetFramework>
         <OutputType>Exe</OutputType>
         <AllowUnsafeBlocks>true</AllowUnsafeBlocks>
         <Nullable>enable</Nullable>
     </PropertyGroup>
 
     <ItemGroup>
-        <AvaloniaResource Include="Assets\**"/>
+        <AvaloniaResource Include="..\Fonts\*" Link="Assets\Fonts\%(Filename)%(Extension)" />
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Browser" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia.Browser"/>
+        <PackageReference Include="SkiaSharp"/>
+        <PackageReference Include="SkiaSharp.NativeAssets.WebAssembly"/>
     </ItemGroup>
 
     <ItemGroup>

demo/Semi.Avalonia.Demo/App.axaml

@@ -1,11 +1,11 @@
 <Application
+    Name="Semi Avalonia Demo"
     x:Class="Semi.Avalonia.Demo.App"
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    x:CompileBindings="True"
-    x:DataType="viewModels:ApplicationViewModel"
     xmlns:semi="https://irihi.tech/semi"
-    xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels">
+    xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels"
+    x:DataType="vm:ApplicationViewModel">
     <Application.Styles>
         <semi:SemiTheme Locale="zh-CN" />
         <semi:SemiPopupAnimations />
@@ -20,12 +20,30 @@
             </ResourceDictionary.MergedDictionaries>
         </ResourceDictionary>
     </Application.Resources>
+    <NativeMenu.Menu>
+        <NativeMenu>
+            <NativeMenuItem
+                Header="About Us"
+                Command="{Binding JumpToCommand}"
+                CommandParameter="{Binding $self.Header}" />
+        </NativeMenu>
+    </NativeMenu.Menu>
     <TrayIcon.Icons>
         <TrayIcons>
-            <TrayIcon Icon="/Assets/irihi.ico" MacOSProperties.IsTemplateIcon="true" ToolTipText="Semi Avalonia Demo">
+            <TrayIcon
+                Icon="{OnPlatform Default=/Assets/irihi.ico, macOS=/Assets/irihi2.ico}"
+                MacOSProperties.IsTemplateIcon="true"
+                Command="{Binding ActivateCommand}"
+                ToolTipText="Semi Avalonia Demo">
                 <TrayIcon.Menu>
                     <NativeMenu>
-                        <NativeMenuItem Header="Exit" Command="{Binding ExitCommand}" />
+                        <NativeMenuItem
+                            Header="About Us"
+                            Command="{Binding JumpToCommand}"
+                            CommandParameter="{Binding $self.Header}" />
+                        <NativeMenuItem
+                            Header="Exit"
+                            Command="{Binding ExitCommand}" />
                     </NativeMenu>
                 </TrayIcon.Menu>
             </TrayIcon>

demo/Semi.Avalonia.Demo/Constant/ColorTokens.cs

@@ -79,6 +79,32 @@ public static class ColorTokens
         new("SemiColorDangerLightActive", "Danger Light Active")
     ];
 
+    public static IReadOnlyList<Tuple<string, string>> AIGeneralTokens { get; } =
+    [
+        new("SemiColorAIGeneral", "AI General"),
+        new("SemiColorAIGeneralPointerover", "AI General Pointerover"),
+        new("SemiColorAIGeneralActive", "AI General Active"),
+        new("SemiColorAIGeneralDisabled", "AI General Disabled")
+    ];
+
+    public static IReadOnlyList<Tuple<string, string>> AIPurpleTokens { get; } =
+    [
+        new("SemiColorAIPurple", "AI Purple"),
+        new("SemiColorAIPurplePointerover", "AI Purple Pointerover"),
+        new("SemiColorAIPurpleActive", "AI Purple Active"),
+        new("SemiColorAIPurpleDisabled", "AI Purple Disabled")
+    ];
+
+    public static IReadOnlyList<Tuple<string, string>> AIBackgroundTokens { get; } =
+    [
+        new("SemiColorAIBackgroundBottom", "AI Bottom Background"),
+        new("SemiColorAIBackgroundBottomPointerover", "AI Bottom Background Pointerover"),
+        new("SemiColorAIBackgroundBottomActive", "AI Bottom Background Active"),
+        new("SemiColorAIBackgroundTop", "AI Top Background"),
+        new("SemiColorAIBackgroundTopPointerover", "AI Top Background Pointerover"),
+        new("SemiColorAIBackgroundTopActive", "AI Top Background Active"),
+    ];
+
     public static IReadOnlyList<Tuple<string, string>> TextTokens { get; } =
     [
         new("SemiColorText0", "Text 0"),

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

@@ -92,6 +92,12 @@ public class ColorDetailControl : TemplatedControl
             Hex2 = hex2 as string;
             OpacityNumber = brush.Opacity.ToString(CultureInfo.InvariantCulture);
         }
+        else
+        {
+            Hex = null;
+            Hex2 = null;
+            OpacityNumber = null;
+        }
     }
 
     public async Task Copy(object o)

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

@@ -8,7 +8,6 @@
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels"
     x:DataType="vm:AboutUsViewModel"
-    x:CompileBindings="True"
     d:DesignHeight="450"
     d:DesignWidth="800"
     mc:Ignorable="d">

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

@@ -7,7 +7,6 @@
     xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels"
     d:DesignHeight="450"
     d:DesignWidth="800"
-    x:CompileBindings="False"
     x:DataType="vm:AutoCompleteBoxDemoViewModel"
     mc:Ignorable="d">
     <Design.DataContext>
@@ -30,40 +29,40 @@
 
         <AutoCompleteBox
             Watermark="Please select a State"
-            ValueMemberBinding="{Binding Name}" />
+            ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
         <AutoCompleteBox
             Classes="Large"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
         <AutoCompleteBox
             Classes="Small"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
         <AutoCompleteBox
             Classes="Bordered"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
         <AutoCompleteBox
             IsEnabled="False"
             Watermark="Disabled"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
         <AutoCompleteBox
             InnerLeftContent="https://"
             InnerRightContent=".com"
-            ValueMemberBinding="{ReflectionBinding Name}" />
+            ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
 
         <StackPanel Orientation="Horizontal">
             <AutoCompleteBox
                 Width="100"
                 Classes="Large"
                 Watermark="Large"
-                ValueMemberBinding="{ReflectionBinding Name}" />
+                ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
             <AutoCompleteBox
                 Width="100"
                 Watermark="Default"
-                ValueMemberBinding="{ReflectionBinding Name}" />
+                ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
             <AutoCompleteBox
                 Width="100"
                 Classes="Small"
                 Watermark="Small"
-                ValueMemberBinding="{ReflectionBinding Name}" />
+                ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
         </StackPanel>
 
         <StackPanel Orientation="Horizontal">
@@ -71,17 +70,17 @@
                 Width="100"
                 IsEnabled="False"
                 Watermark="Disabled"
-                ValueMemberBinding="{ReflectionBinding Name}" />
+                ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
             <AutoCompleteBox
                 Width="100"
                 Classes="Bordered"
                 Watermark="Bordered"
-                ValueMemberBinding="{ReflectionBinding Name}" />
+                ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
             <AutoCompleteBox
                 Width="100"
                 Classes="Bordered"
                 IsEnabled="False"
-                ValueMemberBinding="{ReflectionBinding Name}" />
+                ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
         </StackPanel>
 
     </StackPanel>

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

@@ -6,174 +6,369 @@
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     mc:Ignorable="d">
     <ScrollViewer>
-        <StackPanel HorizontalAlignment="Left" Spacing="20">
+        <StackPanel HorizontalAlignment="Left" Spacing="8">
             <StackPanel.Styles>
-                <Style Selector="SplitButton">
+                <Style Selector="SplitButton,DropDownButton,ToggleSplitButton">
-                    <Setter Property="Flyout">
+                    <Setter Property="Button.Flyout">
-                        <MenuFlyout Placement="BottomEdgeAlignedRight">
+                        <MenuFlyout>
-                            <MenuItem Header="Submit All" />
-                            <MenuItem Header="Submit Updated" />
-                        </MenuFlyout>
-                    </Setter>
-                </Style>
-                <Style Selector="DropDownButton">
-                    <Setter Property="Flyout">
-                        <MenuFlyout Placement="BottomEdgeAlignedRight">
-                            <MenuItem Header="Submit All" />
-                            <MenuItem Header="Submit Updated" />
-                        </MenuFlyout>
-                    </Setter>
-                </Style>
-                <Style Selector="ToggleSplitButton">
-                    <Setter Property="Flyout">
-                        <MenuFlyout Placement="BottomEdgeAlignedRight">
                             <MenuItem Header="Submit All" />
                             <MenuItem Header="Submit Updated" />
                         </MenuFlyout>
                     </Setter>
                 </Style>
             </StackPanel.Styles>
+            <HeaderedContentControl
+                Theme="{StaticResource GroupBox}">
+                <HeaderedContentControl.Header>
+                    <StackPanel Spacing="8">
+                        <TextBlock Text="Button/RepeatButton Theme" />
+                        <WrapPanel ItemSpacing="4">
+                            <TextBlock Text="Theme:" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Light" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Solid" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Outline" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue Solid" Content="Borderless" />
+                        </WrapPanel>
+                        <WrapPanel ItemSpacing="4">
+                            <TextBlock Text="Classes:" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Primary" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Secondary" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Tertiary" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Success" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Warning" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Danger" />
+                        </WrapPanel>
+                    </StackPanel>
+                </HeaderedContentControl.Header>
+                <StackPanel HorizontalAlignment="Left" Spacing="16">
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <Button Content="Default" />
+                        <Button Content="Primary" Classes="Primary" />
+                        <Button Content="Secondary" Classes="Secondary" />
+                        <Button Content="Tertiary" Classes="Tertiary" />
+                        <Button Content="Success" Classes="Success" />
+                        <Button Content="Warning" Classes="Warning" />
+                        <Button Content="Danger" Classes="Danger" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <Button Content="Default" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Primary" Classes="Primary" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Secondary" Classes="Secondary" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Tertiary" Classes="Tertiary" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Success" Classes="Success" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Warning" Classes="Warning" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Danger" Classes="Danger" Theme="{StaticResource SolidButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <Button Content="Default" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Primary" Classes="Primary" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Secondary" Classes="Secondary" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Tertiary" Classes="Tertiary" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Success" Classes="Success" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Warning" Classes="Warning" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Danger" Classes="Danger" Theme="{StaticResource OutlineButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <Button Content="Default" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Primary" Classes="Primary" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Secondary" Classes="Secondary" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Tertiary" Classes="Tertiary" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Success" Classes="Success" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Warning" Classes="Warning" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Danger" Classes="Danger" Theme="{StaticResource BorderlessButton}" />
+                    </WrapPanel>
+                </StackPanel>
+            </HeaderedContentControl>
 
-            <TextBlock>Light (Default)</TextBlock>
+            <HeaderedContentControl
-            <StackPanel Orientation="Horizontal" Spacing="20">
+                Theme="{StaticResource GroupBox}"
-                <Button Classes="Primary">Primary</Button>
+                Header="Prohibited Status">
-                <Button Classes="Secondary">Secondary</Button>
+                <WrapPanel ItemSpacing="16" LineSpacing="16">
-                <Button Classes="Tertiary">Tertiary</Button>
+                    <Button Content="Light" IsEnabled="False" />
-                <Button Classes="Success">Success</Button>
+                    <Button Content="Solid" IsEnabled="False" Theme="{StaticResource SolidButton}" />
-                <Button Classes="Warning">Warning</Button>
+                    <Button Content="Outline" IsEnabled="False" Theme="{StaticResource OutlineButton}" />
-                <Button Classes="Danger">Danger</Button>
+                    <Button Content="Borderless" IsEnabled="False" Theme="{StaticResource BorderlessButton}" />
-                <Button Classes="Danger" IsEnabled="False">Disabled</Button>
+                </WrapPanel>
-            </StackPanel>
+            </HeaderedContentControl>
-            <TextBlock>Solid</TextBlock>
-            <StackPanel Orientation="Horizontal" Spacing="20">
-                <Button Classes="Primary" Theme="{DynamicResource SolidButton}">Primary</Button>
-                <Button Classes="Secondary" Theme="{DynamicResource SolidButton}">Secondary</Button>
-                <Button Classes="Tertiary" Theme="{DynamicResource SolidButton}">Tertiary</Button>
-                <Button Classes="Success" Theme="{DynamicResource SolidButton}">Success</Button>
-                <Button Classes="Warning" Theme="{DynamicResource SolidButton}">Warning</Button>
-                <Button Classes="Danger" Theme="{DynamicResource SolidButton}">Danger</Button>
-                <Button
-                    Classes="Danger"
-                    IsEnabled="False"
-                    Theme="{DynamicResource SolidButton}">
-                    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>
-                <Button Classes="Secondary" Theme="{DynamicResource BorderlessButton}">Secondary</Button>
-                <Button Classes="Tertiary" Theme="{DynamicResource BorderlessButton}">Tertiary</Button>
-                <Button Classes="Success" Theme="{DynamicResource BorderlessButton}">Success</Button>
-                <Button Classes="Warning" Theme="{DynamicResource BorderlessButton}">Warning</Button>
-                <Button Classes="Danger" Theme="{DynamicResource BorderlessButton}">Danger</Button>
-                <Button
-                    Classes="Danger"
-                    IsEnabled="False"
-                    Theme="{DynamicResource BorderlessButton}">
-                    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>
+            <HeaderedContentControl
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                Theme="{StaticResource GroupBox}">
-                <DropDownButton Content="Primary" />
+                <HeaderedContentControl.Header>
-                <DropDownButton Classes="Secondary" Content="Secondary" />
+                    <StackPanel Spacing="8">
-                <DropDownButton Classes="Tertiary" Content="Tertiary" />
+                        <WrapPanel ItemSpacing="4">
-                <DropDownButton Classes="Success" Content="Success" />
+                            <TextBlock Text="Size Classes:" />
-                <DropDownButton Classes="Warning" Content="Warning" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Large" />
-                <DropDownButton Classes="Danger" Content="Danger" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Blue" Content="Small" />
-                <DropDownButton
+                        </WrapPanel>
-                    Classes="Danger"
+                    </StackPanel>
-                    Content="Disabled"
+                </HeaderedContentControl.Header>
-                    IsEnabled="False" />
+                <WrapPanel ItemSpacing="16" LineSpacing="16">
-            </StackPanel>
+                    <Button Content="Large" Classes="Large" />
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                    <Button Content="Default" />
-                <DropDownButton Content="Default" Classes="Success" />
+                    <Button Content="Small" Classes="Small" />
-                <DropDownButton Content="Solid" Theme="{DynamicResource SolidDropDownButton}" Classes="Success" />
+                </WrapPanel>
-                <DropDownButton Content="Outline" Theme="{DynamicResource OutlineDropDownButton}" Classes="Success" />
+            </HeaderedContentControl>
-                <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">
-                <DropDownButton Classes="Small" Content="Small" />
-                <DropDownButton Content="Default" />
-                <DropDownButton Classes="Large" Content="Large" />
-            </StackPanel>
 
-            <TextBlock>SplitButton</TextBlock>
+            <HeaderedContentControl
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                Theme="{StaticResource GroupBox}">
-                <SplitButton Content="Primary" />
+                <HeaderedContentControl.Header>
-                <SplitButton Classes="Secondary" Content="Secondary" />
+                    <StackPanel Spacing="8">
-                <SplitButton Classes="Tertiary" Content="Tertiary" />
+                        <TextBlock Text="AI style - Colorful Button" />
-                <SplitButton Classes="Success" Content="Success" />
+                        <WrapPanel ItemSpacing="4">
-                <SplitButton Classes="Warning" Content="Warning" />
+                            <TextBlock Text="Theme:" />
-                <SplitButton Classes="Danger" Content="Danger" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Colorful Gradient Solid" Content="Light" />
-                <SplitButton Classes="Danger" Content="Disabled" IsEnabled="False" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Colorful Gradient Solid" Content="Solid" />
-            </StackPanel>
+                            <Label Theme="{StaticResource TagLabel}" Classes="Colorful Gradient Solid" Content="Outline" />
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                            <Label Theme="{StaticResource TagLabel}" Classes="Colorful Gradient Solid" Content="Borderless" />
-                <SplitButton Content="Default" Classes="Success" />
+                        </WrapPanel>
-                <SplitButton Content="Solid" Theme="{DynamicResource SolidSplitButton}" Classes="Success" />
+                        <WrapPanel ItemSpacing="4">
-                <SplitButton Content="Outline" Theme="{DynamicResource OutlineSplitButton}" Classes="Success" />
+                            <TextBlock Text="Classes:" />
-                <SplitButton Content="Borderless" Theme="{DynamicResource BorderlessSplitButton}" Classes="Success" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Colorful Gradient" Content="Colorful Primary" />
-                <SplitButton Content="Default" Classes="Success" IsEnabled="False" />
+                            <Label Theme="{StaticResource TagLabel}" Classes="Colorful Gradient" Content="Colorful Tertiary" />
-                <SplitButton Content="Solid" Theme="{DynamicResource SolidSplitButton}" Classes="Success" IsEnabled="False" />
+                        </WrapPanel>
-                <SplitButton Content="Outline" Theme="{DynamicResource OutlineSplitButton}" Classes="Success" IsEnabled="False" />
+                    </StackPanel>
-                <SplitButton Content="Borderless" Theme="{DynamicResource BorderlessSplitButton}" Classes="Success" IsEnabled="False" />
+                </HeaderedContentControl.Header>
-            </StackPanel>
+                <StackPanel HorizontalAlignment="Left" Spacing="16">
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
-                <SplitButton Classes="Small" Content="Small" />
+                        <Button Content="Primary" Classes="Colorful Primary" />
-                <SplitButton Content="Default" />
+                        <Button Content="Tertiary" Classes="Colorful Tertiary" />
-                <SplitButton Classes="Large" Content="Large" />
+                        <Button Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
-            </StackPanel>
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <Button Content="Primary" Classes="Colorful Primary" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource SolidButton}" />
+                        <Button Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource SolidButton}" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <Button Content="Primary" Classes="Colorful Primary" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource OutlineButton}" />
+                        <Button Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource OutlineButton}" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <Button Content="Primary" Classes="Colorful Primary" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource BorderlessButton}" />
+                        <Button Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource BorderlessButton}" IsEnabled="False" />
+                    </WrapPanel>
+                </StackPanel>
+            </HeaderedContentControl>
 
-            <TextBlock>ToggleSplitButton</TextBlock>
+            <HeaderedContentControl
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                Theme="{StaticResource GroupBox}" Header="DropDownButton">
-                <ToggleSplitButton Content="Primary" />
+                <StackPanel HorizontalAlignment="Left" Spacing="16">
-                <ToggleSplitButton Classes="Secondary" Content="Secondary" />
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
-                <ToggleSplitButton Classes="Tertiary" Content="Tertiary" />
+                        <DropDownButton Content="Default" />
-                <ToggleSplitButton Classes="Success" Content="Success" />
+                        <DropDownButton Content="Primary" Classes="Primary" />
-                <ToggleSplitButton Classes="Warning" Content="Warning" />
+                        <DropDownButton Content="Secondary" Classes="Secondary" />
-                <ToggleSplitButton Classes="Danger" Content="Danger" />
+                        <DropDownButton Content="Tertiary" Classes="Tertiary" />
-                <ToggleSplitButton Classes="Danger" Content="Disabled" IsEnabled="False" />
+                        <DropDownButton Content="Success" Classes="Success" />
-            </StackPanel>
+                        <DropDownButton Content="Warning" Classes="Warning" />
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                        <DropDownButton Content="Danger" Classes="Danger" />
-                <ToggleSplitButton Content="Default" Classes="Success" />
+                    </WrapPanel>
-                <ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True" />
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
-                <ToggleSplitButton Content="Default" Classes="Success" IsEnabled="False" />
+                        <DropDownButton Content="Default" Theme="{StaticResource SolidDropDownButton}" />
-                <ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True" IsEnabled="False" />
+                        <DropDownButton Content="Primary" Classes="Primary" Theme="{StaticResource SolidDropDownButton}" />
-            </StackPanel>
+                        <DropDownButton Content="Secondary" Classes="Secondary" Theme="{StaticResource SolidDropDownButton}" />
-            <StackPanel Orientation="Horizontal" Spacing="8">
+                        <DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource SolidDropDownButton}" />
-                <ToggleSplitButton Classes="Small" Content="Small" />
+                        <DropDownButton Content="Success" Classes="Success" Theme="{StaticResource SolidDropDownButton}" />
-                <ToggleSplitButton Content="Default" />
+                        <DropDownButton Content="Warning" Classes="Warning" Theme="{StaticResource SolidDropDownButton}" />
-                <ToggleSplitButton Classes="Large" Content="Large" />
+                        <DropDownButton Content="Danger" Classes="Danger" Theme="{StaticResource SolidDropDownButton}" />
-            </StackPanel>
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Default" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Primary" Classes="Primary" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Secondary" Classes="Secondary" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Success" Classes="Success" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Warning" Classes="Warning" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Danger" Classes="Danger" Theme="{StaticResource OutlineDropDownButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Default" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Primary" Classes="Primary" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Secondary" Classes="Secondary" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Success" Classes="Success" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Warning" Classes="Warning" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Danger" Classes="Danger" Theme="{StaticResource BorderlessDropDownButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Light" IsEnabled="False" />
+                        <DropDownButton Content="Solid" IsEnabled="False" Theme="{StaticResource SolidDropDownButton}" />
+                        <DropDownButton Content="Outline" IsEnabled="False" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Borderless" IsEnabled="False" Theme="{StaticResource BorderlessDropDownButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Large" Classes="Large" />
+                        <DropDownButton Content="Default" />
+                        <DropDownButton Content="Small" Classes="Small" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Primary" Classes="Colorful Primary" />
+                        <DropDownButton Content="Tertiary" Classes="Colorful Tertiary" />
+                        <DropDownButton Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{StaticResource SolidDropDownButton}" />
+                        <DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource SolidDropDownButton}" />
+                        <DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource SolidDropDownButton}" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource OutlineDropDownButton}" />
+                        <DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource OutlineDropDownButton}" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <DropDownButton Content="Primary" Classes="Colorful Primary" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Tertiary" Classes="Colorful Tertiary" Theme="{StaticResource BorderlessDropDownButton}" />
+                        <DropDownButton Content="Disabled" Classes="Colorful Primary" Theme="{StaticResource BorderlessDropDownButton}" IsEnabled="False" />
+                    </WrapPanel>
+                </StackPanel>
+            </HeaderedContentControl>
+
+            <HeaderedContentControl
+                Theme="{StaticResource GroupBox}" Header="SplitButton">
+                <StackPanel HorizontalAlignment="Left" Spacing="16">
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <SplitButton Content="Default" />
+                        <SplitButton Content="Primary" Classes="Primary" />
+                        <SplitButton Content="Secondary" Classes="Secondary" />
+                        <SplitButton Content="Tertiary" Classes="Tertiary" />
+                        <SplitButton Content="Success" Classes="Success" />
+                        <SplitButton Content="Warning" Classes="Warning" />
+                        <SplitButton Content="Danger" Classes="Danger" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <SplitButton Content="Default" Theme="{StaticResource SolidSplitButton}" />
+                        <SplitButton Content="Primary" Classes="Primary" Theme="{StaticResource SolidSplitButton}" />
+                        <SplitButton Content="Secondary" Classes="Secondary" Theme="{StaticResource SolidSplitButton}" />
+                        <SplitButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource SolidSplitButton}" />
+                        <SplitButton Content="Success" Classes="Success" Theme="{StaticResource SolidSplitButton}" />
+                        <SplitButton Content="Warning" Classes="Warning" Theme="{StaticResource SolidSplitButton}" />
+                        <SplitButton Content="Danger" Classes="Danger" Theme="{StaticResource SolidSplitButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <SplitButton Content="Default" Theme="{StaticResource OutlineSplitButton}" />
+                        <SplitButton Content="Primary" Classes="Primary" Theme="{StaticResource OutlineSplitButton}" />
+                        <SplitButton Content="Secondary" Classes="Secondary" Theme="{StaticResource OutlineSplitButton}" />
+                        <SplitButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource OutlineSplitButton}" />
+                        <SplitButton Content="Success" Classes="Success" Theme="{StaticResource OutlineSplitButton}" />
+                        <SplitButton Content="Warning" Classes="Warning" Theme="{StaticResource OutlineSplitButton}" />
+                        <SplitButton Content="Danger" Classes="Danger" Theme="{StaticResource OutlineSplitButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <SplitButton Content="Default" Theme="{StaticResource BorderlessSplitButton}" />
+                        <SplitButton Content="Primary" Classes="Primary" Theme="{StaticResource BorderlessSplitButton}" />
+                        <SplitButton Content="Secondary" Classes="Secondary" Theme="{StaticResource BorderlessSplitButton}" />
+                        <SplitButton Content="Tertiary" Classes="Tertiary" Theme="{StaticResource BorderlessSplitButton}" />
+                        <SplitButton Content="Success" Classes="Success" Theme="{StaticResource BorderlessSplitButton}" />
+                        <SplitButton Content="Warning" Classes="Warning" Theme="{StaticResource BorderlessSplitButton}" />
+                        <SplitButton Content="Danger" Classes="Danger" Theme="{StaticResource BorderlessSplitButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <SplitButton Content="Light" IsEnabled="False" />
+                        <SplitButton Content="Solid" IsEnabled="False" Theme="{StaticResource SolidSplitButton}" />
+                        <SplitButton Content="Outline" IsEnabled="False" Theme="{StaticResource OutlineSplitButton}" />
+                        <SplitButton Content="Borderless" IsEnabled="False" Theme="{StaticResource BorderlessSplitButton}" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <SplitButton Content="Large" Classes="Large" />
+                        <SplitButton Content="Default" />
+                        <SplitButton Content="Small" Classes="Small" />
+                    </WrapPanel>
+                </StackPanel>
+            </HeaderedContentControl>
+
+            <HeaderedContentControl
+                Theme="{StaticResource GroupBox}"
+                Header="ToggleSplitButton">
+                <StackPanel HorizontalAlignment="Left" Spacing="24">
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleSplitButton Content="Default" />
+                        <ToggleSplitButton Classes="Primary" Content="Primary" />
+                        <ToggleSplitButton Classes="Secondary" Content="Secondary" />
+                        <ToggleSplitButton Classes="Tertiary" Content="Tertiary" />
+                        <ToggleSplitButton Classes="Success" Content="Success" />
+                        <ToggleSplitButton Classes="Warning" Content="Warning" />
+                        <ToggleSplitButton Classes="Danger" Content="Danger" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleSplitButton Content="Default" IsChecked="True" />
+                        <ToggleSplitButton Classes="Primary" Content="Primary" IsChecked="True" />
+                        <ToggleSplitButton Classes="Secondary" Content="Secondary" IsChecked="True" />
+                        <ToggleSplitButton Classes="Tertiary" Content="Tertiary" IsChecked="True" />
+                        <ToggleSplitButton Classes="Success" Content="Success" IsChecked="True" />
+                        <ToggleSplitButton Classes="Warning" Content="Warning" IsChecked="True" />
+                        <ToggleSplitButton Classes="Danger" Content="Danger" IsChecked="True" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleSplitButton Content="Unchecked" Classes="Success" IsEnabled="False" />
+                        <ToggleSplitButton Content="Checked" Classes="Success" IsChecked="True" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleSplitButton Content="Large" Classes="Large" />
+                        <ToggleSplitButton Content="Default" />
+                        <ToggleSplitButton Content="Small" Classes="Small" />
+                    </WrapPanel>
+                </StackPanel>
+            </HeaderedContentControl>
+
+            <HeaderedContentControl
+                Theme="{StaticResource GroupBox}" Header="ToggleButton">
+                <StackPanel HorizontalAlignment="Left" Spacing="16">
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Default" />
+                        <ToggleButton Content="Primary" Classes="Primary" />
+                        <ToggleButton Content="Secondary" Classes="Secondary" />
+                        <ToggleButton Content="Tertiary" Classes="Tertiary" />
+                        <ToggleButton Content="Success" Classes="Success" />
+                        <ToggleButton Content="Warning" Classes="Warning" />
+                        <ToggleButton Content="Danger" Classes="Danger" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Default" IsChecked="True" />
+                        <ToggleButton Content="Primary" Classes="Primary" IsChecked="True" />
+                        <ToggleButton Content="Secondary" Classes="Secondary" IsChecked="True" />
+                        <ToggleButton Content="Tertiary" Classes="Tertiary" IsChecked="True" />
+                        <ToggleButton Content="Success" Classes="Success" IsChecked="True" />
+                        <ToggleButton Content="Warning" Classes="Warning" IsChecked="True" />
+                        <ToggleButton Content="Danger" Classes="Danger" IsChecked="True" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Default" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Primary" Classes="Primary" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Secondary" Classes="Secondary" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Tertiary" Classes="Tertiary" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Success" Classes="Success" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Warning" Classes="Warning" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Danger" Classes="Danger" IsChecked="{x:Null}" IsThreeState="True" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Unchecked" IsEnabled="False" />
+                        <ToggleButton Content="Checked" IsEnabled="False" IsChecked="True" />
+                        <ToggleButton Content="Indeterminate" IsEnabled="False" IsChecked="{x:Null}" IsThreeState="True" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Large" Classes="Large" />
+                        <ToggleButton Content="Default" />
+                        <ToggleButton Content="Small" Classes="Small" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Primary" Classes="Colorful Primary" />
+                        <ToggleButton Content="Tertiary" Classes="Colorful Tertiary" />
+                        <ToggleButton Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Primary" Classes="Colorful Primary" IsChecked="True" />
+                        <ToggleButton Content="Tertiary" Classes="Colorful Tertiary" IsChecked="True" />
+                        <ToggleButton Content="Disabled" Classes="Colorful Primary" IsChecked="True" IsEnabled="False" />
+                    </WrapPanel>
+                    <WrapPanel ItemSpacing="16" LineSpacing="16">
+                        <ToggleButton Content="Primary" Classes="Colorful Primary" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Tertiary" Classes="Colorful Tertiary" IsChecked="{x:Null}" IsThreeState="True" />
+                        <ToggleButton Content="Disabled" Classes="Colorful Primary" IsChecked="{x:Null}" IsThreeState="True" IsEnabled="False" />
+                    </WrapPanel>
+                </StackPanel>
+            </HeaderedContentControl>
         </StackPanel>
     </ScrollViewer>
 </UserControl>

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

@@ -8,6 +8,10 @@
     d:DesignWidth="800"
     mc:Ignorable="d">
     <StackPanel HorizontalAlignment="Left" Spacing="20">
+        <StackPanel Orientation="Horizontal">
+            <ToggleSwitch Name="showSpinCheck" IsChecked="True" Content="Show Button Spinner" />
+            <ToggleSwitch Name="allowSpinCheck" IsChecked="True" Content="Allow Spin" />
+        </StackPanel>
         <ButtonSpinner
             Height="30"
             AllowSpin="{Binding #allowSpinCheck.IsChecked}"

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

@@ -7,46 +7,51 @@
     xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels"
     d:DesignHeight="800"
     d:DesignWidth="800"
-    mc:Ignorable="d">
+    mc:Ignorable="d"
+    x:DataType="vm:ComboBoxDemoViewModel">
     <Design.DataContext>
         <vm:ComboBoxDemoViewModel />
     </Design.DataContext>
-    <StackPanel Spacing="20">
+    <ScrollViewer>
-        <StackPanel.Styles>
+        <StackPanel Spacing="20">
-            <Style Selector="ComboBox">
+            <StackPanel.Styles>
-                <Setter Property="Width" Value="300" />
+                <Style Selector="ComboBox">
-                <Setter Property="ItemsSource" Value="{Binding Items}" />
+                    <Setter Property="Width" Value="300" />
-            </Style>
+                    <Setter Property="ItemsSource" Value="{Binding Items}" />
-        </StackPanel.Styles>
+                </Style>
+            </StackPanel.Styles>
 
-        <ComboBox />
+            <ComboBox />
-        <ComboBox Classes="ClearButton" />
+            <ComboBox Classes="ClearButton" />
-        <ComboBox PlaceholderText="Please Select" />
+            <ComboBox PlaceholderText="Please Select" />
-        <ComboBox IsEnabled="False" />
+            <ComboBox IsEnabled="False" />
-        <ComboBox Classes="Large" IsEnabled="False" />
+            <ComboBox Classes="Large" IsEnabled="False" />
-        <ComboBox Classes="Small" />
+            <ComboBox Classes="Small" />
-        <ComboBox Classes="Bordered" />
+            <ComboBox Classes="Bordered" />
-        <ComboBox Classes="Bordered" IsEnabled="False" />
+            <ComboBox Classes="Bordered" IsEnabled="False" />
-        <ComboBox>
+            <ComboBox>
-            <ComboBox.SelectionBoxItemTemplate>
+                <ComboBox.SelectionBoxItemTemplate>
-                <DataTemplate DataType="x:String">
+                    <DataTemplate DataType="x:String">
-                    <ContentControl BorderThickness="1"
+                        <ContentControl BorderThickness="1"
-                                    BorderBrush="Gold"
+                                        BorderBrush="Gold"
-                                    Content="{Binding}" />
+                                        Content="{Binding}" />
-                </DataTemplate>
+                    </DataTemplate>
-            </ComboBox.SelectionBoxItemTemplate>
+                </ComboBox.SelectionBoxItemTemplate>
-        </ComboBox>
+            </ComboBox>
 
-        <StackPanel Orientation="Horizontal">
+            <StackPanel Orientation="Horizontal">
-            <ComboBox Width="100" Classes="Large" PlaceholderText="Large" />
+                <ComboBox Width="100" Classes="Large" PlaceholderText="Large" />
-            <ComboBox Width="100" PlaceholderText="Default" />
+                <ComboBox Width="100" PlaceholderText="Default" />
-            <ComboBox Width="100" Classes="Small" PlaceholderText="Small" />
+                <ComboBox Width="100" Classes="Small" PlaceholderText="Small" />
+            </StackPanel>
+
+            <StackPanel Orientation="Horizontal">
+                <ComboBox Width="100" IsEnabled="False" PlaceholderText="Disabled" />
+                <ComboBox Width="100" Classes="Bordered" PlaceholderText="Bordered" />
+                <ComboBox Width="100" Classes="Bordered" IsEnabled="False" />
+            </StackPanel>
+            <ToggleSwitch Name="toggle" IsChecked="True" Content="IsEditable" />
+            <ComboBox IsEditable="{Binding #toggle.IsChecked}" />
         </StackPanel>
-
+    </ScrollViewer>
-        <StackPanel Orientation="Horizontal">
-            <ComboBox Width="100" IsEnabled="False" PlaceholderText="Disabled" />
-            <ComboBox Width="100" Classes="Bordered" PlaceholderText="Bordered" />
-            <ComboBox Width="100" Classes="Bordered" IsEnabled="False" />
-        </StackPanel>
-    </StackPanel>
 </UserControl>

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

@@ -7,7 +7,6 @@
     xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels;assembly=Semi.Avalonia.Demo"
     d:DesignHeight="450"
     d:DesignWidth="800"
-    x:CompileBindings="True"
     x:DataType="vm:DataGridDemoViewModel"
     mc:Ignorable="d">
     <TabControl>

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

@@ -8,7 +8,6 @@
              xmlns:pages="clr-namespace:Semi.Avalonia.Demo.Pages"
              mc:Ignorable="d" d:DesignWidth="1000" d:DesignHeight="1450"
              x:DataType="vm:HighContrastDemoViewModel"
-             x:CompileBindings="True"
              x:Class="Semi.Avalonia.Demo.Pages.HighContrastDemo">
     <Design.DataContext>
         <vm:HighContrastDemoViewModel />

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

@@ -18,78 +18,67 @@
             Text="{Binding SearchText}"
             Watermark="Input Icon Name" />
 
-        <TabControl Grid.Row="1">
+        <TabControl
-            <TabItem Header="Filled Icons">
+            Grid.Row="1"
-                <ScrollViewer>
+            Theme="{StaticResource LineTabControl}"
-                    <ItemsControl ItemsSource="{Binding FilteredFilledIcons}">
+            ItemsSource="{Binding IconTabs}">
-                        <ItemsControl.ItemsPanel>
+            <TabControl.ItemTemplate>
-                            <ItemsPanelTemplate>
+                <DataTemplate>
-                                <WrapPanel />
+                    <WrapPanel ItemSpacing="5">
-                            </ItemsPanelTemplate>
+                        <TextBlock Text="{Binding Header}" />
-                        </ItemsControl.ItemsPanel>
+                        <Label 
-                        <ItemsControl.ItemTemplate>
+                            Theme="{StaticResource TagLabel}"
-                            <DataTemplate>
+                            Classes="Purple"
-                                <Button Theme="{DynamicResource OutlineButton}"
+                            IsVisible="{Binding Header, 
-                                        Classes="Tertiary"
+                                Converter={x:Static ObjectConverters.Equal},
-                                        Padding="0"
+                                ConverterParameter='AI Icons'}"
-                                        Margin="10"
+                            Content="New" />
-                                        Width="200"
+                    </WrapPanel>
-                                        Height="120"
+                </DataTemplate>
-                                        Click="Button_Clicked">
+            </TabControl.ItemTemplate>
-                                    <StackPanel Spacing="8">
-                                        <PathIcon
-                                            Theme="{DynamicResource InnerPathIcon}"
-                                            HorizontalAlignment="Center"
-                                            Classes="ExtraLarge"
-                                            Data="{Binding Geometry}" />
-                                        <TextBlock
-                                            HorizontalAlignment="Center"
-                                            FontSize="12"
-                                            FontWeight="Normal"
-                                            Text="{Binding ResourceKey}" />
-                                    </StackPanel>
-                                </Button>
-                            </DataTemplate>
-                        </ItemsControl.ItemTemplate>
-                    </ItemsControl>
-                </ScrollViewer>
-            </TabItem>
 
-            <TabItem Header="Stroked Icons">
+            <TabControl.ContentTemplate>
-                <ScrollViewer>
+                <DataTemplate DataType="vm:IconTab">
-                    <ItemsControl ItemsSource="{Binding FilteredStrokedIcons}">
+                    <ScrollViewer>
-                        <ItemsControl.ItemsPanel>
+                        <ItemsControl
-                            <ItemsPanelTemplate>
+                            Margin="0 10"
-                                <WrapPanel />
+                            ItemsSource="{Binding IconItems}">
-                            </ItemsPanelTemplate>
+                            <ItemsControl.ItemsPanel>
-                        </ItemsControl.ItemsPanel>
+                                <ItemsPanelTemplate>
-                        <ItemsControl.ItemTemplate>
+                                    <WrapPanel
-                            <DataTemplate>
+                                        ItemWidth="200"
-                                <Button Theme="{DynamicResource OutlineButton}"
+                                        ItemHeight="120"
-                                        Classes="Tertiary"
+                                        ItemSpacing="10"
-                                        Padding="0"
+                                        LineSpacing="10" />
-                                        Margin="10"
+                                </ItemsPanelTemplate>
-                                        Width="200"
+                            </ItemsControl.ItemsPanel>
-                                        Height="120"
+                            <ItemsControl.ItemTemplate>
-                                        Click="Button_Clicked">
+                                <DataTemplate>
-                                    <StackPanel Spacing="8">
+                                    <Button Theme="{DynamicResource OutlineButton}"
-                                        <PathIcon
+                                            Classes="Tertiary"
-                                            Theme="{DynamicResource InnerPathIcon}"
+                                            Padding="0"
-                                            HorizontalAlignment="Center"
+                                            HorizontalAlignment="Stretch"
-                                            Classes="ExtraLarge"
+                                            VerticalAlignment="Stretch"
-                                            Data="{Binding Geometry}" />
+                                            Click="Button_Clicked">
-                                        <TextBlock
+                                        <StackPanel Spacing="8">
-                                            HorizontalAlignment="Center"
+                                            <PathIcon
-                                            FontSize="12"
+                                                Theme="{DynamicResource InnerPathIcon}"
-                                            FontWeight="Normal"
+                                                HorizontalAlignment="Center"
-                                            Text="{Binding ResourceKey}" />
+                                                Classes="ExtraLarge"
-                                    </StackPanel>
+                                                Data="{Binding Geometry}" />
-                                </Button>
+                                            <TextBlock
-                            </DataTemplate>
+                                                HorizontalAlignment="Center"
-                        </ItemsControl.ItemTemplate>
+                                                FontSize="12"
-                    </ItemsControl>
+                                                FontWeight="Normal"
-                </ScrollViewer>
+                                                Text="{Binding ResourceKey}" />
-            </TabItem>
+                                        </StackPanel>
+                                    </Button>
+                                </DataTemplate>
+                            </ItemsControl.ItemTemplate>
+                        </ItemsControl>
+                    </ScrollViewer>
+                </DataTemplate>
+            </TabControl.ContentTemplate>
         </TabControl>
     </Grid>
 </UserControl>

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

@@ -8,14 +8,11 @@
     d:DesignWidth="800"
     mc:Ignorable="d">
     <ScrollViewer>
-        <StackPanel HorizontalAlignment="Left" Spacing="20">
+        <StackPanel>
             <StackPanel.Styles>
-                <Style Selector="Label">
+                <Style Selector="Grid > TextBlock,Grid > Label">
-                    <Setter Property="Margin" Value="4" />
+                    <Setter Property="Layoutable.VerticalAlignment" Value="Center" />
-                </Style>
+                    <Setter Property="Layoutable.Margin" Value="4" />
-                <Style Selector="Grid > TextBlock">
-                    <Setter Property="VerticalAlignment" Value="Center" />
-                    <Setter Property="Margin" Value="4" />
                 </Style>
             </StackPanel.Styles>
             <ScrollViewer HorizontalScrollBarVisibility="Auto">
@@ -156,69 +153,89 @@
                     </HeaderedContentControl>
                 </StackPanel>
             </ScrollViewer>
-            <WrapPanel>
+
-                <Label Theme="{StaticResource TagLabel}">Label</Label>
+            <HeaderedContentControl
-                <Label Classes="Large" Theme="{StaticResource TagLabel}">Large Label</Label>
+                Margin="16"
-                <Label Classes="Circle" Theme="{StaticResource TagLabel}">Circle Label</Label>
+                Header="Theme: TagLabel"
-                <Label Classes="Large Circle" Theme="{StaticResource TagLabel}">Large Circle Label</Label>
+                Theme="{DynamicResource GroupBox}">
-            </WrapPanel>
+                <ScrollViewer HorizontalScrollBarVisibility="Auto">
-            <WrapPanel>
+                    <StackPanel Orientation="Horizontal" Spacing="8">
-                <Label Classes="Red" Theme="{StaticResource TagLabel}">Red</Label>
+                        <StackPanel Spacing="4">
-                <Label Classes="Pink" Theme="{StaticResource TagLabel}">Pink</Label>
+                            <Label Classes="Red" Theme="{StaticResource TagLabel}">Red</Label>
-                <Label Classes="Purple" Theme="{StaticResource TagLabel}">Purple</Label>
+                            <Label Classes="Pink" Theme="{StaticResource TagLabel}">Pink</Label>
-                <Label Classes="Violet" Theme="{StaticResource TagLabel}">Violet</Label>
+                            <Label Classes="Purple" Theme="{StaticResource TagLabel}">Purple</Label>
-                <Label Classes="Indigo" Theme="{StaticResource TagLabel}">Indigo</Label>
+                            <Label Classes="Violet" Theme="{StaticResource TagLabel}">Violet</Label>
-                <Label Classes="Blue" Theme="{StaticResource TagLabel}">Blue</Label>
+                            <Label Classes="Indigo" Theme="{StaticResource TagLabel}">Indigo</Label>
-                <Label Classes="LightBlue" Theme="{StaticResource TagLabel}">LightBlue</Label>
+                            <Label Classes="Blue" Theme="{StaticResource TagLabel}">Blue</Label>
-                <Label Classes="Cyan" Theme="{StaticResource TagLabel}">Cyan</Label>
+                            <Label Classes="LightBlue" Theme="{StaticResource TagLabel}">LightBlue</Label>
-                <Label Classes="Teal" Theme="{StaticResource TagLabel}">Teal</Label>
+                            <Label Classes="Cyan" Theme="{StaticResource TagLabel}">Cyan</Label>
-                <Label Classes="Green" Theme="{StaticResource TagLabel}">Green</Label>
+                            <Label Classes="Teal" Theme="{StaticResource TagLabel}">Teal</Label>
-                <Label Classes="LightGreen" Theme="{StaticResource TagLabel}">LightGreen</Label>
+                            <Label Classes="Green" Theme="{StaticResource TagLabel}">Green</Label>
-                <Label Classes="Lime" Theme="{StaticResource TagLabel}">Lime</Label>
+                            <Label Classes="LightGreen" Theme="{StaticResource TagLabel}">LightGreen</Label>
-                <Label Classes="Yellow" Theme="{StaticResource TagLabel}">Yellow</Label>
+                            <Label Classes="Lime" Theme="{StaticResource TagLabel}">Lime</Label>
-                <Label Classes="Amber" Theme="{StaticResource TagLabel}">Amber</Label>
+                            <Label Classes="Yellow" Theme="{StaticResource TagLabel}">Yellow</Label>
-                <Label Classes="Orange" Theme="{StaticResource TagLabel}">Orange</Label>
+                            <Label Classes="Amber" Theme="{StaticResource TagLabel}">Amber</Label>
-                <Label Classes="Grey" Theme="{StaticResource TagLabel}">Grey</Label>
+                            <Label Classes="Orange" Theme="{StaticResource TagLabel}">Orange</Label>
-                <Label Classes="White" Theme="{StaticResource TagLabel}">White</Label>
+                            <Label Classes="Grey" Theme="{StaticResource TagLabel}">Grey</Label>
-            </WrapPanel>
+                            <Label Classes="White" Theme="{StaticResource TagLabel}">White</Label>
-            <WrapPanel>
+                        </StackPanel>
-                <Label Classes="Ghost Red" Theme="{StaticResource TagLabel}">Red</Label>
+                        <StackPanel Spacing="4">
-                <Label Classes="Ghost Pink" Theme="{StaticResource TagLabel}">Pink</Label>
+                            <Label Classes="Ghost Red" Theme="{StaticResource TagLabel}">Red</Label>
-                <Label Classes="Ghost Purple" Theme="{StaticResource TagLabel}">Purple</Label>
+                            <Label Classes="Ghost Pink" Theme="{StaticResource TagLabel}">Pink</Label>
-                <Label Classes="Ghost Violet" Theme="{StaticResource TagLabel}">Violet</Label>
+                            <Label Classes="Ghost Purple" Theme="{StaticResource TagLabel}">Purple</Label>
-                <Label Classes="Ghost Indigo" Theme="{StaticResource TagLabel}">Indigo</Label>
+                            <Label Classes="Ghost Violet" Theme="{StaticResource TagLabel}">Violet</Label>
-                <Label Classes="Ghost Blue" Theme="{StaticResource TagLabel}">Blue</Label>
+                            <Label Classes="Ghost Indigo" Theme="{StaticResource TagLabel}">Indigo</Label>
-                <Label Classes="Ghost LightBlue" Theme="{StaticResource TagLabel}">LightBlue</Label>
+                            <Label Classes="Ghost Blue" Theme="{StaticResource TagLabel}">Blue</Label>
-                <Label Classes="Ghost Cyan" Theme="{StaticResource TagLabel}">Cyan</Label>
+                            <Label Classes="Ghost LightBlue" Theme="{StaticResource TagLabel}">LightBlue</Label>
-                <Label Classes="Ghost Teal" Theme="{StaticResource TagLabel}">Teal</Label>
+                            <Label Classes="Ghost Cyan" Theme="{StaticResource TagLabel}">Cyan</Label>
-                <Label Classes="Ghost Green" Theme="{StaticResource TagLabel}">Green</Label>
+                            <Label Classes="Ghost Teal" Theme="{StaticResource TagLabel}">Teal</Label>
-                <Label Classes="Ghost LightGreen" Theme="{StaticResource TagLabel}">LightGreen</Label>
+                            <Label Classes="Ghost Green" Theme="{StaticResource TagLabel}">Green</Label>
-                <Label Classes="Ghost Lime" Theme="{StaticResource TagLabel}">Lime</Label>
+                            <Label Classes="Ghost LightGreen" Theme="{StaticResource TagLabel}">LightGreen</Label>
-                <Label Classes="Ghost Yellow" Theme="{StaticResource TagLabel}">Yellow</Label>
+                            <Label Classes="Ghost Lime" Theme="{StaticResource TagLabel}">Lime</Label>
-                <Label Classes="Ghost Amber" Theme="{StaticResource TagLabel}">Amber</Label>
+                            <Label Classes="Ghost Yellow" Theme="{StaticResource TagLabel}">Yellow</Label>
-                <Label Classes="Ghost Orange" Theme="{StaticResource TagLabel}">Orange</Label>
+                            <Label Classes="Ghost Amber" Theme="{StaticResource TagLabel}">Amber</Label>
-                <Label Classes="Ghost Grey" Theme="{StaticResource TagLabel}">Grey</Label>
+                            <Label Classes="Ghost Orange" Theme="{StaticResource TagLabel}">Orange</Label>
-                <Label Classes="Ghost White" Theme="{StaticResource TagLabel}">White</Label>
+                            <Label Classes="Ghost Grey" Theme="{StaticResource TagLabel}">Grey</Label>
-            </WrapPanel>
+                            <Label Classes="Ghost White" Theme="{StaticResource TagLabel}">White</Label>
-            <WrapPanel>
+                        </StackPanel>
-                <Label Classes="Solid Red" Theme="{StaticResource TagLabel}">Red</Label>
+                        <StackPanel Spacing="4">
-                <Label Classes="Solid Pink" Theme="{StaticResource TagLabel}">Pink</Label>
+                            <Label Classes="Solid Red" Theme="{StaticResource TagLabel}">Red</Label>
-                <Label Classes="Solid Purple" Theme="{StaticResource TagLabel}">Purple</Label>
+                            <Label Classes="Solid Pink" Theme="{StaticResource TagLabel}">Pink</Label>
-                <Label Classes="Solid Violet" Theme="{StaticResource TagLabel}">Violet</Label>
+                            <Label Classes="Solid Purple" Theme="{StaticResource TagLabel}">Purple</Label>
-                <Label Classes="Solid Indigo" Theme="{StaticResource TagLabel}">Indigo</Label>
+                            <Label Classes="Solid Violet" Theme="{StaticResource TagLabel}">Violet</Label>
-                <Label Classes="Solid Blue" Theme="{StaticResource TagLabel}">Blue</Label>
+                            <Label Classes="Solid Indigo" Theme="{StaticResource TagLabel}">Indigo</Label>
-                <Label Classes="Solid LightBlue" Theme="{StaticResource TagLabel}">LightBlue</Label>
+                            <Label Classes="Solid Blue" Theme="{StaticResource TagLabel}">Blue</Label>
-                <Label Classes="Solid Cyan" Theme="{StaticResource TagLabel}">Cyan</Label>
+                            <Label Classes="Solid LightBlue" Theme="{StaticResource TagLabel}">LightBlue</Label>
-                <Label Classes="Solid Teal" Theme="{StaticResource TagLabel}">Teal</Label>
+                            <Label Classes="Solid Cyan" Theme="{StaticResource TagLabel}">Cyan</Label>
-                <Label Classes="Solid Green" Theme="{StaticResource TagLabel}">Green</Label>
+                            <Label Classes="Solid Teal" Theme="{StaticResource TagLabel}">Teal</Label>
-                <Label Classes="Solid LightGreen" Theme="{StaticResource TagLabel}">LightGreen</Label>
+                            <Label Classes="Solid Green" Theme="{StaticResource TagLabel}">Green</Label>
-                <Label Classes="Solid Lime" Theme="{StaticResource TagLabel}">Lime</Label>
+                            <Label Classes="Solid LightGreen" Theme="{StaticResource TagLabel}">LightGreen</Label>
-                <Label Classes="Solid Yellow" Theme="{StaticResource TagLabel}">Yellow</Label>
+                            <Label Classes="Solid Lime" Theme="{StaticResource TagLabel}">Lime</Label>
-                <Label Classes="Solid Amber" Theme="{StaticResource TagLabel}">Amber</Label>
+                            <Label Classes="Solid Yellow" Theme="{StaticResource TagLabel}">Yellow</Label>
-                <Label Classes="Solid Orange" Theme="{StaticResource TagLabel}">Orange</Label>
+                            <Label Classes="Solid Amber" Theme="{StaticResource TagLabel}">Amber</Label>
-                <Label Classes="Solid Grey" Theme="{StaticResource TagLabel}">Grey</Label>
+                            <Label Classes="Solid Orange" Theme="{StaticResource TagLabel}">Orange</Label>
-                <Label Classes="Solid White" Theme="{StaticResource TagLabel}">White</Label>
+                            <Label Classes="Solid Grey" Theme="{StaticResource TagLabel}">Grey</Label>
-            </WrapPanel>
+                            <Label Classes="Solid White" Theme="{StaticResource TagLabel}">White</Label>
+                        </StackPanel>
+                        <StackPanel Spacing="4">
+                            <Label Classes="Colorful Gradient" Theme="{DynamicResource TagLabel}">Light</Label>
+                            <Label Classes="Colorful Gradient Ghost" Theme="{DynamicResource TagLabel}">Ghost</Label>
+                            <Label Classes="Colorful Gradient Solid" Theme="{DynamicResource TagLabel}">Solid</Label>
+                        </StackPanel>
+                        <StackPanel Spacing="4">
+                            <Label Classes="Colorful" Theme="{DynamicResource TagLabel}">Light</Label>
+                            <Label Classes="Colorful Ghost" Theme="{DynamicResource TagLabel}">Ghost</Label>
+                            <Label Classes="Colorful Solid" Theme="{DynamicResource TagLabel}">Solid</Label>
+                        </StackPanel>
+                        <StackPanel Spacing="4">
+                            <Label Theme="{StaticResource TagLabel}">Label</Label>
+                            <Label Classes="Large" Theme="{StaticResource TagLabel}">Large Label</Label>
+                            <Label Classes="Circle" Theme="{StaticResource TagLabel}">Circle Label</Label>
+                            <Label Classes="Large Circle" Theme="{StaticResource TagLabel}">Large Circle Label</Label>
+                        </StackPanel>
+                    </StackPanel>
+                </ScrollViewer>
+            </HeaderedContentControl>
         </StackPanel>
     </ScrollViewer>
 </UserControl>

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

@@ -27,7 +27,8 @@ public partial class NotificationDemo : UserControl
         if (sender is RadioButton b && b.Content is string s)
         {
             Enum.TryParse<NotificationPosition>(s, out var t);
-            _manager.Position = t;
+            if (_manager is not null)
+                _manager.Position = t;
         }
     }
 

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

@@ -348,7 +348,7 @@
                     Classes="H5"
                     Text="Start to install"
                     Theme="{DynamicResource TitleTextBlock}" />
-                <TabControl Padding="8">
+                <TabControl Theme="{StaticResource LineTabControl}">
                     <TabItem Header="Main">
                         <StackPanel>
                             <TextBlock Text="Install via nuget: " />
@@ -409,6 +409,51 @@
                             </Border>
                         </StackPanel>
                     </TabItem>
+                    <TabItem Header="Dock">
+                        <StackPanel>
+                            <TextBlock Text="Install via nuget: " />
+                            <Border Margin="0,16" Classes="CodeBlock">
+                                <SelectableTextBlock FontFamily="Consolas" Text="{Binding $parent[local:Overview].DockInstall}" />
+                            </Border>
+                            <TextBlock Text="Reference styles: " />
+                            <Border Margin="0,16" Classes="CodeBlock">
+                                <SelectableTextBlock
+                                    FontFamily="Consolas"
+                                    Text="{Binding $parent[local:Overview].DockStyle}"
+                                    TextWrapping="Wrap" />
+                            </Border>
+                        </StackPanel>
+                    </TabItem>
+                    <TabItem Header="Tabalonia">
+                        <StackPanel>
+                            <TextBlock Text="Install via nuget: " />
+                            <Border Margin="0,16" Classes="CodeBlock">
+                                <SelectableTextBlock FontFamily="Consolas" Text="{Binding $parent[local:Overview].TabaloniaInstall}" />
+                            </Border>
+                            <TextBlock Text="Reference styles: " />
+                            <Border Margin="0,16" Classes="CodeBlock">
+                                <SelectableTextBlock
+                                    FontFamily="Consolas"
+                                    Text="{Binding $parent[local:Overview].TabaloniaStyle}"
+                                    TextWrapping="Wrap" />
+                            </Border>
+                        </StackPanel>
+                    </TabItem>
+                    <TabItem Header="AvaloniaEdit">
+                        <StackPanel>
+                            <TextBlock Text="Install via nuget: " />
+                            <Border Margin="0,16" Classes="CodeBlock">
+                                <SelectableTextBlock FontFamily="Consolas" Text="{Binding $parent[local:Overview].AvaloniaEditInstall}" />
+                            </Border>
+                            <TextBlock Text="Reference styles: " />
+                            <Border Margin="0,16" Classes="CodeBlock">
+                                <SelectableTextBlock
+                                    FontFamily="Consolas"
+                                    Text="{Binding $parent[local:Overview].AvaloniaEditStyle}"
+                                    TextWrapping="Wrap" />
+                            </Border>
+                        </StackPanel>
+                    </TabItem>
                 </TabControl>
             </StackPanel>
         </StackPanel>

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

@@ -9,7 +9,7 @@ public partial class Overview : UserControl
         InitializeComponent();
     }
 
-    public string MainInstall { get; set; } = "dotnet add package Semi.Avalonia --version 11.2.1.8";
+    public string MainInstall { get; set; } = "dotnet add package Semi.Avalonia";
 
     public string MainStyle { get; set; } =
         """
@@ -18,7 +18,7 @@ public partial class Overview : UserControl
         </Application.Styles>
         """;
 
-    public string ColorPickerInstall { get; set; } = "dotnet add package Semi.Avalonia.ColorPicker --version 11.2.1.8";
+    public string ColorPickerInstall { get; set; } = "dotnet add package Semi.Avalonia.ColorPicker";
 
     public string ColorPickerStyle { get; set; } =
         """
@@ -27,7 +27,7 @@ public partial class Overview : UserControl
         </Application.Styles>
         """;
 
-    public string DataGridInstall { get; set; } = "dotnet add package Semi.Avalonia.DataGrid --version 11.2.1.8";
+    public string DataGridInstall { get; set; } = "dotnet add package Semi.Avalonia.DataGrid";
 
     public string DataGridStyle { get; set; } =
         """
@@ -36,7 +36,7 @@ public partial class Overview : UserControl
         </Application.Styles>
         """;
 
-    public string TreeDataGridInstall { get; set; } = "dotnet add package Semi.Avalonia.TreeDataGrid --version 11.0.10.4";
+    public string TreeDataGridInstall { get; set; } = "dotnet add package Semi.Avalonia.TreeDataGrid";
 
     public string TreeDataGridStyle { get; set; } =
         """
@@ -44,4 +44,31 @@ public partial class Overview : UserControl
             <semi:TreeDataGridSemiTheme />
         </Application.Styles>
         """;
+
+    public string DockInstall { get; set; } = "dotnet add package Semi.Avalonia.Dock";
+
+    public string DockStyle { get; set; } =
+        """
+        <Application.Styles>
+            <semi:DockSemiTheme />
+        </Application.Styles>
+        """;
+
+    public string TabaloniaInstall { get; set; } = "dotnet add package Semi.Avalonia.Tabalonia";
+
+    public string TabaloniaStyle { get; set; } =
+        """
+        <Application.Styles>
+            <semi:TabaloniaSemiTheme />
+        </Application.Styles>
+        """;
+
+    public string AvaloniaEditInstall { get; set; } = "dotnet add package Semi.Avalonia.AvaloniaEdit";
+
+    public string AvaloniaEditStyle { get; set; } =
+        """
+        <Application.Styles>
+            <semi:AvaloniaEditSemiTheme />
+        </Application.Styles>
+        """;
 }

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

@@ -8,7 +8,6 @@
     xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
     d:DesignHeight="450"
     d:DesignWidth="800"
-    x:CompileBindings="True"
     x:DataType="viewModels:PaletteDemoViewModel"
     mc:Ignorable="d">
     <Design.DataContext>

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

@@ -8,7 +8,6 @@
     d:DesignHeight="450"
     d:DesignWidth="800"
     x:DataType="vm:RefreshContainerDemoViewModel"
-    x:CompileBindings="True"
     mc:Ignorable="d">
     <DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Top">
         <Label DockPanel.Dock="Top">A control that supports pull to refresh</Label>

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

@@ -1,80 +0,0 @@
-<UserControl
-    x:Class="Semi.Avalonia.Demo.Pages.RepeatButtonDemo"
-    xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    d:DesignHeight="450"
-    d:DesignWidth="800"
-    mc:Ignorable="d">
-    <StackPanel HorizontalAlignment="Left" Spacing="20">
-        <TextBlock>Light (Default)</TextBlock>
-        <StackPanel Orientation="Horizontal" Spacing="20">
-            <RepeatButton Classes="Primary">Primary</RepeatButton>
-            <RepeatButton Classes="Secondary">Secondary</RepeatButton>
-            <RepeatButton Classes="Tertiary">Tertiary</RepeatButton>
-            <RepeatButton Classes="Success">Success</RepeatButton>
-            <RepeatButton Classes="Warning">Warning</RepeatButton>
-            <RepeatButton Classes="Danger">Danger</RepeatButton>
-            <RepeatButton Classes="Danger" IsEnabled="False">Disabled</RepeatButton>
-        </StackPanel>
-        <TextBlock>Solid</TextBlock>
-        <StackPanel Orientation="Horizontal" Spacing="20">
-            <RepeatButton Classes="Primary" Theme="{DynamicResource SolidRepeatButton}">Primary</RepeatButton>
-            <RepeatButton Classes="Secondary" Theme="{DynamicResource SolidRepeatButton}">Secondary</RepeatButton>
-            <RepeatButton Classes="Tertiary" Theme="{DynamicResource SolidRepeatButton}">Tertiary</RepeatButton>
-            <RepeatButton Classes="Success" Theme="{DynamicResource SolidRepeatButton}">Success</RepeatButton>
-            <RepeatButton Classes="Warning" Theme="{DynamicResource SolidRepeatButton}">Warning</RepeatButton>
-            <RepeatButton Classes="Danger" Theme="{DynamicResource SolidRepeatButton}">Danger</RepeatButton>
-            <RepeatButton
-                Classes="Danger"
-                IsEnabled="False"
-                Theme="{DynamicResource SolidRepeatButton}">
-                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>
-            <RepeatButton Classes="Secondary" Theme="{DynamicResource BorderlessRepeatButton}">Secondary</RepeatButton>
-            <RepeatButton Classes="Tertiary" Theme="{DynamicResource BorderlessRepeatButton}">Tertiary</RepeatButton>
-            <RepeatButton Classes="Success" Theme="{DynamicResource BorderlessRepeatButton}">Success</RepeatButton>
-            <RepeatButton Classes="Warning" Theme="{DynamicResource BorderlessRepeatButton}">Warning</RepeatButton>
-            <RepeatButton Classes="Danger" Theme="{DynamicResource BorderlessRepeatButton}">Danger</RepeatButton>
-            <RepeatButton
-                Classes="Danger"
-                IsEnabled="False"
-                Theme="{DynamicResource BorderlessRepeatButton}">
-                Disabled
-            </RepeatButton>
-        </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">
-            <RepeatButton Classes="Small">Small</RepeatButton>
-            <RepeatButton>Default</RepeatButton>
-            <RepeatButton Classes="Large">Large</RepeatButton>
-        </StackPanel>
-    </StackPanel>
-</UserControl>

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

@@ -1,11 +0,0 @@
-using Avalonia.Controls;
-
-namespace Semi.Avalonia.Demo.Pages;
-
-public partial class RepeatButtonDemo : UserControl
-{
-    public RepeatButtonDemo()
-    {
-        InitializeComponent();
-    }
-}

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

@@ -22,6 +22,15 @@
             TickFrequency="10"
             TickPlacement="Outside"
             Value="0" />
+        <Slider
+            Value="0"
+            Minimum="0"
+            Maximum="100"
+            TickPlacement="BottomRight"
+            IsSnapToTickEnabled="True"
+            IsDirectionReversed="True"
+            Ticks="0,20,25,40,75,100"
+            Width="300" />
         <Slider
             Width="300"
             Classes="ToolTip"

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

@@ -7,276 +7,187 @@
     xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels"
     d:DesignHeight="1000"
     d:DesignWidth="800"
+    x:DataType="vm:SplitViewDemoViewModel"
     mc:Ignorable="d">
     <Design.DataContext>
         <vm:SplitViewDemoViewModel />
     </Design.DataContext>
     <Border>
         <Grid ColumnDefinitions="*,400">
-            <Border Grid.Column="1" VerticalAlignment="Top" Margin="10 0 0 0">
+            <Border
-                <Grid RowDefinitions="*, *, *, *, *, *" ColumnDefinitions="Auto, *">
+                Grid.Column="1"
+                Margin="10,0,0,0"
+                VerticalAlignment="Top">
+                <Grid ColumnDefinitions="Auto, *" RowDefinitions="*, *, *, *, *, *">
                     <Label
-                        Grid.Row="0" Grid.Column="0"
+                        Grid.Row="0"
+                        Grid.Column="0"
                         VerticalAlignment="Center"
                         Content="IsPaneOpen" />
                     <ToggleSwitch
-                        Grid.Row="0" Grid.Column="1"
+                        Name="PaneOpenButton"
-                        Name="PaneOpenButton" />
+                        Grid.Row="0"
+                        Grid.Column="1" />
 
                     <Label
-                        Grid.Row="1" Grid.Column="0"
+                        Grid.Row="1"
+                        Grid.Column="0"
                         VerticalAlignment="Center"
                         Content="UseLightDismissOverlayMode" />
                     <ToggleSwitch
-                        Grid.Row="1" Grid.Column="1"
+                        Name="UseLightDismissOverlayModeButton"
-                        Name="UseLightDismissOverlayModeButton" />
+                        Grid.Row="1"
+                        Grid.Column="1" />
 
                     <Label
-                        Grid.Row="2" Grid.Column="0"
+                        Grid.Row="2"
+                        Grid.Column="0"
                         VerticalAlignment="Center"
                         Content="Placement" />
-                    <ToggleSwitch
+                    <ComboBox 
-                        Grid.Row="2" Grid.Column="1"
+                        Grid.Row="2" 
-                        Name="PanePlacementButton"
+                        Grid.Column="1" 
-                        OffContent="Left"
+                        Name="PanelPlacementSelector"
-                        OnContent="Right" />
+                        HorizontalAlignment="Stretch"
-
+                        ItemsSource="{x:Static vm:SplitViewDemoViewModel.Placements}"
+                        SelectedItem="{x:Static SplitViewPanePlacement.Left}"
+                        />
                     <Label
-                        Grid.Row="3" Grid.Column="0"
+                        Grid.Row="3"
+                        Grid.Column="0"
                         VerticalAlignment="Center"
                         Content="DisplayMode" />
                     <ComboBox
-                        Grid.Row="3" Grid.Column="1"
                         Name="DisplayModeSelector"
+                        Grid.Row="3"
+                        Grid.Column="1"
                         HorizontalAlignment="Stretch"
                         ItemsSource="{x:Static vm:SplitViewDemoViewModel.DisplayModes}"
                         SelectedItem="{x:Static SplitViewDisplayMode.CompactInline}" />
 
                     <Label
-                        Grid.Row="4" Grid.Column="0"
+                        Grid.Row="4"
+                        Grid.Column="0"
                         VerticalAlignment="Center"
                         Content="{Binding #CompactPaneLengthSlider.Value, StringFormat='{}CompactPaneLength: {0}'}" />
                     <Slider
-                        Grid.Row="4" Grid.Column="1"
                         Name="CompactPaneLengthSlider"
+                        Grid.Row="4"
+                        Grid.Column="1"
+                        IsSnapToTickEnabled="True"
                         Maximum="128"
                         Minimum="0"
                         TickFrequency="1"
-                        IsSnapToTickEnabled="True"
                         Value="48" />
 
                     <Label
-                        Grid.Row="5" Grid.Column="0"
+                        Grid.Row="5"
+                        Grid.Column="0"
                         VerticalAlignment="Center"
-                        Content="{Binding #OpenPaneLengthSlider.Value,StringFormat='{}OpenPaneLength: {0}'}" />
+                        Content="{Binding #OpenPaneLengthSlider.Value, StringFormat='{}OpenPaneLength: {0}'}" />
                     <Slider
-                        Grid.Row="5" Grid.Column="1"
                         Name="OpenPaneLengthSlider"
+                        Grid.Row="5"
+                        Grid.Column="1"
+                        IsSnapToTickEnabled="True"
                         Maximum="500"
                         Minimum="128"
                         TickFrequency="1"
-                        IsSnapToTickEnabled="True"
                         Value="256" />
                 </Grid>
             </Border>
-            <TabControl Grid.Column="0">
+            <SplitView
-                <TabItem Header="Default">
+                Grid.Column="0"
-                    <Border
+                Name="SplitView"
-                        BorderBrush="{DynamicResource SemiGrey1}"
+                CompactPaneLength="{Binding #CompactPaneLengthSlider.Value}"
-                        BorderThickness="1">
+                DisplayMode="{Binding #DisplayModeSelector.SelectedItem}"
-                        <SplitView
+                IsPaneOpen="{Binding #PaneOpenButton.IsChecked, Mode=TwoWay}"
-                            Name="SplitView"
+                OpenPaneLength="{Binding #OpenPaneLengthSlider.Value}"
-                            IsPaneOpen="{Binding #PaneOpenButton.IsChecked,Mode=TwoWay}"
+                PanePlacement="{Binding #PanelPlacementSelector.SelectedItem}"
-                            UseLightDismissOverlayMode="{Binding #UseLightDismissOverlayModeButton.IsChecked}"
+                UseLightDismissOverlayMode="{Binding #UseLightDismissOverlayModeButton.IsChecked}">
-                            PanePlacement="{Binding #PanePlacementButton.IsChecked}"
+                <SplitView.Background>
-                            DisplayMode="{Binding #DisplayModeSelector.SelectedItem}"
+                    <LinearGradientBrush StartPoint="0%,0%" EndPoint="0%,100%">
-                            CompactPaneLength="{Binding #CompactPaneLengthSlider.Value}"
+                        <GradientStop Offset="0" Color="#6b4c1b" />
-                            OpenPaneLength="{Binding #OpenPaneLengthSlider.Value}">
+                        <GradientStop Offset="1" Color="#291e10" />
-                            <SplitView.Background>
+                    </LinearGradientBrush>
-                                <LinearGradientBrush StartPoint="0%,0%" EndPoint="0%,100%">
+                </SplitView.Background>
-                                    <GradientStop Color="#6b4c1b" Offset="0" />
+                <SplitView.Pane>
-                                    <GradientStop Color="#291e10" Offset="1" />
+                    <Grid RowDefinitions="Auto,*,Auto">
-                                </LinearGradientBrush>
+                        <StackPanel Grid.Row="0" Orientation="Horizontal" Margin="8 12">
-                            </SplitView.Background>
+                            <ToggleSwitch
-                            <SplitView.Pane>
+                                Content="{StaticResource SemiIconSidebar}"
-                                <Grid RowDefinitions="Auto,*,Auto">
+                                IsChecked="{Binding #SplitView.IsPaneOpen}"
-                                    <TextBlock
+                                Theme="{DynamicResource IconBorderlessToggleSwitch}" />
-                                        Grid.Row="0"
+                            <TextBlock
-                                        Name="PaneHeader"
+                                Name="PaneHeader"
-                                        Margin="8,12"
+                                VerticalAlignment="Center"
-                                        FontWeight="Bold"
+                                Margin="8 0"
-                                        Text="Playlist" />
+                                FontWeight="Bold"
-                                    <ListBox
+                                Text="Playlist" />
-                                        Grid.Row="1"
+                        </StackPanel>
-                                        ItemsSource="{Binding Songs}" />
+                        
-                                    <ToggleSwitch
+                        <ListBox Grid.Row="1" ItemsSource="{Binding Songs}" />
-                                        Grid.Row="2"
+                        
-                                        Theme="{DynamicResource IconBorderlessToggleSwitch}"
+                    </Grid>
-                                        Content="{StaticResource SemiIconSidebar}"
+                </SplitView.Pane>
-                                        HorizontalAlignment="Left"
-                                        IsChecked="{Binding #SplitView.IsPaneOpen}" />
-                                </Grid>
-                            </SplitView.Pane>
 
-                            <Panel>
+                <Panel>
-                                <Panel.Styles>
+                    <Panel.Styles>
-                                    <Style Selector="Image#AlbumCover">
+                        <Style Selector="Image#AlbumCover">
-                                        <Style.Animations>
+                            <Style.Animations>
-                                            <Animation IterationCount="Infinite" Duration="0:0:40">
+                                <Animation IterationCount="Infinite" Duration="0:0:40">
-                                                <KeyFrame Cue="0%">
+                                    <KeyFrame Cue="0%">
-                                                    <Setter Property="RotateTransform.Angle" Value="0" />
+                                        <Setter Property="RotateTransform.Angle" Value="0" />
-                                                </KeyFrame>
+                                    </KeyFrame>
-                                                <KeyFrame Cue="100%">
+                                    <KeyFrame Cue="100%">
-                                                    <Setter Property="RotateTransform.Angle" Value="360" />
+                                        <Setter Property="RotateTransform.Angle" Value="360" />
-                                                </KeyFrame>
+                                    </KeyFrame>
-                                            </Animation>
+                                </Animation>
-                                        </Style.Animations>
+                            </Style.Animations>
-                                    </Style>
+                        </Style>
-                                </Panel.Styles>
+                    </Panel.Styles>
-                                <Image
+                    <Image
-                                    Source="/Assets/WORLD.png"
+                        Name="AlbumCover"
-                                    Name="AlbumCover"
+                        Width="200"
-                                    Width="200"
+                        Height="200"
-                                    Height="200" />
+                        Source="/Assets/WORLD.png" />
-                                <Arc
+                    <Arc
-                                    Width="290"
+                        Width="290"
-                                    Height="290"
+                        Height="290"
-                                    StartAngle="0"
+                        StartAngle="0"
-                                    SweepAngle="360"
+                        StrokeJoin="Round"
-                                    StrokeJoin="Round"
+                        StrokeLineCap="Round"
-                                    StrokeLineCap="Round"
+                        StrokeThickness="45"
-                                    StrokeThickness="45">
+                        SweepAngle="360">
-                                    <Arc.Stroke>
+                        <Arc.Stroke>
-                                        <LinearGradientBrush StartPoint="0%,0%" EndPoint="100%,0%">
+                            <LinearGradientBrush StartPoint="0%,0%" EndPoint="100%,0%">
-                                            <GradientStop Color="#010101" Offset="0" />
+                                <GradientStop Offset="0" Color="#010101" />
-                                            <GradientStop Color="#363636" Offset="0.5" />
+                                <GradientStop Offset="0.5" Color="#363636" />
-                                            <GradientStop Color="#010101" Offset="1" />
+                                <GradientStop Offset="1" Color="#010101" />
-                                        </LinearGradientBrush>
+                            </LinearGradientBrush>
-                                    </Arc.Stroke>
+                        </Arc.Stroke>
-                                </Arc>
+                    </Arc>
-                                <Arc
+                    <Arc
-                                    Width="294"
+                        Width="294"
-                                    Height="294"
+                        Height="294"
-                                    StartAngle="0"
+                        StartAngle="0"
-                                    SweepAngle="360"
+                        Stroke="Black"
-                                    StrokeJoin="Round"
+                        StrokeJoin="Round"
-                                    StrokeLineCap="Round"
+                        StrokeLineCap="Round"
-                                    StrokeThickness="4"
+                        StrokeThickness="4"
-                                    Stroke="Black" />
+                        SweepAngle="360" />
-                                <Arc
+                    <Arc
-                                    Width="310"
+                        Width="310"
-                                    Height="310"
+                        Height="310"
-                                    StartAngle="0"
+                        Opacity="0.1"
-                                    SweepAngle="360"
+                        StartAngle="0"
-                                    StrokeJoin="Round"
+                        Stroke="#C6CACD"
-                                    StrokeLineCap="Round"
+                        StrokeJoin="Round"
-                                    StrokeThickness="10"
+                        StrokeLineCap="Round"
-                                    Stroke="#C6CACD"
+                        StrokeThickness="10"
-                                    Opacity="0.1" />
+                        SweepAngle="360" />
-                            </Panel>
+                </Panel>
-
+            </SplitView>
-                        </SplitView>
-                    </Border>
-                </TabItem>
-                <TabItem Header="VerticalSplitView">
-                    <Border
-                        BorderBrush="{DynamicResource SemiGrey1}"
-                        BorderThickness="1">
-                        <SplitView
-                            Name="SplitView2"
-                            Theme="{DynamicResource VerticalSplitView}"
-                            IsPaneOpen="{Binding #PaneOpenButton.IsChecked,Mode=TwoWay}"
-                            UseLightDismissOverlayMode="{Binding #UseLightDismissOverlayModeButton.IsChecked}"
-                            PanePlacement="{Binding #PanePlacementButton.IsChecked}"
-                            DisplayMode="{Binding #DisplayModeSelector.SelectedItem}"
-                            CompactPaneLength="{Binding #CompactPaneLengthSlider.Value}"
-                            OpenPaneLength="{Binding #OpenPaneLengthSlider.Value}">
-                            <SplitView.Background>
-                                <LinearGradientBrush StartPoint="0%,0%" EndPoint="0%,100%">
-                                    <GradientStop Color="#6b4c1b" Offset="0" />
-                                    <GradientStop Color="#291e10" Offset="1" />
-                                </LinearGradientBrush>
-                            </SplitView.Background>
-                            <SplitView.Pane>
-                                <Grid RowDefinitions="Auto,Auto,*">
-                                    <ToggleSwitch
-                                        Grid.Row="0"
-                                        Theme="{DynamicResource IconBorderlessToggleSwitch}"
-                                        Content="{StaticResource SemiIconSidebar}"
-                                        HorizontalAlignment="Left"
-                                        IsChecked="{Binding #SplitView2.IsPaneOpen}" />
-                                    <TextBlock
-                                        Grid.Row="1"
-                                        Margin="8,12"
-                                        FontWeight="Bold"
-                                        Text="Playlist" />
-                                    <ListBox
-                                        Grid.Row="2"
-                                        ItemsSource="{Binding Songs}" />
-                                </Grid>
-                            </SplitView.Pane>
-
-                            <Panel>
-                                <Panel.Styles>
-                                    <Style Selector="Image#AlbumCover2">
-                                        <Style.Animations>
-                                            <Animation IterationCount="Infinite" Duration="0:0:40">
-                                                <KeyFrame Cue="0%">
-                                                    <Setter Property="RotateTransform.Angle" Value="0" />
-                                                </KeyFrame>
-                                                <KeyFrame Cue="100%">
-                                                    <Setter Property="RotateTransform.Angle" Value="360" />
-                                                </KeyFrame>
-                                            </Animation>
-                                        </Style.Animations>
-                                    </Style>
-                                </Panel.Styles>
-                                <Image
-                                    Source="/Assets/WORLD.png"
-                                    Name="AlbumCover2"
-                                    Width="200"
-                                    Height="200" />
-                                <Arc
-                                    Width="290"
-                                    Height="290"
-                                    StartAngle="0"
-                                    SweepAngle="360"
-                                    StrokeJoin="Round"
-                                    StrokeLineCap="Round"
-                                    StrokeThickness="45">
-                                    <Arc.Stroke>
-                                        <LinearGradientBrush StartPoint="0%,0%" EndPoint="100%,0%">
-                                            <GradientStop Color="#010101" Offset="0" />
-                                            <GradientStop Color="#363636" Offset="0.5" />
-                                            <GradientStop Color="#010101" Offset="1" />
-                                        </LinearGradientBrush>
-                                    </Arc.Stroke>
-                                </Arc>
-                                <Arc
-                                    Width="294"
-                                    Height="294"
-                                    StartAngle="0"
-                                    SweepAngle="360"
-                                    StrokeJoin="Round"
-                                    StrokeLineCap="Round"
-                                    StrokeThickness="4"
-                                    Stroke="Black" />
-                                <Arc
-                                    Width="310"
-                                    Height="310"
-                                    StartAngle="0"
-                                    SweepAngle="360"
-                                    StrokeJoin="Round"
-                                    StrokeLineCap="Round"
-                                    StrokeThickness="10"
-                                    Stroke="#C6CACD"
-                                    Opacity="0.1" />
-                            </Panel>
-
-                        </SplitView>
-                    </Border>
-                </TabItem>
-            </TabControl>
         </Grid>
     </Border>
 </UserControl>

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

@@ -7,7 +7,6 @@
     xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels;assembly=Semi.Avalonia.Demo"
     d:DesignHeight="450"
     d:DesignWidth="800"
-    x:CompileBindings="True"
     x:DataType="vm:TabControlDemoViewModel"
     mc:Ignorable="d">
     <ScrollViewer>

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

@@ -5,7 +5,6 @@
              xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:Class="Semi.Avalonia.Demo.Pages.TabStripDemo"
-             x:CompileBindings="True"
              x:DataType="vm:TabStripDemoViewModel">
     <Design.DataContext>
         <vm:TabStripDemoViewModel />

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

@@ -48,6 +48,7 @@
                     IsEnabled="False" />
             </StackPanel>
             <TextBox Width="300" Classes="TextArea" Watermark="TextArea TextBox" />
+            <TextBox Width="300" Classes="TextArea ClearButton" Text="TextArea with ClearButton - text should be clearable" />
             <TextBox
                 Width="300"
                 Theme="{StaticResource LooklessTextBox}"

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

@@ -1,98 +0,0 @@
-<UserControl
-    x:Class="Semi.Avalonia.Demo.Pages.ToggleButtonDemo"
-    xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-    d:DesignHeight="450"
-    d:DesignWidth="800"
-    mc:Ignorable="d">
-    <StackPanel Spacing="20">
-        <TextBlock Text="Toggle Button (Default)" />
-        <StackPanel Orientation="Horizontal" Spacing="20">
-            <ToggleButton>Default</ToggleButton>
-            <ToggleButton Classes="Primary">Primary</ToggleButton>
-            <ToggleButton Classes="Secondary">Secondary</ToggleButton>
-            <ToggleButton Classes="Tertiary">Tertiary</ToggleButton>
-            <ToggleButton Classes="Success">Success</ToggleButton>
-            <ToggleButton Classes="Warning">Warning</ToggleButton>
-            <ToggleButton Classes="Danger">Danger</ToggleButton>
-            <ToggleButton Classes="Danger" IsEnabled="False">Disabled</ToggleButton>
-        </StackPanel>
-        <TextBlock Text="Toggle Button Checked State" />
-        <StackPanel Orientation="Horizontal" Spacing="20">
-            <ToggleButton IsChecked="True">Default</ToggleButton>
-            <ToggleButton Classes="Primary" IsChecked="True">Primary</ToggleButton>
-            <ToggleButton Classes="Secondary" IsChecked="True">Secondary</ToggleButton>
-            <ToggleButton Classes="Tertiary" IsChecked="True">Tertiary</ToggleButton>
-            <ToggleButton Classes="Success" IsChecked="True">Success</ToggleButton>
-            <ToggleButton Classes="Warning" IsChecked="True">Warning</ToggleButton>
-            <ToggleButton Classes="Danger" IsChecked="True">Danger</ToggleButton>
-            <ToggleButton
-                Classes="Danger"
-                IsChecked="True"
-                IsEnabled="False">
-                Disabled
-            </ToggleButton>
-        </StackPanel>
-        <TextBlock Text="Toggle Button Three State" />
-        <StackPanel Orientation="Horizontal" Spacing="20">
-            <ToggleButton IsChecked="{x:Null}" IsThreeState="True">Default</ToggleButton>
-            <ToggleButton
-                Classes="Primary"
-                IsChecked="{x:Null}"
-                IsThreeState="True">
-                Primary
-            </ToggleButton>
-            <ToggleButton
-                Classes="Secondary"
-                IsChecked="{x:Null}"
-                IsThreeState="True">
-                Secondary
-            </ToggleButton>
-            <ToggleButton
-                Classes="Tertiary"
-                IsChecked="{x:Null}"
-                IsThreeState="True">
-                Tertiary
-            </ToggleButton>
-            <ToggleButton
-                Classes="Success"
-                IsChecked="{x:Null}"
-                IsThreeState="True">
-                Success
-            </ToggleButton>
-            <ToggleButton
-                Classes="Warning"
-                IsChecked="{x:Null}"
-                IsThreeState="True">
-                Warning
-            </ToggleButton>
-            <ToggleButton
-                Classes="Danger"
-                IsChecked="{x:Null}"
-                IsThreeState="True">
-                Danger
-            </ToggleButton>
-            <ToggleButton
-                Classes="Danger"
-                IsChecked="{x:Null}"
-                IsEnabled="False"
-                IsThreeState="True">
-                Disabled
-            </ToggleButton>
-        </StackPanel>
-        <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>
-        </StackPanel>
-    </StackPanel>
-</UserControl>

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

@@ -1,11 +0,0 @@
-using Avalonia.Controls;
-
-namespace Semi.Avalonia.Demo.Pages;
-
-public partial class ToggleButtonDemo : UserControl
-{
-    public ToggleButtonDemo()
-    {
-        InitializeComponent();
-    }
-}

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

@@ -6,7 +6,6 @@
              xmlns:converters="clr-namespace:Semi.Avalonia.Demo.Converters"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:Class="Semi.Avalonia.Demo.Pages.TreeDataGridDemo"
-             x:CompileBindings="True"
              x:DataType="vm:TreeDataGridDemoViewModel">
     <UserControl.Resources>
         <converters:FileIconConverter x:Key="FileIconConverter">

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

@@ -14,10 +14,9 @@ public partial class TreeDataGridDemo : UserControl
 
     private void SelectedPath_KeyDown(object? sender, KeyEventArgs e)
     {
-        if (e.Key == Key.Enter)
+        if (e.Key == Key.Enter && DataContext is TreeDataGridDemoViewModel vm)
         {
-            var vm = DataContext as TreeDataGridDemoViewModel;
+            vm.FilesContext.SelectedPath = (sender as TextBox)?.Text;
-            vm.FilesContext.SelectedPath = (sender as TextBox)!.Text;
         }
     }
 }

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

@@ -8,7 +8,6 @@
     xmlns:vm="clr-namespace:Semi.Avalonia.Demo.Pages"
     d:DesignHeight="450"
     d:DesignWidth="800"
-    x:CompileBindings="True"
     x:DataType="vm:TreeViewVm"
     mc:Ignorable="d">
 

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

@@ -21,33 +21,40 @@ public class TreeViewVm : ObservableObject
 
     public TreeViewVm()
     {
-        Items = new ObservableCollection<TreeViewItemVm>()
+        Items =
-        {
+        [
-            new TreeViewItemVm() { Name = "Item 1", Id = "1" },
+            new TreeViewItemVm { Name = "Item 1", Id = "1" },
-            new TreeViewItemVm() { Name = "Item 2", Id = "2" },
+            new TreeViewItemVm { Name = "Item 2", Id = "2" },
-            new TreeViewItemVm()
+            new TreeViewItemVm
             {
-                Name = "Item 3", Id = "3", Items = new ObservableCollection<TreeViewItemVm>()
+                Name = "Item 3", Id = "3", Items =
-                {
+                [
-                    new TreeViewItemVm() { Name = "Item 3.1", Id = "3.1" },
+                    new TreeViewItemVm { Name = "Item 3.1", Id = "3.1" },
-                    new TreeViewItemVm() { Name = "Item 3.2", Id = "3.2" },
+                    new TreeViewItemVm { Name = "Item 3.2", Id = "3.2" },
-                    new TreeViewItemVm() { Name = "Item 3.3", Id = "3.3" },
+                    new TreeViewItemVm { Name = "Item 3.3", Id = "3.3" }
-                },
+                ],
-            },
+            }
-        };
 
-        MultipleLevelItems = new();
+        ];
-        for (int i = 1; i < 6; i++)
+
+        MultipleLevelItems = [];
+        for (var i = 1; i < 6; i++)
         {
-            FirstItem firstItem = new FirstItem { Id = i, Name = $"FirstItem {i}" };
+            var firstItem = new FirstItem
-            firstItem.SecondItems = new();
-            for (int j = 1; j < 6; j++)
             {
-                SecondItem secondItem = new SecondItem { Id = j, Name = $"SecondItem {j}" };
+                Id = i, Name = $"FirstItem {i}",
-                secondItem.ThirdItemItems = new();
+                SecondItems = []
-                for (int k = 1; k < 6; k++)
+            };
+            for (var j = 1; j < 6; j++)
+            {
+                var secondItem = new SecondItem
                 {
-                    ThirdItem thirdItem = new ThirdItem { Id = k, Name = $"ThirdItem {k}" };
+                    Id = j, Name = $"SecondItem {j}",
+                    ThirdItemItems = []
+                };
+                for (var k = 1; k < 6; k++)
+                {
+                    var thirdItem = new ThirdItem { Id = k, Name = $"ThirdItem {k}" };
                     secondItem.ThirdItemItems.Add(thirdItem);
                 }
 
@@ -61,9 +68,9 @@ public class TreeViewVm : ObservableObject
 
 public partial class TreeViewItemVm : ObservableObject
 {
-    public ObservableCollection<TreeViewItemVm> Items { get; set; }
+    public ObservableCollection<TreeViewItemVm> Items { get; set; } = [];
-    public string Name { get; set; }
+    public string? Name { get; set; }
-    public string Id { get; set; }
+    public string? Id { get; set; }
 }
 
 public class ItemBase

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

@@ -6,89 +6,99 @@
              xmlns:pages="clr-namespace:Semi.Avalonia.Demo.Pages"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:Class="Semi.Avalonia.Demo.Pages.VariablesDemo"
-             x:DataType="vm:VariablesDemoViewModel"
+             x:DataType="vm:VariablesDemoViewModel">
-             x:CompileBindings="True">
     <Design.DataContext>
         <vm:VariablesDemoViewModel />
     </Design.DataContext>
-    <DataGrid
+    <Grid RowDefinitions="Auto, *">
-        Margin="8"
+        <TextBox
-        CanUserReorderColumns="True"
+            Grid.Row="0"
-        CanUserResizeColumns="True"
+            Width="600"
-        CanUserSortColumns="True"
+            Margin="8"
-        HeadersVisibility="All"
+            Classes="ClearButton"
-        IsReadOnly="True"
+            Text="{Binding SearchText}"
-        ItemsSource="{Binding GridData}">
+            Watermark="Input Variable Category/ResourceKey/Type/Value/Description" />
-        <DataGrid.Columns>
+
-            <DataGridTemplateColumn
+        <DataGrid
-                Width="300"
+            Grid.Row="1"
-                x:DataType="vm:VariableItem"
+            Margin="8"
-                Header="ResourceKey">
+            CanUserReorderColumns="True"
-                <DataGridTemplateColumn.CellTemplate>
+            CanUserResizeColumns="True"
-                    <DataTemplate DataType="vm:VariableItem">
+            CanUserSortColumns="True"
-                        <SelectableTextBlock
+            HeadersVisibility="All"
-                            Margin="12,0"
+            IsReadOnly="True"
-                            VerticalAlignment="Center"
+            ItemsSource="{Binding GridData}">
-                            Text="{Binding ResourceKey}" />
+            <DataGrid.Columns>
-                    </DataTemplate>
+                <DataGridTemplateColumn
-                </DataGridTemplateColumn.CellTemplate>
+                    Width="300"
-            </DataGridTemplateColumn>
+                    x:DataType="vm:VariableItem"
-            <DataGridTemplateColumn
+                    Header="ResourceKey">
-                Width="200"
+                    <DataGridTemplateColumn.CellTemplate>
-                x:DataType="vm:VariableItem"
+                        <DataTemplate DataType="vm:VariableItem">
-                Header="Type">
+                            <SelectableTextBlock
-                <DataGridTemplateColumn.CellTemplate>
+                                Margin="12,0"
-                    <DataTemplate DataType="vm:VariableItem">
+                                VerticalAlignment="Center"
-                        <SelectableTextBlock
+                                Text="{Binding ResourceKey}" />
-                            Margin="12,0"
+                        </DataTemplate>
-                            VerticalAlignment="Center"
+                    </DataGridTemplateColumn.CellTemplate>
-                            Text="{Binding Type.Name}" />
+                </DataGridTemplateColumn>
-                    </DataTemplate>
+                <DataGridTemplateColumn
-                </DataGridTemplateColumn.CellTemplate>
+                    Width="200"
-            </DataGridTemplateColumn>
+                    x:DataType="vm:VariableItem"
-            <DataGridTemplateColumn
+                    Header="Type">
-                Width="200"
+                    <DataGridTemplateColumn.CellTemplate>
-                x:DataType="vm:VariableItem"
+                        <DataTemplate DataType="vm:VariableItem">
-                Header="Value">
+                            <SelectableTextBlock
-                <DataGridTemplateColumn.CellTemplate>
+                                Margin="12,0"
-                    <DataTemplate DataType="vm:VariableItem">
+                                VerticalAlignment="Center"
-                        <SelectableTextBlock
+                                Text="{Binding Type.Name}" />
-                            Margin="12,0"
+                        </DataTemplate>
-                            VerticalAlignment="Center"
+                    </DataGridTemplateColumn.CellTemplate>
-                            Text="{Binding Value}"
+                </DataGridTemplateColumn>
-                            TextWrapping="Wrap" />
+                <DataGridTemplateColumn
-                    </DataTemplate>
+                    Width="200"
-                </DataGridTemplateColumn.CellTemplate>
+                    x:DataType="vm:VariableItem"
-            </DataGridTemplateColumn>
+                    Header="Value">
-            <DataGridTemplateColumn
+                    <DataGridTemplateColumn.CellTemplate>
-                Width="*"
+                        <DataTemplate DataType="vm:VariableItem">
-                x:DataType="vm:VariableItem"
+                            <SelectableTextBlock
-                Header="Description">
+                                Margin="12,0"
-                <DataGridTemplateColumn.CellTemplate>
+                                VerticalAlignment="Center"
-                    <DataTemplate DataType="vm:VariableItem">
+                                Text="{Binding Value}"
-                        <SelectableTextBlock
+                                TextWrapping="Wrap" />
-                            Margin="12,0"
+                        </DataTemplate>
-                            VerticalAlignment="Center"
+                    </DataGridTemplateColumn.CellTemplate>
-                            Text="{Binding Description}"
+                </DataGridTemplateColumn>
-                            TextWrapping="Wrap" />
+                <DataGridTemplateColumn
-                    </DataTemplate>
+                    Width="*"
-                </DataGridTemplateColumn.CellTemplate>
+                    x:DataType="vm:VariableItem"
-            </DataGridTemplateColumn>
+                    Header="Description">
-            <DataGridTemplateColumn
+                    <DataGridTemplateColumn.CellTemplate>
-                Width="100"
+                        <DataTemplate DataType="vm:VariableItem">
-                x:DataType="vm:VariableItem"
+                            <SelectableTextBlock
-                Header="CopyText"
+                                Margin="12,0"
-                SortMemberPath="Duration">
+                                VerticalAlignment="Center"
-                <DataGridTemplateColumn.CellTemplate>
+                                Text="{Binding Description}"
-                    <DataTemplate DataType="vm:VariableItem">
+                                TextWrapping="Wrap" />
-                        <Button
+                        </DataTemplate>
-                            Command="{Binding $parent[pages:VariablesDemo].Copy}"
+                    </DataGridTemplateColumn.CellTemplate>
-                            CommandParameter="{Binding CopyText}"
+                </DataGridTemplateColumn>
-                            Theme="{DynamicResource  IconBorderlessButton}"
+                <DataGridTemplateColumn
-                            Content="{StaticResource SemiIconCopy}" />
+                    Width="100"
-                    </DataTemplate>
+                    x:DataType="vm:VariableItem"
-                </DataGridTemplateColumn.CellTemplate>
+                    Header="CopyText"
-            </DataGridTemplateColumn>
+                    SortMemberPath="Duration">
-        </DataGrid.Columns>
+                    <DataGridTemplateColumn.CellTemplate>
-    </DataGrid>
+                        <DataTemplate DataType="vm:VariableItem">
+                            <Button
+                                Command="{Binding $parent[pages:VariablesDemo].Copy}"
+                                CommandParameter="{Binding CopyText}"
+                                Theme="{DynamicResource  IconBorderlessButton}"
+                                Content="{StaticResource SemiIconCopy}" />
+                        </DataTemplate>
+                    </DataGridTemplateColumn.CellTemplate>
+                </DataGridTemplateColumn>
+            </DataGrid.Columns>
+        </DataGrid>
+    </Grid>
 </UserControl>

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

@@ -3,6 +3,7 @@
         <TargetFramework>net8.0</TargetFramework>
         <Nullable>enable</Nullable>
         <LangVersion>latest</LangVersion>
+        <AvaloniaUseCompiledBindingsByDefault>true</AvaloniaUseCompiledBindingsByDefault>
     </PropertyGroup>
 
     <ItemGroup>
@@ -10,16 +11,16 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia"/>
-        <PackageReference Include="Avalonia.Controls.ColorPicker" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia.Controls.ColorPicker"/>
-        <PackageReference Include="Avalonia.Controls.DataGrid" Version="$(DataGridVersion)"/>
+        <PackageReference Include="Avalonia.Controls.DataGrid"/>
         <!--Condition below is needed to remove Avalonia.Diagnostics package from build output in Release configuration.-->
-        <PackageReference Include="Avalonia.Diagnostics" Version="$(AvaloniaVersion)">
+        <PackageReference Include="Avalonia.Diagnostics">
             <IncludeAssets Condition="'$(Configuration)' != 'Debug'">None</IncludeAssets>
             <PrivateAssets Condition="'$(Configuration)' != 'Debug'">All</PrivateAssets>
         </PackageReference>
-        <PackageReference Include="CommunityToolkit.Mvvm" Version="$(CommunityToolkitVersion)"/>
+        <PackageReference Include="CommunityToolkit.Mvvm"/>
-        <PackageReference Include="Irihi.Avalonia.Shared" Version="0.3.0" />
+        <PackageReference Include="Irihi.Avalonia.Shared"/>
     </ItemGroup>
 
     <ItemGroup>

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

@@ -1,8 +1,7 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls"
+    xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls">
-    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type controls:ColorDetailControl}" TargetType="controls:ColorDetailControl">
         <Setter Property="Template">
             <ControlTemplate TargetType="controls:ColorDetailControl">

demo/Semi.Avalonia.Demo/Themes/ColorItemControl.axaml

@@ -1,8 +1,7 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:controls="using:Semi.Avalonia.Demo.Controls"
+    xmlns:controls="using:Semi.Avalonia.Demo.Controls">
-    x:CompileBindings="True">
     <Design.PreviewWith>
         <controls:ColorItemControl />
     </Design.PreviewWith>

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

@@ -4,7 +4,6 @@
     xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls"
     xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
     xmlns:pages="clr-namespace:Semi.Avalonia.Demo.Pages"
-    x:CompileBindings="True"
     x:DataType="viewModels:FunctionalColorGroupViewModel">
     <ControlTheme x:Key="{x:Type controls:FunctionalColorGroupControl}" TargetType="controls:FunctionalColorGroupControl">
         <Setter Property="Template">

demo/Semi.Avalonia.Demo/Themes/ShadowGroupControl.axaml

@@ -4,7 +4,6 @@
     xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls"
     xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
     xmlns:pages="clr-namespace:Semi.Avalonia.Demo.Pages"
-    x:CompileBindings="True"
     x:DataType="viewModels:ShadowGroupViewModel">
     <ControlTheme x:Key="{x:Type controls:ShadowGroupControl}" TargetType="controls:ShadowGroupControl">
         <Setter Property="Template">

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

@@ -1,12 +1,37 @@
 using Avalonia;
+using Avalonia.Controls;
 using Avalonia.Controls.ApplicationLifetimes;
 using CommunityToolkit.Mvvm.ComponentModel;
 using CommunityToolkit.Mvvm.Input;
+using CommunityToolkit.Mvvm.Messaging;
 
 namespace Semi.Avalonia.Demo.ViewModels;
 
 public partial class ApplicationViewModel : ObservableObject
 {
+    [RelayCommand]
+    private void Activate()
+    {
+        if (Application.Current?.ApplicationLifetime is not IClassicDesktopStyleApplicationLifetime desktop) return;
+        var mainWindow = desktop.MainWindow;
+        if (mainWindow is not null && !mainWindow.IsActive)
+        {
+            if (mainWindow.WindowState is WindowState.Minimized)
+            {
+                mainWindow.WindowState = WindowState.Normal;
+            }
+
+            mainWindow.Activate();
+        }
+    }
+
+    [RelayCommand]
+    private void JumpTo(string header)
+    {
+        Activate();
+        WeakReferenceMessenger.Default.Send(header, "JumpTo");
+    }
+
     [RelayCommand]
     private void Exit()
     {

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

@@ -1,4 +1,5 @@
-using System.Collections.Generic;
+using System;
+using System.Collections.Generic;
 using System.Collections.ObjectModel;
 using System.Linq;
 using Avalonia.Controls;
@@ -9,20 +10,21 @@ namespace Semi.Avalonia.Demo.ViewModels;
 
 public partial class IconDemoViewModel : ObservableObject
 {
-    private readonly IResourceDictionary? _resources = new Icons();
+    private readonly Icons _resources = new();
 
-    private readonly Dictionary<string, IconItem> _filledIcons = new();
+    private readonly Dictionary<string, IconItem> _fillIcons = new();
     private readonly Dictionary<string, IconItem> _strokedIcons = new();
+    private readonly Dictionary<string, IconItem> _aiIcons = new();
 
     [ObservableProperty] private string? _searchText;
 
-    public ObservableCollection<IconItem> FilteredFilledIcons { get; set; } = [];
+    public ObservableCollection<IconTab> IconTabs { get; } = [];
+    public ObservableCollection<IconItem> FilteredFillIcons { get; set; } = [];
     public ObservableCollection<IconItem> FilteredStrokedIcons { get; set; } = [];
+    public ObservableCollection<IconItem> FilteredAIIcons { get; set; } = [];
 
     public void InitializeResources()
     {
-        if (_resources is null) return;
-
         foreach (var provider in _resources.MergedDictionaries)
         {
             if (provider is not ResourceDictionary dic) continue;
@@ -30,40 +32,60 @@ public partial class IconDemoViewModel : ObservableObject
             foreach (var key in dic.Keys)
             {
                 if (dic[key] is not Geometry geometry) continue;
+                var resourceKey = key.ToString() ?? string.Empty;
                 var icon = new IconItem
                 {
-                    ResourceKey = key.ToString(),
+                    ResourceKey = resourceKey,
                     Geometry = geometry
                 };
 
-                if (key.ToString().EndsWith("Stroked"))
+                if (resourceKey.StartsWith("SemiIconAI"))
-                    _strokedIcons[key.ToString().ToLowerInvariant()] = icon;
+                    _aiIcons[resourceKey] = icon;
+                else if (resourceKey.EndsWith("Stroked", StringComparison.InvariantCultureIgnoreCase))
+                    _strokedIcons[resourceKey] = icon;
                 else
-                    _filledIcons[key.ToString().ToLowerInvariant()] = icon;
+                    _fillIcons[resourceKey] = icon;
             }
         }
 
         OnSearchTextChanged(string.Empty);
+
+        IconTabs.Clear();
+        IconTabs.Add(new IconTab("Fill Icons", FilteredFillIcons));
+        IconTabs.Add(new IconTab("Stroked Icons", FilteredStrokedIcons));
+        IconTabs.Add(new IconTab("AI Icons", FilteredAIIcons));
     }
 
     partial void OnSearchTextChanged(string? value)
     {
-        var search = value?.ToLowerInvariant() ?? string.Empty;
+        var search = string.IsNullOrWhiteSpace(value) ? string.Empty : value.Trim();
 
-        FilteredFilledIcons.Clear();
+        FilteredFillIcons.Clear();
-        foreach (var pair in _filledIcons.Where(i => i.Key.Contains(search)))
+        foreach (var pair in _fillIcons.Where(kv => kv.Key.Contains(search, StringComparison.InvariantCultureIgnoreCase)))
         {
-            FilteredFilledIcons.Add(pair.Value);
+            FilteredFillIcons.Add(pair.Value);
         }
 
         FilteredStrokedIcons.Clear();
-        foreach (var pair in _strokedIcons.Where(i => i.Key.Contains(search)))
+        foreach (var pair in _strokedIcons.Where(kv => kv.Key.Contains(search, StringComparison.InvariantCultureIgnoreCase)))
         {
             FilteredStrokedIcons.Add(pair.Value);
         }
+
+        FilteredAIIcons.Clear();
+        foreach (var pair in _aiIcons.Where(kv => kv.Key.Contains(search, StringComparison.InvariantCultureIgnoreCase)))
+        {
+            FilteredAIIcons.Add(pair.Value);
+        }
     }
 }
 
+public class IconTab(string header, ObservableCollection<IconItem> iconItems)
+{
+    public string Header { get; set; } = header;
+    public ObservableCollection<IconItem> IconItems { get; set; } = iconItems;
+}
+
 public class IconItem
 {
     public string? ResourceKey { get; set; }

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

@@ -19,7 +19,7 @@ public partial class PaletteDemoViewModel : ObservableObject
         "Red", "Pink", "Purple", "Violet", "Indigo",
         "Blue", "LightBlue", "Cyan", "Teal", "Green",
         "LightGreen", "Lime", "Yellow", "Amber", "Orange",
-        "Grey"
+        "Grey", "AIPurple"
     ];
 
     private readonly IResourceDictionary? _lightResourceDictionary;
@@ -61,6 +61,38 @@ public partial class PaletteDemoViewModel : ObservableObject
             s.Initialize(_darkResourceDictionary, color, false);
             DarkLists.Add(s);
         }
+        
+        InitializeAIGeneralGradients();
+    }
+
+    private void InitializeAIGeneralGradients()
+    {
+        if (_lightResourceDictionary is null || _darkResourceDictionary is null) return;
+
+        ColorListViewModel lightGradients = new ColorListViewModel { SeriesName = "AI General" };
+        ColorListViewModel darkGradients = new ColorListViewModel { SeriesName = "AI General" };
+
+        for (var i = 0; i < 10; i++)
+        {
+            var key = $"SemiAIGeneral{i}";
+            
+            if (_lightResourceDictionary.TryGetValue(key, out var lightValue) && lightValue is IBrush lightBrush)
+            {
+                var name = $"AI General {i}";
+                var item = new ColorItemViewModel(name, lightBrush, key, true, i);
+                lightGradients.Color.Add(item);
+            }
+
+            if (_darkResourceDictionary.TryGetValue(key, out var darkValue) && darkValue is IBrush darkBrush)
+            {
+                var name = $"AI General {i}";
+                var item = new ColorItemViewModel(name, darkBrush, key, false, i);
+                darkGradients.Color.Add(item);
+            }
+        }
+        
+        LightLists.Add(lightGradients);
+        DarkLists.Add(darkGradients);
     }
 
     private void InitializeFunctionalColors()
@@ -79,6 +111,12 @@ public partial class PaletteDemoViewModel : ObservableObject
             "Warning", _lightResourceDictionary, _darkResourceDictionary, ColorTokens.WarningTokens));
         FunctionalColors.Add(new FunctionalColorGroupViewModel(
             "Danger", _lightResourceDictionary, _darkResourceDictionary, ColorTokens.DangerTokens));
+        FunctionalColors.Add(new FunctionalColorGroupViewModel(
+            "AI General", _lightResourceDictionary, _darkResourceDictionary, ColorTokens.AIGeneralTokens));
+        FunctionalColors.Add(new FunctionalColorGroupViewModel(
+            "AI Purple", _lightResourceDictionary, _darkResourceDictionary, ColorTokens.AIPurpleTokens));
+        FunctionalColors.Add(new FunctionalColorGroupViewModel(
+            "AI Background", _lightResourceDictionary, _darkResourceDictionary, ColorTokens.AIBackgroundTokens));
         FunctionalColors.Add(new FunctionalColorGroupViewModel(
             "Text", _lightResourceDictionary, _darkResourceDictionary, ColorTokens.TextTokens));
         FunctionalColors.Add(new FunctionalColorGroupViewModel(
@@ -142,14 +180,24 @@ public partial class ColorItemViewModel : ObservableObject
          <StaticResource x:Key="" ResourceKey="{ResourceKey}" />
          """;
 
-    public ColorItemViewModel(string colorDisplayName, ISolidColorBrush brush, string resourceKey, bool light,
+    public ColorItemViewModel(string colorDisplayName, IBrush brush, string resourceKey, bool light,
         int index)
     {
         ColorDisplayName = colorDisplayName;
         Brush = brush;
         ResourceKey = resourceKey;
-        var hex = ColorConverter.ToHex.Convert(brush.Color, typeof(string), false, CultureInfo.InvariantCulture);
+        
-        Hex = hex as string ?? string.Empty;
+        // Only calculate hex for solid color brushes
+        if (brush is ISolidColorBrush solidBrush)
+        {
+            var hex = ColorConverter.ToHex.Convert(solidBrush.Color, typeof(string), false, CultureInfo.InvariantCulture);
+            Hex = hex as string ?? string.Empty;
+        }
+        else
+        {
+            Hex = string.Empty;
+        }
+        
         if ((light && index < 5) || (!light && index >= 5))
         {
             TextBrush = Brushes.Black;
@@ -175,7 +223,7 @@ public partial class FunctionalColorGroupViewModel : ObservableObject
         {
             if (lightDictionary?.TryGetValue(key, out var lightValue) ?? false)
             {
-                if (lightValue is ISolidColorBrush lightBrush)
+                if (lightValue is IBrush lightBrush)
                 {
                     LightColors.Add(new ColorItemViewModel(name, lightBrush, key, true, 0));
                 }
@@ -183,7 +231,7 @@ public partial class FunctionalColorGroupViewModel : ObservableObject
 
             if (darkDictionary?.TryGetValue(key, out var darkValue) ?? false)
             {
-                if (darkValue is ISolidColorBrush darkBrush)
+                if (darkValue is IBrush darkBrush)
                 {
                     DarkColors.Add(new ColorItemViewModel(name, darkBrush, key, true, 0));
                 }

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

@@ -26,4 +26,12 @@ public class SplitViewDemoViewModel : ObservableObject
         SplitViewDisplayMode.Overlay,
         SplitViewDisplayMode.CompactOverlay,
     ];
+
+    public static ObservableCollection<SplitViewPanePlacement> Placements { get; set; } =
+    [
+        SplitViewPanePlacement.Left,
+        SplitViewPanePlacement.Right,
+        SplitViewPanePlacement.Top,
+        SplitViewPanePlacement.Bottom
+    ];
 }

demo/Semi.Avalonia.Demo/ViewModels/TreeDataGridDemo/FilesPageViewModel.cs

@@ -19,9 +19,15 @@ public partial class FilesPageViewModel : ObservableObject
     public IList<string> Drives { get; }
     public HierarchicalTreeDataGridSource<FileNodeViewModel> Source { get; }
     [ObservableProperty] private string _selectedDrive;
-    [ObservableProperty] private string? _selectedPath;
+    private string? _selectedPath;
     [ObservableProperty] private FileNodeViewModel? _root;
 
+    public string? SelectedPath
+    {
+        get => _selectedPath;
+        set => SetSelectedPath(value);
+    }
+
     partial void OnSelectedDriveChanged(string value)
     {
         Root = new FileNodeViewModel(value, true, true);
@@ -31,11 +37,6 @@ public partial class FilesPageViewModel : ObservableObject
         }
     }
 
-    partial void OnSelectedPathChanged(string? value)
-    {
-        SetSelectedPath(value);
-    }
-
     public FilesPageViewModel()
     {
         Drives = DriveInfo.GetDrives().Select(x => x.Name).ToList();
@@ -48,7 +49,7 @@ public partial class FilesPageViewModel : ObservableObject
             SelectedDrive = Drives.FirstOrDefault() ?? "/";
         }
 
-        Source = new HierarchicalTreeDataGridSource<FileNodeViewModel>(Array.Empty<FileNodeViewModel>())
+        Source = new HierarchicalTreeDataGridSource<FileNodeViewModel>([])
         {
             Columns =
             {
@@ -108,16 +109,14 @@ public partial class FilesPageViewModel : ObservableObject
         foreach (var i in e.SelectedItems)
             Trace.WriteLine($"Selected '{i?.Path}'");
     }
-
+    private void SetSelectedPath(string? path)
-    private void SetSelectedPath(string? value)
     {
-        if (string.IsNullOrEmpty(value))
+        if (string.IsNullOrEmpty(path))
         {
             Source.RowSelection!.Clear();
             return;
         }
 
-        var path = value;
         var components = new Stack<string>();
         DirectoryInfo? d = null;
 
@@ -148,7 +147,7 @@ public partial class FilesPageViewModel : ObservableObject
             if (driveIndex >= 0)
                 SelectedDrive = Drives[driveIndex];
 
-            FileNodeViewModel? node = _root;
+            var node = Root;
             index = new IndexPath(0);
 
             while (node is not null && components.Count > 0)
@@ -162,7 +161,7 @@ public partial class FilesPageViewModel : ObservableObject
             }
         }
 
-        Source.Items = [Root];
+        Source.Items = [Root!];
         Source.RowSelection!.SelectedIndex = index;
     }
 }
@@ -275,8 +274,8 @@ public partial class FileNodeViewModel : ObservableObject, IEditableObject
         };
     }
 
-    void IEditableObject.BeginEdit() => _undoName = _name;
+    void IEditableObject.BeginEdit() => _undoName = Name;
-    void IEditableObject.CancelEdit() => _name = _undoName!;
+    void IEditableObject.CancelEdit() => Name = _undoName ?? string.Empty;
     void IEditableObject.EndEdit() => _undoName = null;
 
     private void OnChanged(object sender, FileSystemEventArgs e)

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

@@ -10,9 +10,10 @@ using Semi.Avalonia.Tokens;
 
 namespace Semi.Avalonia.Demo.ViewModels;
 
-public class VariablesDemoViewModel : ObservableObject
+public partial class VariablesDemoViewModel : ObservableObject
 {
     public DataGridCollectionView GridData { get; set; }
+    [ObservableProperty] private string _searchText = string.Empty;
 
     public VariablesDemoViewModel()
     {
@@ -30,7 +31,7 @@ public class VariablesDemoViewModel : ObservableObject
         GridData.GroupDescriptions.Add(new DataGridPathGroupDescription(nameof(VariableItem.Category)));
     }
 
-    private static string GetValueString(object? value)
+    private static string? GetValueString(object? value)
     {
         if (value is null) return string.Empty;
 
@@ -45,6 +46,28 @@ public class VariablesDemoViewModel : ObservableObject
         };
     }
 
+    partial void OnSearchTextChanged(string value)
+    {
+        if (string.IsNullOrWhiteSpace(value))
+        {
+            GridData.Filter = _ => true;
+            GridData.Refresh();
+            return;
+        }
+
+        var search = value.Trim();
+        GridData.Filter = item =>
+        {
+            if (item is not VariableItem variableItem) return false;
+            return (variableItem.Category?.Contains(search, StringComparison.InvariantCultureIgnoreCase) ?? false) ||
+                   (variableItem.ResourceKey?.Contains(search, StringComparison.InvariantCultureIgnoreCase) ?? false) ||
+                   (variableItem.Value?.Contains(search, StringComparison.InvariantCultureIgnoreCase) ?? false) ||
+                   (variableItem.Type?.Name.Contains(search, StringComparison.InvariantCultureIgnoreCase) ?? false) ||
+                   (variableItem.Description?.Contains(search, StringComparison.InvariantCultureIgnoreCase) ?? false);
+        };
+        GridData.Refresh();
+    }
+
     private static List<VariableItem> Tokens { get; set; } =
     [
         new("Height", "SemiHeightControlSmall"),
@@ -55,6 +78,11 @@ public class VariablesDemoViewModel : ObservableObject
         new("Icon Size", "SemiWidthIconMedium"),
         new("Icon Size", "SemiWidthIconLarge"),
         new("Icon Size", "SemiWidthIconExtraLarge"),
+        new("Border CornerRadius Spacing", "SemiBorderRadiusSpacingExtraSmall"),
+        new("Border CornerRadius Spacing", "SemiBorderRadiusSpacingSmall"),
+        new("Border CornerRadius Spacing", "SemiBorderRadiusSpacingMedium"),
+        new("Border CornerRadius Spacing", "SemiBorderRadiusSpacingLarge"),
+        new("Border CornerRadius Spacing", "SemiBorderRadiusSpacingFull"),
         new("Border CornerRadius", "SemiBorderRadiusExtraSmall"),
         new("Border CornerRadius", "SemiBorderRadiusSmall"),
         new("Border CornerRadius", "SemiBorderRadiusMedium"),

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

@@ -8,7 +8,6 @@
     xmlns:views="clr-namespace:Semi.Avalonia.Demo.Views"
     d:DesignHeight="450"
     d:DesignWidth="800"
-    x:CompileBindings="True"
     x:DataType="views:MainViewModel"
     mc:Ignorable="d">
     <UserControl.Resources>
@@ -162,15 +161,9 @@
             <TabItem Header="Button">
                 <pages:ButtonDemo />
             </TabItem>
-            <TabItem Header="RepeatButton">
-                <pages:RepeatButtonDemo />
-            </TabItem>
             <TabItem Header="HyperlinkButton">
                 <pages:HyperlinkButtonDemo />
             </TabItem>
-            <TabItem Header="ToggleButton">
-                <pages:ToggleButtonDemo />
-            </TabItem>
             <TabItem Header="CheckBox">
                 <pages:CheckBoxDemo />
             </TabItem>

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

@@ -9,6 +9,7 @@ using Avalonia.Controls.ApplicationLifetimes;
 using Avalonia.Styling;
 using CommunityToolkit.Mvvm.ComponentModel;
 using CommunityToolkit.Mvvm.Input;
+using CommunityToolkit.Mvvm.Messaging;
 
 namespace Semi.Avalonia.Demo.Views;
 
@@ -18,6 +19,19 @@ public partial class MainView : UserControl
     {
         InitializeComponent();
         this.DataContext = new MainViewModel();
+        WeakReferenceMessenger.Default.Register<string, string>(this, "JumpTo", MessageHandler);
+    }
+
+    private void MessageHandler(object _, string message)
+    {
+        foreach (var item in tab.ItemsView)
+        {
+            if (item is TabItem tabItem && tabItem.Header is not null && tabItem.Header.Equals(message))
+            {
+                tab.SelectedItem = tabItem;
+                break;
+            }
+        }
     }
 }
 
@@ -76,55 +90,97 @@ public partial class MainViewModel : ObservableObject
                     {
                         Header = "简体中文",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("zh-cn")
+                        CommandParameter = new CultureInfo("zh-CN")
                     },
                     new MenuItemViewModel
                     {
                         Header = "English",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("en-us")
+                        CommandParameter = new CultureInfo("en-US")
                     },
                     new MenuItemViewModel
                     {
                         Header = "日本語",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("ja-jp")
+                        CommandParameter = new CultureInfo("ja-JP")
+                    },
+                    new MenuItemViewModel
+                    {
+                        Header = "한국어",
+                        Command = SelectLocaleCommand,
+                        CommandParameter = new CultureInfo("ko-KR")
+                    },
+                    new MenuItemViewModel
+                    {
+                        Header = "English (UK)",
+                        Command = SelectLocaleCommand,
+                        CommandParameter = new CultureInfo("en-GB")
+                    },
+                    new MenuItemViewModel
+                    {
+                        Header = "Italiano",
+                        Command = SelectLocaleCommand,
+                        CommandParameter = new CultureInfo("it-IT")
+                    },
+                    new MenuItemViewModel
+                    {
+                        Header = "Italiano (Switzerland)",
+                        Command = SelectLocaleCommand,
+                        CommandParameter = new CultureInfo("it-CH")
+                    },
+                    new MenuItemViewModel
+                    {
+                        Header = "Nederlands",
+                        Command = SelectLocaleCommand,
+                        CommandParameter = new CultureInfo("nl-NL")
+                    },
+                    new MenuItemViewModel
+                    {
+                        Header = "Nederlands (Belgium)",
+                        Command = SelectLocaleCommand,
+                        CommandParameter = new CultureInfo("nl-BE")
                     },
                     new MenuItemViewModel
                     {
                         Header = "Українська",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("uk-ua")
+                        CommandParameter = new CultureInfo("uk-UA")
                     },
                     new MenuItemViewModel
                     {
                         Header = "Русский",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("ru-ru")
+                        CommandParameter = new CultureInfo("ru-RU")
                     },
                     new MenuItemViewModel
                     {
                         Header = "繁體中文",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("zh-tw")
+                        CommandParameter = new CultureInfo("zh-TW")
                     },
                     new MenuItemViewModel
                     {
                         Header = "Deutsch",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("de-de")
+                        CommandParameter = new CultureInfo("de-DE")
                     },
                     new MenuItemViewModel
                     {
                         Header = "Español",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("es-es")
+                        CommandParameter = new CultureInfo("es-ES")
                     },
                     new MenuItemViewModel
                     {
                         Header = "Polski",
                         Command = SelectLocaleCommand,
-                        CommandParameter = new CultureInfo("pl-pl")
+                        CommandParameter = new CultureInfo("pl-PL")
+                    },
+                    new MenuItemViewModel
+                    {
+                        Header = "Français",
+                        Command = SelectLocaleCommand,
+                        CommandParameter = new CultureInfo("fr-FR")
                     },
                 ]
             }

src/Directory.Build.props

@@ -1,16 +1,22 @@
 <Project>
     <PropertyGroup>
-        <TargetFrameworks>netstandard2.0;net6.0;net8.0</TargetFrameworks>
         <Nullable>enable</Nullable>
         <LangVersion>latest</LangVersion>
-        <Version>11.2.1.8</Version>
+        <AvaloniaUseCompiledBindingsByDefault>true</AvaloniaUseCompiledBindingsByDefault>
+    </PropertyGroup>
+
+    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
+        <IsAotCompatible>true</IsAotCompatible>
+    </PropertyGroup>
+
+    <PropertyGroup>
         <Authors>IRIHI Technology Co., Ltd.</Authors>
         <Description>Avalonia Theme inspired by Semi Design.</Description>
         <RepositoryUrl>https://github.com/irihitech/Semi.Avalonia</RepositoryUrl>
+        <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
         <PackageLicenseExpression>MIT</PackageLicenseExpression>
         <PackageIcon>irihi.png</PackageIcon>
-        <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
+        <PackageReadmeFile>README.md</PackageReadmeFile>
-        <AvaloniaVersion>11.2.1</AvaloniaVersion>
     </PropertyGroup>
 
     <ItemGroup>

src/Directory.Packages.props

@@ -0,0 +1,13 @@
+<Project>
+    <PropertyGroup>
+        <ManagePackageVersionsCentrally>true</ManagePackageVersionsCentrally>
+        <AvaloniaVersion>11.3.7</AvaloniaVersion>
+        <DataGridVersion>11.3.7</DataGridVersion>
+    </PropertyGroup>
+    <ItemGroup>
+        <PackageVersion Include="Avalonia" Version="$(AvaloniaVersion)"/>
+        <PackageVersion Include="Avalonia.Controls.ColorPicker" Version="$(AvaloniaVersion)"/>
+        <PackageVersion Include="Avalonia.Controls.DataGrid" Version="$(DataGridVersion)"/>
+        <PackageVersion Include="Avalonia.Controls.TreeDataGrid" Version="11.1.1"/>
+    </ItemGroup>
+</Project>

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

@@ -1,8 +1,7 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converters="using:Avalonia.Controls.Converters"
+    xmlns:converters="using:Avalonia.Controls.Converters">
-    x:CompileBindings="True">
     <converters:CornerRadiusFilterConverter x:Key="LeftCornerRadiusFilterConverter" Filter="TopLeft, BottomLeft" />
     <converters:ToBrushConverter x:Key="ToBrushConverter" />
 

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

@@ -2,8 +2,7 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:converters="using:Avalonia.Controls.Converters"
-    xmlns:pc="using:Avalonia.Controls.Primitives.Converters"
+    xmlns:pc="using:Avalonia.Controls.Primitives.Converters">
-    x:CompileBindings="True">
     <pc:AccentColorConverter x:Key="AccentColorConverter" />
     <converters:CornerRadiusFilterConverter x:Key="LeftCornerRadiusFilterConverter" Filter="TopLeft, BottomLeft" />
     <converters:CornerRadiusFilterConverter x:Key="RightCornerRadiusFilterConverter" Filter="TopRight, BottomRight" />

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

@@ -1,8 +1,7 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converters="using:Avalonia.Controls.Converters"
+    xmlns:converters="using:Avalonia.Controls.Converters">
-    x:CompileBindings="True">
     <converters:CornerRadiusToDoubleConverter x:Key="TopLeftCornerRadiusConverter" Corner="TopLeft" />
     <converters:CornerRadiusToDoubleConverter x:Key="BottomRightCornerRadiusConverter" Corner="BottomRight" />
 

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

@@ -1,8 +1,7 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converters="using:Avalonia.Controls.Converters"
+    xmlns:converters="using:Avalonia.Controls.Converters">
-    x:CompileBindings="True">
     <converters:EnumToBoolConverter x:Key="EnumToBoolConverter" />
     <converters:CornerRadiusToDoubleConverter x:Key="TopLeftCornerRadiusConverter" Corner="TopLeft" />
     <converters:CornerRadiusToDoubleConverter x:Key="BottomRightCornerRadiusConverter" Corner="BottomRight" />

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

@@ -4,8 +4,7 @@
     xmlns:converters="using:Avalonia.Controls.Converters"
     xmlns:globalization="using:System.Globalization"
     xmlns:pc="using:Avalonia.Controls.Primitives.Converters"
-    xmlns:cvts="clr-namespace:Semi.Avalonia.ColorPicker.Converters"
+    xmlns:cvts="clr-namespace:Semi.Avalonia.ColorPicker.Converters">
-    x:CompileBindings="True">
     <pc:ContrastBrushConverter x:Key="ContrastBrushConverter" />
     <converters:ColorToDisplayNameConverter x:Key="ColorToDisplayNameConverter" />
     <converters:ColorToHexConverter x:Key="ColorToHexConverter" />

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

@@ -1,5 +1,4 @@
 <ResourceDictionary
-    x:CompileBindings="True"
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <ResourceDictionary.MergedDictionaries>

src/Semi.Avalonia.ColorPicker/README.md

@@ -0,0 +1,50 @@
+# Semi.Avalonia.ColorPicker
+
+[![Semi Avalonia ColorPicker](https://img.shields.io/nuget/v/Semi.Avalonia.ColorPicker.svg?color=red&style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia.ColorPicker/)
+[![Semi Avalonia ColorPicker](https://img.shields.io/nuget/dt/Semi.Avalonia.ColorPicker.svg?style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia.ColorPicker/)
+
+Avalonia ColorPicker Theme inspired by Semi Design
+
+This package provides Semi Design theming for the Avalonia ColorPicker control.
+
+## Installation
+
+```bash
+dotnet add package Semi.Avalonia.ColorPicker
+```
+
+## Prerequisites
+
+This package requires the main Semi.Avalonia theme to be installed:
+
+```bash
+dotnet add package Semi.Avalonia
+```
+
+## Usage
+
+Include the ColorPicker theme in your application:
+
+```xaml
+<Application
+    ...
+    xmlns:semi="https://irihi.tech/semi">
+    <Application.Styles>
+        <semi:SemiTheme Locale="zh-CN" />
+        <semi:ColorPickerSemiTheme />
+    </Application.Styles>
+</Application>
+```
+
+## Resources
+
+- [Documentation](https://docs.irihi.tech/semi/)
+- [Repository](https://github.com/irihitech/Semi.Avalonia)
+- [Online Demo](https://irihitech.github.io/Semi.Avalonia/)
+- [Download Demo](https://github.com/irihitech/Semi.Avalonia/releases)
+
+## Credits
+
+[Semi Design](https://semi.design/)
+
+[Avalonia](https://github.com/AvaloniaUI/Avalonia)

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

@@ -1,18 +1,15 @@
 <Project Sdk="Microsoft.NET.Sdk">
 
-    <Import Project="../Package.props"/>
-
     <PropertyGroup>
+        <TargetFrameworks>netstandard2.0;net6.0;net8.0</TargetFrameworks>
+        <Version>11.3.7.3</Version>
+        <PackageReleaseNotes>Update to Semi.Avalonia.ColorPicker 11.3.7.3</PackageReleaseNotes>
         <Title>Semi.Avalonia.ColorPicker</Title>
-        <PackageReleaseNotes>Update to Semi.Avalonia.ColorPicker 11.2.1.8</PackageReleaseNotes>
-    </PropertyGroup>
-
-    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
-        <IsAotCompatible>true</IsAotCompatible>
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Controls.ColorPicker" Version="$(AvaloniaVersion)"/>
+        <PackageReference Include="Avalonia.Controls.ColorPicker"/>
+        <None Include="README.md" Pack="true" PackagePath="\"/>
     </ItemGroup>
 
 </Project>

src/Semi.Avalonia.DataGrid/DataGrid.axaml

@@ -86,7 +86,7 @@
                         <Rectangle
                             Name="PART_RightGridLine"
                             Grid.Column="1"
-                            Width="1"
+                            Width="{DynamicResource DataGridGridLineThickness}"
                             VerticalAlignment="Stretch"
                             Fill="{DynamicResource DataGridLineBrush}" />
                     </Grid>
@@ -145,7 +145,7 @@
                         <Rectangle
                             Name="VerticalSeparator"
                             Grid.Column="1"
-                            Width="1"
+                            Width="{DynamicResource DataGridGridLineThickness}"
                             VerticalAlignment="Stretch"
                             Fill="{TemplateBinding SeparatorBrush}"
                             IsVisible="{TemplateBinding AreSeparatorsVisible}" />
@@ -209,7 +209,7 @@
                     <Rectangle
                         Grid.Row="0"
                         Grid.RowSpan="2"
-                        Height="1"
+                        Height="{DynamicResource DataGridGridLineThickness}"
                         VerticalAlignment="Bottom"
                         Fill="{DynamicResource DataGridLineBrush}"
                         StrokeThickness="1" />
@@ -250,7 +250,7 @@
                         Grid.Row="2"
                         Grid.Column="0"
                         Grid.ColumnSpan="2"
-                        Height="1"
+                        Height="{DynamicResource DataGridGridLineThickness}"
                         Margin="1,0,1,0"
                         HorizontalAlignment="Stretch"
                         Fill="{TemplateBinding SeparatorBrush}"
@@ -315,7 +315,7 @@
                             Name="PART_BottomGridLine"
                             Grid.Row="2"
                             Grid.Column="1"
-                            Height="1"
+                            Height="{DynamicResource DataGridGridLineThickness}"
                             HorizontalAlignment="Stretch" />
                     </DataGridFrozenGrid>
                 </Border>
@@ -452,7 +452,7 @@
                         Grid.Row="1"
                         Grid.Column="0"
                         Grid.ColumnSpan="5"
-                        Height="1"
+                        Height="{DynamicResource DataGridGridLineThickness}"
                         Fill="{DynamicResource DataGridLineBrush}" />
                 </DataGridFrozenGrid>
             </ControlTemplate>
@@ -498,7 +498,7 @@
                             Grid.Row="0"
                             Grid.Column="0"
                             Grid.ColumnSpan="3"
-                            Height="1"
+                            Height="{DynamicResource DataGridGridLineThickness}"
                             VerticalAlignment="Bottom"
                             Fill="{DynamicResource DataGridLineBrush}" />
 

src/Semi.Avalonia.DataGrid/README.md

@@ -0,0 +1,50 @@
+# Semi.Avalonia.DataGrid
+
+[![Semi Avalonia DataGrid](https://img.shields.io/nuget/v/Semi.Avalonia.DataGrid.svg?color=red&style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia.DataGrid/)
+[![Semi Avalonia DataGrid](https://img.shields.io/nuget/dt/Semi.Avalonia.DataGrid.svg?style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia.DataGrid/)
+
+Avalonia DataGrid Theme inspired by Semi Design
+
+This package provides Semi Design theming for the Avalonia DataGrid control.
+
+## Installation
+
+```bash
+dotnet add package Semi.Avalonia.DataGrid
+```
+
+## Prerequisites
+
+This package requires the main Semi.Avalonia theme to be installed:
+
+```bash
+dotnet add package Semi.Avalonia
+```
+
+## Usage
+
+Include the DataGrid theme in your application:
+
+```xaml
+<Application
+    ...
+    xmlns:semi="https://irihi.tech/semi">
+    <Application.Styles>
+        <semi:SemiTheme Locale="zh-CN" />
+        <semi:DataGridSemiTheme />
+    </Application.Styles>
+</Application>
+```
+
+## Resources
+
+- [Documentation](https://docs.irihi.tech/semi/)
+- [Repository](https://github.com/irihitech/Semi.Avalonia)
+- [Online Demo](https://irihitech.github.io/Semi.Avalonia/)
+- [Download Demo](https://github.com/irihitech/Semi.Avalonia/releases)
+
+## Credits
+
+[Semi Design](https://semi.design/)
+
+[Avalonia](https://github.com/AvaloniaUI/Avalonia)

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

@@ -2,27 +2,14 @@
 
     <PropertyGroup>
         <TargetFrameworks>netstandard2.0;net6.0;net8.0</TargetFrameworks>
-        <Nullable>enable</Nullable>
+        <Version>11.3.7.3</Version>
-        <LangVersion>latest</LangVersion>
+        <PackageReleaseNotes>Update to Semi.Avalonia.DataGrid 11.3.7.3</PackageReleaseNotes>
-        <Version>11.2.1.8</Version>
-        <PackageReleaseNotes>Update to Semi.Avalonia.DataGrid 11.2.1.8</PackageReleaseNotes>
-        <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>
         <Title>Semi.Avalonia.DataGrid</Title>
     </PropertyGroup>
 
-    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
-        <IsAotCompatible>true</IsAotCompatible>
-    </PropertyGroup>
-
     <ItemGroup>
-        <PackageReference Include="Avalonia.Controls.DataGrid" Version="11.2.1"/>
+        <PackageReference Include="Avalonia.Controls.DataGrid"/>
-        <None Include="..\..\irihi.png" Pack="true" PackagePath="\" Link="Properties\irihi.png"/>
+        <None Include="README.md" Pack="true" PackagePath="\"/>
-        <None Include="..\..\LICENSE" Pack="true" PackagePath="\" Link="Properties\LICENSE"/>
     </ItemGroup>
 
 </Project>

src/Semi.Avalonia.DataGrid/Shared.axaml

@@ -19,4 +19,7 @@
     <StaticResource x:Key="DataGridRowGroupHeaderVisualStrokeThickness" ResourceKey="SemiBorderSpacingControl" />
 
     <StaticResource x:Key="DataGridDisabledCornerRadius" ResourceKey="SemiBorderRadiusSmall" />
+
+    <!-- Grid line thickness -->
+    <x:Double x:Key="DataGridGridLineThickness">1</x:Double>
 </ResourceDictionary>

src/Semi.Avalonia.TreeDataGrid/Dark.axaml

@@ -1,10 +1,10 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <StaticResource x:Key="TreeDataGridGridLinesBrush" ResourceKey="SemiColorBorder" />
-    <StaticResource x:Key="TreeDataGridHeaderPointerOverBackground" ResourceKey="SemiColorFill1" />
+    <StaticResource x:Key="TreeDataGridHeaderPointeroverBackground" ResourceKey="SemiColorFill1" />
     <StaticResource x:Key="TreeDataGridHeaderPressedBackground" ResourceKey="SemiColorFill2" />
-    <SolidColorBrush x:Key="TreeDataGridHeaderPointerOverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TreeDataGridHeaderPointeroverBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="TreeDataGridHeaderPressedBorderBrush" Color="Transparent" />
-    <StaticResource x:Key="TreeDataGridHeaderPointerOverForeground" ResourceKey="SemiColorText1" />
+    <StaticResource x:Key="TreeDataGridHeaderPointeroverForeground" ResourceKey="SemiColorText1" />
     <StaticResource x:Key="TreeDataGridHeaderPressedForeground" ResourceKey="SemiColorText0" />
     <StaticResource x:Key="TreeDataGridCellSelectedBackground" ResourceKey="SemiColorPrimaryLight" />
     <StaticResource x:Key="TreeDataGridColumnHeaderForeground" ResourceKey="SemiColorText2" />

src/Semi.Avalonia.TreeDataGrid/Light.axaml

@@ -1,10 +1,10 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <StaticResource x:Key="TreeDataGridGridLinesBrush" ResourceKey="SemiColorBorder" />
-    <StaticResource x:Key="TreeDataGridHeaderPointerOverBackground" ResourceKey="SemiColorFill1" />
+    <StaticResource x:Key="TreeDataGridHeaderPointeroverBackground" ResourceKey="SemiColorFill1" />
     <StaticResource x:Key="TreeDataGridHeaderPressedBackground" ResourceKey="SemiColorFill2" />
-    <SolidColorBrush x:Key="TreeDataGridHeaderPointerOverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TreeDataGridHeaderPointeroverBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="TreeDataGridHeaderPressedBorderBrush" Color="Transparent" />
-    <StaticResource x:Key="TreeDataGridHeaderPointerOverForeground" ResourceKey="SemiColorText1" />
+    <StaticResource x:Key="TreeDataGridHeaderPointeroverForeground" ResourceKey="SemiColorText1" />
     <StaticResource x:Key="TreeDataGridHeaderPressedForeground" ResourceKey="SemiColorText0" />
     <StaticResource x:Key="TreeDataGridCellSelectedBackground" ResourceKey="SemiColorPrimaryLight" />
     <StaticResource x:Key="TreeDataGridColumnHeaderForeground" ResourceKey="SemiColorText2" />

src/Semi.Avalonia.TreeDataGrid/README.md

@@ -0,0 +1,50 @@
+# Semi.Avalonia.TreeDataGrid
+
+[![Semi Avalonia TreeDataGrid](https://img.shields.io/nuget/v/Semi.Avalonia.TreeDataGrid.svg?color=red&style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia.TreeDataGrid/)
+[![Semi Avalonia TreeDataGrid](https://img.shields.io/nuget/dt/Semi.Avalonia.TreeDataGrid.svg?style=flat-square)](https://www.nuget.org/packages/Semi.Avalonia.TreeDataGrid/)
+
+Avalonia TreeDataGrid Theme inspired by Semi Design
+
+This package provides Semi Design theming for the Avalonia TreeDataGrid control.
+
+## Installation
+
+```bash
+dotnet add package Semi.Avalonia.TreeDataGrid
+```
+
+## Prerequisites
+
+This package requires the main Semi.Avalonia theme to be installed:
+
+```bash
+dotnet add package Semi.Avalonia
+```
+
+## Usage
+
+Include the TreeDataGrid theme in your application:
+
+```xaml
+<Application
+    ...
+    xmlns:semi="https://irihi.tech/semi">
+    <Application.Styles>
+        <semi:SemiTheme Locale="zh-CN" />
+        <semi:TreeDataGridSemiTheme />
+    </Application.Styles>
+</Application>
+```
+
+## Resources
+
+- [Documentation](https://docs.irihi.tech/semi/)
+- [Repository](https://github.com/irihitech/Semi.Avalonia)
+- [Online Demo](https://irihitech.github.io/Semi.Avalonia/)
+- [Download Demo](https://github.com/irihitech/Semi.Avalonia/releases)
+
+## Credits
+
+[Semi Design](https://semi.design/)
+
+[Avalonia](https://github.com/AvaloniaUI/Avalonia)

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

@@ -2,26 +2,14 @@
 
     <PropertyGroup>
         <TargetFramework>net6.0</TargetFramework>
-        <Nullable>enable</Nullable>
+        <Version>11.1.1.1</Version>
-        <LangVersion>latest</LangVersion>
+        <PackageReleaseNotes>Update to Semi.Avalonia.TreeDataGrid 11.1.1.1</PackageReleaseNotes>
-        <Version>11.0.10.4</Version>
+        <Title>Semi.Avalonia.TreeDataGrid</Title>
-        <PackageReleaseNotes>Update to 11.0.10.4</PackageReleaseNotes>
-        <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>
-    </PropertyGroup>
-
-    <PropertyGroup Condition="$([MSBuild]::IsTargetFrameworkCompatible('$(TargetFramework)', 'net8.0'))">
-        <IsAotCompatible>true</IsAotCompatible>
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia.Controls.TreeDataGrid" Version="11.0.10"/>
+        <PackageReference Include="Avalonia.Controls.TreeDataGrid"/>
-        <None Include="..\..\irihi.png" Pack="true" PackagePath="\" Link="Properties\irihi.png"/>
+        <None Include="README.md" Pack="true" PackagePath="\"/>
-        <None Include="..\..\LICENSE" Pack="true" PackagePath="\" Link="Properties\LICENSE"/>
     </ItemGroup>
 
 </Project>

src/Semi.Avalonia.TreeDataGrid/TreeDataGrid.axaml

@@ -1,7 +1,8 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:conv="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls.TreeDataGrid">
+    xmlns:conv="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls.TreeDataGrid"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20">
             <TreeDataGridColumnHeader Header="123" />
@@ -112,9 +113,9 @@
         </Setter>
 
         <Style Selector="^:pointerover /template/ Border#DataGridBorder">
-            <Setter Property="Background" Value="{DynamicResource TreeDataGridHeaderPointerOverBackground}" />
+            <Setter Property="Background" Value="{DynamicResource TreeDataGridHeaderPointeroverBackground}" />
-            <Setter Property="BorderBrush" Value="{DynamicResource TreeDataGridHeaderPointerOverBorderBrush}" />
+            <Setter Property="BorderBrush" Value="{DynamicResource TreeDataGridHeaderPointeroverBorderBrush}" />
-            <Setter Property="TextBlock.Foreground" Value="{DynamicResource TreeDataGridHeaderPointerOverForeground}" />
+            <Setter Property="TextBlock.Foreground" Value="{DynamicResource TreeDataGridHeaderPointeroverForeground}" />
         </Style>
 
         <Style Selector="^:pressed /template/ Border#DataGridBorder">

src/Semi.Avalonia/Controls/AdornerLayer.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <ControlTheme x:Key="{x:Type AdornerLayer}" TargetType="AdornerLayer">
         <Setter Property="DefaultFocusAdorner">
             <FocusAdornerTemplate>

src/Semi.Avalonia/Controls/AutoCompleteBox.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <TextBox Text="Hello" />
@@ -20,6 +19,7 @@
                             Name="PART_TextBox"
                             VerticalAlignment="Stretch"
                             MinHeight="{TemplateBinding MinHeight}"
+                            ClearSelectionOnLostFocus="{TemplateBinding ClearSelectionOnLostFocus}"
                             DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                             Theme="{DynamicResource NonErrorTextBox}"
                             InnerLeftContent="{TemplateBinding InnerLeftContent}"
@@ -28,6 +28,7 @@
                         <Popup
                             Name="PART_Popup"
                             MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                            InheritsTransform="True"
                             IsLightDismissEnabled="True"
                             PlacementTarget="{TemplateBinding}">
                             <Border
@@ -62,11 +63,13 @@
                             VerticalAlignment="Stretch"
                             MinHeight="0"
                             Classes="Bordered"
+                            ClearSelectionOnLostFocus="{TemplateBinding ClearSelectionOnLostFocus}"
                             DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                             Watermark="{TemplateBinding Watermark}" />
                         <Popup
                             Name="PART_Popup"
                             MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                            InheritsTransform="True"
                             IsLightDismissEnabled="True"
                             PlacementTarget="{TemplateBinding}">
                             <Border
@@ -84,7 +87,8 @@
                                     Foreground="{TemplateBinding Foreground}"
                                     ItemTemplate="{TemplateBinding ItemTemplate}"
                                     ScrollViewer.HorizontalScrollBarVisibility="Auto"
-                                    ScrollViewer.VerticalScrollBarVisibility="Auto" />
+                                    ScrollViewer.VerticalScrollBarVisibility="Auto" 
+                                    ScrollViewer.IsScrollChainingEnabled="False" />
                             </Border>
                         </Popup>
                     </Panel>

src/Semi.Avalonia/Controls/Border.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <Border Theme="{StaticResource CardBorder}">

src/Semi.Avalonia/Controls/Button.axaml

@@ -1,12 +1,97 @@
 <ResourceDictionary
     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">
+    <!--  Theme: Light, Solid, Outline, Borderless; Default is Light  -->
-    <!--  Button Theme Key: Light, Solid, Outline, Borderless; Default is Light  -->
+    <!--  Color Classes: Primary, Secondary, Tertiary, Success, Warning, Danger; Default is Primary  -->
-    <!--  Button Default Classes: Primary, Secondary, Tertiary, Success, Warning, Danger; Default is Primary  -->
+    <!--  Size Classes: Large, Small  -->
-    <!--  State: default, pointerover, pressed, disabled  -->
+    <!--  AI style Classes: Colorful  -->
+    <!--  PseudoClasses: :pointerover, :pressed, :disabled  -->
+
+    <Design.PreviewWith>
+        <StackPanel Margin="16" Spacing="16">
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" />
+                <Button Content="Primary" Classes="Primary" />
+                <Button Content="Secondary" Classes="Secondary" />
+                <Button Content="Tertiary" Classes="Tertiary" />
+                <Button Content="Success" Classes="Success" />
+                <Button Content="Warning" Classes="Warning" />
+                <Button Content="Danger" Classes="Danger" />
+                <Button Content="Disabled" Classes="Danger" IsEnabled="False" />
+            </WrapPanel>
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Primary" Classes="Primary" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Secondary" Classes="Secondary" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Success" Classes="Success" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Warning" Classes="Warning" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Danger" Classes="Danger" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Disabled" Classes="Danger" Theme="{DynamicResource SolidButton}" IsEnabled="False" />
+            </WrapPanel>
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Primary" Classes="Primary" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Secondary" Classes="Secondary" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Success" Classes="Success" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Warning" Classes="Warning" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Danger" Classes="Danger" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Disabled" Classes="Danger" Theme="{DynamicResource OutlineButton}" IsEnabled="False" />
+            </WrapPanel>
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Primary" Classes="Primary" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Secondary" Classes="Secondary" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Tertiary" Classes="Tertiary" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Success" Classes="Success" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Warning" Classes="Warning" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Danger" Classes="Danger" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Disabled" Classes="Danger" Theme="{DynamicResource BorderlessButton}" IsEnabled="False" />
+            </WrapPanel>
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" Classes="Colorful" />
+                <Button Content="Primary" Classes="Colorful Primary" />
+                <Button Content="Secondary" Classes="Colorful Secondary" />
+                <Button Content="Tertiary" Classes="Colorful Tertiary" />
+                <Button Content="Success" Classes="Colorful Success" />
+                <Button Content="Warning" Classes="Colorful Warning" />
+                <Button Content="Danger" Classes="Colorful Danger" />
+                <Button Content="Disabled" Classes="Colorful Primary" IsEnabled="False" />
+            </WrapPanel>
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" Classes="Colorful" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Success" Classes="Colorful Success" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource SolidButton}" />
+                <Button Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource SolidButton}" IsEnabled="False" />
+            </WrapPanel>
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" Classes="Colorful" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Success" Classes="Colorful Success" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource OutlineButton}" />
+                <Button Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource OutlineButton}" IsEnabled="False" />
+            </WrapPanel>
+            <WrapPanel ItemSpacing="16">
+                <Button Content="Default" Classes="Colorful" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Primary" Classes="Colorful Primary" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Secondary" Classes="Colorful Secondary" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Tertiary" Classes="Colorful Tertiary" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Success" Classes="Colorful Success" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Warning" Classes="Colorful Warning" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Danger" Classes="Colorful Danger" Theme="{DynamicResource BorderlessButton}" />
+                <Button Content="Disabled" Classes="Colorful Primary" Theme="{DynamicResource BorderlessButton}" IsEnabled="False" />
+            </WrapPanel>
+        </StackPanel>
+    </Design.PreviewWith>
 
-    <!--  Button Light  -->
     <ControlTheme x:Key="{x:Type Button}" TargetType="Button">
         <Setter Property="Padding" Value="{DynamicResource ButtonDefaultPadding}" />
         <Setter Property="MinHeight" Value="{DynamicResource ButtonDefaultHeight}" />
@@ -38,7 +123,6 @@
                     CornerRadius="{TemplateBinding CornerRadius}"
                     Content="{TemplateBinding Content}"
                     ContentTemplate="{TemplateBinding ContentTemplate}"
-                    RecognizesAccessKey="True"
                     TextElement.FontSize="{TemplateBinding FontSize}"
                     TextElement.FontWeight="{TemplateBinding FontWeight}"
                     UseLayoutRounding="False" />
@@ -48,6 +132,7 @@
         <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{TemplateBinding Background}" />
             <Setter Property="BorderBrush" Value="{TemplateBinding BorderBrush}" />
+            <Setter Property="RecognizesAccessKey" Value="True" />
         </Style>
 
         <Style Selector="^.Primary /template/ ContentPresenter#PART_ContentPresenter">
@@ -69,6 +154,12 @@
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDangerForeground}" />
         </Style>
 
+        <Style Selector="^.Colorful">
+            <Style Selector="^.Primary /template/ ContentPresenter#PART_ContentPresenter">
+                <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultColorfulPrimaryForeground}" />
+            </Style>
+        </Style>
+
         <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonDefaultPointeroverBorderBrush}" />
@@ -210,6 +301,39 @@
             </Style>
         </Style>
 
+        <Style Selector="^.Colorful">
+            <Style Selector="^.Primary">
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
+                    <Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryBackground}" />
+                </Style>
+                <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPointeroverBackground}" />
+                </Style>
+                <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulPrimaryPressedBackground}" />
+                </Style>
+            </Style>
+            <Style Selector="^.Tertiary">
+                <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource ButtonSolidColorfulTertiaryForeground}" />
+                    <Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryBackground}" />
+                </Style>
+                <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPointeroverBackground}" />
+                </Style>
+                <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
+                    <Setter Property="Background" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource ButtonSolidColorfulTertiaryPressedBackground}" />
+                </Style>
+            </Style>
+        </Style>
+
         <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource ButtonSolidDisabledForeground}" />
             <Setter Property="Background" Value="{DynamicResource ButtonSolidDisabledBackground}" />
@@ -242,6 +366,14 @@
         <Style Selector="^.Danger /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineDangerBorderBrush}" />
         </Style>
+
+        <Style Selector="^.Colorful">
+            <Style Selector="^.Primary /template/ ContentPresenter#PART_ContentPresenter">
+                <Setter Property="Foreground" Value="{DynamicResource ButtonOutlineColorfulPrimaryForeground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ButtonOutlineColorfulPrimaryBorderBrush}" />
+            </Style>
+        </Style>
+
         <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
             <Setter Property="Background" Value="{DynamicResource ButtonOutlineBackground}" />
@@ -262,7 +394,6 @@
             <Setter Property="Background" Value="{DynamicResource ButtonBorderlessBackground}" />
             <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderlessBorderBrush}" />
         </Style>
-
     </ControlTheme>
 
     <ControlTheme x:Key="InnerIconButton" TargetType="Button">

src/Semi.Avalonia/Controls/ButtonSpinner.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <ButtonSpinner Content="Hello World" />

src/Semi.Avalonia/Controls/Calendar.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <Border Padding="20">
             <Calendar />

src/Semi.Avalonia/Controls/CalendarDatePicker.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <StackPanel Margin="20" Width="800" Height="400">
             <CalendarDatePicker HorizontalAlignment="Center" Classes="ClearButton" />
@@ -96,6 +95,7 @@
                             <Popup
                                 Name="PART_Popup"
                                 Grid.Column="0"
+                                InheritsTransform="True"
                                 IsLightDismissEnabled="True"
                                 Placement="BottomEdgeAlignedLeft"
                                 PlacementTarget="{TemplateBinding}">
@@ -111,7 +111,7 @@
                                         DisplayDateStart="{TemplateBinding DisplayDateStart}"
                                         FirstDayOfWeek="{TemplateBinding FirstDayOfWeek}"
                                         IsTodayHighlighted="{TemplateBinding IsTodayHighlighted}"
-                                        SelectedDate="{TemplateBinding SelectedDate, Mode=TwoWay}" />
+                                        SelectedDate="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=SelectedDate, Mode=TwoWay}" />
                                 </Border>
                             </Popup>
                         </Grid>
@@ -171,7 +171,7 @@
                 <Setter Property="BorderBrush" Value="Transparent" />
             </Style>
             <Style Selector="^:pointerover /template/ Border#Background">
-                <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointerOverBackground}" />
+                <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="Transparent" />
             </Style>
             <Style Selector="^:pressed /template/ Border#Background">
@@ -213,8 +213,8 @@
                     <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsBorderBrush}" />
                 </Style>
                 <Style Selector="^:pointerover /template/ Border#Background">
-                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointerOverBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointeroverBackground}" />
-                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsPointerOverBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsPointeroverBorderBrush}" />
                 </Style>
                 <Style Selector="^:pressed /template/ Border#Background">
                     <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPressedBackground}" />

src/Semi.Avalonia/Controls/CaptionButtons.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <CaptionButtons />
     </Design.PreviewWith>
@@ -51,21 +50,33 @@
                             Data="{StaticResource WindowExpandGlyph}"
                             Foreground="{Binding $parent[Button].Foreground}" />
                     </Button>
-                    <Button Name="PART_MinimizeButton" Theme="{StaticResource CaptionButton}">
+                    <Button
+                        Name="PART_MinimizeButton"
+                        Theme="{StaticResource CaptionButton}"
+                        AutomationProperties.Name="Minimize"
+                        Win32Properties.NonClientHitTestResult="MinButton">
                         <PathIcon
                             Name="PART_MinimizeButtonIcon"
                             Theme="{StaticResource InnerPathIcon}"
                             Data="{StaticResource WindowMinimizeGlyph}"
                             Foreground="{Binding $parent[Button].Foreground}" />
                     </Button>
-                    <Button Name="PART_RestoreButton" Theme="{StaticResource CaptionButton}">
+                    <Button
+                        Name="PART_RestoreButton"
+                        Theme="{StaticResource CaptionButton}"
+                        AutomationProperties.Name="Maximize"
+                        Win32Properties.NonClientHitTestResult="MaxButton">
                         <PathIcon
                             Name="PART_RestoreButtonIcon"
                             Theme="{StaticResource InnerPathIcon}"
                             Data="{StaticResource WindowMaximizeGlyph}"
                             Foreground="{Binding $parent[Button].Foreground}" />
                     </Button>
-                    <Button Name="PART_CloseButton" Theme="{StaticResource CaptionButton}">
+                    <Button
+                        Name="PART_CloseButton"
+                        Theme="{StaticResource CaptionButton}"
+                        AutomationProperties.Name="Close"
+                        Win32Properties.NonClientHitTestResult="Close">
                         <PathIcon
                             Name="PART_CloseButtonIcon"
                             Theme="{StaticResource InnerPathIcon}"

src/Semi.Avalonia/Controls/Carousel.axaml

@@ -1,8 +1,7 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converter="clr-namespace:Semi.Avalonia.Converters"
+    xmlns:converter="clr-namespace:Semi.Avalonia.Converters">
-    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Spacing="20" Width="800" Height="800">
             <StackPanel.Styles>

src/Semi.Avalonia/Controls/CheckBox.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <ThemeVariantScope RequestedThemeVariant="Dark">
             <StackPanel Background="{DynamicResource SemiBackground0Color}">
@@ -63,13 +62,16 @@
                             ContentTemplate="{TemplateBinding ContentTemplate}"
                             IsVisible="{TemplateBinding Content,Converter={x:Static ObjectConverters.IsNotNull}}"
                             FontSize="{TemplateBinding FontSize}"
-                            RecognizesAccessKey="True"
                             TextWrapping="Wrap" />
                     </Grid>
                 </Border>
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="RecognizesAccessKey" Value="True" />
+        </Style>
+
         <Style Selector="^:unchecked">
             <Style Selector="^:pointerover /template/ Border#NormalRectangle">
                 <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPointeroverBorderBrush}" />
@@ -220,13 +222,16 @@
                             Foreground="{TemplateBinding Foreground}"
                             IsVisible="{TemplateBinding Content,Converter={x:Static ObjectConverters.IsNotNull}}"
                             FontSize="{TemplateBinding FontSize}"
-                            RecognizesAccessKey="True"
                             TextWrapping="Wrap" />
                     </Grid>
                 </Border>
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="RecognizesAccessKey" Value="True" />
+        </Style>
+
         <Style Selector="^:unchecked">
             <Style Selector="^:pointerover">
                 <Style Selector="^ /template/ Border#NormalRectangle">
@@ -338,12 +343,15 @@
                     Content="{TemplateBinding Content}"
                     ContentTemplate="{TemplateBinding ContentTemplate}"
                     CornerRadius="{TemplateBinding CornerRadius}"
-                    RecognizesAccessKey="True"
                     UseLayoutRounding="False"
                     TextWrapping="Wrap" />
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
+            <Setter Property="RecognizesAccessKey" Value="True" />
+        </Style>
+
         <Style Selector="^:unchecked">
             <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource CheckBoxCardPointeroverBackground}" />

src/Semi.Avalonia/Controls/ComboBox.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <Design.PreviewWith>
         <StackPanel Margin="20">
             <ComboBoxItem>Hello World</ComboBoxItem>
@@ -67,8 +66,14 @@
                             VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                             TextTrimming="CharacterEllipsis"
                             Foreground="{TemplateBinding PlaceholderForeground}"
-                            IsVisible="{TemplateBinding SelectionBoxItem,Converter={x:Static ObjectConverters.IsNull}}"
+                            Text="{TemplateBinding PlaceholderText}">
-                            Text="{TemplateBinding PlaceholderText}" />
+                            <TextBlock.IsVisible>
+                                <MultiBinding Converter="{x:Static BoolConverters.And}">
+                                    <TemplateBinding Property="SelectionBoxItem" Converter="{x:Static ObjectConverters.IsNull}" />
+                                    <TemplateBinding Property="IsEditable" Converter="{x:Static BoolConverters.Not}" />
+                                </MultiBinding>
+                            </TextBlock.IsVisible>
+                        </TextBlock>
                         <ContentPresenter
                             Name="ContentPresenter"
                             Grid.Column="0"
@@ -76,7 +81,20 @@
                             HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                             VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                             Content="{TemplateBinding SelectionBoxItem}"
-                            ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" />
+                            ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
+                            IsVisible="{TemplateBinding IsEditable, Converter={x:Static BoolConverters.Not}}" />
+                        <TextBox
+                            Name="PART_EditableTextBox"
+                            Grid.Column="0"
+                            Theme="{StaticResource LooklessTextBox}"
+                            Padding="{TemplateBinding Padding}"
+                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                            Foreground="{TemplateBinding Foreground}"
+                            Text="{TemplateBinding Text, Mode=TwoWay}"
+                            Watermark="{TemplateBinding PlaceholderText}"
+                            IsVisible="{TemplateBinding IsEditable}" />
+
                         <Button
                             Name="ClearButton"
                             Grid.Column="1"
@@ -199,7 +217,7 @@
                 <Setter Property="Background" Value="{DynamicResource DataValidationErrorsBackground}" />
             </Style>
             <Style Selector="^:pointerover /template/ Border#Background">
-                <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointerOverBackground}" />
+                <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointeroverBackground}" />
                 <Setter Property="BorderBrush" Value="Transparent" />
             </Style>
             <Style Selector="^:pressed /template/ Border#Background">
@@ -212,6 +230,11 @@
             </Style>
         </Style>
 
+        <Style Selector="^[IsEditable=true]">
+            <Setter Property="IsTabStop" Value="False" />
+            <Setter Property="KeyboardNavigation.TabNavigation" Value="Local" />
+        </Style>
+
         <Style Selector="^.Bordered">
             <Style Selector="^ /template/ Border#Background">
                 <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedBackground}" />
@@ -250,8 +273,8 @@
                     <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsBorderBrush}" />
                 </Style>
                 <Style Selector="^:pointerover /template/ Border#Background">
-                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointerOverBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPointeroverBackground}" />
-                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsPointerOverBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource DataValidationErrorsPointeroverBorderBrush}" />
                 </Style>
                 <Style Selector="^:pressed /template/ Border#Background">
                     <Setter Property="Background" Value="{DynamicResource DataValidationErrorsPressedBackground}" />

src/Semi.Avalonia/Controls/ContextMenu.axaml

@@ -1,7 +1,6 @@
 <ResourceDictionary
     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">
     <ControlTheme x:Key="{x:Type ContextMenu}" TargetType="ContextMenu">
         <Setter Property="Background" Value="{DynamicResource MenuFlyoutBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource MenuFlyoutBorderBrush}" />

src/Semi.Avalonia/Controls/DataValidationErrors.axaml

@@ -94,12 +94,10 @@
                     <ToolTip.Tip>
                         <ItemsControl x:DataType="collections:IEnumerable" ItemsSource="{Binding}" />
                     </ToolTip.Tip>
-                    <Path
+                    <PathIcon
-                        Width="14"
+                        Theme="{StaticResource InnerPathIcon}"
-                        Height="14"
+                        Data="{StaticResource SemiIconIssueStroked}"
-                        Data="M14,7 A7,7 0 0,0 0,7 M0,7 A7,7 0 1,0 14,7 M7,3l0,5 M7,9l0,2"
+                        Foreground="{DynamicResource DataValidationErrorsForeground}" />
-                        Stroke="{DynamicResource DataValidationErrorsForeground}"
-                        StrokeThickness="2" />
                 </Panel>
             </DataTemplate>
         </Setter>