From 27b08caae72b85959a53db81a77b3be766e23b40 Mon Sep 17 00:00:00 2001
From: Zhang Dian <54255897+zdpcdt@users.noreply.github.com>
Date: Fri, 28 Feb 2025 16:18:41 +0800
Subject: [PATCH] misc: format ColorPicker xaml.

---
 .../Controls/ColorPicker.axaml                | 113 +++++-----
 .../Controls/ColorPreviewer.axaml             |  39 ++--
 .../Controls/ColorSlider.axaml                |  52 ++---
 .../Controls/ColorSpectrum.axaml              | 198 +++++++++---------
 .../Controls/ColorView.axaml                  | 129 ++++++------
 .../Controls/_index.axaml                     |  12 ++
 src/Semi.Avalonia.ColorPicker/Index.axaml     |   2 +-
 7 files changed, 254 insertions(+), 291 deletions(-)
 create mode 100644 src/Semi.Avalonia.ColorPicker/Controls/_index.axaml

diff --git a/src/Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml b/src/Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml
index 27745b7..f3d894a 100644
--- a/src/Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml
+++ b/src/Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml
@@ -1,17 +1,8 @@
 <ResourceDictionary
     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:primitives="using:Avalonia.Controls.Primitives"
     x:CompileBindings="True">
-    <ResourceDictionary.MergedDictionaries>
-        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorPreviewer.axaml" />
-        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorSlider.axaml" />
-        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorSpectrum.axaml" />
-        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorView.axaml" />
-    </ResourceDictionary.MergedDictionaries>
-
     <converters:CornerRadiusFilterConverter x:Key="LeftCornerRadiusFilterConverter" Filter="TopLeft, BottomLeft" />
     <converters:ToBrushConverter x:Key="ToBrushConverter" />
 
@@ -30,21 +21,18 @@
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"
                         Background="{DynamicResource ColorControlCheckeredBackgroundBrush}"
-                        CornerRadius="{TemplateBinding CornerRadius,
-                                                       Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+                        CornerRadius="{TemplateBinding CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
                     <Border
                         Margin="1,1,0,1"
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"
-                        Background="{TemplateBinding HsvColor,
-                                                     Converter={StaticResource ToBrushConverter}}"
-                        CornerRadius="{TemplateBinding CornerRadius,
-                                                       Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
+                        Background="{TemplateBinding HsvColor, Converter={StaticResource ToBrushConverter}}"
+                        CornerRadius="{TemplateBinding CornerRadius, Converter={StaticResource LeftCornerRadiusFilterConverter}}" />
                 </Panel>
             </Template>
         </Setter>
         <Setter Property="Palette">
-            <controls:FluentColorPalette />
+            <FluentColorPalette />
         </Setter>
         <Setter Property="Template">
             <ControlTemplate TargetType="{x:Type ColorPicker}">
@@ -127,7 +115,7 @@
                                                 <ColumnDefinition Width="*" />
                                                 <ColumnDefinition Width="Auto" MinWidth="32" />
                                             </Grid.ColumnDefinitions>
-                                            <primitives:ColorSlider
+                                            <ColorSlider
                                                 Name="ColorSpectrumThirdComponentSlider"
                                                 Grid.Column="0"
                                                 Margin="0,0,12,0"
@@ -141,8 +129,8 @@
                                                 IsPerceptive="False"
                                                 IsVisible="{TemplateBinding IsColorSpectrumSliderVisible}"
                                                 Orientation="Vertical" />
-                                            <primitives:ColorSpectrum
-                                                x:Name="ColorSpectrum"
+                                            <ColorSpectrum
+                                                Name="ColorSpectrum"
                                                 Grid.Column="1"
                                                 HorizontalAlignment="Stretch"
                                                 VerticalAlignment="Stretch"
@@ -155,7 +143,7 @@
                                                 MinSaturation="{TemplateBinding MinSaturation}"
                                                 MinValue="{TemplateBinding MinValue}"
                                                 Shape="{TemplateBinding ColorSpectrumShape}" />
-                                            <primitives:ColorSlider
+                                            <ColorSlider
                                                 Name="ColorSpectrumAlphaSlider"
                                                 Grid.Column="2"
                                                 Margin="12,0,0,0"
@@ -167,12 +155,12 @@
                                                 HsvColor="{Binding HsvColor, ElementName=ColorSpectrum}"
                                                 IsEnabled="{TemplateBinding IsAlphaEnabled}"
                                                 Orientation="Vertical">
-                                                <primitives:ColorSlider.IsVisible>
+                                                <ColorSlider.IsVisible>
                                                     <MultiBinding Converter="{x:Static BoolConverters.And}">
                                                         <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                                     </MultiBinding>
-                                                </primitives:ColorSlider.IsVisible>
-                                            </primitives:ColorSlider>
+                                                </ColorSlider.IsVisible>
+                                            </ColorSlider>
                                         </Grid>
                                     </TabItem>
                                     <!--  Palette Tab  -->
@@ -228,7 +216,7 @@
                                         <Grid
                                             Margin="12"
                                             ColumnDefinitions="Auto,*"
-                                            RowDefinitions="Auto,24,1*,1*,1*,1*,12"
+                                            RowDefinitions="Auto,24,*,*,*,*,12"
                                             Tag="{TemplateBinding ColorModel}">
                                             <Grid.Styles>
                                                 <Style Selector="NumericUpDown">
@@ -272,13 +260,13 @@
                                                 Grid.Row="0"
                                                 Grid.Column="0"
                                                 Grid.ColumnSpan="2"
-                                                ColumnDefinitions="1*,12,1*">
+                                                ColumnDefinitions="*,12,*">
                                                 <!--  RadioButtonGroup  -->
                                                 <Border
                                                     Padding="2"
                                                     Background="{DynamicResource ColorViewRadioButtonPointeroverBackground}"
                                                     CornerRadius="3">
-                                                    <Grid ColumnDefinitions="1*,1*" IsVisible="{TemplateBinding IsColorModelVisible}">
+                                                    <Grid ColumnDefinitions="*,*" IsVisible="{TemplateBinding IsColorModelVisible}">
                                                         <RadioButton
                                                             Name="RgbRadioButton"
                                                             Grid.Column="0"
@@ -287,9 +275,9 @@
                                                             Content="RGB"
                                                             CornerRadius="3,0,0,3"
                                                             IsChecked="{TemplateBinding ColorModel,
