feat: add SetHeader on TabItem (#621)

* Revert "!3108 refactor(#I5LZWS): remove SetText method on TabItem"

This reverts commit 436fff673e.

# Conflicts:
#	src/BootstrapBlazor.Shared/Samples/Tabs.razor
#	src/BootstrapBlazor.Shared/Samples/Tabs.razor.cs
#	src/BootstrapBlazor/Components/Tab/TabItem.cs

* feat: 增加 SetHeader 方法

* test: 增加 SetHeader 单元测试

* doc: 精简 DemoTabItem 示例

* doc: 增加 SetHeader 示例代码

* chore: bump version 7.4.2-beta01

src/BootstrapBlazor.Shared/Components/DemoTabItem.razor.cs

@@ -9,10 +9,6 @@ namespace BootstrapBlazor.Shared.Components;
 /// </summary>
 public partial class DemoTabItem
 {
-    [CascadingParameter]
-    [NotNull]
-    private TabItem? TabItem { get; set; }
-
     [Inject]
     [NotNull]
     private IStringLocalizer<DemoTabItem>? Localizer { get; set; }

src/BootstrapBlazor.Shared/Components/DemoTabItemSetText.razor

@@ -0,0 +1,3 @@
+<p>@((MarkupString)Localizer["Info"].Value)</p>
+
+<Button OnClick="OnClick" Text="@Localizer["ButtonText"]" />

src/BootstrapBlazor.Shared/Components/DemoTabItemSetText.razor.cs

@@ -0,0 +1,24 @@
+// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
+// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
+// Website: https://www.blazor.zone or https://argozhang.github.io/
+
+namespace BootstrapBlazor.Shared.Components;
+
+/// <summary>
+/// DemoTabItem 组件
+/// </summary>
+public partial class DemoTabItemSetText
+{
+    [CascadingParameter]
+    [NotNull]
+    private TabItem? TabItem { get; set; }
+
+    [Inject]
+    [NotNull]
+    private IStringLocalizer<DemoTabItem>? Localizer { get; set; }
+
+    private void OnClick()
+    {
+        TabItem.SetHeader(DateTime.Now.ToString("mm:ss"));
+    }
+}

src/BootstrapBlazor.Shared/Locales/en.json

@@ -2066,6 +2066,8 @@
     "BlockHeaderTemplateDesc": "Use <code>Badge</code> in the <code>HeaderTemplate</code>",
     "BlockSetHeaderTextTemplateTitle": "Set header text",
     "BlockSetHeaderTextTemplateIntro": "Set the parameter <code>Text</code> of <code>TabItem</code> custom the tabitem's header title'",
+    "BlockSetTabItemHeaderTextTitle": "Set header text icon",
+    "BlockSetTabItemHeaderTextIntro": "Set the parameter by <code>TabItem</code> instance method <code>SetHeader</code>",
     "Att1": "Whether it is a bordered card style",
     "Att2": "Whether it is a card style",
     "Att3": "Whether to render only Active labels",

src/BootstrapBlazor.Shared/Locales/zh.json

@@ -2071,6 +2071,8 @@
     "BlockHeaderTemplateDesc": "在 <code>HeaderTemplate</code> 中使用 <code>Badge</code> 设置挂件",
     "BlockSetHeaderTextTemplateTitle": "代码设置 Header 标题",
     "BlockSetHeaderTextTemplateIntro": "通过设置 <code>TabItem</code> 参数 <code>Text</code> 进行自定义标题设置",
+    "BlockSetTabItemHeaderTextTitle": "代码设置标题图标",
+    "BlockSetTabItemHeaderTextIntro": "通过设置 <code>TabItem</code> 实例方法 <code>SetHeader</code> 进行自定义标题设置",
     "Att1": "是否为带边框卡片样式",
     "Att2": "是否为卡片样式",
     "Att3": "是否仅渲染 Active 标签",

src/BootstrapBlazor.Shared/Samples/Tabs.razor

@@ -357,6 +357,14 @@ public TabItem? TabItem { get; set; }</Pre>
     </Tab>
 </DemoBlock>
 
+<DemoBlock Title="@Localizer["BlockSetTabItemHeaderTextTitle"]" Introduction="@Localizer["BlockSetTabItemHeaderTextIntro"]" Name="SetTabItemHeaderText">
+    <Tab IsBorderCard="true">
+        <TabItem Text="Text">
+            <DemoTabItemSetText />
+        </TabItem>
+    </Tab>
+</DemoBlock>
+
 <AttributeTable Items="@GetAttributes()" Title="@Localizer["AttTitle"]" />
 
 <MethodTable Items="@GetMethods()" Title="@Localizer["MethodTitle"]" />

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>7.4.1</Version>
+    <Version>7.4.2-beta01</Version>
   </PropertyGroup>
 
   <ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">

src/BootstrapBlazor/Components/Tab/TabItem.cs

@@ -81,6 +81,30 @@ public class TabItem : ComponentBase
     /// <param name="active"></param>
     public virtual void SetActive(bool active) => IsActive = active;
 
+    /// <summary>
+    /// 重新设置标签文字等参数
+    /// </summary>
+    /// <param name="text"></param>
+    /// <param name="icon"></param>
+    /// <param name="closable"></param>
+    public void SetHeader(string text, string? icon = null, bool? closable = null)
+    {
+        if (TabSet != null)
+        {
+            Text = text;
+
+            if (!string.IsNullOrEmpty(icon))
+            {
+                Icon = icon;
+            }
+            if (closable.HasValue)
+            {
+                Closable = closable.Value;
+            }
+            TabSet.ActiveTab(this);
+        }
+    }
+
     /// <summary>
     /// 通过指定参数集合获取 TabItem 实例
     /// </summary>

test/UnitTest/Components/TabTest.cs

@@ -460,7 +460,7 @@ public class TabTest : TabTestBase
     }
 
     [Fact]
-    public void SetText_Ok()
+    public void Text_Ok()
     {
         var text = "Tab1";
         var cut = Context.RenderComponent<Tab>(pb =>
@@ -487,6 +487,25 @@ public class TabTest : TabTestBase
         cut.Contains("<span class=\"tabs-item-text\">Text</span>");
     }
 
+    [Fact]
+    public void SetText_Ok()
+    {
+        var cut = Context.RenderComponent<Tab>(pb =>
+        {
+            pb.Add(a => a.AdditionalAssemblies, new Assembly[] { GetType().Assembly });
+            pb.Add(a => a.ClickTabToNavigation, true);
+            pb.AddChildContent<TabItem>(pb =>
+            {
+                pb.Add(a => a.Text, "Tab1");
+                pb.Add(a => a.Url, "/Cat");
+            });
+        });
+        cut.Contains("<span class=\"tabs-item-text\">Tab1</span>");
+        var item = cut.FindComponent<TabItem>();
+        cut.InvokeAsync(() => item.Instance.SetHeader("Text", "fa fa-fa", true));
+        cut.Contains("<span class=\"tabs-item-text\">Text</span>");
+    }
+
     [Fact]
     public void TabItem_HeaderTemplate()
     {