feat(AutoFill): reuse AutoComplete clear-icon function (#6763)

* refactor: 清空按钮复用 AutoComplete 逻辑

* test: 更新单元测试

* chore: bump version 9.10.2

Author: ArgoZhang

src/BootstrapBlazor/BootstrapBlazor.csproj

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

src/BootstrapBlazor/Components/AutoFill/AutoFill.razor

@@ -19,7 +19,7 @@
     <span class="form-select-append ac-loading"><i class="@LoadingIcon"></i></span>
     @if (GetClearable())
     {
-        <span class="@ClearClassString" @onclick="OnClearValue"><i class="@ClearIcon"></i></span>
+        <span class="@ClearClassString"><i class="@ClearIcon"></i></span>
     }
     <RenderTemplate @ref="_dropdown">
         @RenderDropdown

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

@@ -14,13 +14,6 @@ namespace BootstrapBlazor.Components;
 /// <typeparam name="TValue">The type of the value.</typeparam>
 public partial class AutoFill<TValue>
 {
-    /// <summary>
-    /// Gets the component style.
-    /// </summary>
-    private string? ClassString => CssBuilder.Default("auto-complete auto-fill")
-        .AddClass("is-clearable", IsClearable)
-        .Build();
-
     /// <summary>
     /// Gets or sets the collection of items for the component.
     /// </summary>
@@ -141,6 +134,13 @@ public partial class AutoFill<TValue>
     [NotNull]
     private RenderTemplate? _dropdown = null;
 
+    /// <summary>
+    /// Gets the component style.
+    /// </summary>
+    private string? ClassString => CssBuilder.Default("auto-complete auto-fill")
+        .AddClass("is-clearable", IsClearable)
+        .Build();
+
     /// <summary>
     /// Gets the clear icon class string.
     /// </summary>
@@ -176,7 +176,6 @@ protected override void OnParametersSet()
     /// <returns></returns>
     protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, Interop, _displayText);
 
-
     private bool IsNullable() => !ValueType.IsValueType || NullableUnderlyingType != null;
 
     /// <summary>
@@ -185,30 +184,6 @@ protected override void OnParametersSet()
     /// <returns></returns>
     private bool GetClearable() => IsClearable && !IsDisabled && IsNullable();
 
-    /// <summary>
-    /// <inheritdoc/>
-    /// </summary>
-    /// <returns></returns>
-    private async Task OnClearValue()
-    {
-        // 使用脚本更新 input 值
-        await InvokeVoidAsync("setValue", Id, "");
-
-        if (OnClearAsync != null)
-        {
-            await OnClearAsync();
-        }
-        CurrentValue = default;
-        _displayText = null;
-        _filterItems = null;
-        _searchText = null;
-
-        if (OnQueryAsync != null)
-        {
-            await _virtualizeElement.RefreshDataAsync();
-        }
-    }
-
     /// <summary>
     /// Callback method when a candidate item is clicked.
     /// </summary>
@@ -255,6 +230,18 @@ private async ValueTask<ItemsProviderResult<TValue>> LoadItems(ItemsProviderRequ
     [JSInvokable]
     public async Task TriggerFilter(string val)
     {
+        if (string.IsNullOrEmpty(val))
+        {
+            CurrentValue = default;
+            _filterItems = null;
+            _displayText = null;
+
+            if (OnClearAsync != null)
+            {
+                await OnClearAsync();
+            }
+        }
+
         if (OnQueryAsync != null)
         {
             _searchText = val;

test/UnitTest/Components/AutoFillTest.cs

@@ -425,10 +425,9 @@ public async Task IsVirtualize_OnQueryAsync_Clearable_Ok()
         Assert.Equal("2", searchText);
         Assert.Contains("<div>test2</div>", cut.Markup);
 
+        // 测试 Clear 清空逻辑
         query = false;
-        // 点击 Clear 按钮
-        var button = cut.Find(".clear-icon");
-        await cut.InvokeAsync(() => button.Click());
+        await cut.InvokeAsync(() => cut.Instance.TriggerFilter(""));
 
         Assert.True(query);
         Assert.True(cleared);
@@ -445,7 +444,7 @@ public async Task IsVirtualize_OnQueryAsync_Clearable_Ok()
                 });
             });
         });
-        await cut.InvokeAsync(() => button.Click());
+        await cut.InvokeAsync(() => cut.Instance.TriggerFilter(""));
     }
 
     [Fact]