-                                                                                        Converter={StaticResource EnumToBoolConverter},
-                                                                                        ConverterParameter={x:Static controls:ColorModel.Rgba},
-                                                                                        Mode=TwoWay}"
+                                                            Converter={StaticResource EnumToBoolConverter},
+                                                            ConverterParameter={x:Static ColorModel.Rgba},
+                                                            Mode=TwoWay}"
                                                             Theme="{DynamicResource ColorViewRadioButton}" />
                                                         <RadioButton
                                                             Name="HsvRadioButton"
@@ -299,9 +287,9 @@
                                                             Content="HSV"
                                                             CornerRadius="0,3,3,0"
                                                             IsChecked="{TemplateBinding ColorModel,
-                                                                                        Converter={StaticResource EnumToBoolConverter},
-                                                                                        ConverterParameter={x:Static controls:ColorModel.Hsva},
-                                                                                        Mode=TwoWay}"
+                                                            Converter={StaticResource EnumToBoolConverter},
+                                                            ConverterParameter={x:Static ColorModel.Hsva},
+                                                            Mode=TwoWay}"
                                                             Theme="{DynamicResource ColorViewRadioButton}" />
                                                     </Grid>
                                                 </Border>
@@ -332,15 +320,14 @@
                                                 NumberFormat="{StaticResource ColorViewComponentNumberFormat}"
                                                 ShowButtonSpinner="False"
                                                 Value="{Binding Value, ElementName=Component1Slider}" />
-                                            <primitives:ColorSlider
-                                                x:Name="Component1Slider"
+                                            <ColorSlider
+                                                Name="Component1Slider"
                                                 Grid.Row="2"
                                                 Grid.Column="1"
                                                 HorizontalAlignment="Stretch"
                                                 VerticalAlignment="Center"
                                                 ColorComponent="Component1"
-                                                ColorModel="{TemplateBinding ColorModel,
-                                                                             Mode=OneWay}"
+                                                ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                                 HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                                 IsRoundingEnabled="True"
                                                 IsSnapToTickEnabled="True"
@@ -363,15 +350,14 @@
                                                 NumberFormat="{StaticResource ColorViewComponentNumberFormat}"
                                                 ShowButtonSpinner="False"
                                                 Value="{Binding Value, ElementName=Component2Slider}" />
-                                            <primitives:ColorSlider
-                                                x:Name="Component2Slider"
+                                            <ColorSlider
+                                                Name="Component2Slider"
                                                 Grid.Row="3"
                                                 Grid.Column="1"
                                                 HorizontalAlignment="Stretch"
                                                 VerticalAlignment="Center"
                                                 ColorComponent="Component2"
-                                                ColorModel="{TemplateBinding ColorModel,
-                                                                             Mode=OneWay}"
+                                                ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                                 HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                                 IsRoundingEnabled="True"
                                                 IsSnapToTickEnabled="True"
@@ -394,15 +380,14 @@
                                                 NumberFormat="{StaticResource ColorViewComponentNumberFormat}"
                                                 ShowButtonSpinner="False"
                                                 Value="{Binding Value, ElementName=Component3Slider}" />
-                                            <primitives:ColorSlider
-                                                x:Name="Component3Slider"
+                                            <ColorSlider
+                                                Name="Component3Slider"
                                                 Grid.Row="4"
                                                 Grid.Column="1"
                                                 HorizontalAlignment="Stretch"
                                                 VerticalAlignment="Center"
                                                 ColorComponent="Component3"
-                                                ColorModel="{TemplateBinding ColorModel,
-                                                                             Mode=OneWay}"
+                                                ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                                 HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                                 IsRoundingEnabled="True"
                                                 IsSnapToTickEnabled="True"
@@ -432,34 +417,33 @@
                                                     </MultiBinding>
                                                 </NumericUpDown.IsVisible>
                                             </NumericUpDown>
-                                            <primitives:ColorSlider
-                                                x:Name="AlphaComponentSlider"
+                                            <ColorSlider
+                                                Name="AlphaComponentSlider"
                                                 Grid.Row="5"
                                                 Grid.Column="1"
                                                 HorizontalAlignment="Stretch"
                                                 VerticalAlignment="Center"
                                                 ColorComponent="Alpha"
-                                                ColorModel="{TemplateBinding ColorModel,
-                                                                             Mode=OneWay}"
+                                                ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                                 HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                                 IsEnabled="{TemplateBinding IsAlphaEnabled}"
                                                 IsRoundingEnabled="True"
                                                 IsSnapToTickEnabled="True"
                                                 Orientation="Horizontal"
                                                 TickFrequency="1">
-                                                <primitives:ColorSlider.IsVisible>
+                                                <ColorSlider.IsVisible>
                                                     <MultiBinding Converter="{x:Static BoolConverters.And}">
                                                         <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                                         <Binding Path="IsComponentSliderVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                                     </MultiBinding>
-                                                </primitives:ColorSlider.IsVisible>
-                                            </primitives:ColorSlider>
+                                                </ColorSlider.IsVisible>
+                                            </ColorSlider>
                                         </Grid>
                                     </TabItem>
                                 </TabControl>
                                 <!--  Previewer  -->
                                 <!--  Note that top/bottom margins have -5 to remove for drop shadow padding  -->
-                                <primitives:ColorPreviewer
+                                <ColorPreviewer
                                     Grid.Row="1"
                                     Margin="12,-5,12,7"
                                     HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
@@ -471,9 +455,9 @@
                 </DropDownButton>
             </ControlTemplate>
         </Setter>
-        
+
         <Style Selector="^ /template/ DropDownButton">
-            <Setter Property="Padding" Value="0 0 10 0"></Setter>
+            <Setter Property="Padding" Value="0 0 10 0" />
         </Style>
     </ControlTheme>
 
@@ -499,8 +483,7 @@
                         Margin="1,1,0,1"
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"
-                        Background="{TemplateBinding HsvColor,
-                                                     Converter={StaticResource ToBrushConverter}}"
+                        Background="{TemplateBinding HsvColor,Converter={StaticResource ToBrushConverter}}"
                         CornerRadius="{TemplateBinding CornerRadius}" />
                     <TextBlock
                         Grid.Column="1"
@@ -557,8 +540,8 @@
                                     Grid.Row="0"
                                     CornerRadius="8 8 0 0"
                                     ClipToBounds="True">
