misc: update package version.

Add Checkbox new theme

README.md

@@ -11,30 +11,57 @@ Avalonia Theme inspired by Semi Design
 
 ## Installation
 ```bash
-dotnet add package Semi.Avalonia --version 0.1.0-preview5
+dotnet add package Semi.Avalonia --version 0.1.0-preview5.3
 ```
 Include Semi Design Styles in application:
 
 ```xaml
 <Application.Styles>
-    <StyleInclude Source="avares://Semi.Avalonia/Themes/DarkTheme.axaml" />
+    <StyleInclude Source="avares://Semi.Avalonia/Themes/Index.axaml" />
 </Application.Styles>
 ```
 
 That's all. 
 
+DataGrid and ColorPicker are distributed in separated packages. Please install if you need. 
+```bash
+dotnet add package Semi.Avalonia.ColorPicker --version 0.1.0-preview5.2
+dotnet add package Semi.Avalonia.DataGrid --version 0.1.0-preview5.2
+```
+```xaml
+<Application.Styles>
+    <StyleInclude Source="avares://Semi.Avalonia.DataGrid/Index.axaml" />
+    <StyleInclude Source="avares://Semi.Avalonia.ColorPicker/Index.axaml" />
+</Application.Styles>
+```
+
+## Demo
+
+You can always download demo executable to play around with Semi Avalonia Themes.
+https://github.com/irihitech/Semi.Avalonia/releases
+
 ## Version compatibility
 
-|Semi Design Version| Avalonia Version|
+| Semi Design Version | Avalonia Version|
-|:---|:---|
+|:--------------------|:---|
-|0.1.0-preview3|11.0-preview4|
+| 0.1.0-preview3      |11.0-preview4|
-|0.1.0-preview5|11.0-preview5|
+| 0.1.0-preview5.x    |11.0-preview5|
 
 ## TODO
 * DataValidationErrors
 * FocusAdorner
