feat(Search): remove IsAutoClearAfterSearch parameter (#5205)

* refactor: 增加虚方法规范子类

* refactor: 实现虚方法

* doc: 更新搜索示例

* refactor: 修复获得焦点自动全选失效问题

* refactor: 移除 IsAutoClearAfterSearch 参数

* doc: 更新示例代码说明

* refactor: 更新提示信息

* refactor: 增加过期标签

* test: 更新单元测试

* test: 更新单元测试

Author: ArgoZhang

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

@@ -18,15 +18,6 @@
     <ConsoleLogger @ref="Logger" />
 </DemoBlock>
 
-<DemoBlock Title="@Localizer["SearchesClearValueTitle"]"
-           Introduction="@Localizer["SearchesClearValueIntro"]"
-           Name="ClearValue">
-    <Search IsAutoClearAfterSearch="true"
-            PlaceHolder="@Localizer["SearchesPlaceHolder"]"
-            OnSearch="@OnClearSearch" />
-    <ConsoleLogger @ref="ClearLogger" />
-</DemoBlock>
-
 <DemoBlock Title="@Localizer["SearchesDisplayButtonTitle"]"
            Introduction="@Localizer["SearchesDisplayButtonIntro"]"
            Name="DisplayButton">
@@ -73,7 +64,7 @@
            Introduction="@Localizer["SearchesValidateFormIntro"]"
            Name="ValidateForm">
     <ValidateForm Model="@Model">
-        <Search @bind-Value="Model.Name" />
+        <Search @bind-Value="Model.Name" OnSearch="@OnModelSearch" />
     </ValidateForm>
 </DemoBlock>
 

src/BootstrapBlazor.Server/Components/Samples/Searches.razor.cs

@@ -54,7 +54,7 @@ private Task<IEnumerable<string>> OnKeyboardSearch(string searchText)
 
     private Foo Model { get; } = new() { Name = "" };
 
-    private string? OnGetDisplayText(Foo foo) => foo.Name;
+    private static string? OnGetDisplayText(Foo? foo) => foo?.Name;
 
     private async Task<IEnumerable<Foo>> OnSearchFoo(string searchText)
     {
@@ -69,6 +69,15 @@ private async Task<IEnumerable<Foo>> OnSearchFoo(string searchText)
         }).ToList();
     }
 
+    private async Task<IEnumerable<string>> OnModelSearch(string v)
+    {
+        // 模拟异步延时
+        await Task.Delay(100);
+        return string.IsNullOrEmpty(v)
+            ? Enumerable.Empty<string>()
+            : Enumerable.Range(1, 10).Select(i => LocalizerFoo["Foo.Name", $"{i:d4}"].Value).ToList();
+    }
+
     /// <summary>
     /// 获得属性方法
     /// </summary>

src/BootstrapBlazor.Server/Locales/en-US.json

@@ -4191,8 +4191,6 @@
     "SearchesNormalTitle": "Basic usage",
     "SearchesNormalIntro": "Enter some of the data to search",
     "SearchesNormalDescription": "Please enter <code>1234</code> to get the Smart Prompt and turn on auto focus by setting <code>IsAutoFocus='true'</code>",
-    "SearchesClearValueTitle": "Values are automatically emptied after searching",
-    "SearchesClearValueIntro": "Turn on the automatic emptying of the search box after search by setting <code>IsAutoClearAfterSearch=&quot;true&quot;</code>",
     "SearchesDisplayButtonTitle": "The Empty button is displayed",
     "SearchesDisplayButtonIntro": "Control whether the Empty button is displayed by setting the <code>ShowClearButton</code> parameter",
     "SearchesKeyboardsTitle": "Keyboard input instant search",

src/BootstrapBlazor.Server/Locales/zh-CN.json

@@ -4191,12 +4191,10 @@
     "SearchesNormalTitle": "基础用法",
     "SearchesNormalIntro": "输入部分数据进行搜索",
     "SearchesNormalDescription": "请输入 <code>1234</code> 获取智能提示，通过设置 <code>IsAutoFocus='true'</code> 开启自动获得焦点功能",