-                                    <primitives:ColorSpectrum
-                                        x:Name="ColorSpectrum"
+                                    <ColorSpectrum
+                                        Name="ColorSpectrum"
                                         HorizontalAlignment="Stretch"
                                         VerticalAlignment="Stretch"
                                         Components="{TemplateBinding ColorSpectrumComponents}"
@@ -571,7 +554,7 @@
                                         MinValue="{TemplateBinding MinValue}"
                                         Shape="{TemplateBinding ColorSpectrumShape}" />
                                 </Border>
-                                <primitives:ColorSlider
+                                <ColorSlider
                                     Name="ColorSpectrumThirdComponentSlider"
                                     Grid.Row="1"
                                     HorizontalAlignment="Stretch"
@@ -583,8 +566,8 @@
                                     IsVisible="{TemplateBinding IsColorSpectrumSliderVisible}"
                                     Orientation="Horizontal" />
 
-                                <primitives:ColorSlider
-                                    x:Name="ColorSpectrumAlphaSlider"
+                                <ColorSlider
+                                    Name="ColorSpectrumAlphaSlider"
                                     Grid.Row="2"
                                     HorizontalAlignment="Stretch"
                                     VerticalAlignment="Center"
@@ -597,8 +580,7 @@
                                     IsRoundingEnabled="True"
                                     IsSnapToTickEnabled="True"
                                     TickFrequency="1"
-                                    Orientation="Horizontal">
-                                </primitives:ColorSlider>
+                                    Orientation="Horizontal" />
                                 <StackPanel
                                     Grid.Row="3"
                                     HorizontalAlignment="Stretch"
@@ -693,8 +675,7 @@
                         Margin="1,1,0,1"
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"
-                        Background="{TemplateBinding HsvColor,
-                                                     Converter={StaticResource ToBrushConverter}}"
+                        Background="{TemplateBinding HsvColor,Converter={StaticResource ToBrushConverter}}"
                         CornerRadius="{TemplateBinding CornerRadius}" />
                     <TextBlock
                         Grid.Column="1"
@@ -709,4 +690,4 @@
         </Setter>
     </ControlTheme>
 
-</ResourceDictionary>
+</ResourceDictionary>
\ No newline at end of file
diff --git a/src/Semi.Avalonia.ColorPicker/Controls/ColorPreviewer.axaml b/src/Semi.Avalonia.ColorPicker/Controls/ColorPreviewer.axaml
index 6ee2837..3ddd64b 100644
--- a/src/Semi.Avalonia.ColorPicker/Controls/ColorPreviewer.axaml
+++ b/src/Semi.Avalonia.ColorPicker/Controls/ColorPreviewer.axaml
@@ -33,17 +33,16 @@
                                 Name="PART_AccentDecrement2Border"
                                 Grid.Column="0"
                                 Background="{TemplateBinding HsvColor,
-                                                             Converter={StaticResource AccentColorConverter},
-                                                             ConverterParameter='-2'}"
-                                CornerRadius="{TemplateBinding CornerRadius,
-                                                               Converter={StaticResource LeftCornerRadiusFilterConverter}}"
+                                Converter={StaticResource AccentColorConverter},
+                                ConverterParameter='-2'}"
+                                CornerRadius="{TemplateBinding CornerRadius,Converter={StaticResource LeftCornerRadiusFilterConverter}}"
                                 Tag="-2" />
                             <Border
                                 Name="PART_AccentDecrement1Border"
                                 Grid.Column="1"
                                 Background="{TemplateBinding HsvColor,
-                                                             Converter={StaticResource AccentColorConverter},
-                                                             ConverterParameter='-1'}"
+                                Converter={StaticResource AccentColorConverter},
+                                ConverterParameter='-1'}"
                                 Tag="-1" />
                         </Grid>
                         <!--  Right accent colors  -->
@@ -63,17 +62,16 @@
                                 Name="PART_AccentIncrement1Border"
                                 Grid.Column="0"
                                 Background="{TemplateBinding HsvColor,
-                                                             Converter={StaticResource AccentColorConverter},
-                                                             ConverterParameter='1'}"
+                                Converter={StaticResource AccentColorConverter},
+                                ConverterParameter='1'}"
                                 Tag="1" />
                             <Border
                                 Name="PART_AccentIncrement2Border"
                                 Grid.Column="1"
                                 Background="{TemplateBinding HsvColor,
-                                                             Converter={StaticResource AccentColorConverter},
-                                                             ConverterParameter='2'}"
-                                CornerRadius="{TemplateBinding CornerRadius,
-                                                               Converter={StaticResource RightCornerRadiusFilterConverter}}"
+                                Converter={StaticResource AccentColorConverter},
+                                ConverterParameter='2'}"
+                                CornerRadius="{TemplateBinding CornerRadius,Converter={StaticResource RightCornerRadiusFilterConverter}}"
                                 Tag="2" />
                         </Grid>
                         <!--  Preview color: Must be last for drop shadow Z-index  -->
@@ -85,12 +83,13 @@
                             BoxShadow="{DynamicResource ColorPreviewerMainBoxShadow}"
                             CornerRadius="{TemplateBinding CornerRadius}">
                             <Panel>
-                                <Border Background="{DynamicResource ColorControlCheckeredBackgroundBrush}" CornerRadius="{TemplateBinding CornerRadius}" />
+                                <Border
+                                    Background="{DynamicResource ColorControlCheckeredBackgroundBrush}"
+                                    CornerRadius="{TemplateBinding CornerRadius}" />
                                 <Border
                                     HorizontalAlignment="Stretch"
                                     VerticalAlignment="Stretch"
-                                    Background="{TemplateBinding HsvColor,
-                                                                 Converter={StaticResource ToBrushConverter}}"
+                                    Background="{TemplateBinding HsvColor,Converter={StaticResource ToBrushConverter}}"
                                     CornerRadius="{TemplateBinding CornerRadius}" />
                             </Panel>
                         </Border>
@@ -100,15 +99,15 @@
                         HorizontalAlignment="Stretch"
                         VerticalAlignment="Stretch"
                         CornerRadius="{TemplateBinding CornerRadius}"
-                        IsVisible="{TemplateBinding IsAccentColorsVisible,
-                                                    Converter={x:Static BoolConverters.Not}}">
+                        IsVisible="{TemplateBinding IsAccentColorsVisible,Converter={x:Static BoolConverters.Not}}">
                         <Panel>