-* DataGrid
+
-* ColorPicker
+## Credits
+
+[Semi Design](https://semi.design/)
+
+[Avalonia](https://github.com/AvaloniaUI/Avalonia)
+
+[FluentAvalonia](https://github.com/amwx/FluentAvalonia)
+
+[Material Design Icons](https://pictogrammers.com/library/mdi/)
+
+[CommunityToolKit](https://github.com/CommunityToolkit/dotnet)
 
 ## Screenshot
 

Semi.Avalonia.sln

@@ -9,6 +9,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "Solution Files", "Solution
 	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}") = "Demo", "Demo", "{43091528-9509-43CB-A003-9C5C11E96DD6}"

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

@@ -4,11 +4,20 @@
         <TargetFramework>net7.0</TargetFramework>
         <Nullable>enable</Nullable>
         <BuiltInComInteropSupport>true</BuiltInComInteropSupport>
+        <!-- Uncomment below to enable Native AOT compilation-->
+        <!--
+        <PublishAot>true</PublishAot>
+        <IncludeNativeLibrariesForSelfExtract>true</IncludeNativeLibrariesForSelfExtract>
+        -->
     </PropertyGroup>
 
     <PropertyGroup>
         <ApplicationManifest>app.manifest</ApplicationManifest>
     </PropertyGroup>
+    
+    <ItemGroup>
+        <RdXmlFile Include="rd.xml"/>
+    </ItemGroup>
 
     <ItemGroup>
         <PackageReference Include="Avalonia.Desktop" Version="11.0.0-preview5" />

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

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

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

@@ -1,7 +1,10 @@
 <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"
+    xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
+    x:CompileBindings="True"
+    x:DataType="viewModels:ColorItemViewModel">
     <PathGeometry x:Key="CopyIcon">M5 7C3.89543 7 3 7.89543 3 9V19C3 20.1046 3.89543 21 5 21H15C16.1046 21 17 20.1046 17 19V9C17 7.89543 16.1046 7 15 7H5Z,M7 4C7 2.89543 7.89543 2 9 2H20C21.1046 2 22 2.89543 22 4V15C22 16.1046 21.1046 17 20 17H19V8C19 6 18 5 16 5H7V4Z</PathGeometry>
     <ControlTheme x:Key="{x:Type controls:ColorDetailControl}" TargetType="controls:ColorDetailControl">
         <!--  Add Resources Here  -->

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

@@ -1,7 +1,10 @@
 <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"
+    xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
+    x:CompileBindings="True"
+    x:DataType="viewModels:ColorItemViewModel">
     <Design.PreviewWith>
         <controls:ColorItemControl />
     </Design.PreviewWith>

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

@@ -2,7 +2,9 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls"
-    xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels">
+    xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
+    x:CompileBindings="True"
+    x:DataType="viewModels:FunctionalColorGroupViewModel">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type controls:FunctionalColorGroupControl}" TargetType="controls:FunctionalColorGroupControl">
         <!--  Add Resources Here  -->
@@ -25,6 +27,7 @@
                                                 <controls:ColorItemControl
                                                     Width="40"
                                                     Height="20"
+                                                    x:DataType="viewModels:ColorItemViewModel"
                                                     Background="{Binding Brush}"
                                                     CornerRadius="3" />
                                             </DataTemplate>
@@ -33,12 +36,17 @@
                                     <DataGridTemplateColumn Width="*" Header="ResourceKey">
                                         <DataGridTemplateColumn.CellTemplate>
                                             <DataTemplate>
-                                                <SelectableTextBlock VerticalAlignment="Center" Text="{Binding ResourceKey}" />
+                                                <SelectableTextBlock
+                                                    Margin="12,0,12,0"
+                                                    VerticalAlignment="Center"
+                                                    x:DataType="viewModels:ColorItemViewModel"
+                                                    Text="{Binding ResourceKey}" />
                                             </DataTemplate>
                                         </DataGridTemplateColumn.CellTemplate>
                                     </DataGridTemplateColumn>
                                     <DataGridTextColumn
                                         Width="*"
+                                        x:DataType="viewModels:ColorItemViewModel"
                                         Binding="{Binding ColorDisplayName}"
                                         CanUserSort="False"
                                         Header="Name" />
@@ -46,8 +54,9 @@
                                         <DataGridTemplateColumn.CellTemplate>
                                             <DataTemplate>
                                                 <SelectableTextBlock
-                                                    Margin="8,0,0,0"
+                                                    Margin="12,0,12,0"
                                                     VerticalAlignment="Center"
+                                                    x:DataType="viewModels:ColorItemViewModel"
                                                     Text="{Binding Hex}" />
                                             </DataTemplate>
                                         </DataGridTemplateColumn.CellTemplate>
@@ -56,9 +65,10 @@
                                         <DataGridTemplateColumn.CellTemplate>
                                             <DataTemplate>
                                                 <SelectableTextBlock
-                                                    Margin="8,0,0,0"
+                                                    Margin="12,0,12,0"
                                                     HorizontalAlignment="Right"
                                                     VerticalAlignment="Center"
+                                                    x:DataType="viewModels:ColorItemViewModel"
                                                     Text="{Binding Brush.Opacity}" />
                                             </DataTemplate>
                                         </DataGridTemplateColumn.CellTemplate>
@@ -75,6 +85,7 @@
                                                 <controls:ColorItemControl
                                                     Width="40"
                                                     Height="20"
+                                                    x:DataType="viewModels:ColorItemViewModel"
                                                     Background="{Binding Brush}"
                                                     CornerRadius="3" />
                                             </DataTemplate>
@@ -83,12 +94,17 @@
                                     <DataGridTemplateColumn Width="*" Header="ResourceKey">
                                         <DataGridTemplateColumn.CellTemplate>
                                             <DataTemplate>
-                                                <SelectableTextBlock VerticalAlignment="Center" Text="{Binding ResourceKey}" />
+                                                <SelectableTextBlock
+                                                    Margin="12,0,12,0"
+                                                    VerticalAlignment="Center"
+                                                    x:DataType="viewModels:ColorItemViewModel"
+                                                    Text="{Binding ResourceKey}" />
                                             </DataTemplate>
                                         </DataGridTemplateColumn.CellTemplate>
                                     </DataGridTemplateColumn>
                                     <DataGridTextColumn
                                         Width="*"
+                                        x:DataType="viewModels:ColorItemViewModel"
                                         Binding="{Binding ColorDisplayName}"
                                         CanUserSort="False"
                                         Header="Name" />
@@ -96,8 +112,9 @@
                                         <DataGridTemplateColumn.CellTemplate>
                                             <DataTemplate>
                                                 <SelectableTextBlock
-                                                    Margin="8,0,0,0"
+                                                    Margin="12,0,12,0"
                                                     VerticalAlignment="Center"
+                                                    x:DataType="viewModels:ColorItemViewModel"
                                                     Text="{Binding Hex}" />
                                             </DataTemplate>
                                         </DataGridTemplateColumn.CellTemplate>
@@ -106,9 +123,10 @@
                                         <DataGridTemplateColumn.CellTemplate>
                                             <DataTemplate>
                                                 <SelectableTextBlock
-                                                    Margin="8,0,0,0"
+                                                    Margin="12,0,12,0"
                                                     HorizontalAlignment="Right"
                                                     VerticalAlignment="Center"
+                                                    x:DataType="viewModels:ColorItemViewModel"
                                                     Text="{Binding Brush.Opacity}" />
                                             </DataTemplate>
                                         </DataGridTemplateColumn.CellTemplate>

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

@@ -7,6 +7,8 @@
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     d:DesignHeight="450"
     d:DesignWidth="800"
+    x:CompileBindings="False"
+    x:DataType="local:AutoCompleteBoxDemoViewModel"
     mc:Ignorable="d">
     <Design.DataContext>
         <local:AutoCompleteBoxDemoViewModel />
@@ -17,7 +19,10 @@
                 <Setter Property="Width" Value="300" />
             </Style>
         </StackPanel.Styles>
-        <AutoCompleteBox Items="{Binding States}" ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
+        <AutoCompleteBox
+            Items="{Binding States}"
+            ValueMemberBinding="{Binding Name}"
+            Watermark="Please select a State">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
                     <TextBlock Text="{Binding Name}" />
@@ -25,9 +30,40 @@
             </AutoCompleteBox.ItemTemplate>
         </AutoCompleteBox>
         <AutoCompleteBox
+            Classes="Large"
             Items="{Binding States}"
-            Theme="{StaticResource BorderlessAutoCompleteBox}"
+            ValueMemberBinding="{ReflectionBinding Name}">
-            ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
+        <AutoCompleteBox
+            Classes="Small"
+            Items="{Binding States}"
+            ValueMemberBinding="{ReflectionBinding Name}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
+        <AutoCompleteBox
+            Classes="Bordered"
+            Items="{Binding States}"
+            ValueMemberBinding="{ReflectionBinding Name}">
+            <AutoCompleteBox.ItemTemplate>
+                <DataTemplate DataType="local:StateData">
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </AutoCompleteBox.ItemTemplate>
+        </AutoCompleteBox>
+        <AutoCompleteBox
+            IsEnabled="False"
+            Items="{Binding States}"
+            ValueMemberBinding="{ReflectionBinding Name}"
+            Watermark="Disabled">
             <AutoCompleteBox.ItemTemplate>
                 <DataTemplate DataType="local:StateData">
                     <TextBlock Text="{Binding Name}" />

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

@@ -9,6 +9,9 @@
     mc:Ignorable="d">
     <StackPanel HorizontalAlignment="Left" Spacing="20">
         <CalendarDatePicker />
+        <CalendarDatePicker Width="500" />
+        <CalendarDatePicker Classes="Large" />
+        <CalendarDatePicker Classes="Small" />
         <CalendarDatePicker
             Name="DatePicker2"
             Margin="0,0,0,8"
@@ -21,5 +24,7 @@
         <CalendarDatePicker Margin="0,0,0,8" Watermark="Watermark" />
 
         <CalendarDatePicker IsEnabled="False" />
+        <CalendarDatePicker Classes="Bordered" />
+        <CalendarDatePicker Classes="Bordered" IsEnabled="False" />
     </StackPanel>
 </UserControl>

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

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

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

@@ -23,5 +23,31 @@
             <ComboBoxItem>BBB</ComboBoxItem>
             <ComboBoxItem>CCC</ComboBoxItem>
         </ComboBox>
+        <ComboBox
+            Width="150"
+            Classes="Large"
+            IsEnabled="False">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox Width="150" Classes="Small">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox Width="150" Classes="Bordered">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
+        <ComboBox
+            Width="150"
+            Classes="Bordered"
+            IsEnabled="False">
+            <ComboBoxItem>AAA</ComboBoxItem>
+            <ComboBoxItem>BBB</ComboBoxItem>
+            <ComboBoxItem>CCC</ComboBoxItem>
+        </ComboBox>
     </StackPanel>
 </UserControl>

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

@@ -11,5 +11,7 @@
         <DatePicker />
         <DatePicker DayFormat="d (ddd)" YearVisible="False" />
         <DatePicker IsEnabled="False" />
+        <DatePicker Classes="Large" />
+        <DatePicker Classes="Small" />
     </StackPanel>
 </UserControl>

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

@@ -73,7 +73,7 @@
                 <MenuItem Header="Child 19" />
             </MenuItem>
         </Menu>
-        <Border>
+        <Border Theme="{DynamicResource CardBorder}">
             <Border.ContextMenu>
                 <ContextMenu>
                     <MenuItem Header="Standard _Menu Item" InputGesture="Ctrl+A" />
@@ -100,7 +100,7 @@
             </Border.ContextMenu>
             <TextBlock Text="Right Click to show Context Menu" />
         </Border>
-        <Border>
+        <Border Theme="{DynamicResource CardBorder}">
             <Border.ContextFlyout>
                 <MenuFlyout>
                     <MenuItem Header="Standard _Menu Item" InputGesture="Ctrl+A" />

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

@@ -96,7 +96,11 @@
                 </TabItem>
             </TabControl>
             <StackPanel Orientation="Horizontal" Spacing="20">
-                <ComboBox Width="200" PlaceholderText="Please Select" />
+                <ComboBox Width="200" PlaceholderText="Please Select" >
+                    <ComboBoxItem>Item 1</ComboBoxItem>
+                    <ComboBoxItem>Item 2</ComboBoxItem>
+                    <ComboBoxItem>Item 3</ComboBoxItem>
+                </ComboBox>
                 <DatePicker />
                 <TimePicker />
                 <CalendarDatePicker />

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

@@ -8,6 +8,8 @@
     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>
         <viewModels:PaletteDemoViewModel />

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

@@ -62,6 +62,15 @@
                 TickFrequency="10"
                 TickPlacement="TopLeft"
                 Value="0" />
+            <Slider
+                Height="300"
+                IsSnapToTickEnabled="True"
+                Maximum="100"
+                Minimum="0"
+                Orientation="Vertical"
+                TickFrequency="10"
+                TickPlacement="Outside"
+                Value="0" />
             <Slider
                 Height="300"
                 Classes="ToolTip"
@@ -71,6 +80,22 @@
                 TickFrequency="10"
                 TickPlacement="TopLeft"
                 Value="0" />
+            <Slider
+                Height="300"
+                IsDirectionReversed="True"
+                Maximum="100"
+                Minimum="0"
+                Orientation="Vertical"
+                TickFrequency="10"
+                Value="0" />
+            <Slider
+                Height="300"
+                IsEnabled="False"
+                Maximum="100"
+                Minimum="0"
+                Orientation="Vertical"
+                TickFrequency="10"
+                Value="30" />
         </StackPanel>
     </StackPanel>
 </UserControl>

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

@@ -25,7 +25,6 @@
 
                 <ToggleSwitch
                     Content="Placement"
-                    IsChecked="{Binding !IsLeft}"
                     OffContent="Left"
                     OnContent="Right" />
 

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

@@ -1,11 +1,16 @@
 <UserControl
-    x:Class="Semi.Avalonia.Demo.Pages.TextBlockDemo" xmlns="https://github.com/avaloniaui"
+    x:Class="Semi.Avalonia.Demo.Pages.TextBlockDemo"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns="https://github.com/avaloniaui"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" d:DesignHeight="600"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    d:DesignWidth="800" mc:Ignorable="d">
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    d:DesignHeight="600"
+    d:DesignWidth="800"
+    mc:Ignorable="d">
     <StackPanel Orientation="Horizontal">
         <StackPanel
-            Margin="20" HorizontalAlignment="Left"
+            Margin="20"
+            HorizontalAlignment="Left"
             Spacing="5">
             <TextBlock>Styles for TextBlock</TextBlock>
             <TextBlock Classes="H1" Theme="{StaticResource TitleTextBlock}">Header 1</TextBlock>
@@ -20,15 +25,18 @@
             <TextBlock Classes="Tertiary">Tertiary</TextBlock>
             <TextBlock Classes="Quaternary">Quaternary</TextBlock>
             <TextBlock Classes="Warning">Warning</TextBlock>
+            <TextBlock Classes="Warning" IsEnabled="False">Warning disabled</TextBlock>
             <TextBlock Classes="Danger">Danger</TextBlock>
             <TextBlock Classes="Success">Success</TextBlock>
             <TextBlock IsEnabled="False">Disabled</TextBlock>
             <TextBlock Classes="Mark">Default Mark</TextBlock>
             <TextBlock Classes="Underline">Underline</TextBlock>
             <TextBlock Classes="Delete">Delete</TextBlock>
+            <TextBlock Classes="Underline Delete">Underline and Delete</TextBlock>
         </StackPanel>
         <StackPanel
-            Margin="20" HorizontalAlignment="Left"
+            Margin="20"
+            HorizontalAlignment="Left"
             Spacing="5">
             <TextBlock>Styles for SelectableTextBlock</TextBlock>
             <SelectableTextBlock Classes="H1" Theme="{StaticResource TitleSelectableTextBlock}">Header 1</SelectableTextBlock>
@@ -43,15 +51,18 @@
             <SelectableTextBlock Classes="Tertiary">Tertiary</SelectableTextBlock>
             <SelectableTextBlock Classes="Quaternary">Quaternary</SelectableTextBlock>
             <SelectableTextBlock Classes="Warning">Warning</SelectableTextBlock>
+            <SelectableTextBlock Classes="Warning" IsEnabled="False">Warning disabled</SelectableTextBlock>
             <SelectableTextBlock Classes="Danger">Danger</SelectableTextBlock>
             <SelectableTextBlock Classes="Success">Success</SelectableTextBlock>
             <SelectableTextBlock IsEnabled="False">Disabled</SelectableTextBlock>
             <SelectableTextBlock Classes="Mark">Default Mark</SelectableTextBlock>
             <SelectableTextBlock Classes="Underline">Underline</SelectableTextBlock>
             <SelectableTextBlock Classes="Delete">Delete</SelectableTextBlock>
+            <SelectableTextBlock Classes="Underline Delete">Underline and Delete</SelectableTextBlock>
         </StackPanel>
         <StackPanel
-            Margin="20" HorizontalAlignment="Left"
+            Margin="20"
+            HorizontalAlignment="Left"
             Spacing="5">
             <TextBlock>Styles for Label</TextBlock>
             <Label Classes="H1" Theme="{StaticResource TitleLabel}">Header 1</Label>
@@ -66,6 +77,7 @@
             <Label Classes="Tertiary">Tertiary</Label>
             <Label Classes="Quaternary">Quaternary</Label>
             <Label Classes="Warning">Warning</Label>
+            <Label Classes="Warning" IsEnabled="False">Warning disabled</Label>
             <Label Classes="Danger">Danger</Label>
             <Label Classes="Success">Success</Label>
             <Label IsEnabled="False">Disabled</Label>

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

@@ -1,26 +1,46 @@
 <UserControl
-    x:Class="Semi.Avalonia.Demo.Pages.TextBoxDemo" xmlns="https://github.com/avaloniaui"
+    x:Class="Semi.Avalonia.Demo.Pages.TextBoxDemo"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns="https://github.com/avaloniaui"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" d:DesignHeight="450"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    d:DesignWidth="800" mc:Ignorable="d">
+    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">
     <ScrollViewer>
         <StackPanel HorizontalAlignment="Left" Spacing="20">
             <TextBox Width="300" />
+            <TextBox Width="300" Classes="Large" />
+            <TextBox Width="300" Classes="Small" />
             <TextBox Width="300" Watermark="Please use this" />
             <TextBox Width="300" InnerLeftContent="http://" />
             <TextBox Width="300" InnerRightContent=".com" />
             <TextBox
-                Width="500" InnerLeftContent="http://"
+                Width="500"
+                InnerLeftContent="http://"
                 InnerRightContent=".com" />
             <TextBox Width="300" Classes="clearButton" />
             <TextBox Width="300" PasswordChar="*" />
             <TextBox
-                Width="300" Classes="revealPasswordButton"
+                Width="300"
+                Classes="revealPasswordButton"
                 PasswordChar="*" />
             <TextBox
-                Width="500" InnerLeftContent="http://"
+                Width="500"
+                InnerLeftContent="http://"
                 InnerRightContent=".com"
-                Theme="{StaticResource BorderlessTextBox}" />
+                IsEnabled="False" />
+            <TextBox
+                Width="500"
+                Classes="Bordered"
+                InnerLeftContent="http://"
+                InnerRightContent=".com" />
+            <TextBox
+                Width="500"
+                Classes="Bordered"
+                InnerLeftContent="http://"
+                InnerRightContent=".com"
+                IsEnabled="False" />
         </StackPanel>
     </ScrollViewer>
 </UserControl>

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

@@ -12,5 +12,7 @@
         <TimePicker MinuteIncrement="15" />
         <TimePicker ClockIdentifier="24HourClock" />
         <TimePicker ClockIdentifier="12HourClock" IsEnabled="False" />
+        <TimePicker Classes="Large" />
+        <TimePicker Classes="Small" />
     </StackPanel>
 </UserControl>

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

@@ -24,5 +24,26 @@
             IsEnabled="False"
             OffContent="OffContent"
             OnContent="OnContent" />
+        <ToggleSwitch
+            Theme="{DynamicResource SimpleToggleSwitch}"
+            Content="Content"
+            OffContent="OffContent"
+            OnContent="OnContent" />
+        <ToggleSwitch Theme="{DynamicResource ButtonToggleSwitch}">
+            <ToggleSwitch.OnContent>
+                <PathIcon
+                    Width="16"
+                    Height="16"
+                    Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13"
+                    Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
+            </ToggleSwitch.OnContent>
+            <ToggleSwitch.OffContent>
+                <PathIcon
+                    Width="16"
+                    Height="16"
+                    Data="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z"
+                    Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
+            </ToggleSwitch.OffContent>
+        </ToggleSwitch>
     </StackPanel>
-</UserControl>
+</UserControl>

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

@@ -1,35 +1,5 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <!--  Add Resources Here  -->
-    <ControlTheme x:Key="ThemeToggleButton" TargetType="ToggleButton">
-        <Setter Property="ToggleButton.Template">
-            <ControlTemplate TargetType="ToggleButton">
-                <Border
-                    Name="Background"
-                    Padding="8"
-                    Background="{TemplateBinding Background}"
-                    CornerRadius="3">
-                    <PathIcon
-                        Name="Icon"
-                        Width="16"
-                        Height="16"
-                        Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13"
-                        Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
-                </Border>
-            </ControlTemplate>
-        </Setter>
-        <Style Selector="^:pointerover">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
-        </Style>
-        <Style Selector="^:pressed">
-            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
-        </Style>
-        <Style Selector="^:checked">
-            <Style Selector="^ /template/ PathIcon">
-                <Setter Property="PathIcon.Data" Value="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z" />
-            </Style>
-        </Style>
-    </ControlTheme>
-
     <ControlTheme x:Key="SplitViewToggleButton" TargetType="ToggleButton">
         <Setter Property="ToggleButton.Template">
             <ControlTemplate TargetType="ToggleButton">

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

@@ -38,10 +38,26 @@
                         Classes="Secondary"
                         Text="{Binding #tab.SelectedItem.Header}" />
                 </StackPanel>
-                <ToggleButton
+                <ToggleSwitch
                     Grid.Column="1"
+                    Padding="4"
                     IsCheckedChanged="ToggleButton_OnIsCheckedChanged"
-                    Theme="{DynamicResource ThemeToggleButton}" />
+                    Theme="{DynamicResource ButtonToggleSwitch}">
+                    <ToggleSwitch.OnContent>
+                        <PathIcon
+                            Width="16"
+                            Height="16"
+                            Data="M12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23ZM17 15C17.476 15 17.9408 14.9525 18.3901 14.862C17.296 17.3011 14.8464 19 12 19C8.13401 19 5 15.866 5 12C5 8.60996 7.40983 5.78277 10.6099 5.13803C10.218 6.01173 10 6.98041 10 8C10 11.866 13.134 15 17 15Z"
+                            Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
+                    </ToggleSwitch.OnContent>
+                    <ToggleSwitch.OffContent>
+                        <PathIcon
+                            Width="16"
+                            Height="16"
+                            Data="M3.55 19.09L4.96 20.5L6.76 18.71L5.34 17.29M12 6C8.69 6 6 8.69 6 12S8.69 18 12 18 18 15.31 18 12C18 8.68 15.31 6 12 6M20 13H23V11H20M17.24 18.71L19.04 20.5L20.45 19.09L18.66 17.29M20.45 5L19.04 3.6L17.24 5.39L18.66 6.81M13 1H11V4H13M6.76 5.39L4.96 3.6L3.55 5L5.34 6.81L6.76 5.39M1 13H4V11H1M13 20H11V23H13"
+                            Foreground="{DynamicResource ButtonDefaultTertiaryForeground}" />
+                    </ToggleSwitch.OffContent>
+                </ToggleSwitch>
             </Grid>
 
         </Border>

src/Package.props

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

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

@@ -3,7 +3,8 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:controls="using:Avalonia.Controls"
     xmlns:converters="using:Avalonia.Controls.Converters"
-    xmlns:primitives="using:Avalonia.Controls.Primitives">
+    xmlns:primitives="using:Avalonia.Controls.Primitives"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ResourceDictionary.MergedDictionaries>
         <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorPreviewer.axaml" />

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

@@ -2,7 +2,8 @@
     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">
     <!--  Add Resources Here  -->
     <pc:AccentColorConverter x:Key="AccentColorConverter" />
     <converters:CornerRadiusFilterConverter x:Key="LeftCornerRadiusFilterConverter" Filter="TopLeft, BottomLeft" />

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

@@ -1,7 +1,8 @@
 <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">
     <!--  Add Resources Here  -->
 
     <converters:CornerRadiusToDoubleConverter x:Key="TopLeftCornerRadiusConverter" Corner="TopLeft" />

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

@@ -2,7 +2,8 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:controls="using:Avalonia.Controls"
-    xmlns:converters="using:Avalonia.Controls.Converters">
+    xmlns:converters="using:Avalonia.Controls.Converters"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <converters:EnumToBoolConverter x:Key="EnumToBoolConverter" />
     <converters:CornerRadiusToDoubleConverter x:Key="TopLeftCornerRadiusConverter" Corner="TopLeft" />

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

@@ -5,7 +5,8 @@
     xmlns:converters="using:Avalonia.Controls.Converters"
     xmlns:globalization="using:System.Globalization"
     xmlns:pc="using:Avalonia.Controls.Primitives.Converters"
-    xmlns:primitives="using:Avalonia.Controls.Primitives">
+    xmlns:primitives="using:Avalonia.Controls.Primitives"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <pc:ContrastBrushConverter x:Key="ContrastBrushConverter" />
     <converters:ColorToDisplayNameConverter x:Key="ColorToDisplayNameConverter" />

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

@@ -1,20 +1,15 @@
 <Project Sdk="Microsoft.NET.Sdk">
 
+    <Import Project="../Package.props"/>
+
     <PropertyGroup>
-        <TargetFrameworks>net6.0;netstandard2.0</TargetFrameworks>
-        <LangVersion>10</LangVersion>
-        <Nullable>enable</Nullable>
-        <Version>0.1.0-preview5.1</Version>
         <Title>Semi.Avalonia.ColorPicker</Title>
-        <Authors>IRIHI Technology</Authors>
+        <PackageReleaseNotes>Add Native AOT support.</PackageReleaseNotes>
-        <Description>Avalonia Theme inspired by Semi Design. </Description>
-        <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
-        <PackageReleaseNotes>Initial Release</PackageReleaseNotes>
     </PropertyGroup>
 
     <ItemGroup>
-      <PackageReference Include="Avalonia" Version="11.0.0-preview5" />
+      <PackageReference Include="Avalonia" Version="$(AvaloniaVersion)" />
-      <PackageReference Include="Avalonia.Controls.ColorPicker" Version="11.0.0-preview5" />
+      <PackageReference Include="Avalonia.Controls.ColorPicker" Version="$(AvaloniaVersion)" />
     </ItemGroup>
 
 </Project>

src/Semi.Avalonia.DataGrid/DataGrid.axaml

@@ -1,7 +1,8 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:collections="using:Avalonia.Collections">
+    xmlns:collections="using:Avalonia.Collections"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="DataGridCellTextBlockTheme" TargetType="TextBlock">
         <Setter Property="Margin" Value="{DynamicResource DataGridCellTextBlockDefaultMargin}" />

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

@@ -1,18 +1,15 @@
 <Project Sdk="Microsoft.NET.Sdk">
+
+    <Import Project="../Package.props"/>
+    
     <PropertyGroup>
-        <TargetFrameworks>net6.0;netstandard2.0</TargetFrameworks>
-        <LangVersion>10</LangVersion>
-        <Version>0.1.0-preview5.1</Version>
         <Title>Semi.Avalonia.DataGrid</Title>
-        <Authors>IRIHI Technology</Authors>
+        <PackageReleaseNotes>Add Native AOT support.</PackageReleaseNotes>
-        <Description>Avalonia Theme inspired by Semi Design. </Description>
-        <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
-        <PackageReleaseNotes>Initial Release </PackageReleaseNotes>
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Avalonia" Version="11.0.0-preview5" />
+        <PackageReference Include="Avalonia" Version="$(AvaloniaVersion)" />
-        <PackageReference Include="Avalonia.Controls.DataGrid" Version="11.0.0-preview5" />
+        <PackageReference Include="Avalonia.Controls.DataGrid" Version="$(AvaloniaVersion)" />
     </ItemGroup>
     
 </Project>

src/Semi.Avalonia/Controls/AutoCompleteBox.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <TextBox Text="Hello" />
@@ -6,23 +9,15 @@
         </StackPanel>
     </Design.PreviewWith>
     <ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
-        <Setter Property="Background" Value="{DynamicResource AutoCompleteBoxDefaultBackground}" />
+        <Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="{DynamicResource AutoCompleteMaxDropdownHeight}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource AutoCompleteBoxDefaultBorderBrush}" />
-        <Setter Property="CornerRadius" Value="{DynamicResource AutoCompleteBoxCornerRadius}" />
-        <Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="600" />
-        <Setter Property="BorderThickness" Value="1" />
         <Setter Property="Template">
             <ControlTemplate TargetType="AutoCompleteBox">
                 <Panel>
                     <TextBox
                         Name="PART_TextBox"
-                        Background="{TemplateBinding Background}"
+                        VerticalAlignment="Center"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        CornerRadius="{TemplateBinding CornerRadius}"
                         DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
                         Watermark="{TemplateBinding Watermark}" />
-
                     <Popup
                         Name="PART_Popup"
                         MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
@@ -48,18 +43,52 @@
                 </Panel>
             </ControlTemplate>
         </Setter>
+
+        <Style Selector="^.Bordered">
+            <Setter Property="Template">
+                <ControlTemplate TargetType="AutoCompleteBox">
+                    <Panel>
+                        <TextBox
+                            Name="PART_TextBox"
+                            VerticalAlignment="Center"
+                            Classes="Bordered"
+                            DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
+                            Watermark="{TemplateBinding Watermark}" />
+                        <Popup
+                            Name="PART_Popup"
+                            MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                            MaxHeight="{TemplateBinding MaxDropDownHeight}"
+                            IsLightDismissEnabled="True"
+                            PlacementTarget="{TemplateBinding}">
+                            <Border
+                                Margin="{DynamicResource AutoCompleteBoxPopupMargin}"
+                                HorizontalAlignment="Stretch"
+                                Background="{DynamicResource AutoCompleteBoxPopupBackground}"
+                                BorderBrush="{DynamicResource AutoCompleteBoxPopupBorderBrush}"
+                                BorderThickness="{DynamicResource AutoCompleteBoxPopupBorderThickness}"
+                                BoxShadow="{DynamicResource AutoCompleteBoxPopupBoxShadow}"
+                                CornerRadius="{DynamicResource AutoCompleteBoxPopupCornerRadius}">
+                                <ListBox
+                                    Name="PART_SelectingItemsControl"
+                                    Foreground="{TemplateBinding Foreground}"
+                                    ItemTemplate="{TemplateBinding ItemTemplate}"
+                                    ScrollViewer.HorizontalScrollBarVisibility="Auto"
+                                    ScrollViewer.VerticalScrollBarVisibility="Auto" />
+                            </Border>
+                        </Popup>
+                    </Panel>
+                </ControlTemplate>
+            </Setter>
+        </Style>
+        <Style Selector="^.Large /template/ TextBox">
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource AutoCompleteBoxLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small /template/ TextBox">
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource AutoCompleteBoxSmallHeight}" />
+        </Style>
     </ControlTheme>
 
-    <ControlTheme
+
-        x:Key="BorderlessAutoCompleteBox"
+
-        BasedOn="{StaticResource {x:Type AutoCompleteBox}}"
+
-        TargetType="AutoCompleteBox">
-        <ControlTheme.Children>
-            <Style Selector="^ /template/ TextBox#PART_TextBox">
-                <Setter Property="Theme" Value="{StaticResource BorderlessTextBox}" />
-            </Style>
-        </ControlTheme.Children>
-        <Setter Property="Background" Value="{DynamicResource AutoCompleteBoxBorderlessBackground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource AutoCompleteBoxBorderlessBorderBrush}" />
-    </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/Border.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <Border Theme="{StaticResource CardBorder}">

src/Semi.Avalonia/Controls/Button.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Button Theme Key: Solid Light Border Borderless; Default is Light  -->
     <!--  Button Default Classes: Primary Secondary, Tertiary, Warning, Danger; Default is Primary  -->
     <!--  State： default pointerover pressed disabled  -->

src/Semi.Avalonia/Controls/ButtonSpinner.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <ButtonSpinner Content="Hello World" />

src/Semi.Avalonia/Controls/Calendar.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
 
     <ControlTheme x:Key="{x:Type Calendar}" TargetType="Calendar">
@@ -28,11 +31,13 @@
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type CalendarItem}" TargetType="CalendarItem">
+        <Setter Property="CalendarItem.MinHeight" Value="{DynamicResource CalendarMinHeight}" />
         <Setter Property="CalendarItem.DayTitleTemplate">
             <Template>
                 <TextBlock
                     HorizontalAlignment="Center"
                     VerticalAlignment="Center"
+                    x:DataType="x:String"
                     FontSize="12"
                     Foreground="{DynamicResource CalendarItemWeekDayNameForeground}"
                     Text="{Binding}" />
@@ -47,25 +52,19 @@
                     BorderBrush="{TemplateBinding BorderBrush}"
                     BorderThickness="{TemplateBinding BorderThickness}"
                     CornerRadius="{TemplateBinding CornerRadius}">
-                    <!--
-                        To keep calendar from resizing when switching DisplayMode
-                        In WinUI Min-Width from TemplateSettings
-                        basically...MinWidth of DayItem = 40, 40 * 7 = 280 + margins/padding = ~294
-                        Viewport height is set from # of rows displayed (2-8) in Month mode, = ~290 for 6 weeks (+ day names)
-                    -->
                     <Grid
                         MinWidth="{DynamicResource CalendarMinWidth}"
+                        MinHeight="{TemplateBinding MinHeight}"
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"
                         RowDefinitions="Auto,*">
-                        <Grid ColumnDefinitions="Auto,*,Auto">
+                        <Grid Grid.Row="0" ColumnDefinitions="Auto,*,Auto">
                             <Button
                                 Name="PART_PreviousButton"
                                 Grid.Column="0"
                                 HorizontalContentAlignment="Left"
                                 Foreground="{TemplateBinding Foreground}"
                                 Theme="{DynamicResource BorderlessButton}">
-                                <!--  Path mimics Segoe MDL2 Assets font glyph used in WinUI  -->
                                 <PathIcon
                                     Width="12"
                                     Height="12"
@@ -86,7 +85,6 @@
                                 HorizontalContentAlignment="Left"
                                 Foreground="{TemplateBinding Foreground}"
                                 Theme="{DynamicResource BorderlessButton}">
-                                <!--  Path mimics Segoe MDL2 Assets font glyph used in WinUI  -->
                                 <PathIcon
                                     Width="12"
                                     Height="12"
@@ -94,15 +92,12 @@
                                     Foreground="{DynamicResource CalendarItemIconForeground}" />
                             </Button>
                         </Grid>
-                        <!--  Border below is used only for MonthView but it can't be moved inside of Grid because CalendarItem expects it to be empty and it will cause side-effects  -->
                         <Grid
                             Name="PART_MonthView"
                             Grid.Row="1"
-                            MinHeight="200"
                             HorizontalAlignment="Stretch"
                             IsVisible="False">
                             <Grid.RowDefinitions>
-                                <!--  This should always be the week day names??  -->
                                 <RowDefinition Height="{DynamicResource CalendarItemWeekDayNameHeight}" />
                                 <RowDefinition Height="*" />
                                 <RowDefinition Height="*" />
@@ -124,7 +119,6 @@
                         <Grid
                             Name="PART_YearView"
                             Grid.Row="1"
-                            MinHeight="200"
                             Background="{TemplateBinding Background}"
                             IsVisible="False">
                             <Grid.RowDefinitions>
@@ -148,7 +142,6 @@
     <ControlTheme x:Key="{x:Type CalendarButton}" TargetType="CalendarButton">
         <Setter Property="ClickMode" Value="Release" />
         <Setter Property="Margin" Value="2" />
-        <!--  These are actually set on the CalendarView in WinUI  -->
         <Setter Property="Foreground" Value="{DynamicResource CalendarItemCalendarButtonForeground}" />
         <Setter Property="Background" Value="{DynamicResource CalendarItemCalendarButtonBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource CalendarItemCalendarButtonBorderBrush}" />
@@ -184,7 +177,6 @@
             <Setter Property="ContentControl.Background" Value="{DynamicResource CalendarItemCalendarButtonPressedBackground}" />
         </Style>
 
-        <!--  Adjusted :selected to look like :today from DayItem  -->
         <Style Selector="^:selected">
             <Style Selector="^ /template/ ContentControl">
                 <Setter Property="ContentControl.Background" Value="{DynamicResource CalendarItemCalendarButtonSelectedBackground}" />

src/Semi.Avalonia/Controls/CalendarDatePicker.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="CalendarDatePickerButton" TargetType="Button">
         <Setter Property="Button.Foreground" Value="{DynamicResource CalendarDatePickerIconForeground}" />
@@ -31,7 +34,8 @@
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="Padding" Value="4 0" />
+        <Setter Property="CalendarDatePicker.MinHeight" Value="{DynamicResource CalendarDatePickerDefaultHeight}" />
+        <Setter Property="Padding" Value="8 0" />
         <Setter Property="Template">
             <ControlTemplate TargetType="CalendarDatePicker">
                 <Panel
@@ -45,12 +49,13 @@
                         BorderThickness="{TemplateBinding BorderThickness}"
                         CornerRadius="{TemplateBinding CornerRadius}">
                         <Grid
-                            HorizontalAlignment="Left"
+                            HorizontalAlignment="Stretch"
                             VerticalAlignment="Center"
                             ColumnDefinitions="*,Auto">
                             <TextBox
                                 Name="PART_TextBox"
                                 Grid.Column="0"
+                                MinHeight="{DynamicResource CalendarDatePickerInnerDefaultHeight}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Center"
                                 HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
@@ -63,19 +68,25 @@
                                 UseFloatingWatermark="{TemplateBinding UseFloatingWatermark}"
                                 Watermark="{TemplateBinding Watermark}">
                                 <TextBox.Styles>
-                                    <Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_BorderElement">
+                                    <Style Selector="TextBox#PART_TextBox:pointerover /template/ Border#PART_ContentPresenterBorder">
+                                        <!--  By default the TextBox has its own focused state, override this to disable it here  -->
+                                        <Setter Property="Background" Value="Transparent" />
+                                        <Setter Property="BorderBrush" Value="Transparent" />
+                                        <Setter Property="BorderThickness" Value="0" />
+                                    </Style>
+                                    <Style Selector="TextBox#PART_TextBox:focus /template/ Border#PART_ContentPresenterBorder">
                                         <!--  By default the TextBox has its own focused state, override this to disable it here  -->
                                         <Setter Property="Background" Value="Transparent" />
                                         <Setter Property="BorderBrush" Value="Transparent" />
                                         <Setter Property="BorderThickness" Value="0" />
                                     </Style>
                                     <Style Selector="TextBox#PART_TextBox:disabled">
-                                        <Style Selector="^ /template/ Border#PART_BorderElement">
+                                        <Style Selector="^ /template/ Border#PART_ContentPresenterBorder">
                                             <!--  By default the TextBox has its own disabled state, override this to make the border background show through  -->
                                             <Setter Property="Background" Value="Transparent" />
                                             <Setter Property="BorderBrush" Value="Transparent" />
                                         </Style>
-                                        <Style Selector="^ /template/ TextBlock#PART_Watermark, ^ TextBlock#PART_FloatingWatermark">
+                                        <Style Selector="^ /template/ TextBlock#PART_Watermark">
                                             <Setter Property="TextElement.Foreground" Value="{DynamicResource CalendarDatePickerTextForegroundDisabled}" />
                                         </Style>
                                     </Style>
@@ -113,11 +124,29 @@
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^.Large">
+            <Setter Property="CalendarDatePicker.MinHeight" Value="{DynamicResource CalendarDatePickerLargeHeight}" />
+            <Style Selector="^ /template/ TextBox#PART_TextBox">
+                <Setter Property="TextBox.MinHeight" Value="{DynamicResource CalendarDatePickerInnerLargeHeight}" />
+            </Style>
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="CalendarDatePicker.MinHeight" Value="{DynamicResource CalendarDatePickerSmallHeight}" />
+            <Style Selector="^ /template/ TextBox#PART_TextBox">
+                <Setter Property="TextBox.MinHeight" Value="{DynamicResource CalendarDatePickerInnerSmallHeight}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^:pointerover">
+            <Style Selector="^ /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource CalendarDatePickerPointeroverBackground}" />
+            </Style>
+        </Style>
+
         <!--  Disabled State  -->
         <Style Selector="^:disabled">
             <Style Selector="^ /template/ Border#Background">
                 <Setter Property="Background" Value="{DynamicResource CalendarDatePickerDisabledBackground}" />
-                <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerDisabledBorderBrush}" />
             </Style>
 
             <Style Selector="^ /template/ Button#PART_Button">
