feat(Collapse): redesign HeaderTemplate function (#6467)

* refactor: 更改 HeaderTemplate 模板

* doc: 更新示例

* chore: bump version 9.8.2-beta04

Co-Authored-By: 逆流的鱼 <[email protected]>

---------

Co-authored-by: 逆流的鱼 <[email protected]>

Author: ArgoZhang

src/BootstrapBlazor.Server/Components/Samples/Collapses.razor

@@ -145,9 +145,7 @@
         <CollapseItems>
             <CollapseItem Text="@Localizer["Consistency"]">
                 <HeaderTemplate>
-                    <div class="p-2">
-                        <Select Items="Items" @bind-Value="Value" IsPopover="true"></Select>
-                    </div>
+                    <Select Items="Items" @bind-Value="Value" IsPopover="true"></Select>
                 </HeaderTemplate>
                 <ChildContent>
                     <div>@Localizer["ConsistencyItem1"]</div>
@@ -157,7 +155,7 @@
             </CollapseItem>
             <CollapseItem Text="@Localizer["Feedback"]">
                 <HeaderTemplate>
-                    <div class="p-2">Header-Test</div>
+                    Header-Test
                 </HeaderTemplate>
                 <ChildContent>
                     <div>@Localizer["FeedbackItem1"]</div>
@@ -166,7 +164,7 @@
             </CollapseItem>
             <CollapseItem Text="@Localizer["Controllability"]">
                 <HeaderTemplate>
-                    <div class="p-2">Header-Test</div>
+                    Header-Test
                 </HeaderTemplate>
                 <ChildContent>
                     <div>@Localizer["ControllabilityItem1"]</div>

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.8.2-beta03</Version>
+    <Version>9.8.2-beta04</Version>
   </PropertyGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Components/Collapse/Collapse.razor

@@ -10,20 +10,23 @@
         {
             <div @key="item" class="@GetItemClassString(item)">
                 <div class="@GetHeaderClassString(item)">
-                    @if (item.HeaderTemplate != null)
-                    {
-                        <div class="accordion-header-body">
-                            @item.HeaderTemplate
-                        </div>
-                    }
                     <div class="@GetHeaderButtonClassString(item)"
                          data-bs-toggle="collapse" data-bs-target="@GetTargetIdString(item)"
                          aria-expanded="@(item.IsCollapsed ? "false" : "true")" @onclick="() => OnClickItem(item)">
-                        @if(!string.IsNullOrEmpty(item.Icon))
+                        @if (item.HeaderTemplate != null)
+                        {
+                            <div class="accordion-header-body">
+                                @item.HeaderTemplate
+                            </div>
+                        }
+                        else if(!string.IsNullOrEmpty(item.Icon))
                         {
                             <i class="@GetItemIconString(item)"></i>
                         }
-                        <span>@item.Text</span>
+                        else
+                        {
+                            <span>@item.Text</span>
+                        }
                     </div>
                 </div>
                 <div class="@GetClassString(item.IsCollapsed)" id="@GetTargetId(item)" data-bs-parent="@ParentIdString">