-                            <Border Background="{DynamicResource ColorControlCheckeredBackgroundBrush}" CornerRadius="{TemplateBinding CornerRadius}" />
+                            <Border
+                                Background="{DynamicResource ColorControlCheckeredBackgroundBrush}"
+                                CornerRadius="{TemplateBinding CornerRadius}" />
                             <Border
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
-                                Background="{TemplateBinding HsvColor,
-                                                             Converter={StaticResource ToBrushConverter}}"
+                                Background="{TemplateBinding HsvColor,Converter={StaticResource ToBrushConverter}}"
                                 CornerRadius="{TemplateBinding CornerRadius}" />
                         </Panel>
                     </Border>
diff --git a/src/Semi.Avalonia.ColorPicker/Controls/ColorSlider.axaml b/src/Semi.Avalonia.ColorPicker/Controls/ColorSlider.axaml
index 8b7fe64..03c6840 100644
--- a/src/Semi.Avalonia.ColorPicker/Controls/ColorSlider.axaml
+++ b/src/Semi.Avalonia.ColorPicker/Controls/ColorSlider.axaml
@@ -13,17 +13,15 @@
         <Setter Property="BorderThickness" Value="{DynamicResource ColorSliderThumbBorderBrush}" />
         <Setter Property="CornerRadius" Value="999" />
         <Setter Property="Template">
-            <Setter.Value>
-                <ControlTemplate>
-                    <Border
-                        Margin="1"
-                        Background="{TemplateBinding Background}"
-                        BorderBrush="{TemplateBinding BorderBrush}"
-                        BorderThickness="{TemplateBinding BorderThickness}"
-                        BoxShadow="{DynamicResource ColorSliderBoxShadow}"
-                        CornerRadius="{TemplateBinding CornerRadius}" />
-                </ControlTemplate>
-            </Setter.Value>
+            <ControlTemplate>
+                <Border
+                    Margin="1"
+                    Background="{TemplateBinding Background}"
+                    BorderBrush="{TemplateBinding BorderBrush}"
+                    BorderThickness="{TemplateBinding BorderThickness}"
+                    BoxShadow="{DynamicResource ColorSliderBoxShadow}"
+                    CornerRadius="{TemplateBinding CornerRadius}" />
+            </ControlTemplate>
         </Setter>
     </ControlTheme>
 
@@ -45,20 +43,16 @@
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{DynamicResource ColorControlCheckeredBackgroundBrush}"
-                                RadiusX="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
-                                RadiusY="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
+                                RadiusX="{TemplateBinding CornerRadius,Converter={StaticResource TopLeftCornerRadiusConverter}}"
+                                RadiusY="{TemplateBinding CornerRadius,Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Rectangle
                                 Width="{Binding #PART_Track.Bounds.Width}"
                                 Height="{Binding #PART_Track.Bounds.Height}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{TemplateBinding Background}"
-                                RadiusX="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
-                                RadiusY="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
+                                RadiusX="{TemplateBinding CornerRadius,Converter={StaticResource TopLeftCornerRadiusConverter}}"
+                                RadiusY="{TemplateBinding CornerRadius,Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Track
                                 Name="PART_Track"
                                 Height="12"
@@ -68,8 +62,7 @@
                                 Maximum="{TemplateBinding Maximum}"
                                 Minimum="{TemplateBinding Minimum}"
                                 Orientation="Horizontal"
-                                Value="{TemplateBinding Value,
-                                                        Mode=TwoWay}">
+                                Value="{TemplateBinding Value,Mode=TwoWay}">
                                 <Track.DecreaseButton>
                                     <RepeatButton
                                         Name="PART_DecreaseButton"
@@ -136,20 +129,16 @@
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{DynamicResource ColorControlCheckeredBackgroundBrush}"
-                                RadiusX="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
-                                RadiusY="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
+                                RadiusX="{TemplateBinding CornerRadius,Converter={StaticResource TopLeftCornerRadiusConverter}}"
+                                RadiusY="{TemplateBinding CornerRadius,Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Rectangle
                                 Width="{Binding #PART_Track.Bounds.Width}"
                                 Height="{Binding #PART_Track.Bounds.Height}"
                                 HorizontalAlignment="Stretch"
                                 VerticalAlignment="Stretch"
                                 Fill="{TemplateBinding Background}"
-                                RadiusX="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
-                                RadiusY="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
+                                RadiusX="{TemplateBinding CornerRadius,Converter={StaticResource TopLeftCornerRadiusConverter}}"
+                                RadiusY="{TemplateBinding CornerRadius,Converter={StaticResource BottomRightCornerRadiusConverter}}" />
                             <Track
                                 Name="PART_Track"
                                 Width="12"
@@ -159,8 +148,7 @@
                                 Maximum="{TemplateBinding Maximum}"
                                 Minimum="{TemplateBinding Minimum}"
                                 Orientation="Vertical"
-                                Value="{TemplateBinding Value,
-                                                        Mode=TwoWay}">
+                                Value="{TemplateBinding Value,Mode=TwoWay}">
                                 <Track.DecreaseButton>
                                     <RepeatButton
                                         Name="PART_DecreaseButton"
@@ -231,4 +219,4 @@
         </Style>
 
     </ControlTheme>
-</ResourceDictionary>
+</ResourceDictionary>
\ No newline at end of file
diff --git a/src/Semi.Avalonia.ColorPicker/Controls/ColorSpectrum.axaml b/src/Semi.Avalonia.ColorPicker/Controls/ColorSpectrum.axaml
index 748b1f3..bbc1acc 100644
--- a/src/Semi.Avalonia.ColorPicker/Controls/ColorSpectrum.axaml
+++ b/src/Semi.Avalonia.ColorPicker/Controls/ColorSpectrum.axaml
@@ -1,125 +1,115 @@
 <ResourceDictionary
     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"
     x:CompileBindings="True">
     <converters:EnumToBoolConverter x:Key="EnumToBoolConverter" />
     <converters:CornerRadiusToDoubleConverter x:Key="TopLeftCornerRadiusConverter" Corner="TopLeft" />
     <converters:CornerRadiusToDoubleConverter x:Key="BottomRightCornerRadiusConverter" Corner="BottomRight" />
 
-
     <ControlTheme x:Key="{x:Type ColorSpectrum}" TargetType="ColorSpectrum">
         <Setter Property="CornerRadius" Value="6" />
         <Setter Property="Template">
