diff --git a/samples/AtomUI.Demo.Desktop/ShowCase/CheckBoxShowCase.axaml b/samples/AtomUI.Demo.Desktop/ShowCase/CheckBoxShowCase.axaml
index 6fb7be812..1dc62bb4c 100644
--- a/samples/AtomUI.Demo.Desktop/ShowCase/CheckBoxShowCase.axaml
+++ b/samples/AtomUI.Demo.Desktop/ShowCase/CheckBoxShowCase.axaml
@@ -21,105 +21,105 @@
             </StackPanel>
         </desktop:ShowCaseItem>
 
-        <!-- <desktop:ShowCaseItem -->
-        <!--     Title="Disabled" -->
-        <!--     Description="Disabled checkbox."> -->
-        <!--     <StackPanel HorizontalAlignment="Left" Spacing="10" Orientation="Vertical"> -->
-        <!--         <atom:CheckBox IsChecked="False" IsEnabled="False">UnChecked</atom:CheckBox> -->
-        <!--         <atom:CheckBox IsChecked="{x:Null}" IsEnabled="False">Indeterminate</atom:CheckBox> -->
-        <!--         <atom:CheckBox IsChecked="True" IsEnabled="False">Checked</atom:CheckBox> -->
-        <!--     </StackPanel> -->
-        <!-- </desktop:ShowCaseItem> -->
-        <!-- -->
-        <!-- <desktop:ShowCaseItem -->
-        <!--     Title="Controlled Checkbox" -->
-        <!--     Description="Communicated with other components."> -->
-        <!--     <StackPanel HorizontalAlignment="Left" Spacing="10" Orientation="Vertical"> -->
-        <!--         <atom:CheckBox IsChecked="{Binding ControlledCheckBoxCheckedStatus}" -->
-        <!--                        IsEnabled="{Binding ControlledCheckBoxEnabledStatus}" -->
-        <!--                        Command="{Binding CheckBoxHandler}" -->
-        <!--                        Content="{Binding ControlledCheckBoxText}" /> -->
-        <!--         <StackPanel Orientation="Horizontal" Spacing="10" Margin="0, 10, 0, 0"> -->
-        <!--             <atom:Button SizeType="Small" ButtonType="Primary" -->
-        <!--                          x:Name="CheckStatusBtn" -->
-        <!--                          Command="{Binding CheckStatusHandler}" -->
-        <!--                          CommandParameter="{Binding ElementName=CheckStatusBtn}" -->
-        <!--                          Text="{Binding CheckStatusBtnText}" /> -->
-        <!--             <atom:Button SizeType="Small" ButtonType="Primary" -->
-        <!--                          x:Name="EnableStatusBtn" -->
-        <!--                          CommandParameter="{Binding ElementName=EnableStatusBtn}" -->
-        <!--                          Command="{Binding EnableStatusHandler}" -->
-        <!--                          Text="{Binding EnableStatusBtnText}" /> -->
-        <!--         </StackPanel> -->
-        <!--     </StackPanel> -->
-        <!-- </desktop:ShowCaseItem> -->
-        <!-- -->
-        <!-- <desktop:ShowCaseItem -->
-        <!--     Title="Checkbox Group" -->
-        <!--     Description="Generate a group of checkboxes from an array."> -->
-        <!--     <StackPanel HorizontalAlignment="Left" Spacing="10" Orientation="Vertical"> -->
-        <!--         <WrapPanel Margin="0, 0, 0, 10"> -->
-        <!--             <atom:CheckBox IsChecked="True">Apple</atom:CheckBox> -->
-        <!--             <atom:CheckBox IsChecked="True">Pear</atom:CheckBox> -->
-        <!--             <atom:CheckBox IsChecked="True">Orange</atom:CheckBox> -->
-        <!--         </WrapPanel> -->
-        <!--         <WrapPanel Margin="0, 0, 0, 10"> -->
-        <!--             <atom:CheckBox>Apple</atom:CheckBox> -->
-        <!--             <atom:CheckBox IsChecked="True">Pear</atom:CheckBox> -->
-        <!--             <atom:CheckBox>Orange</atom:CheckBox> -->
-        <!--         </WrapPanel> -->
-        <!--         <WrapPanel Margin="0, 0, 0, 10"> -->
-        <!--             <atom:CheckBox IsChecked="True" IsEnabled="False">Apple</atom:CheckBox> -->
-        <!--             <atom:CheckBox IsEnabled="False">Pear</atom:CheckBox> -->
-        <!--             <atom:CheckBox IsEnabled="False">Orange</atom:CheckBox> -->
-        <!--         </WrapPanel> -->
-        <!--     </StackPanel> -->
-        <!-- </desktop:ShowCaseItem> -->
-        <!-- -->
-        <!-- -->
-        <!-- <desktop:ShowCaseItem -->
-        <!--     Title="Check all" -->
-        <!--     Description="The indeterminate property can help you to achieve a 'check all' effect."> -->
-        <!--     <StackPanel Orientation="Vertical" HorizontalAlignment="Left" Spacing="10"> -->
-        <!--         <StackPanel> -->
-        <!--             <atom:CheckBox IsChecked="{Binding CheckedAllStatus}" -->
-        <!--                            Command="{Binding CheckedAllStatusHandler}"> -->
-        <!--                 Check all -->
-        <!--             </atom:CheckBox> -->
-        <!--         </StackPanel> -->
-        <!--         <WrapPanel Margin="0, 20, 0, 0"> -->
-        <!--             <atom:CheckBox x:Name="AppleCheckBox" -->
-        <!--                            IsChecked="{Binding AppleCheckedStatus}" -->
-        <!--                            Command="{Binding CheckedItemStatusHandler}" -->
-        <!--                            CommandParameter="{Binding ElementName=AppleCheckBox}"> -->
-        <!--                 Apple -->
-        <!--             </atom:CheckBox> -->
-        <!--             <atom:CheckBox x:Name="PearCheckBox" -->
-        <!--                            IsChecked="{Binding PearCheckedStatus}" -->
-        <!--                            Command="{Binding CheckedItemStatusHandler}" -->
-        <!--                            CommandParameter="{Binding ElementName=PearCheckBox}"> -->
-        <!--                 Pear -->
-        <!--             </atom:CheckBox> -->
-        <!--             <atom:CheckBox x:Name="OrangeCheckBox" -->
-        <!--                            IsChecked="{Binding OrangeCheckedStatus}" -->
-        <!--                            Command="{Binding CheckedItemStatusHandler}" -->
-        <!--                            CommandParameter="{Binding ElementName=OrangeCheckBox}"> -->
-        <!--                 Orange -->
-        <!--             </atom:CheckBox> -->
-        <!--         </WrapPanel> -->
-        <!--     </StackPanel> -->
-        <!-- </desktop:ShowCaseItem> -->
-        <!-- -->
-        <!-- <desktop:ShowCaseItem -->
-        <!--     Title="Use with Grid" -->
-        <!--     Description="We can use Checkbox and Grid in Checkbox.Group, to implement complex layout."> -->
-        <!--     <Grid ColumnDefinitions="*,*,*" RowDefinitions="Auto,Auto,Auto" Margin="10"> -->
-        <!--         <atom:CheckBox Grid.Row="0" Grid.Column="0">A</atom:CheckBox> -->
-        <!--         <atom:CheckBox Grid.Row="0" Grid.Column="1">B</atom:CheckBox> -->
-        <!--         <atom:CheckBox Grid.Row="0" Grid.Column="2">C</atom:CheckBox> -->
-        <!--         <atom:CheckBox Grid.Row="1" Grid.Column="0">D</atom:CheckBox> -->
-        <!--         <atom:CheckBox Grid.Row="1" Grid.Column="1">D</atom:CheckBox> -->
-        <!--     </Grid> -->
-        <!-- </desktop:ShowCaseItem> -->
+        <desktop:ShowCaseItem
+            Title="Disabled"
+            Description="Disabled checkbox.">
+            <StackPanel HorizontalAlignment="Left" Spacing="10" Orientation="Vertical">
+                <atom:CheckBox IsChecked="False" IsEnabled="False">UnChecked</atom:CheckBox>
+                <atom:CheckBox IsChecked="{x:Null}" IsEnabled="False">Indeterminate</atom:CheckBox>
+                <atom:CheckBox IsChecked="True" IsEnabled="False">Checked</atom:CheckBox>
+            </StackPanel>
+        </desktop:ShowCaseItem>
+        
+        <desktop:ShowCaseItem
+            Title="Controlled Checkbox"
+            Description="Communicated with other components.">
+            <StackPanel HorizontalAlignment="Left" Spacing="10" Orientation="Vertical">
+                <atom:CheckBox IsChecked="{Binding ControlledCheckBoxCheckedStatus}"
+                               IsEnabled="{Binding ControlledCheckBoxEnabledStatus}"
+                               Command="{Binding CheckBoxHandler}"
+                               Content="{Binding ControlledCheckBoxText}" />
+                <StackPanel Orientation="Horizontal" Spacing="10" Margin="0, 10, 0, 0">
+                    <atom:Button SizeType="Small" ButtonType="Primary"
+                                 x:Name="CheckStatusBtn"
+                                 Command="{Binding CheckStatusHandler}"
+                                 CommandParameter="{Binding ElementName=CheckStatusBtn}"
+                                 Text="{Binding CheckStatusBtnText}" />
+                    <atom:Button SizeType="Small" ButtonType="Primary"
+                                 x:Name="EnableStatusBtn"
+                                 CommandParameter="{Binding ElementName=EnableStatusBtn}"
+                                 Command="{Binding EnableStatusHandler}"
+                                 Text="{Binding EnableStatusBtnText}" />
+                </StackPanel>
+            </StackPanel>
+        </desktop:ShowCaseItem>
+        
+        <desktop:ShowCaseItem
+            Title="Checkbox Group"
+            Description="Generate a group of checkboxes from an array.">
+            <StackPanel HorizontalAlignment="Left" Spacing="10" Orientation="Vertical">
+                <WrapPanel Margin="0, 0, 0, 10">
+                    <atom:CheckBox IsChecked="True">Apple</atom:CheckBox>
+                    <atom:CheckBox IsChecked="True">Pear</atom:CheckBox>
+                    <atom:CheckBox IsChecked="True">Orange</atom:CheckBox>
+                </WrapPanel>
+                <WrapPanel Margin="0, 0, 0, 10">
+                    <atom:CheckBox>Apple</atom:CheckBox>
+                    <atom:CheckBox IsChecked="True">Pear</atom:CheckBox>
+                    <atom:CheckBox>Orange</atom:CheckBox>
+                </WrapPanel>
+                <WrapPanel Margin="0, 0, 0, 10">
+                    <atom:CheckBox IsChecked="True" IsEnabled="False">Apple</atom:CheckBox>
+                    <atom:CheckBox IsEnabled="False">Pear</atom:CheckBox>
+                    <atom:CheckBox IsEnabled="False">Orange</atom:CheckBox>
+                </WrapPanel>
+            </StackPanel>
+        </desktop:ShowCaseItem>
+        
+        
+        <desktop:ShowCaseItem
+            Title="Check all"
+            Description="The indeterminate property can help you to achieve a 'check all' effect.">
+            <StackPanel Orientation="Vertical" HorizontalAlignment="Left" Spacing="10">
+                <StackPanel>
+                    <atom:CheckBox IsChecked="{Binding CheckedAllStatus}"
+                                   Command="{Binding CheckedAllStatusHandler}">
+                        Check all
+                    </atom:CheckBox>
+                </StackPanel>
+                <WrapPanel Margin="0, 20, 0, 0">
+                    <atom:CheckBox x:Name="AppleCheckBox"
+                                   IsChecked="{Binding AppleCheckedStatus}"
+                                   Command="{Binding CheckedItemStatusHandler}"
+                                   CommandParameter="{Binding ElementName=AppleCheckBox}">
+                        Apple
+                    </atom:CheckBox>
+                    <atom:CheckBox x:Name="PearCheckBox"
+                                   IsChecked="{Binding PearCheckedStatus}"
+                                   Command="{Binding CheckedItemStatusHandler}"
+                                   CommandParameter="{Binding ElementName=PearCheckBox}">
+                        Pear
+                    </atom:CheckBox>
+                    <atom:CheckBox x:Name="OrangeCheckBox"
+                                   IsChecked="{Binding OrangeCheckedStatus}"
+                                   Command="{Binding CheckedItemStatusHandler}"
+                                   CommandParameter="{Binding ElementName=OrangeCheckBox}">
+                        Orange
+                    </atom:CheckBox>
+                </WrapPanel>
+            </StackPanel>
+        </desktop:ShowCaseItem>
+        
+        <desktop:ShowCaseItem
+            Title="Use with Grid"
+            Description="We can use Checkbox and Grid in Checkbox.Group, to implement complex layout.">
+            <Grid ColumnDefinitions="*,*,*" RowDefinitions="Auto,Auto,Auto" Margin="10">
+                <atom:CheckBox Grid.Row="0" Grid.Column="0">A</atom:CheckBox>
+                <atom:CheckBox Grid.Row="0" Grid.Column="1">B</atom:CheckBox>
+                <atom:CheckBox Grid.Row="0" Grid.Column="2">C</atom:CheckBox>
+                <atom:CheckBox Grid.Row="1" Grid.Column="0">D</atom:CheckBox>
+                <atom:CheckBox Grid.Row="1" Grid.Column="1">D</atom:CheckBox>
+            </Grid>
+        </desktop:ShowCaseItem>
     </desktop:ShowCasePanel>
 </UserControl>