@@ -133,5 +162,30 @@
         <Style Selector="^:focus-within /template/ Border#Background">
             <Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerFocusBorderBrush}" />
         </Style>
+
+        <Style Selector="^.Bordered">
+            <Style Selector="^ Border#Background">
+                <Setter Property="Border.Background" Value="{DynamicResource CalendarDatePickerBorderedDefaultBackground}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource CalendarDatePickerBorderedDefaultBorderBrush}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Border#Background">
+                <Setter Property="Border.Background" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBackground}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:focus-within /template/ Border#Background">
+                <Setter Property="Border.Background" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBackground}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource CalendarDatePickerBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#Background">
+                    <Setter Property="Background" Value="{DynamicResource CalendarDatePickerDisabledBackground}" />
+                    <Setter Property="Border.BorderBrush" Value="Transparent" />
+                </Style>
+
+                <Style Selector="^ /template/ Button#PART_Button">
+                    <Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerDisabledIconForeground}" />
+                </Style>
+            </Style>
+        </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/CaptionButtons.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
 
     <ControlTheme x:Key="CaptionButton" TargetType="Button">
@@ -6,10 +9,11 @@
         <Setter Property="BorderBrush" Value="{DynamicResource CaptionButtonPressedBackground}" />
         <Setter Property="Foreground" Value="{DynamicResource CaptionButtonForeground}" />
         <Setter Property="CornerRadius" Value="6" />