-            <Setter.Value>
-                <ControlTemplate TargetType="{x:Type ColorSpectrum}">
+            <ControlTemplate TargetType="{x:Type ColorSpectrum}">
+                <Panel
+                    Name="PART_LayoutRoot"
+                    HorizontalAlignment="Stretch"
+                    VerticalAlignment="Stretch">
                     <Panel
-                        Name="PART_LayoutRoot"
-                        HorizontalAlignment="Stretch"
-                        VerticalAlignment="Stretch">
-                        <Panel
-                            Name="PART_SizingPanel"
-                            HorizontalAlignment="Center"
-                            VerticalAlignment="Center"
-                            ClipToBounds="True">
-                            <Rectangle
-                                Name="PART_SpectrumRectangle"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
-                                IsHitTestVisible="False"
-                                IsVisible="{TemplateBinding Shape,
-                                                            Converter={StaticResource EnumToBoolConverter},
-                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Box}}"
-                                RadiusX="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
-                                RadiusY="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
-                            <Rectangle
-                                Name="PART_SpectrumOverlayRectangle"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
-                                IsHitTestVisible="False"
-                                IsVisible="{TemplateBinding Shape,
-                                                            Converter={StaticResource EnumToBoolConverter},
-                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Box}}"
-                                RadiusX="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
-                                RadiusY="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
-                            <Ellipse
-                                Name="PART_SpectrumEllipse"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
-                                IsHitTestVisible="False"
-                                IsVisible="{TemplateBinding Shape,
-                                                            Converter={StaticResource EnumToBoolConverter},
-                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Ring}}" />
-                            <Ellipse
-                                Name="PART_SpectrumOverlayEllipse"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
-                                IsHitTestVisible="False"
-                                IsVisible="{TemplateBinding Shape,
-                                                            Converter={StaticResource EnumToBoolConverter},
-                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Ring}}" />
-                            <Canvas
-                                Name="PART_InputTarget"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
-                                Background="Transparent">
-                                <!--  Note: ToolTip.VerticalOffset is for touch devices to keep the tip above fingers  -->
-                                <Panel
-                                    Name="PART_SelectionEllipsePanel"
-                                    ToolTip.Placement="Top"
-                                    ToolTip.VerticalOffset="-10">
-                                    <Ellipse
-                                        Name="FocusEllipse"
-                                        Margin="-2"
-                                        HorizontalAlignment="Stretch"
-                                        VerticalAlignment="Stretch"
-                                        IsHitTestVisible="False"
-                                        StrokeThickness="2" />
-                                    <Ellipse
-                                        Name="SelectionEllipse"
-                                        HorizontalAlignment="Stretch"
-                                        VerticalAlignment="Stretch"
-                                        IsHitTestVisible="False"
-                                        StrokeThickness="2" />
-                                    <ToolTip.Tip>
-                                        <!--  Set in code-behind  -->
-                                    </ToolTip.Tip>
-                                </Panel>
-                            </Canvas>
-                            <Rectangle
-                                Name="BorderRectangle"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
-                                IsHitTestVisible="False"
-                                IsVisible="{TemplateBinding Shape,
-                                                            Converter={StaticResource EnumToBoolConverter},
-                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Box}}"
-                                RadiusX="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource TopLeftCornerRadiusConverter}}"
-                                RadiusY="{TemplateBinding CornerRadius,
-                                                          Converter={StaticResource BottomRightCornerRadiusConverter}}" />
-                            <Ellipse
-                                Name="BorderEllipse"
-                                HorizontalAlignment="Stretch"
-                                VerticalAlignment="Stretch"
-                                IsHitTestVisible="False"
-                                IsVisible="{TemplateBinding Shape,
-                                                            Converter={StaticResource EnumToBoolConverter},
-                                                            ConverterParameter={x:Static controls:ColorSpectrumShape.Ring}}" />
-                        </Panel>
+                        Name="PART_SizingPanel"
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        ClipToBounds="True">
+                        <Rectangle
+                            Name="PART_SpectrumRectangle"
+                            HorizontalAlignment="Stretch"
+                            VerticalAlignment="Stretch"
+                            IsHitTestVisible="False"
+                            IsVisible="{TemplateBinding Shape,
+                            Converter={StaticResource EnumToBoolConverter},
+                            ConverterParameter={x:Static ColorSpectrumShape.Box}}"
+                            RadiusX="{TemplateBinding CornerRadius,Converter={StaticResource TopLeftCornerRadiusConverter}}"
+                            RadiusY="{TemplateBinding CornerRadius,Converter={StaticResource BottomRightCornerRadiusConverter}}" />
+                        <Rectangle
+                            Name="PART_SpectrumOverlayRectangle"
+                            HorizontalAlignment="Stretch"
+                            VerticalAlignment="Stretch"
+                            IsHitTestVisible="False"
+                            IsVisible="{TemplateBinding Shape,
+                            Converter={StaticResource EnumToBoolConverter},
+                            ConverterParameter={x:Static ColorSpectrumShape.Box}}"
+                            RadiusX="{TemplateBinding CornerRadius,Converter={StaticResource TopLeftCornerRadiusConverter}}"
+                            RadiusY="{TemplateBinding CornerRadius,Converter={StaticResource BottomRightCornerRadiusConverter}}" />
+                        <Ellipse
+                            Name="PART_SpectrumEllipse"
+                            HorizontalAlignment="Stretch"
+                            VerticalAlignment="Stretch"
+                            IsHitTestVisible="False"
+                            IsVisible="{TemplateBinding Shape,
+                            Converter={StaticResource EnumToBoolConverter},
+                            ConverterParameter={x:Static ColorSpectrumShape.Ring}}" />
+                        <Ellipse
+                            Name="PART_SpectrumOverlayEllipse"
+                            HorizontalAlignment="Stretch"
+                            VerticalAlignment="Stretch"
+                            IsHitTestVisible="False"
+                            IsVisible="{TemplateBinding Shape,
+                            Converter={StaticResource EnumToBoolConverter},
+                            ConverterParameter={x:Static ColorSpectrumShape.Ring}}" />
+                        <Canvas
+                            Name="PART_InputTarget"
+                            HorizontalAlignment="Stretch"
+                            VerticalAlignment="Stretch"
+                            Background="Transparent">
+                            <!--  Note: ToolTip.VerticalOffset is for touch devices to keep the tip above fingers  -->
+                            <Panel
+                                Name="PART_SelectionEllipsePanel"
+                                ToolTip.Placement="Top"
+                                ToolTip.VerticalOffset="-10">
+                                <Ellipse
+                                    Name="FocusEllipse"
+                                    Margin="-2"
+                                    HorizontalAlignment="Stretch"
+                                    VerticalAlignment="Stretch"
+                                    IsHitTestVisible="False"
+                                    StrokeThickness="2" />
+                                <Ellipse
+                                    Name="SelectionEllipse"
+                                    HorizontalAlignment="Stretch"
+                                    VerticalAlignment="Stretch"
+                                    IsHitTestVisible="False"
+                                    StrokeThickness="2" />
+                                <ToolTip.Tip>
+                                    <!--  Set in code-behind  -->
+                                </ToolTip.Tip>
+                            </Panel>
+                        </Canvas>
+                        <Rectangle
+                            Name="BorderRectangle"
+                            HorizontalAlignment="Stretch"
+                            VerticalAlignment="Stretch"
+                            IsHitTestVisible="False"
+                            IsVisible="{TemplateBinding Shape,
+                            Converter={StaticResource EnumToBoolConverter},
+                            ConverterParameter={x:Static ColorSpectrumShape.Box}}"
+                            RadiusX="{TemplateBinding CornerRadius,Converter={StaticResource TopLeftCornerRadiusConverter}}"
+                            RadiusY="{TemplateBinding CornerRadius,Converter={StaticResource BottomRightCornerRadiusConverter}}" />
+                        <Ellipse
+                            Name="BorderEllipse"
+                            HorizontalAlignment="Stretch"
+                            VerticalAlignment="Stretch"
+                            IsHitTestVisible="False"
+                            IsVisible="{TemplateBinding Shape,
+                            Converter={StaticResource EnumToBoolConverter},
+                            ConverterParameter={x:Static ColorSpectrumShape.Ring}}" />
                     </Panel>