-    "SearchesClearValueTitle": "搜索后自动清空值",
-    "SearchesClearValueIntro": "通过设置 <code>IsAutoClearAfterSearch=&quot;true&quot;</code> 开启搜索后自动清空搜索框功能",
     "SearchesDisplayButtonTitle": "显示清空按钮",
     "SearchesDisplayButtonIntro": "通过设置 <code>ShowClearButton</code> 参数控制是否显示清空按钮",
     "SearchesKeyboardsTitle": "键盘输入即时搜索",
-    "SearchesKeyboardsIntro": "通过设置 <code>IsTriggerSearchByInput</code> 参数控制是否实时进行搜索操作",
+    "SearchesKeyboardsIntro": "通过设置 <code>IsTriggerSearchByInput</code> 参数控制是否实时进行搜索操作，组件默认输入时即进行搜索，可通过 <code>IsTriggerSearchByInput=\"false\"</code> 关闭",
     "SearchesValidateFormTitle": "验证表单内使用",
     "SearchesValidateFormIntro": "内置于 <code>ValidateForm</code> 使用，输入中文时不会多次触发搜索功能",
     "SearchesNoDataTip": "自动完成数据无匹配项时提示信息",

src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.cs

@@ -133,7 +133,7 @@ private async Task OnClickItem(string val)
     /// </summary>
     /// <param name="val"></param>
     [JSInvokable]