-        <Setter Property="Margin" Value="4" />
+        <Setter Property="Margin" Value="0, 4" />
         <Setter Property="Padding" Value="4" />
         <Setter Property="Height" Value="28" />
         <Setter Property="Width" Value="28" />
+        <Setter Property="Cursor" Value="Hand" />
         <Setter Property="VerticalAlignment" Value="Stretch" />
         <Setter Property="Template">
             <ControlTemplate TargetType="Button">
@@ -33,6 +37,7 @@
 
     <ControlTheme x:Key="{x:Type CaptionButtons}" TargetType="CaptionButtons">
         <Setter Property="Foreground" Value="{DynamicResource CaptionButtonForeground}" />
+        <Setter Property="Margin" Value="0 0 4 0" />
         <Setter Property="Template">
             <ControlTemplate TargetType="CaptionButtons">
                 <StackPanel

src/Semi.Avalonia/Controls/Carousel.axaml

@@ -1,7 +1,8 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converters="clr-namespace:Semi.Avalonia.Converters">
+    xmlns:converters="clr-namespace:Semi.Avalonia.Converters"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <converters:ItemToObjectConverter x:Key="ItemsConverter" />
     <ControlTheme x:Key="{x:Type Carousel}" TargetType="Carousel">

src/Semi.Avalonia/Controls/CheckBox.axaml

@@ -1,16 +1,20 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type CheckBox}" TargetType="CheckBox">
         <Setter Property="Padding" Value="8,0,0,0" />
-        <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
+        <Setter Property="HorizontalAlignment" Value="Stretch" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
-        <Setter Property="FontSize" Value="{DynamicResource CheckboxFontSize}" />
+        <Setter Property="Cursor" Value="Hand" />
-        <Setter Property="CornerRadius" Value="{DynamicResource CheckboxBoxCornerRadius}" />
+        <Setter Property="FontSize" Value="{DynamicResource CheckBoxFontSize}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource CheckBoxBoxCornerRadius}" />
         <Setter Property="MinHeight" Value="32" />
-        <Setter Property="Foreground" Value="{DynamicResource CheckboxForeground}" />
+        <Setter Property="Foreground" Value="{DynamicResource CheckBoxForeground}" />
-        <Setter Property="Background" Value="{DynamicResource CheckboxDefaultBackground}" />
+        <Setter Property="Background" Value="{DynamicResource CheckBoxDefaultBackground}" />
-        <Setter Property="BorderBrush" Value="{DynamicResource CheckboxDefaultBorderBrush}" />
+        <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxDefaultBorderBrush}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="CheckBox">
                 <Grid x:Name="RootGrid" ColumnDefinitions="Auto,*">
@@ -18,6 +22,7 @@
                         x:Name="PART_Border"
                         Grid.Column="0"
                         Grid.ColumnSpan="2"
+                        HorizontalAlignment="Center"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
@@ -29,18 +34,18 @@
                         VerticalAlignment="Center">
                         <Border
                             x:Name="NormalRectangle"
-                            Width="{DynamicResource CheckboxBoxWidth}"
+                            Width="{DynamicResource CheckBoxBoxWidth}"
-                            Height="{DynamicResource CheckboxBoxHeight}"
+                            Height="{DynamicResource CheckBoxBoxHeight}"
-                            Background="{DynamicResource CheckboxDefaultBackground}"
+                            Background="{DynamicResource CheckBoxDefaultBackground}"
-                            BorderBrush="{DynamicResource CheckboxDefaultBorderBrush}"
+                            BorderBrush="{DynamicResource CheckBoxDefaultBorderBrush}"
-                            BorderThickness="{DynamicResource CheckboxBoxBorderThickness}"
+                            BorderThickness="{DynamicResource CheckBoxBoxBorderThickness}"
                             CornerRadius="{TemplateBinding CornerRadius}"
                             UseLayoutRounding="False" />
                         <PathIcon
                             Name="CheckGlyph"
-                            Width="{DynamicResource CheckboxBoxGlyphWidth}"
+                            Width="{DynamicResource CheckBoxBoxGlyphWidth}"
-                            Height="{DynamicResource CheckboxBoxGlyphHeight}"
+                            Height="{DynamicResource CheckBoxBoxGlyphHeight}"
-                            Foreground="{DynamicResource CheckboxGlyphFill}" />
+                            Foreground="{DynamicResource CheckBoxGlyphFill}" />
 
                     </Grid>
                     <ContentPresenter
@@ -62,34 +67,34 @@
         <!--  Unchecked PointerOver State  -->
         <Style Selector="^:pointerover">
             <Style Selector="^ /template/ Border#NormalRectangle">
-                <Setter Property="BorderBrush" Value="{DynamicResource CheckboxPointOverBorderBrush}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPointOverBorderBrush}" />
-                <Setter Property="Background" Value="{DynamicResource CheckboxPointOverBackground}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxPointOverBackground}" />
             </Style>
         </Style>
 
         <!--  Unchecked Pressed State  -->
         <Style Selector="^:pressed">
             <Style Selector="^ /template/ Border#NormalRectangle">
-                <Setter Property="BorderBrush" Value="{DynamicResource CheckboxPressedBorderBrush}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPressedBorderBrush}" />
-                <Setter Property="Background" Value="{DynamicResource CheckboxPressedBackground}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxPressedBackground}" />
             </Style>
         </Style>
 
         <!--  Unchecked Disabled state  -->
         <Style Selector="^:disabled">
             <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                <Setter Property="Foreground" Value="{DynamicResource CheckboxDisabledForeground}" />
+                <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
             </Style>
             <Style Selector="^ /template/ Border#NormalRectangle">
-                <Setter Property="BorderBrush" Value="{DynamicResource CheckboxDefaultDisabledBorderBrush}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxDefaultDisabledBorderBrush}" />
-                <Setter Property="Background" Value="{DynamicResource CheckboxDefaultDisabledBackground}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxDefaultDisabledBackground}" />
             </Style>
         </Style>
 
         <Style Selector="^:checked">
             <Style Selector="^ /template/ Border#NormalRectangle">
-                <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedDefaultBorderBrush}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDefaultBorderBrush}" />
-                <Setter Property="Background" Value="{DynamicResource CheckboxCheckedDefaultBackground}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDefaultBackground}" />
             </Style>
 
             <Style Selector="^ /template/ PathIcon#CheckGlyph">
@@ -100,39 +105,39 @@
             <!--  Checked PointerOver State  -->
             <Style Selector="^:pointerover">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedPointOverBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckboxCheckedPointOverBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
                 </Style>
             </Style>
 
             <!--  Checked Pressed State  -->
             <Style Selector="^:pressed">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedPressedBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPressedBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckboxCheckedPressedBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPressedBackground}" />
                 </Style>
             </Style>
 
             <!--  Checked Disabled State  -->
             <Style Selector="^:disabled">
                 <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                    <Setter Property="Foreground" Value="{DynamicResource CheckboxDisabledForeground}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
                 </Style>
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedDisabledBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDisabledBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckboxCheckedDisabledBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
                 <Style Selector="^ /template/ Path#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckboxGlyphDisabledFill}" />
+                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
                 </Style>
             </Style>
         </Style>
 
         <Style Selector="^:indeterminate">
             <Style Selector="^ /template/ Border#NormalRectangle">
-                <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedDefaultBorderBrush}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDefaultBorderBrush}" />
-                <Setter Property="Background" Value="{DynamicResource CheckboxCheckedDefaultBackground}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDefaultBackground}" />
             </Style>
 
             <Style Selector="^ /template/ PathIcon#CheckGlyph">
@@ -143,31 +148,317 @@
             <!--  Checked PointerOver State  -->
             <Style Selector="^:pointerover">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedPointOverBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckboxCheckedPointOverBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
                 </Style>
             </Style>
 
             <!--  Checked Pressed State  -->
             <Style Selector="^:pressed">
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedPressedBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPressedBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckboxCheckedPressedBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPressedBackground}" />
                 </Style>
             </Style>
 
             <!--  Checked Disabled State  -->
             <Style Selector="^:disabled">
                 <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
-                    <Setter Property="Foreground" Value="{DynamicResource CheckboxDisabledForeground}" />
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
                 </Style>
                 <Style Selector="^ /template/ Border#NormalRectangle">
-                    <Setter Property="BorderBrush" Value="{DynamicResource CheckboxCheckedDisabledBorderBrush}" />
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDisabledBorderBrush}" />
-                    <Setter Property="Background" Value="{DynamicResource CheckboxCheckedDisabledBackground}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
                 </Style>
 
                 <Style Selector="^ /template/ Path#CheckGlyph">
-                    <Setter Property="Fill" Value="{DynamicResource CheckboxGlyphDisabledFill}" />
+                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                </Style>
+            </Style>
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme x:Key="CardCheckBox" TargetType="CheckBox">
+        <Setter Property="Cursor" Value="Hand" />
+        <Setter Property="Padding" Value="{DynamicResource CheckBoxCardPadding}" />
+        <Setter Property="BorderThickness" Value="{DynamicResource CheckBoxCardBorderThickness}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource CheckBoxCardCornerRadius}" />
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="CheckBox.Template">
+            <ControlTemplate TargetType="CheckBox">
+                <Border
+                    Name="RootBorder"
+                    Padding="{TemplateBinding Padding}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <Grid x:Name="RootGrid" ColumnDefinitions="Auto,*">
+                        <Grid Grid.Column="0" VerticalAlignment="Top">
+                            <Border
+                                x:Name="NormalRectangle"
+                                Width="{DynamicResource CheckBoxBoxWidth}"
+                                Height="{DynamicResource CheckBoxBoxHeight}"
+                                Background="{DynamicResource CheckBoxDefaultBackground}"
+                                BorderBrush="{DynamicResource CheckBoxDefaultBorderBrush}"
+                                BorderThickness="{DynamicResource CheckBoxBoxBorderThickness}"
+                                CornerRadius="{DynamicResource CheckBoxBoxCornerRadius}"
+                                UseLayoutRounding="False" />
+                            <PathIcon
+                                Name="CheckGlyph"
+                                Width="{DynamicResource CheckBoxBoxGlyphWidth}"
+                                Height="{DynamicResource CheckBoxBoxGlyphHeight}"
+                                Foreground="{DynamicResource CheckBoxGlyphFill}" />
+
+                        </Grid>
+                        <ContentPresenter
+                            x:Name="ContentPresenter"
+                            Grid.Column="1"
+                            Margin="8,0,0,0"
+                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                            VerticalAlignment="Center"
+                            Content="{TemplateBinding Content}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            IsVisible="{TemplateBinding Content,
+                                                        Converter={x:Static ObjectConverters.IsNotNull}}"
+                            RecognizesAccessKey="True"
+                            TextWrapping="Wrap" />
+                    </Grid>
+                </Border>
+            </ControlTemplate>
+        </Setter>
+
+        <!--  Unchecked PointerOver State  -->
+        <Style Selector="^:pointerover">
+            <Style Selector="^ /template/ Border#NormalRectangle">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPointOverBorderBrush}" />
+            </Style>
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCardPointeroverBackground}" />
+            </Style>
+        </Style>
+
+        <!--  Unchecked Pressed State  -->
+        <Style Selector="^:pressed">
+            <Style Selector="^ /template/ Border#NormalRectangle">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxPressedBorderBrush}" />
+            </Style>
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCardPressedBackground}" />
+            </Style>
+        </Style>
+
+        <!--  Unchecked Disabled state  -->
+        <Style Selector="^:disabled">
+            <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+                <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
+            </Style>
+            <Style Selector="^ /template/ Border#NormalRectangle">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxDefaultDisabledBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxDefaultDisabledBackground}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^:checked">
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCardCheckedBackground}" />
+            </Style>
+            <Style Selector="^ /template/ Border#NormalRectangle">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDefaultBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDefaultBackground}" />
+            </Style>
+
+            <Style Selector="^ /template/ PathIcon#CheckGlyph">
+                <Setter Property="Data" Value="{DynamicResource CheckBoxCheckGlyph}" />
+                <Setter Property="Opacity" Value="1" />
+            </Style>
+
+            <!--  Checked PointerOver State  -->
+            <Style Selector="^:pointerover">
+                <Style Selector="^ /template/ Border#NormalRectangle">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
+                </Style>
+            </Style>
+
+            <!--  Checked Pressed State  -->
+            <Style Selector="^:pressed">
+                <Style Selector="^ /template/ Border#NormalRectangle">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPressedBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPressedBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPressedBorderBrush}" />
+                </Style>
+            </Style>
+
+            <!--  Checked Disabled State  -->
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedDisabledBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ Border#NormalRectangle">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDisabledBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
+                </Style>
+
+                <Style Selector="^ /template/ Path#CheckGlyph">
+                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                </Style>
+            </Style>
+        </Style>
+
+        <Style Selector="^:indeterminate">
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedBorderBrush}" />
+            </Style>
+            <Style Selector="^ /template/ Border#NormalRectangle">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDefaultBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDefaultBackground}" />
+            </Style>
+
+            <Style Selector="^ /template/ PathIcon#CheckGlyph">
+                <Setter Property="Data" Value="{DynamicResource CheckBoxIndeterminateGlyph}" />
+                <Setter Property="Opacity" Value="1" />
+            </Style>
+
+            <!--  Checked PointerOver State  -->
+            <Style Selector="^:pointerover">
+                <Style Selector="^ /template/ Border#NormalRectangle">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPointOverBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPointOverBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
+                </Style>
+            </Style>
+
+            <!--  Checked Pressed State  -->
+            <Style Selector="^:pressed">
+                <Style Selector="^ /template/ Border#NormalRectangle">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedPressedBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedPressedBackground}" />
+                </Style>
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPressedBorderBrush}" />
+                </Style>
+            </Style>
+
+            <!--  Checked Disabled State  -->
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedDisabledBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ Border#NormalRectangle">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCheckedDisabledBorderBrush}" />
+                    <Setter Property="Background" Value="{DynamicResource CheckBoxCheckedDisabledBackground}" />
+                </Style>
+
+                <Style Selector="^ /template/ Path#CheckGlyph">
+                    <Setter Property="Fill" Value="{DynamicResource CheckBoxGlyphDisabledFill}" />
+                </Style>
+            </Style>
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme x:Key="PureCardCheckBox" TargetType="CheckBox">
+        <Setter Property="Cursor" Value="Hand" />
+        <Setter Property="Padding" Value="{DynamicResource CheckBoxCardPadding}" />
+        <Setter Property="BorderThickness" Value="{DynamicResource CheckBoxCardBorderThickness}" />
+        <Setter Property="CornerRadius" Value="{DynamicResource CheckBoxCardCornerRadius}" />
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="CheckBox.Template">
+            <ControlTemplate TargetType="CheckBox">
+                <Border
+                    Name="RootBorder"
+                    Padding="{TemplateBinding Padding}"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <ContentPresenter
+                        x:Name="ContentPresenter"
+                        Grid.Column="1"
+                        Margin="8,0,0,0"
+                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
+                        VerticalAlignment="Center"
+                        Content="{TemplateBinding Content}"
+                        ContentTemplate="{TemplateBinding ContentTemplate}"
+                        IsVisible="{TemplateBinding Content,
+                                                    Converter={x:Static ObjectConverters.IsNotNull}}"
+                        RecognizesAccessKey="True"
+                        TextWrapping="Wrap" />
+                </Border>
+            </ControlTemplate>
+        </Setter>
+
+        <!--  Unchecked PointerOver State  -->
+        <Style Selector="^:pointerover">
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCardPointeroverBackground}" />
+            </Style>
+        </Style>
+
+        <!--  Unchecked Pressed State  -->
+        <Style Selector="^:pressed">
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCardPressedBackground}" />
+            </Style>
+        </Style>
+
+        <!--  Unchecked Disabled state  -->
+        <Style Selector="^:disabled">
+            <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+                <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
+            </Style>
+        </Style>
+
+        <Style Selector="^:checked">
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedBorderBrush}" />
+                <Setter Property="Background" Value="{DynamicResource CheckBoxCardCheckedBackground}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:pressed /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPressedBorderBrush}" />
+            </Style>
+            <!--  Checked Disabled State  -->
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedDisabledBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ ContentPresenter#ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource CheckBoxDisabledForeground}" />
+                </Style>
+            </Style>
+        </Style>
+
+        <Style Selector="^:indeterminate">
+            <!--  Checked Disabled State  -->
+            <Style Selector="^ /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedBorderBrush}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:pressed /template/ Border#RootBorder">
+                <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedPressedBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#RootBorder">
+                    <Setter Property="BorderBrush" Value="{DynamicResource CheckBoxCardCheckedDisabledBorderBrush}" />
                 </Style>
             </Style>
         </Style>