-                </ControlTemplate>
-            </Setter.Value>
+                </Panel>
+            </ControlTemplate>
         </Setter>
 
         <!--  Normal  -->
         <!--  Separating this allows easier customization in applications  -->
-        <Style Selector="^ /template/ Ellipse#BorderEllipse,                      ^ /template/ Rectangle#BorderRectangle">
+        <Style Selector="^ /template/ Ellipse#BorderEllipse,^ /template/ Rectangle#BorderRectangle">
             <Setter Property="Stroke" Value="{DynamicResource ColorSpectrumBorderBrush}" />
             <Setter Property="StrokeThickness" Value="1" />
         </Style>
diff --git a/src/Semi.Avalonia.ColorPicker/Controls/ColorView.axaml b/src/Semi.Avalonia.ColorPicker/Controls/ColorView.axaml
index e44dd1b..988e6ec 100644
--- a/src/Semi.Avalonia.ColorPicker/Controls/ColorView.axaml
+++ b/src/Semi.Avalonia.ColorPicker/Controls/ColorView.axaml
@@ -1,11 +1,9 @@
 <ResourceDictionary
     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:globalization="using:System.Globalization"
     xmlns:pc="using:Avalonia.Controls.Primitives.Converters"
-    xmlns:primitives="using:Avalonia.Controls.Primitives"
     xmlns:cvts="clr-namespace:Semi.Avalonia.ColorPicker.Converters"
     x:CompileBindings="True">
     <pc:ContrastBrushConverter x:Key="ContrastBrushConverter" />
@@ -19,6 +17,15 @@
     <cvts:ToColorModel x:Key="ToColorModel" />
     <globalization:NumberFormatInfo x:Key="ColorViewComponentNumberFormat" NumberDecimalDigits="0" />
 
+    <Design.PreviewWith>
+        <ColorView
+            Theme="{StaticResource SimpleColorView}"
+            IsAlphaVisible="True"
+            IsAlphaEnabled="True"
+            ColorModel="Hsva"
+            HsvColor="hsv(120,7%,90%)" />
+    </Design.PreviewWith>
+
     <VisualBrush
         x:Key="ColorControlCheckeredBackgroundBrush"
         DestinationRect="0,0,8,8"
@@ -116,12 +123,12 @@
     </ControlTheme>
 
     <ControlTheme x:Key="ColorViewRadioButton" TargetType="RadioButton">
-        <Setter Property="RadioButton.Cursor" Value="Hand" />
-        <Setter Property="RadioButton.FontWeight" Value="{DynamicResource ColorViewRadioButtonFontWeight}" />
-        <Setter Property="RadioButton.Padding" Value="{DynamicResource ColorViewRadioButtonPadding}" />
-        <Setter Property="RadioButton.Foreground" Value="{DynamicResource ColorViewRadioButtonForeground}" />
-        <Setter Property="RadioButton.Background" Value="{DynamicResource ColorViewRadioButtonBackground}" />
-        <Setter Property="RadioButton.Template">
+        <Setter Property="Cursor" Value="Hand" />
+        <Setter Property="FontWeight" Value="{DynamicResource ColorViewRadioButtonFontWeight}" />
+        <Setter Property="Padding" Value="{DynamicResource ColorViewRadioButtonPadding}" />
+        <Setter Property="Foreground" Value="{DynamicResource ColorViewRadioButtonForeground}" />
+        <Setter Property="Background" Value="{DynamicResource ColorViewRadioButtonBackground}" />
+        <Setter Property="Template">
             <ControlTemplate TargetType="RadioButton">
                 <ContentPresenter
                     Name="PART_ContentPresenter"
@@ -163,10 +170,10 @@
 
     <ControlTheme x:Key="{x:Type ColorView}" TargetType="ColorView">
         <Setter Property="CornerRadius" Value="{DynamicResource ControlCornerRadius}" />
-        <Setter Property="ColorView.Width" Value="300" />
-        <Setter Property="ColorView.Height" Value="300" />
-        <Setter Property="ColorView.Palette">
-            <controls:FluentColorPalette />
+        <Setter Property="Width" Value="300" />
+        <Setter Property="Height" Value="300" />
+        <Setter Property="Palette">
+            <FluentColorPalette />
         </Setter>
         <Setter Property="Template">
             <ControlTemplate TargetType="{x:Type ColorView}">
@@ -222,7 +229,7 @@
                                     <ColumnDefinition Width="*" />
                                     <ColumnDefinition Width="Auto" MinWidth="32" />
                                 </Grid.ColumnDefinitions>