-    public async Task TriggerFilter(string val)
+    public override async Task TriggerFilter(string val)
     {
         if (OnCustomFilter != null)
         {
@@ -165,7 +165,7 @@ public async Task TriggerFilter(string val)
     /// </summary>
     /// <param name="val"></param>
     [JSInvokable]
-    public Task TriggerChange(string val)
+    public override Task TriggerChange(string val)
     {
         CurrentValue = val;
         if (!ValueChanged.HasDelegate)

src/BootstrapBlazor/Components/AutoComplete/PopoverCompleteBase.cs

@@ -131,6 +131,11 @@ public abstract class PopoverCompleteBase<TValue> : BootstrapInputBase<TValue>,
     /// </summary>
     protected string? PlacementString => Placement == Placement.Auto ? null : Placement.ToDescriptionString();
 
+    /// <summary>
+    /// 获得输入框 Id
+    /// </summary>
+    protected override string? GetInputId() => InputId;
+
     /// <summary>
     /// 获得 CustomClass 字符串
     /// </summary>
@@ -149,9 +154,8 @@ protected override void OnParametersSet()
     }
 
     /// <summary>
-    /// 出发 OnBlur 回调方法 由 Javascript 触发
+    /// 触发 OnBlur 回调方法 由 Javascript 触发
     /// </summary>
-    /// <returns></returns>
     [JSInvokable]
     public async Task TriggerBlur()
     {
@@ -161,6 +165,22 @@ public async Task TriggerBlur()
         }
     }
 
+    /// <summary>
+    /// TriggerFilter 方法
+    /// </summary>
+    /// <param name="val"></param>
+    /// <returns></returns>
+    [JSInvokable]
+    public virtual Task TriggerFilter(string val) => Task.CompletedTask;
+
+    /// <summary>
+    /// TriggerChange 方法
+    /// </summary>
+    /// <param name="val"></param>
+    /// <returns></returns>
+    [JSInvokable]
+    public virtual Task TriggerChange(string val) => Task.CompletedTask;
+
     /// <summary>
     /// <inheritdoc/>
     /// </summary>

src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs

@@ -142,7 +142,7 @@ private async Task OnClickItem(TValue val)
     /// </summary>
     /// <param name="val"></param>
     [JSInvokable]
-    public async Task TriggerFilter(string val)
+    public override async Task TriggerFilter(string val)
     {
         if (OnCustomFilter != null)
         {
@@ -174,7 +174,7 @@ public async Task TriggerFilter(string val)
     /// </summary>
     /// <param name="val"></param>
     [JSInvokable]
-    public Task TriggerChange(string val)
+    public override Task TriggerChange(string val)
     {
         _displayText = val;
         StateHasChanged();

src/BootstrapBlazor/Components/Search/Search.razor

@@ -20,7 +20,7 @@
         <Button Color="SearchButtonColor" Text="@SearchButtonText" Icon="@ButtonIcon" OnClick="OnSearchClick" aria-label="Search"></Button>
     </div>
     <ul class="dropdown-menu">
-        @foreach (var item in FilterItems)
+        @foreach (var item in _filterItems)
         {
             <li class="dropdown-item" @onclick="() => OnClickItem(item)">
                 @if (ItemTemplate != null)
@@ -33,7 +33,7 @@
                 }
             </li>
         }
-        @if (FilterItems.Count == 0)
+        @if (_filterItems.Count == 0)
         {
             <li class="dropdown-item">@NoDataTip</li>
         }

src/BootstrapBlazor/Components/Search/Search.razor.cs

@@ -65,6 +65,8 @@ public partial class Search<TValue>
     /// 获得/设置 点击搜索后是否自动清空搜索框
     /// </summary>
     [Parameter]
+    [Obsolete("已弃用，删除即可; Deprecated. Just delete it")]
+    [ExcludeFromCodeCoverage]
     public bool IsAutoClearAfterSearch { get; set; }
 
     /// <summary>
@@ -111,7 +113,7 @@ public partial class Search<TValue>
     /// 获得/设置 UI 呈现数据集合
     /// </summary>
     [NotNull]
-    private List<TValue>? FilterItems { get; set; }
+    private List<TValue>? _filterItems = null;
 
     /// <summary>
     /// <inheritdoc/>
@@ -126,7 +128,7 @@ protected override void OnParametersSet()
         SearchButtonText ??= Localizer[nameof(SearchButtonText)];
         ButtonIcon ??= SearchButtonIcon;
         NoDataTip ??= Localizer[nameof(NoDataTip)];
-        FilterItems ??= [];
+        _filterItems ??= [];
     }
 
     private string _displayText = "";
@@ -142,13 +144,8 @@ private async Task OnSearchClick()
             await Task.Yield();
 
             var items = await OnSearch(_displayText);
-            FilterItems = items.ToList();
+            _filterItems = items.ToList();
             ButtonIcon = SearchButtonIcon;
-            if (IsAutoClearAfterSearch)
-            {
-                _displayText = "";
-            }
-
             if (IsTriggerSearchByInput == false)
             {
                 await InvokeVoidAsync("showList", Id);
@@ -168,7 +165,7 @@ private async Task OnClearClick()
             await OnClear(_displayText);
         }
         _displayText = "";
-        FilterItems = [];
+        _filterItems = [];
     }
 
     private string? GetDisplayText(TValue item)
@@ -195,12 +192,19 @@ private async Task OnClickItem(TValue val)
         }
     }
 
+    /// <summary>
+    /// TriggerFilter 方法
+    /// </summary>
+    /// <param name="val"></param>
+    [JSInvokable]
+    public override Task TriggerFilter(string val) => TriggerChange(val);
+
     /// <summary>
     /// TriggerOnChange 方法
     /// </summary>
     /// <param name="val"></param>
     [JSInvokable]
-    public async Task TriggerChange(string val)
+    public override async Task TriggerChange(string val)
     {
         _displayText = val;
 

src/BootstrapBlazor/Locales/en.json

@@ -148,7 +148,7 @@
   },
   "BootstrapBlazor.Components.Search": {
     "SearchButtonText": "Search",
-    "NoDataTip": "Type something to search"
+    "NoDataTip": "No records found"
   },
   "BootstrapBlazor.Components.Select": {
     "PlaceHolder": "Please select ...",