src/Semi.Avalonia/Controls/ComboBox.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20">
             <ComboBoxItem>Hello World</ComboBoxItem>
@@ -35,7 +38,7 @@
         <Setter Property="CornerRadius" Value="{DynamicResource ComboBoxSelectorCornerRadius}" />
         <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
         <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
-        <Setter Property="MinHeight" Value="30" />
+        <Setter Property="MinHeight" Value="{DynamicResource ComboBoxDefaultHeight}" />
         <Setter Property="HorizontalContentAlignment" Value="Left" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="HorizontalAlignment" Value="Left" />
@@ -115,6 +118,7 @@
                             BorderBrush="{DynamicResource ComboBoxPopupBorderBrush}"
                             BorderThickness="{DynamicResource ComboBoxPopupBorderThickness}"
                             BoxShadow="{DynamicResource ComboBoxPopupBoxShadow}"
+                            ClipToBounds="True"
                             CornerRadius="6">
                             <ScrollViewer HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
                                 <ItemsPresenter
@@ -128,6 +132,13 @@
             </ControlTemplate>
         </Setter>
 
+        <Style Selector="^.Large">
+            <Setter Property="ComboBox.MinHeight" Value="{DynamicResource ComboBoxLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="ComboBox.MinHeight" Value="{DynamicResource ComboBoxSmallHeight}" />
+        </Style>
+
         <!--  PointerOver State  -->
         <Style Selector="^:pointerover">
             <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorPointerOverBackground}" />
@@ -163,6 +174,35 @@
                 <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconDisabledForeground}" />
             </Style>
         </Style>
+        <Style Selector="^.Bordered">
+            <Style Selector="^ /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedBorderBrush}" />
+            </Style>
+            <Style Selector="^:pointerover /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedPointeroverBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedPointeroverBorderBrush}" />
+            </Style>
+            <Style Selector="^:pressed /template/ Border#Background">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBorderedPressedBackground}" />
+                <Setter Property="BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderedPressedBorderBrush}" />
+            </Style>
+            <Style Selector="^:disabled">
+                <Style Selector="^ /template/ Border#Background">
+                    <Setter Property="Border.Background" Value="{DynamicResource ComboBoxSelectorDisabledBackground}" />
+                    <Setter Property="Border.BorderBrush" Value="{DynamicResource ComboBoxSelectorBorderBrush}" />
+                </Style>
+                <Style Selector="^ /template/ ContentControl#ContentPresenter">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ TextBlock#PlaceholderTextBlock">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxDisabledForeground}" />
+                </Style>
+                <Style Selector="^ /template/ PathIcon#DropDownGlyph">
+                    <Setter Property="Foreground" Value="{DynamicResource ComboBoxIconDisabledForeground}" />
+                </Style>
+            </Style>
+        </Style>
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type ComboBoxItem}" TargetType="ComboBoxItem">
@@ -187,24 +227,26 @@
             </ControlTemplate>
         </Setter>
 
-        <Style Selector="^:pointerover">
+        <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemPointerOverBackground}" />
         </Style>
 
-        <Style Selector="^:disabled">
+        <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemDisabledBackground}" />
         </Style>
 
-        <Style Selector="^:pressed">
+        <Style Selector="^:pressed /template/ ContentPresenter#PART_ContentPresenter">
             <Setter Property="Background" Value="{DynamicResource ComboBoxItemPressedBackground}" />
         </Style>
 
         <Style Selector="^:selected">
-            <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedBackground}" />
+            <Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
-            <Style Selector="^:disabled">
+                <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedBackground}" />
+            </Style>
+            <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedDisabledBackground}" />
             </Style>
-            <Style Selector="^:pointerover">
+            <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
                 <Setter Property="Background" Value="{DynamicResource ComboBoxItemSelectedPointerOverBackground}" />
             </Style>
         </Style>

src/Semi.Avalonia/Controls/ContentControl.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type ContentControl}" TargetType="ContentControl">
         <Setter Property="Template">
             <ControlTemplate TargetType="ContentControl">

src/Semi.Avalonia/Controls/ContextMenu.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type ContextMenu}" TargetType="ContextMenu">
         <Setter Property="ContextMenu.Background" Value="{DynamicResource MenuFlyoutBackground}" />
         <Setter Property="ContextMenu.BorderBrush" Value="{DynamicResource MenuFlyoutBorderBrush}" />

src/Semi.Avalonia/Controls/Controls.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ResourceDictionary.MergedDictionaries>
         <ResourceInclude Source="avares://Semi.Avalonia/Controls/AutoCompleteBox.axaml" />

src/Semi.Avalonia/Controls/DatePicker.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type DatePickerPresenter}" TargetType="DatePickerPresenter">
         <Setter Property="Width" Value="296" />
@@ -124,13 +127,12 @@
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type DatePicker}" TargetType="DatePicker">
-        <Setter Property="FontSize" Value="14" />
+        <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonDefaultHeight}" />
-        <Setter Property="Height" Value="30" />
         <Setter Property="Foreground" Value="{DynamicResource DateTimePickerButtonForeground}" />
         <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonBorderBrush}" />
-        <Setter Property="BorderThickness" Value="1" />
+        <Setter Property="BorderThickness" Value="{DynamicResource DateTimePickerButtonBorderThickness}" />
-        <Setter Property="CornerRadius" Value="3" />
+        <Setter Property="CornerRadius" Value="{DynamicResource DateTimePickerButtonCornerRadius}" />
         <Setter Property="HorizontalAlignment" Value="Left" />
         <Setter Property="VerticalAlignment" Value="Center" />
         <Setter Property="Template">
@@ -141,7 +143,7 @@
                         Width="298"
                         MinWidth="298"
                         HorizontalAlignment="Stretch"
-                        VerticalAlignment="Top"
+                        VerticalAlignment="Stretch"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
@@ -154,6 +156,7 @@
                             <Grid
                                 Name="PART_ButtonContentGrid"
                                 Grid.Column="0"
+                                VerticalAlignment="Center"
                                 ColumnDefinitions="78*,Auto,132*,Auto,78*">
                                 <TextBlock
                                     Name="PART_DayTextBlock"
@@ -229,6 +232,12 @@
         <Style Selector="^:hasnodate /template/ Button#PART_FlyoutButton TextBlock">
             <Setter Property="Foreground" Value="{DynamicResource DateTimePickerEmptyForeground}" />
         </Style>
+        <Style Selector="^.Large">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonSmallHeight}" />
+        </Style>
     </ControlTheme>
 
 </ResourceDictionary>

src/Semi.Avalonia/Controls/DateTimePickerShared.axaml

@@ -1,8 +1,12 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
 
     <ControlTheme x:Key="DateTimePickerFlyoutButton" TargetType="Button">
         <Setter Property="RenderTransform" Value="none" />
+        <Setter Property="Button.VerticalAlignment" Value="Stretch" />
         <Setter Property="Template">
             <ControlTemplate>
                 <ContentPresenter
@@ -19,7 +23,7 @@
         </Setter>
 
         <Style Selector="^:pointerover /template/ ContentPresenter#PART_ContentPresenter">
-            <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonPointeroverBorderBrush}" />
+            <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonPointeroverBackground}" />
         </Style>
 
         <Style Selector="^:disabled /template/ ContentPresenter#PART_ContentPresenter">

src/Semi.Avalonia/Controls/DropdownButton.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type DropDownButton}" TargetType="DropDownButton">
         <Setter Property="DropDownButton.Background" Value="{DynamicResource ButtonDefaultBackground}" />

src/Semi.Avalonia/Controls/Expander.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <TextBox>Hello</TextBox>
@@ -29,7 +32,8 @@
                         <ToggleButton
                             x:Name="ExpanderHeader"
                             Padding="{DynamicResource ExpanderHeaderPadding}"
-                            HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch"
+                            HorizontalAlignment="Stretch"
+                            HorizontalContentAlignment="Stretch"
                             Background="{DynamicResource ExpanderHeaderDefaultBackground}"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
@@ -45,7 +49,8 @@
                                     Content="{TemplateBinding Header}"
                                     ContentTemplate="{TemplateBinding HeaderTemplate}" />
                                 <PathIcon
-                                    Name="PART_PathIcon" Grid.Column="1"
+                                    Name="PART_PathIcon"
+                                    Grid.Column="1"
                                     Width="{DynamicResource ExpanderIconSize}"
                                     Height="{DynamicResource ExpanderIconSize}"
                                     Data="M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z">
@@ -60,7 +65,8 @@
                     </LayoutTransformControl>
                     <LayoutTransformControl Name="ExpanderContentLayoutContainer" MinHeight="1">
                         <Border
-                            x:Name="ExpanderContent" MinHeight="2"
+                            x:Name="ExpanderContent"
+                            MinHeight="2"
                             BorderBrush="{DynamicResource ExpanderSeparatorBorderBrush}"
                             BorderThickness="0,0,0,1">
                             <ContentPresenter

src/Semi.Avalonia/Controls/FlyoutPresenter.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type FlyoutPresenter}" TargetType="FlyoutPresenter">
         <Setter Property="FlyoutPresenter.HorizontalContentAlignment" Value="Stretch" />
         <Setter Property="FlyoutPresenter.VerticalContentAlignment" Value="Stretch" />
@@ -37,9 +40,7 @@
                             HorizontalContentAlignment="Stretch"
                             VerticalContentAlignment="Stretch"
                             Content="{TemplateBinding Content}"
-                            ContentTemplate="{TemplateBinding ContentTemplate}"
+                            ContentTemplate="{TemplateBinding ContentTemplate}" />
-                            FontWeight="{TemplateBinding FontWeight}"
-                            TextElement.Foreground="{TemplateBinding Foreground}" />
                     </ScrollViewer>
                 </Border>
             </ControlTemplate>

src/Semi.Avalonia/Controls/GridSplitter.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type GridSplitter}" TargetType="GridSplitter">
         <Setter Property="Focusable" Value="True" />
         <Setter Property="MinWidth" Value="6" />

src/Semi.Avalonia/Controls/ItemsControl.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type ItemsControl}" TargetType="ItemsControl">
         <Setter Property="Template">
             <ControlTemplate>

src/Semi.Avalonia/Controls/Label.axaml

@@ -1,8 +1,13 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel
-            Width="500" Margin="20"
+            Width="500"
-            HorizontalAlignment="Left" Spacing="20">
+            Margin="20"
+            HorizontalAlignment="Left"
+            Spacing="20">
             <StackPanel.Styles>
                 <Style Selector="Label">
                     <Setter Property="Margin" Value="4" />
@@ -94,9 +99,6 @@
                     RecognizesAccessKey="True" />
             </ControlTemplate>
         </Setter>
-        <Style Selector="^:disabled">
-            <Setter Property="Label.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
-        </Style>
         <Style Selector="^.Secondary">
             <Setter Property="Label.Foreground" Value="{DynamicResource TextBlockSecondaryForeground}" />
         </Style>
@@ -128,6 +130,9 @@
             <Setter Property="Label.FontFamily" Value="{DynamicResource CodeFontFamily}" />
             <Setter Property="Label.FontSize" Value="{DynamicResource TextBlockCodeFontSize}" />
         </Style>
+        <Style Selector="^:disabled">
+            <Setter Property="Label.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
+        </Style>
     </ControlTheme>
     <ControlTheme
         x:Key="TitleLabel"
@@ -183,7 +188,8 @@
                     ContentTemplate="{TemplateBinding ContentTemplate}"
                     CornerRadius="{TemplateBinding CornerRadius}"
                     FontSize="{TemplateBinding FontSize}"
-                    RecognizesAccessKey="True" UseLayoutRounding="True" />
+                    RecognizesAccessKey="True"
+                    UseLayoutRounding="True" />
             </ControlTemplate>
         </Setter>
         <Style Selector="^.Large">

src/Semi.Avalonia/Controls/ListBox.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <ListBox Margin="30">
             <ListBoxItem>Item 1</ListBoxItem>

src/Semi.Avalonia/Controls/ManagedFileChooser.axaml

@@ -2,7 +2,8 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:dialogs="clr-namespace:Avalonia.Dialogs;assembly=Avalonia.Dialogs"
-    xmlns:internal="clr-namespace:Avalonia.Dialogs.Internal;assembly=Avalonia.Dialogs">
+    xmlns:internal="clr-namespace:Avalonia.Dialogs.Internal;assembly=Avalonia.Dialogs"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <Design.PreviewWith>
         <Border
@@ -20,7 +21,7 @@
     </internal:ResourceSelectorConverter>
     <ControlTheme x:Key="{x:Type dialogs:ManagedFileChooser}" TargetType="dialogs:ManagedFileChooser">
         <Setter Property="dialogs:ManagedFileChooser.Template">
-            <ControlTemplate TargetType="dialogs:ManagedFileChooser">
+            <ControlTemplate x:DataType="internal:ManagedFileChooserViewModel" TargetType="dialogs:ManagedFileChooser">
                 <DockPanel>
                     <Border
                         Margin="8"

src/Semi.Avalonia/Controls/Menu.axaml

@@ -1,7 +1,8 @@
 <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:PlatformKeyGestureConverter x:Key="KeyGestureConverter" />
 