-                                <primitives:ColorSlider
+                                <ColorSlider
                                     Name="ColorSpectrumThirdComponentSlider"
                                     Grid.Column="0"
                                     Margin="0,0,12,0"
@@ -236,8 +243,8 @@
                                     IsPerceptive="False"
                                     IsVisible="{TemplateBinding IsColorSpectrumSliderVisible}"
                                     Orientation="Vertical" />
-                                <primitives:ColorSpectrum
-                                    x:Name="ColorSpectrum"
+                                <ColorSpectrum
+                                    Name="ColorSpectrum"
                                     Grid.Column="1"
                                     HorizontalAlignment="Stretch"
                                     VerticalAlignment="Stretch"
@@ -250,8 +257,8 @@
                                     MinSaturation="{TemplateBinding MinSaturation}"
                                     MinValue="{TemplateBinding MinValue}"
                                     Shape="{TemplateBinding ColorSpectrumShape}" />
-                                <primitives:ColorSlider
-                                    x:Name="ColorSpectrumAlphaSlider"
+                                <ColorSlider
+                                    Name="ColorSpectrumAlphaSlider"
                                     Grid.Column="2"
                                     Margin="12,0,0,0"
                                     HorizontalAlignment="Center"
@@ -262,12 +269,12 @@
                                     HsvColor="{Binding HsvColor, ElementName=ColorSpectrum}"
                                     IsEnabled="{TemplateBinding IsAlphaEnabled}"
                                     Orientation="Vertical">
-                                    <primitives:ColorSlider.IsVisible>
+                                    <ColorSlider.IsVisible>
                                         <MultiBinding Converter="{x:Static BoolConverters.And}">
                                             <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                         </MultiBinding>
-                                    </primitives:ColorSlider.IsVisible>
-                                </primitives:ColorSlider>
+                                    </ColorSlider.IsVisible>
+                                </ColorSlider>
                             </Grid>
                         </TabItem>
                         <!--  Palette Tab  -->
@@ -323,7 +330,7 @@
                             <Grid
                                 Margin="12"
                                 ColumnDefinitions="Auto,*"
-                                RowDefinitions="Auto,24,1*,1*,1*,1*,12"
+                                RowDefinitions="Auto,24,*,*,*,*,12"
                                 UseLayoutRounding="False">
                                 <Grid.Styles>
                                     <Style Selector="NumericUpDown">
@@ -339,41 +346,41 @@
                                     Grid.Row="0"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
-                                    ColumnDefinitions="1*,12,1*">
+                                    ColumnDefinitions="*,12,*">
                                     <!--  RadioButtonGroup  -->
                                     <Border
                                         Padding="2"
                                         Background="{DynamicResource ColorViewRadioButtonPointeroverBackground}"
                                         CornerRadius="3">
-                                        <Grid ColumnDefinitions="1*,1*" IsVisible="{TemplateBinding IsColorModelVisible}">
+                                        <Grid ColumnDefinitions="*,*" IsVisible="{TemplateBinding IsColorModelVisible}">
                                             <RadioButton
-                                                x:Name="RgbRadioButton"
+                                                Name="RgbRadioButton"
                                                 Grid.Column="0"
                                                 HorizontalContentAlignment="Center"
                                                 VerticalContentAlignment="Center"
                                                 Content="RGB"
                                                 CornerRadius="3,0,0,3"
                                                 IsChecked="{TemplateBinding ColorModel,
-                                                                            Converter={StaticResource EnumToBoolConverter},
-                                                                            ConverterParameter={x:Static controls:ColorModel.Rgba},
-                                                                            Mode=TwoWay}"
+                                                Converter={StaticResource EnumToBoolConverter},
+                                                ConverterParameter={x:Static ColorModel.Rgba},
+                                                Mode=TwoWay}"
                                                 Theme="{DynamicResource ColorViewRadioButton}" />
                                             <RadioButton
-                                                x:Name="HsvRadioButton"
+                                                Name="HsvRadioButton"
                                                 Grid.Column="1"
                                                 HorizontalContentAlignment="Center"
                                                 VerticalContentAlignment="Center"
                                                 Content="HSV"
                                                 CornerRadius="0,3,3,0"
                                                 IsChecked="{TemplateBinding ColorModel,
-                                                                            Converter={StaticResource EnumToBoolConverter},
-                                                                            ConverterParameter={x:Static controls:ColorModel.Hsva},
-                                                                            Mode=TwoWay}"
+                                                Converter={StaticResource EnumToBoolConverter},
+                                                ConverterParameter={x:Static ColorModel.Hsva},
+                                                Mode=TwoWay}"
                                                 Theme="{DynamicResource ColorViewRadioButton}" />
                                         </Grid>
                                     </Border>
                                     <TextBox
-                                        x:Name="PART_HexTextBox"
+                                        Name="PART_HexTextBox"
                                         Grid.Column="2"
                                         Height="32"
                                         HorizontalAlignment="Stretch"
@@ -399,15 +406,14 @@
                                     NumberFormat="{StaticResource ColorViewComponentNumberFormat}"
                                     ShowButtonSpinner="False"
                                     Value="{Binding Value, ElementName=Component1Slider}" />
-                                <primitives:ColorSlider
-                                    x:Name="Component1Slider"
+                                <ColorSlider
+                                    Name="Component1Slider"
                                     Grid.Row="2"
                                     Grid.Column="1"
                                     HorizontalAlignment="Stretch"
                                     VerticalAlignment="Center"
                                     ColorComponent="Component1"
-                                    ColorModel="{TemplateBinding ColorModel,
-                                                                 Mode=OneWay}"
+                                    ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                     HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                     IsRoundingEnabled="True"
                                     IsSnapToTickEnabled="True"
@@ -430,15 +436,14 @@
                                     NumberFormat="{StaticResource ColorViewComponentNumberFormat}"
                                     ShowButtonSpinner="False"
                                     Value="{Binding Value, ElementName=Component2Slider}" />
-                                <primitives:ColorSlider
-                                    x:Name="Component2Slider"
+                                <ColorSlider
+                                    Name="Component2Slider"
                                     Grid.Row="3"
                                     Grid.Column="1"
                                     HorizontalAlignment="Stretch"
                                     VerticalAlignment="Center"
                                     ColorComponent="Component2"
-                                    ColorModel="{TemplateBinding ColorModel,
-                                                                 Mode=OneWay}"
+                                    ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                     HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                     IsRoundingEnabled="True"
                                     IsSnapToTickEnabled="True"