\ No newline at end of file
diff --git a/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml b/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml
index 1760d3ab3..89cc933ab 100644
--- a/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml
+++ b/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml
@@ -152,8 +152,8 @@ If a large or small collapse is desired, set the size property to either large o
         </desktop:ShowCaseItem>
 
         <desktop:ShowCaseItem
-            Title="Extra node"
-            Description="Render extra element in the top-right corner of each panel." Margin="0, 0, 10, 0">
+            Title="Expand icon location"
+            Description="The expand icon can be placed in front or in the back." Margin="0, 0, 10, 0">
             <StackPanel Orientation="Vertical" Spacing="20">
                 <atom:Collapse ExpandIconPosition="{Binding CollapseExpandIconPosition}">
                     <atom:CollapseItem Header="This is panel header 1"
diff --git a/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml.cs b/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml.cs
index 593b76599..468e6ed71 100644
--- a/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml.cs
+++ b/samples/AtomUI.Demo.Desktop/ShowCase/CollapseShowCase.axaml.cs
@@ -19,7 +19,7 @@ public partial class CollapseShowCase : UserControl
     {
         InitializeComponent();
         DataContext = this;
-        //ExpandButtonPosGroup.OptionCheckedChanged += HandleExpandButtonPosOptionCheckedChanged;
+        ExpandButtonPosGroup.OptionCheckedChanged += HandleExpandButtonPosOptionCheckedChanged;
     }
 
     private void HandleExpandButtonPosOptionCheckedChanged(object? sender, OptionCheckedChangedEventArgs args)
diff --git a/samples/AtomUI.Demo.Desktop/ShowCase/ExpanderShowCase.axaml b/samples/AtomUI.Demo.Desktop/ShowCase/ExpanderShowCase.axaml
index f4dee05b9..07dff695f 100644
--- a/samples/AtomUI.Demo.Desktop/ShowCase/ExpanderShowCase.axaml
+++ b/samples/AtomUI.Demo.Desktop/ShowCase/ExpanderShowCase.axaml
@@ -104,8 +104,8 @@ If a large or small Expander is desired, set the size property to either large o
         </desktop:ShowCaseItem>
 
         <desktop:ShowCaseItem
-            Title="Extra node"
-            Description="Render extra element in the top-right corner of each panel." Margin="0, 0, 10, 0">
+            Title="Expand icon location"
+            Description="The expand icon can be placed in front or in the back." Margin="0, 0, 10, 0">
             <StackPanel Orientation="Vertical" Spacing="20">
                 <atom:Expander Header="This is panel header 1"
                                AddOnContent="{atom:IconProvider Kind=SettingOutlined}"