@@ -274,7 +275,7 @@
                             RecognizesAccessKey="True" />
                         <Popup
                             Name="PART_Popup"
-                            MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
+                            MinWidth="{Binding $parent[MenuItem].Bounds.Width}"
                             HorizontalOffset="-8"
                             IsLightDismissEnabled="True"
                             IsOpen="{TemplateBinding IsSubMenuOpen,

src/Semi.Avalonia/Controls/MenuFlyoutPresenter.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type MenuFlyoutPresenter}" TargetType="MenuFlyoutPresenter">
         <Setter Property="MenuFlyoutPresenter.Background" Value="{DynamicResource MenuFlyoutBackground}" />

src/Semi.Avalonia/Controls/NotificationCard.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <NotificationCard>
             <TextBlock Text="Hello World" />

src/Semi.Avalonia/Controls/NumericUpDown.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type NumericUpDown}" TargetType="NumericUpDown">
         <Setter Property="NumericUpDown.VerticalContentAlignment" Value="Center" />

src/Semi.Avalonia/Controls/PathIcon.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type PathIcon}" TargetType="PathIcon">
         <Setter Property="PathIcon.Background" Value="Transparent" />
         <Setter Property="PathIcon.Height" Value="{DynamicResource IconElementThemeHeight}" />

src/Semi.Avalonia/Controls/Popup.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type PopupRoot}" TargetType="PopupRoot">
         <Setter Property="Background" Value="{x:Null}" />
         <Setter Property="TransparencyLevelHint" Value="Transparent" />

src/Semi.Avalonia/Controls/ProgressBar.axaml

@@ -1,7 +1,8 @@
 <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">
     <Design.PreviewWith>
         <StackPanel Margin="20" Spacing="20">
             <ProgressBar

src/Semi.Avalonia/Controls/RadioButton.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20">
             <RadioButton>Hello Button2</RadioButton>

src/Semi.Avalonia/Controls/RefreshContainer.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type RefreshContainer}" TargetType="RefreshContainer">
         <Setter Property="Template">

src/Semi.Avalonia/Controls/RepeatButton.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type RepeatButton}" TargetType="RepeatButton">
         <Setter Property="RepeatButton.Background" Value="{DynamicResource ButtonDefaultBackground}" />
         <Setter Property="RepeatButton.Foreground" Value="{DynamicResource ButtonDefaultPrimaryForeground}" />

src/Semi.Avalonia/Controls/ScrollViewer.axaml

@@ -2,7 +2,8 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:converters="using:Avalonia.Controls.Converters"
-    xmlns:dialog="using:Avalonia.Dialogs">
+    xmlns:dialog="using:Avalonia.Dialogs"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel>
             <ScrollBar Width="200" Orientation="Horizontal" />

src/Semi.Avalonia/Controls/SelectableTextBlock.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
 
     <MenuFlyout x:Key="SelectableTextBlockContextFlyout" Placement="Bottom">
         <MenuItem
@@ -14,9 +17,6 @@
         <Setter Property="SelectableTextBlock.FontSize" Value="{DynamicResource TextBlockFontSize}" />
         <Setter Property="SelectableTextBlock.Cursor" Value="Ibeam" />
         <Setter Property="SelectableTextBlock.SelectionBrush" Value="{DynamicResource TextBlockSelectionBackground}" />
-        <Style Selector="^:disabled">
-            <Setter Property="SelectableTextBlock.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
-        </Style>
         <Style Selector="^.Secondary">
             <Setter Property="SelectableTextBlock.Foreground" Value="{DynamicResource TextBlockSecondaryForeground}" />
         </Style>
@@ -44,8 +44,18 @@
         <Style Selector="^.Delete">
             <Setter Property="SelectableTextBlock.TextDecorations" Value="StrikeThrough" />
         </Style>
+        <Style Selector="^.Underline.Delete">
+            <Setter Property="TextBlock.TextDecorations">
+                <TextDecorationCollection>
+                    <TextDecoration Location="Underline" />
+                    <TextDecoration Location="Strikethrough" />
+                </TextDecorationCollection>
+            </Setter>
+        </Style>
+        <Style Selector="^:disabled">
+            <Setter Property="SelectableTextBlock.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
+        </Style>
         <Style Selector="^[IsEnabled=True]">
-            <Setter Property="Cursor" Value="IBeam" />
             <Setter Property="ContextFlyout" Value="{StaticResource SelectableTextBlockContextFlyout}" />
         </Style>
     </ControlTheme>
@@ -72,5 +82,8 @@
         <Style Selector="^.H6">
             <Setter Property="SelectableTextBlock.FontSize" Value="{DynamicResource TextBlockTitleH6FontSize}" />
         </Style>
+        <Style Selector="^:disabled">
+            <Setter Property="SelectableTextBlock.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
+        </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/Slider.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="SliderHorizontalRepeatButton" TargetType="RepeatButton">
         <Setter Property="Template">
@@ -85,12 +88,7 @@
                                     <Setter Property="ReservedSpace" Value="{Binding #PART_Track.Thumb.Bounds}" />
                                 </Style>
                             </Grid.Styles>
-                            <Grid x:Name="HorizontalTemplate" MinHeight="50">
+                            <Grid x:Name="HorizontalTemplate" RowDefinitions="Auto,Auto,Auto">
-                                <Grid.RowDefinitions>
-                                    <RowDefinition Height="15" />
-                                    <RowDefinition Height="Auto" />
-                                    <RowDefinition Height="15" />
-                                </Grid.RowDefinitions>
                                 <TickBar
                                     Name="TopTickBar"
                                     Grid.Row="0"
@@ -174,15 +172,10 @@
                             <Grid
                                 x:Name="VerticalTemplate"
                                 MinWidth="{DynamicResource SliderVerticalWidth}"
-                                RowDefinitions="*,Auto,Auto">
+                                ColumnDefinitions="Auto,Auto,Auto">
-                                <Grid.ColumnDefinitions>
-                                    <ColumnDefinition Width="{DynamicResource SliderPreContentMargin}" />
-                                    <ColumnDefinition Width="Auto" />
-                                    <ColumnDefinition Width="{DynamicResource SliderPostContentMargin}" />
-                                </Grid.ColumnDefinitions>
                                 <TickBar
                                     Name="LeftTickBar"
-                                    Grid.RowSpan="3"
+                                    Grid.Column="0"
                                     Width="{DynamicResource SliderTickVerticalWidth}"
                                     Margin="0,0,4,0"
                                     HorizontalAlignment="Right"
@@ -196,7 +189,6 @@
                                     Ticks="{TemplateBinding Ticks}" />
                                 <TickBar
                                     Name="RightTickBar"
-                                    Grid.RowSpan="3"
                                     Grid.Column="2"
                                     Width="{DynamicResource SliderTickVerticalWidth}"
                                     Margin="4,0,0,0"
@@ -211,9 +203,7 @@
                                     Ticks="{TemplateBinding Ticks}" />
                                 <Track
                                     Name="PART_Track"
-                                    Grid.RowSpan="3"
                                     Grid.Column="1"
-                                    Grid.ColumnSpan="1"
                                     IsDirectionReversed="{TemplateBinding IsDirectionReversed}"
                                     Maximum="{TemplateBinding Maximum}"
                                     Minimum="{TemplateBinding Minimum}"

src/Semi.Avalonia/Controls/SplitButton.axaml

@@ -1,7 +1,7 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converters="using:Avalonia.Controls.Converters">
+    x:CompileBindings="True">
 
     <ControlTheme x:Key="{x:Type SplitButton}" TargetType="SplitButton">
         <Setter Property="SplitButton.Background" Value="{DynamicResource ButtonDefaultBackground}" />

src/Semi.Avalonia/Controls/SplitView.axaml

@@ -1,7 +1,4 @@
-<ResourceDictionary
+<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    xmlns="https://github.com/avaloniaui"
-    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:sys="using:System">
     <!--  Add Resources Here  -->
 
     <ControlTheme x:Key="{x:Type SplitView}" TargetType="SplitView">

src/Semi.Avalonia/Controls/TabControl.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl">
         <Setter Property="Margin" Value="0" />

src/Semi.Avalonia/Controls/TabItem.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Theme: Card, Strip  default is Strip  -->
     <Design.PreviewWith>
         <StackPanel Margin="20">

src/Semi.Avalonia/Controls/TabStrip.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type TabStrip}" TargetType="TabStrip">
         <Setter Property="Template">

src/Semi.Avalonia/Controls/TextBlock.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Spacing="20">
             <TextBlock Text="Test" Theme="{StaticResource TitleTextBlock}" />
@@ -7,9 +10,6 @@
     <ControlTheme x:Key="{x:Type TextBlock}" TargetType="TextBlock">
         <!--<Setter Property="TextBlock.Foreground" Value="{DynamicResource TextBlockDefaultForeground}" />-->
         <Setter Property="TextBlock.FontSize" Value="{DynamicResource TextBlockFontSize}" />
-        <Style Selector="^:disabled">
-            <Setter Property="TextBlock.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
-        </Style>
         <Style Selector="^.Secondary">
             <Setter Property="TextBlock.Foreground" Value="{DynamicResource TextBlockSecondaryForeground}" />
         </Style>
@@ -37,6 +37,17 @@
         <Style Selector="^.Delete">
             <Setter Property="TextBlock.TextDecorations" Value="StrikeThrough" />
         </Style>
+        <Style Selector="^.Underline.Delete">
+            <Setter Property="TextBlock.TextDecorations">
+                <TextDecorationCollection>
+                    <TextDecoration Location="Underline" />
+                    <TextDecoration Location="Strikethrough" />
+                </TextDecorationCollection>
+            </Setter>
+        </Style>
+        <Style Selector="^:disabled">
+            <Setter Property="TextBlock.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
+        </Style>
     </ControlTheme>
     <ControlTheme
         x:Key="TitleTextBlock"
@@ -61,5 +72,8 @@
         <Style Selector="^.H6">
             <Setter Property="TextBlock.FontSize" Value="{DynamicResource TextBlockTitleH6FontSize}" />
         </Style>
+        <Style Selector="^:disabled">
+            <Setter Property="SelectableTextBlock.Foreground" Value="{DynamicResource TextBlockDisabledForeground}" />
+        </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/TextBox.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel
             Width="200"
@@ -93,7 +96,7 @@
         <Setter Property="TextBox.FontSize" Value="14" />
         <Setter Property="TextBox.Cursor" Value="IBeam" />
         <Setter Property="TextBox.CaretBrush" Value="{DynamicResource TextBoxTextCaretBrush}" />
-        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxDefaultHeight}" />
+        <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperDefaultHeight}" />
         <Setter Property="TextBox.Padding" Value="{DynamicResource TextBoxContentPadding}" />
         <Setter Property="TextBox.VerticalContentAlignment" Value="Center" />
         <Setter Property="TextBox.FocusAdorner" Value="{x:Null}" />
@@ -176,18 +179,24 @@
                 </Border>
             </ControlTemplate>
         </Setter>
+
+        <Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.Background" Value="{DynamicResource TextBoxPointeroverBackground}" />
+        </Style>
+        <Style Selector="^:pressed /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.Background" Value="{DynamicResource TextBoxPressedBackground}" />
+        </Style>
+        <Style Selector="^:focus /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
+        </Style>
+        <Style Selector="^:disabled /template/ Border#PART_ContentPresenterBorder">
+            <Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
+            <Setter Property="Border.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
+        </Style>
         <Style Selector="^:disabled">
             <Setter Property="TextBox.Foreground" Value="{DynamicResource TextBoxDisabledForeground}" />
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
-            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
         </Style>
-        <Style Selector="^:pointerover">
+        <Style Selector="^.clearButton, ^.ClearButton">
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxPointerOverBorderBrush}" />
-        </Style>
-        <Style Selector="^:focus">
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
-        </Style>
-        <Style Selector="^.clearButton">
             <Style Selector="^[AcceptsReturn=False][IsReadOnly=False]:focus:not(:empty) /template/ Button#PART_ClearButton">
                 <Setter Property="Button.IsVisible" Value="True" />
             </Style>
@@ -195,32 +204,33 @@
                 <Setter Property="Button.IsVisible" Value="True" />
             </Style>
         </Style>
-        <Style Selector="^.revealPasswordButton">
+        <Style Selector="^.revealPasswordButton, ^.RevealPasswordButton">
             <Style Selector="^ /template/ ToggleButton#PART_RevealButton">
                 <Setter Property="ToggleButton.IsVisible" Value="True" />
             </Style>
         </Style>
         <Style Selector="^.Large">
-            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxLargeHeight}" />
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperLargeHeight}" />
         </Style>
         <Style Selector="^.Small">
-            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxSmallHeight}" />
+            <Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxWrapperSmallHeight}" />
         </Style>
-    </ControlTheme>
 
-    <ControlTheme
+        <Style Selector="^.Bordered">
-        x:Key="BorderlessTextBox"
+            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderedDefaultBackground}" />
-        BasedOn="{StaticResource {x:Type TextBox}}"
+            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderedDefaultBorderBrush}" />
-        TargetType="TextBox">
+            <Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
-        <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessDefaultBackground}" />
+                <Setter Property="Border.Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
-        <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderlessDefaultBorderBrush}" />
+                <Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
-        <Style Selector="^:pointerover">
+            </Style>
-            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessPointeroverBackground}" />
+            <Style Selector="^:focus">
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderlessPointeroverBorderBrush}" />
+                <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
-        </Style>
+                <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
-        <Style Selector="^:focus">
+            </Style>
-            <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessPointeroverBackground}" />
+            <Style Selector="^:disabled /template/ Border#PART_ContentPresenterBorder">
-            <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
+                <Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
+                <Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
+            </Style>
         </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/ThemeVariantScope.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type ThemeVariantScope}" TargetType="ThemeVariantScope">
         <!--  Add Resources Here  -->

src/Semi.Avalonia/Controls/TimePicker.axaml

@@ -1,7 +1,11 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
 
     <ControlTheme x:Key="{x:Type TimePickerPresenter}" TargetType="TimePickerPresenter">
+        <Setter Property="Width" Value="242" />
         <Setter Property="MinWidth" Value="242" />
         <Setter Property="MaxHeight" Value="300" />
         <Setter Property="FontWeight" Value="Normal" />
@@ -127,8 +131,7 @@
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type TimePicker}" TargetType="TimePicker">
-        <Setter Property="FontSize" Value="14" />
+        <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonDefaultHeight}" />
-        <Setter Property="Height" Value="30" />
         <Setter Property="Foreground" Value="{DynamicResource DateTimePickerButtonForeground}" />
         <Setter Property="Background" Value="{DynamicResource DateTimePickerButtonBackground}" />
         <Setter Property="BorderBrush" Value="{DynamicResource DateTimePickerButtonBorderBrush}" />
@@ -144,7 +147,7 @@
                         Width="242"
                         MinWidth="242"
                         HorizontalAlignment="Stretch"