@@ -461,15 +466,14 @@
                                     NumberFormat="{StaticResource ColorViewComponentNumberFormat}"
                                     ShowButtonSpinner="False"
                                     Value="{Binding Value, ElementName=Component3Slider}" />
-                                <primitives:ColorSlider
-                                    x:Name="Component3Slider"
+                                <ColorSlider
+                                    Name="Component3Slider"
                                     Grid.Row="4"
                                     Grid.Column="1"
                                     HorizontalAlignment="Stretch"
                                     VerticalAlignment="Center"
                                     ColorComponent="Component3"
-                                    ColorModel="{TemplateBinding ColorModel,
-                                                                 Mode=OneWay}"
+                                    ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                     HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                     IsRoundingEnabled="True"
                                     IsSnapToTickEnabled="True"
@@ -499,34 +503,33 @@
                                         </MultiBinding>
                                     </NumericUpDown.IsVisible>
                                 </NumericUpDown>
-                                <primitives:ColorSlider
-                                    x:Name="AlphaComponentSlider"
+                                <ColorSlider
+                                    Name="AlphaComponentSlider"
                                     Grid.Row="5"
                                     Grid.Column="1"
                                     HorizontalAlignment="Stretch"
                                     VerticalAlignment="Center"
                                     ColorComponent="Alpha"
-                                    ColorModel="{TemplateBinding ColorModel,
-                                                                 Mode=OneWay}"
+                                    ColorModel="{TemplateBinding ColorModel,Mode=OneWay}"
                                     HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                     IsEnabled="{TemplateBinding IsAlphaEnabled}"
                                     IsRoundingEnabled="True"
                                     IsSnapToTickEnabled="True"
                                     Orientation="Horizontal"
                                     TickFrequency="1">
-                                    <primitives:ColorSlider.IsVisible>
+                                    <ColorSlider.IsVisible>
                                         <MultiBinding Converter="{x:Static BoolConverters.And}">
                                             <Binding Path="IsAlphaVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                             <Binding Path="IsComponentSliderVisible" RelativeSource="{RelativeSource TemplatedParent}" />
                                         </MultiBinding>
-                                    </primitives:ColorSlider.IsVisible>
-                                </primitives:ColorSlider>
+                                    </ColorSlider.IsVisible>
+                                </ColorSlider>
                             </Grid>
                         </TabItem>
                     </TabControl>
                     <!--  Previewer  -->
                     <!--  Note that top/bottom margins have -5 to remove for drop shadow padding  -->
-                    <primitives:ColorPreviewer
+                    <ColorPreviewer
                         Grid.Row="1"
                         Margin="12,-5,12,7"
                         HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
@@ -583,8 +586,8 @@
                         Grid.Row="0"
                         CornerRadius="8 8 0 0"
                         ClipToBounds="True">
-                        <primitives:ColorSpectrum
-                            x:Name="ColorSpectrum"
+                        <ColorSpectrum
+                            Name="ColorSpectrum"
                             HorizontalAlignment="Stretch"
                             VerticalAlignment="Stretch"
                             Components="{TemplateBinding ColorSpectrumComponents}"
@@ -597,7 +600,7 @@
                             MinValue="{TemplateBinding MinValue}"
                             Shape="{TemplateBinding ColorSpectrumShape}" />
                     </Border>
-                    <primitives:ColorSlider
+                    <ColorSlider
                         Name="ColorSpectrumThirdComponentSlider"
                         Grid.Row="1"
                         HorizontalAlignment="Stretch"
@@ -609,7 +612,7 @@
                         IsVisible="{TemplateBinding IsColorSpectrumSliderVisible}"
                         Orientation="Horizontal" />
 
-                    <primitives:ColorSlider
+                    <ColorSlider
                         x:Name="ColorSpectrumAlphaSlider"
                         Grid.Row="2"
                         HorizontalAlignment="Stretch"
@@ -623,8 +626,7 @@
                         IsRoundingEnabled="True"
                         IsSnapToTickEnabled="True"
                         TickFrequency="1"
-                        Orientation="Horizontal">
-                    </primitives:ColorSlider>
+                        Orientation="Horizontal" />
                     <StackPanel
                         Grid.Row="3"
                         HorizontalAlignment="Stretch"
@@ -693,13 +695,4 @@
             <Setter Property="Width" Value="176" />
         </Style>
     </ControlTheme>
-
-    <Design.PreviewWith>
-        <ColorView
-            Theme="{StaticResource SimpleColorView}"
-            IsAlphaVisible="True"
-            IsAlphaEnabled="True"
-            ColorModel="Hsva"
-            HsvColor="hsv(120,7%,90%)" />
-    </Design.PreviewWith>
-</ResourceDictionary>
+</ResourceDictionary>
\ No newline at end of file
diff --git a/src/Semi.Avalonia.ColorPicker/Controls/_index.axaml b/src/Semi.Avalonia.ColorPicker/Controls/_index.axaml
new file mode 100644
index 0000000..d18df4d
--- /dev/null
+++ b/src/Semi.Avalonia.ColorPicker/Controls/_index.axaml
@@ -0,0 +1,12 @@
+<ResourceDictionary
+    x:CompileBindings="True"
+    xmlns="https://github.com/avaloniaui"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+    <ResourceDictionary.MergedDictionaries>
+        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorPreviewer.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorSlider.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorSpectrum.axaml" />
+        <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorView.axaml" />
+    </ResourceDictionary.MergedDictionaries>
+</ResourceDictionary>
\ No newline at end of file
diff --git a/src/Semi.Avalonia.ColorPicker/Index.axaml b/src/Semi.Avalonia.ColorPicker/Index.axaml
index 32b0f04..2d4da5d 100644
--- a/src/Semi.Avalonia.ColorPicker/Index.axaml
+++ b/src/Semi.Avalonia.ColorPicker/Index.axaml
@@ -6,7 +6,7 @@
                 <ResourceInclude x:Key="Dark" Source="avares://Semi.Avalonia.ColorPicker/Dark.axaml" />
             </ResourceDictionary.ThemeDictionaries>
             <ResourceDictionary.MergedDictionaries>
-                <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/ColorPicker.axaml" />
+                <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Controls/_index.axaml" />
                 <ResourceInclude Source="avares://Semi.Avalonia.ColorPicker/Shared.axaml" />
             </ResourceDictionary.MergedDictionaries>
         </ResourceDictionary>