-                        VerticalAlignment="Top"
+                        VerticalAlignment="Stretch"
                         Background="{TemplateBinding Background}"
                         BorderBrush="{TemplateBinding BorderBrush}"
                         BorderThickness="{TemplateBinding BorderThickness}"
@@ -165,6 +168,7 @@
                                         x:Name="PART_HourTextBlock"
                                         Padding="12,4"
                                         HorizontalAlignment="Center"
+                                        VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
                                         FontWeight="{TemplateBinding FontWeight}" />
@@ -187,6 +191,7 @@
                                         x:Name="PART_MinuteTextBlock"
                                         Padding="12,4"
                                         HorizontalAlignment="Center"
+                                        VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
                                         FontWeight="{TemplateBinding FontWeight}" />
@@ -209,6 +214,7 @@
                                         x:Name="PART_PeriodTextBlock"
                                         Padding="12,4"
                                         HorizontalAlignment="Center"
+                                        VerticalAlignment="Center"
                                         FontFamily="{TemplateBinding FontFamily}"
                                         FontSize="{TemplateBinding FontSize}"
                                         FontWeight="{TemplateBinding FontWeight}" />
@@ -232,7 +238,7 @@
                         PlacementMode="Bottom"
                         PlacementTarget="{TemplateBinding}"
                         WindowManagerAddShadowHint="False">
-                        <TimePickerPresenter Name="PART_PickerPresenter" Width="{Binding $parent[TimePicker].Bounds.Width}" />
+                        <TimePickerPresenter Name="PART_PickerPresenter" />
                     </Popup>
                 </Grid>
             </ControlTemplate>
@@ -245,5 +251,12 @@
         <Style Selector="^:hasnotime /template/ Button#PART_FlyoutButton TextBlock">
             <Setter Property="Foreground" Value="{DynamicResource DateTimePickerEmptyForeground}" />
         </Style>
+
+        <Style Selector="^.Large">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonLargeHeight}" />
+        </Style>
+        <Style Selector="^.Small">
+            <Setter Property="MinHeight" Value="{DynamicResource DateTimePickerButtonSmallHeight}" />
+        </Style>
     </ControlTheme>
 </ResourceDictionary>

src/Semi.Avalonia/Controls/TitleBar.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type TitleBar}" TargetType="TitleBar">
         <Setter Property="VerticalAlignment" Value="Top" />

src/Semi.Avalonia/Controls/ToggleButton.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20">
             <ToggleButton>Toggle</ToggleButton>

src/Semi.Avalonia/Controls/ToggleSwitch.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <Design.PreviewWith>
         <StackPanel Margin="20">
             <ToggleSwitch
@@ -27,6 +30,8 @@
                         VerticalAlignment="Top"
                         Content="{TemplateBinding Content}"
                         ContentTemplate="{TemplateBinding ContentTemplate}"
+                        IsVisible="{TemplateBinding Content,
+                                                    Converter={x:Static ObjectConverters.IsNotNull}}"
                         RecognizesAccessKey="True" />
                     <Grid
                         Grid.Row="1"
@@ -155,7 +160,102 @@
                 <Setter Property="Border.Background" Value="{DynamicResource ToggleSwitchContainerCheckedDisabledBackground}" />
             </Style>
         </Style>
-
-
     </ControlTheme>
-</ResourceDictionary>
+
+    <ControlTheme
+        x:Key="ButtonToggleSwitch"
+        BasedOn="{StaticResource {x:Type ToggleSwitch}}"
+        TargetType="ToggleSwitch">
+        <Setter Property="Padding" Value="8" />
+        <Setter Property="CornerRadius" Value="3" />
+        <Setter Property="Background" Value="Transparent" />
+        <Setter Property="Template">
+            <ControlTemplate TargetType="ToggleSwitch">
+                <Border
+                    Name="Background"
+                    Padding="{TemplateBinding Padding}"
+                    Background="{TemplateBinding Background}"
+                    CornerRadius="{TemplateBinding CornerRadius}"
+                    Cursor="Hand">
+                    <Grid ColumnDefinitions="Auto">
+                        <Grid x:Name="PART_SwitchKnob" />
+                        <Grid x:Name="PART_MovingKnobs" />
+                        <ContentPresenter
+                            x:Name="PART_OnContentPresenter"
+                            Margin="{DynamicResource ToggleSwitchOnContentMargin}"
+                            Content="{TemplateBinding OnContent}"
+                            ContentTemplate="{TemplateBinding OnContentTemplate}" />
+                        <ContentPresenter
+                            x:Name="PART_OffContentPresenter"
+                            Margin="{DynamicResource ToggleSwitchOnContentMargin}"
+                            Content="{TemplateBinding OffContent}"
+                            ContentTemplate="{TemplateBinding OffContentTemplate}" />
+                    </Grid>
+                </Border>
+            </ControlTemplate>
+        </Setter>
+        <Style Selector="^:pointerover">
+            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
+        </Style>
+        <Style Selector="^:pressed">
+            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme
+        x:Key="SimpleToggleSwitch"
+        BasedOn="{StaticResource {x:Type ToggleSwitch}}"
+        TargetType="ToggleSwitch">
+        <Setter Property="Template">
+            <ControlTemplate TargetType="ToggleSwitch">
+                <Grid
+                    Background="{TemplateBinding Background}"
+                    Cursor="Hand"
+                    RowDefinitions="*">
+                    <Grid
+                        Grid.Row="0"
+                        Background="Transparent"
+                        ColumnDefinitions="Auto, *">
+                        <Grid
+                            Grid.Column="0"
+                            Grid.ColumnSpan="2"
+                            TemplatedControl.IsTemplateFocusTarget="True" />
+                        <Border
+                            Name="SwitchBackgroundBorder"
+                            Grid.Column="0"
+                            Width="40"
+                            Height="20"
+                            CornerRadius="100">
+                            <Border.Transitions>
+                                <Transitions>
+                                    <BrushTransition Property="Background" Duration="0:0:0.2" />
+                                </Transitions>
+                            </Border.Transitions>
+                        </Border>
+                        <Canvas
+                            x:Name="PART_SwitchKnob"
+                            Grid.Column="0"
+                            Width="20"
+                            Height="20"
+                            HorizontalAlignment="Left">
+                            <Grid
+                                x:Name="PART_MovingKnobs"
+                                Width="20"
+                                Height="20">
+                                <Border
+                                    x:Name="SwitchKnobIndicator"
+                                    Width="14"
+                                    Height="14"
+                                    Background="White"
+                                    BorderBrush="{DynamicResource ToggleSwitchIndicatorBorderBrush}"
+                                    BorderThickness="0.5"
+                                    BoxShadow="0 0 1 1 #222E3238"
+                                    CornerRadius="100" />
+                            </Grid>
+                        </Canvas>
+                    </Grid>
+                </Grid>
+            </ControlTemplate>
+        </Setter>
+    </ControlTheme>
+</ResourceDictionary>

src/Semi.Avalonia/Controls/Tooltip.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <!--  Add Resources Here  -->
     <ControlTheme x:Key="{x:Type ToolTip}" TargetType="ToolTip">
         <Setter Property="Foreground" Value="{DynamicResource ToolTipForeground}" />

src/Semi.Avalonia/Controls/TransitioningContentControl.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type TransitioningContentControl}" TargetType="TransitioningContentControl">
         <Setter Property="Template">
             <ControlTemplate>

src/Semi.Avalonia/Controls/TreeView.axaml

@@ -1,7 +1,8 @@
 <ResourceDictionary
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls">
+    xmlns:converters="clr-namespace:Avalonia.Controls.Converters;assembly=Avalonia.Controls"
+    x:CompileBindings="True">
 
     <Design.PreviewWith>
         <StackPanel

src/Semi.Avalonia/Controls/UserControl.axaml

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

src/Semi.Avalonia/Controls/Window.axaml

@@ -1,4 +1,7 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+<ResourceDictionary
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    x:CompileBindings="True">
     <ControlTheme x:Key="{x:Type Window}" TargetType="Window">
         <Setter Property="Background" Value="{DynamicResource WindowDefaultBackground}" />
         <Setter Property="TransparencyBackgroundFallback" Value="{DynamicResource WindowDefaultBackground}" />

src/Semi.Avalonia/Converters/ItemToObjectConverter.cs

@@ -9,7 +9,7 @@ namespace Semi.Avalonia.Converters;
 
 public class ItemToObjectConverter: IValueConverter
 {
-    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+    public object Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
     {
         if (value is AvaloniaList<object> list)
         {
@@ -18,7 +18,7 @@ public class ItemToObjectConverter: IValueConverter
         return new List<object>();
     }
 
-    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+    public object ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
     {
         throw new NotImplementedException();
     }

src/Semi.Avalonia/Semi.Avalonia.csproj

@@ -1,18 +1,14 @@
 <Project Sdk="Microsoft.NET.Sdk">
-
+  
+  <Import Project="../Package.props"/>
+  
   <PropertyGroup>
-    <TargetFrameworks>net6.0;netstandard2.0</TargetFrameworks>
-    <LangVersion>10</LangVersion>
-    <Version>0.1.0-preview5.1</Version>
     <Title>Semi.Avalonia</Title>
-    <Authors>IRIHI Technology</Authors>
+    <PackageReleaseNotes>Add new CheckBox Theme, Bug fixes. </PackageReleaseNotes>
-    <Description>Avalonia Theme inspired by Semi Design. </Description>
-    <PackageProjectUrl>https://github.com/irihitech/Semi.Avalonia</PackageProjectUrl>
-    <PackageReleaseNotes>Add Palette, Fix varieous color issue. </PackageReleaseNotes>
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Avalonia" Version="11.0.0-preview5" />
+    <PackageReference Include="Avalonia" Version="$(AvaloniaVersion)" />
   </ItemGroup>
 
   <ItemGroup>

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

@@ -1,13 +1,13 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBorderBrush" Color="#41464C" />
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBackground" Color="Transparent" />
     <BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1AFFFFFF</BoxShadows>
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="#35363C" />
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#F9F9F9" />
     <Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness>
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBackground" Opacity="0.05" Color="#E6E8EA" />
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
+    <x:Double x:Key="AutoCompleteBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="AutoCompleteBoxSmallHeight">24</x:Double>
+    <x:Double x:Key="AutoCompleteBoxLargeHeight">40</x:Double>
+    <x:Double x:Key="AutoCompleteMaxDropdownHeight">600</x:Double>
 </ResourceDictionary>

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

@@ -2,10 +2,10 @@
     <!--  Add Resources Here  -->
     <PathGeometry x:Key="ButtonSpinnerIncreaseButtonGlyph">M19.637 16.4369C19.0513 17.0227 18.1015 17.0227 17.5157 16.4369L11.8589 10.7801L6.20202 16.4369C5.61623 17.0227 4.66648 17.0227 4.0807 16.4369C3.49491 15.8511 3.49491 14.9014 4.0807 14.3156L10.7982 7.59809C11.384 7.01231 12.3337 7.01231 12.9195 7.59809L19.637 14.3156C20.2228 14.9014 20.2228 15.8511 19.637 16.4369Z</PathGeometry>
     <PathGeometry x:Key="ButtonSpinnerDecreaseButtonGlyph">M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z</PathGeometry>
-    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonBackground" Color="#16161A" />
+    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonBackground" Color="#FF35363C" />
-    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonPointeroverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonPointeroverBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonPressedBackground" Opacity="0.20" Color="White" />
+    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonPressedBackground" Opacity="0.16" Color="White" />
-    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonDisabledBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonDisabledBackground" Opacity="0.04" Color="#FF2E3238" />
     <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonForeground" Opacity="0.62" Color="#F9F9F9" />
     <SolidColorBrush x:Key="ButtonSpinnerRepeatButtonBorderBrush" Opacity="0.08" Color="#F9F9F9" />
 

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

@@ -47,4 +47,5 @@
     <SolidColorBrush x:Key="CalendarItemCalendarDayButtonInactiveForeground" Opacity="0.62" Color="#F9F9F9" />
 
     <sys:Double x:Key="CalendarMinWidth">240</sys:Double>
+    <sys:Double x:Key="CalendarMinHeight">250</sys:Double>
 </ResourceDictionary>

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

@@ -3,13 +3,26 @@
     <SolidColorBrush x:Key="CalendarDatePickerIconForeground" Opacity="0.62" Color="#F9F9F9" />
     <SolidColorBrush x:Key="CalendarDatePickerIconPointeroverForeground" Color="#F9F9F9" />
     <PathGeometry x:Key="CalendarDatePickerIconGlyph">M4 20V8H20V20H4ZM2 4C2 2.89543 2.89543 2 4 2H20C21.1046 2 22 2.89543 22 4V20C22 21.1046 21.1046 22 20 22H4C2.89543 22 2 21.1046 2 20V4ZM6 10.5C6 10.2239 6.22386 10 6.5 10H8.5C8.77614 10 9 10.2239 9 10.5V12.5C9 12.7761 8.77614 13 8.5 13H6.5C6.22386 13 6 12.7761 6 12.5V10.5ZM6.5 15C6.22386 15 6 15.2239 6 15.5V17.5C6 17.7761 6.22386 18 6.5 18H8.5C8.77614 18 9 17.7761 9 17.5V15.5C9 15.2239 8.77614 15 8.5 15H6.5ZM10.5 10.5C10.5 10.2239 10.7239 10 11 10H13C13.2761 10 13.5 10.2239 13.5 10.5V12.5C13.5 12.7761 13.2761 13 13 13H11C10.7239 13 10.5 12.7761 10.5 12.5V10.5ZM11 15C10.7239 15 10.5 15.2239 10.5 15.5V17.5C10.5 17.7761 10.7239 18 11 18H13C13.2761 18 13.5 17.7761 13.5 17.5V15.5C13.5 15.2239 13.2761 15 13 15H11ZM15 10.5C15 10.2239 15.2239 10 15.5 10H17.5C17.7761 10 18 10.2239 18 10.5V12.5C18 12.7761 17.7761 13 17.5 13H15.5C15.2239 13 15 12.7761 15 12.5V10.5ZM15.5 15C15.2239 15 15 15.2239 15 15.5V17.5C15 17.7761 15.2239 18 15.5 18H17.5C17.7761 18 18 17.7761 18 17.5V15.5C18 15.2239 17.7761 15 17.5 15H15.5Z</PathGeometry>
-    <SolidColorBrush x:Key="CalendarDatePickerBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="CalendarDatePickerBorderBrush" Color="#41464C" />
+    <SolidColorBrush x:Key="CalendarDatePickerPointeroverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="CalendarDatePickerPressedBackground" Opacity="0.2" Color="White" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderBrush" Color="Transparent" />
     <Thickness x:Key="CalendarDatePickerBorderThickness">1</Thickness>
     <CornerRadius x:Key="CalendarDatePickerCornerRadius">3</CornerRadius>
-    <SolidColorBrush x:Key="CalendarDatePickerFocusBorderBrush" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="CalendarDatePickerFocusBorderBrush" Color="#54A9FF" />
-    <SolidColorBrush x:Key="CalendarDatePickerDisabledBackground" Color="#1C1F23" />
+    <SolidColorBrush x:Key="CalendarDatePickerDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
-    <SolidColorBrush x:Key="CalendarDatePickerDisabledBorderBrush" Color="#1C1F23" />
+    <SolidColorBrush x:Key="CalendarDatePickerDisabledBorderBrush" Color="Transparent" />
     <SolidColorBrush x:Key="CalendarDatePickerDisabledIconForeground" Opacity="0.4" Color="#E6E8EA" />
     <BoxShadows x:Key="CalendarDatePickerPopupBoxShadows">0 0 8 0 #1AFFFFFF</BoxShadows>
+    <x:Double x:Key="CalendarDatePickerInnerDefaultHeight">30</x:Double>
+    <x:Double x:Key="CalendarDatePickerInnerSmallHeight">22</x:Double>
+    <x:Double x:Key="CalendarDatePickerInnerLargeHeight">38</x:Double>
+    <x:Double x:Key="CalendarDatePickerDefaultHeight">32</x:Double>
+    <x:Double x:Key="CalendarDatePickerSmallHeight">24</x:Double>
+    <x:Double x:Key="CalendarDatePickerLargeHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedDefaultBorderBrush" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CalendarDatePickerBorderedPointeroverBorderBrush" Color="#0062D6" />
 </ResourceDictionary>

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

@@ -2,42 +2,54 @@
     xmlns="https://github.com/avaloniaui"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:sys="clr-namespace:System;assembly=System.Runtime">
-    <SolidColorBrush x:Key="CheckboxForeground" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="CheckBoxForeground" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="CheckboxDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="CheckBoxDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
 
-    <SolidColorBrush x:Key="CheckboxGlyphFill" Color="#16161A" />
+    <SolidColorBrush x:Key="CheckBoxGlyphFill" Color="White" />
-    <SolidColorBrush x:Key="CheckboxGlyphDisabledFill" Color="#16161A" />
+    <SolidColorBrush x:Key="CheckBoxGlyphDisabledFill" Color="White" />
 
-    <SolidColorBrush x:Key="CheckboxDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="CheckBoxDefaultBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="CheckboxDefaultBorderBrush" Opacity="0.35" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="CheckBoxDefaultBorderBrush" Opacity="0.35" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="CheckboxPointOverBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="CheckBoxPointOverBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="CheckboxPointOverBorderBrush" Color="#54A9FF" />
+    <SolidColorBrush x:Key="CheckBoxPointOverBorderBrush" Color="#54A9FF" />
-    <SolidColorBrush x:Key="CheckboxPressedBackground" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="CheckBoxPressedBackground" Color="#A9D7FF" />
-    <SolidColorBrush x:Key="CheckboxPressedBorderBrush" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="CheckBoxPressedBorderBrush" Color="#A9D7FF" />
 
-    <SolidColorBrush x:Key="CheckboxCheckedDefaultBackground" Color="#54A9FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedDefaultBackground" Color="#54A9FF" />
-    <SolidColorBrush x:Key="CheckboxCheckedDefaultBorderBrush" Color="#54A9FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedDefaultBorderBrush" Color="#54A9FF" />
-    <SolidColorBrush x:Key="CheckboxCheckedPointOverBackground" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPointOverBackground" Color="#7FC1FF" />
-    <SolidColorBrush x:Key="CheckboxCheckedPointOverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPointOverBorderBrush" Color="#7FC1FF" />
-    <SolidColorBrush x:Key="CheckboxCheckedPressedBackground" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPressedBackground" Color="#A9D7FF" />
-    <SolidColorBrush x:Key="CheckboxCheckedPressedBorderBrush" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="CheckBoxCheckedPressedBorderBrush" Color="#A9D7FF" />
 
-    <SolidColorBrush x:Key="CheckboxDefaultDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
+    <SolidColorBrush x:Key="CheckBoxDefaultDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
-    <SolidColorBrush x:Key="CheckboxDefaultDisabledBorderBrush" Opacity="0.08" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="CheckBoxDefaultDisabledBorderBrush" Opacity="0.08" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="CheckboxCheckedDisabledBackground" Color="#135cb8" />
+    <SolidColorBrush x:Key="CheckBoxCheckedDisabledBackground" Color="#135cb8" />
-    <SolidColorBrush x:Key="CheckboxCheckedDisabledBorderBrush" Color="#135cb8" />
+    <SolidColorBrush x:Key="CheckBoxCheckedDisabledBorderBrush" Color="#135cb8" />
 
-    <sys:Double x:Key="CheckboxFontSize">14</sys:Double>
+    <sys:Double x:Key="CheckBoxFontSize">14</sys:Double>
-    <sys:Double x:Key="CheckboxBoxWidth">16</sys:Double>
+    <sys:Double x:Key="CheckBoxBoxWidth">16</sys:Double>
-    <sys:Double x:Key="CheckboxBoxHeight">16</sys:Double>
+    <sys:Double x:Key="CheckBoxBoxHeight">16</sys:Double>
-    <sys:Double x:Key="CheckboxBoxGlyphWidth">12</sys:Double>
+    <sys:Double x:Key="CheckBoxBoxGlyphWidth">10</sys:Double>
-    <sys:Double x:Key="CheckboxBoxGlyphHeight">12</sys:Double>
+    <sys:Double x:Key="CheckBoxBoxGlyphHeight">10</sys:Double>
-    <FontWeight x:Key="CheckboxFontWeight">400</FontWeight>
+    <FontWeight x:Key="CheckBoxFontWeight">400</FontWeight>
 
-    <CornerRadius x:Key="CheckboxBoxCornerRadius">3</CornerRadius>
+    <CornerRadius x:Key="CheckBoxBoxCornerRadius">3</CornerRadius>
-    <Thickness x:Key="CheckboxContentMargin">8 0 0 0</Thickness>
+    <Thickness x:Key="CheckBoxContentMargin">8 0 0 0</Thickness>
-    <Thickness x:Key="CheckboxBoxBorderThickness">1</Thickness>
+    <Thickness x:Key="CheckBoxBoxBorderThickness">1</Thickness>
 
     <PathGeometry x:Key="CheckBoxCheckGlyph">M17.4111 7.30848C18.0692 7.81171 18.1947 8.75312 17.6915 9.41119L11.1915 17.9112C10.909 18.2806 10.4711 18.4981 10.0061 18.5C9.54105 18.5019 9.10143 18.288 8.81592 17.9209L5.31592 13.4209C4.80731 12.767 4.92512 11.8246 5.57904 11.316C6.23296 10.8074 7.17537 10.9252 7.68398 11.5791L9.98988 14.5438L15.3084 7.58884C15.8116 6.93077 16.7531 6.80525 17.4111 7.30848Z</PathGeometry>
     <PathGeometry x:Key="CheckBoxIndeterminateGlyph">M5 12.5C5 11.6716 5.67157 11 6.5 11H17.5C18.3284 11 19 11.6716 19 12.5C19 13.3284 18.3284 14 17.5 14H6.5C5.67157 14 5 13.3284 5 12.5Z</PathGeometry>
+
+    <SolidColorBrush x:Key="CheckBoxCardCheckedBackground" Opacity="0.2" Color="#FF54A9FF" />
+    <SolidColorBrush x:Key="CheckBoxCardCheckedBorderBrush" Color="#FF54A9FF" />
+    <SolidColorBrush x:Key="CheckBoxCardCheckedDisabledBorderBrush" Color="#FF135CB8" />
+    <SolidColorBrush x:Key="CheckBoxCardPointeroverBackground" Opacity="0.05" Color="#FFFFFFFF" />
+    <SolidColorBrush x:Key="CheckBoxCardPressedBackground" Opacity="0.09" Color="#FFFFFFFF" />
+    <SolidColorBrush x:Key="CheckBoxCardCheckedPointeroverBorderBrush" Color="#FF7FC1FF" />
+    <SolidColorBrush x:Key="CheckBoxCardCheckedPressedBorderBrush" Color="#FFA9D7FF" />
+
+    <Thickness x:Key="CheckBoxCardBorderThickness">1</Thickness>
+    <Thickness x:Key="CheckBoxCardPadding">16</Thickness>
+    <CornerRadius x:Key="CheckBoxCardCornerRadius">3</CornerRadius>
 </ResourceDictionary>

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

@@ -37,4 +37,15 @@
     <PathGeometry x:Key="ComboBoxIcon">
         M4.08045 7.59809C4.66624 7.01231 5.61599 7.01231 6.20177 7.59809L11.8586 13.2549L17.5155 7.59809C18.1013 7.01231 19.051 7.01231 19.6368 7.59809C20.2226 8.18388 20.2226 9.13363 19.6368 9.71941L12.9193 16.4369C12.3335 17.0227 11.3838 17.0227 10.798 16.4369L4.08045 9.71941C3.49467 9.13363 3.49467 8.18388 4.08045 7.59809Z
     </PathGeometry>
+
+    <x:Double x:Key="ComboBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="ComboBoxSmallHeight">24</x:Double>
+    <x:Double x:Key="ComboBoxLargeHeight">40</x:Double>
+
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedBorderBrush" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPointeroverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="ComboBoxSelectorBorderedPressedBorderBrush" Color="#7FC1FF" />
 </ResourceDictionary>

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

@@ -23,20 +23,27 @@
     <sys:Double x:Key="DateTimePickerListBoxItemHeight">28</sys:Double>
 
 
-    <SolidColorBrush x:Key="DateTimePickerButtonBorderBrush" Color="#41464C" />
+    <SolidColorBrush x:Key="DateTimePickerButtonBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="DateTimePickerButtonBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="DateTimePickerButtonBackground" Opacity="0.12" Color="White" />
     <SolidColorBrush x:Key="DateTimePickerButtonForeground" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="DateTimePickerIconForeground" Opacity="0.62" Color="#F9F9F9" />
     <SolidColorBrush x:Key="DateTimePickerEmptyForeground" Opacity="0.5" Color="#F9F9F9" />
 
-    <SolidColorBrush x:Key="DateTimePickerButtonPointeroverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="DateTimePickerButtonPointeroverBackground" Opacity="0.16" Color="White" />
-    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBorderBrush" Color="#1C1F23" />
+    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBorderBrush" Color="Transparent"  />
-    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBackground" Color="#1C1F23" />
+    <SolidColorBrush x:Key="DateTimePickerButtonDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
     <SolidColorBrush x:Key="DateTimePickerButtonDisabledIconForeground" Opacity="0.4" Color="#E6E8EA" />
 
     <BoxShadows x:Key="DateTimePickerFlyoutBoxShadow">0 0 8 0 #1AFFFFFF</BoxShadows>
     <Thickness x:Key="DateTimePickerFlyoutPadding">16 0</Thickness>
     <Thickness x:Key="DateTimePickerFlyoutBorderMargin">8</Thickness>
 
+    <x:Double x:Key="DateTimePickerButtonSmallHeight">24</x:Double>
+    <x:Double x:Key="DateTimePickerButtonDefaultHeight">32</x:Double>
+    <x:Double x:Key="DateTimePickerButtonLargeHeight">40</x:Double>
+
+    <Thickness x:Key="DateTimePickerButtonBorderThickness">1</Thickness>
+    <CornerRadius x:Key="DateTimePickerButtonCornerRadius">3</CornerRadius>
+
 </ResourceDictionary>

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

@@ -28,7 +28,7 @@
     <SolidColorBrush x:Key="RadioButtonCheckIconPressedBorderBrush" Color="#A9D7FF" />
     <SolidColorBrush x:Key="RadioButtonCheckIconDisabledBorderBrush" Color="#135cb8" />
 
-    <SolidColorBrush x:Key="RadioButtonCheckGlyphFill" Color="#16161A" />
+    <SolidColorBrush x:Key="RadioButtonCheckGlyphFill" Color="White" />
 
     <SolidColorBrush x:Key="RadioButtonForeground" Color="#F9F9F9" />
 

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

@@ -4,26 +4,28 @@
     xmlns:sys="clr-namespace:System;assembly=System.Runtime">
     <SolidColorBrush x:Key="TextBoxTextCaretBrush" Color="White" />
 
-    <SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="#41464C" />
+    <SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxDefaultBackground" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxDefaultBackground" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="TextBoxPointeroverBackground" Opacity="0.16" Color="White" />
-    <SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="#7FC1FF" />
+    <SolidColorBrush x:Key="TextBoxPressedBackground" Opacity="0.2" Color="White" />
-    <SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#A9D7FF" />
+    <SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#54A9FF" />
     <SolidColorBrush x:Key="TextBoxForeground" Color="#F9F9F9" />
     <SolidColorBrush x:Key="TextBoxWatermarkForeground" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.62" Color="#F9F9F9" />
+    <SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.6" Color="#F9F9F9" />
 
     <SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.2" Color="#E6E8EA" />
     <SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Opacity="0.4" Color="#E6E8EA" />
 
-    <SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#403238" />
+    <SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
     <SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
-    <SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="#2E3238" />
+    <SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="Transparent" />
 
-    <SolidColorBrush x:Key="TextBoxBorderlessDefaultBackground" Opacity="0.12" Color="White" />
+    <SolidColorBrush x:Key="TextBoxBorderedDefaultBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxBorderlessDefaultBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedDefaultBorderBrush" Opacity="0.12" Color="White" />
-    <SolidColorBrush x:Key="TextBoxBorderlessPointeroverBackground" Opacity="0.16" Color="White" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
-    <SolidColorBrush x:Key="TextBoxBorderlessPointeroverBorderBrush" Color="Transparent" />
+    <SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#7FC1FF" />
 
     <sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
     <sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>

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

@@ -1,13 +1,13 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBorderBrush" Color="#C6CACD" />
-    <SolidColorBrush x:Key="AutoCompleteBoxDefaultBackground" Color="Transparent" />
     <BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1A000000</BoxShadows>
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="White" />
     <SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#1C1F23" />
     <Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness>
     <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
     <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBorderBrush" Color="Transparent" />
-    <SolidColorBrush x:Key="AutoCompleteBoxBorderlessBackground" Opacity="0.05" Color="#2E3238" />
     <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
+    <x:Double x:Key="AutoCompleteBoxDefaultHeight">32</x:Double>
+    <x:Double x:Key="AutoCompleteBoxSmallHeight">24</x:Double>
+    <x:Double x:Key="AutoCompleteBoxLargeHeight">40</x:Double>
+    <x:Double x:Key="AutoCompleteMaxDropdownHeight">600</x:Double>
 </ResourceDictionary>

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

@@ -47,4 +47,5 @@
     <SolidColorBrush x:Key="CalendarItemCalendarDayButtonInactiveForeground" Opacity="0.62" Color="#1C1F23" />
 
     <sys:Double x:Key="CalendarMinWidth">240</sys:Double>
+    <sys:Double x:Key="CalendarMinHeight">250</sys:Double>
 </ResourceDictionary>