From a1c3b556104172e25ffd84e9b96f617d21cb1c08 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 18:32:19 +0800
Subject: [PATCH 01/19] =?UTF-8?q?refactor(AvatarUpload):=20Rewrite=20zoom?=
 =?UTF-8?q?=20event=EF=BC=8Calign=20the=20current=20item=20index.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. Make the hover style of the delete button more prominent,
2. Rewrite zoom onclick event and set stopPropagation.
---
 src/BootstrapBlazor/Components/Upload/AvatarUpload.razor  | 5 +++--
 .../Components/Upload/AvatarUpload.razor.cs               | 6 +++---
 .../Components/Upload/InputUpload.razor.scss              | 8 ++++++++
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
index ff0f043e2d3..18d8fe167ae 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
@@ -16,8 +16,9 @@
         {
             <div @key="item" class="@GetItemClassString()" id="@item.ValidateId" style="@ItemStyleString">
                 <Avatar Url="@item.PrevUrl" />
-                <div class="upload-item-actions">
-                    <span class="upload-item-delete" @onclick="@(e => OnFileDelete(item))">
+                <div class="upload-item-actions" @onclick="@(() => Preview(item.ValidateId ?? ""))">
+                    <span class="upload-item-delete" @onclick="@(e => OnFileDelete(item))"
+                          @onclick:stopPropagation="true">
                         <i class="@DeleteIcon"></i>
                     </span>
                     @if (GetShowProgress(item))
diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
index f0f32d4e66c..98a94d9c750 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
@@ -154,11 +154,11 @@ protected override async Task TriggerOnChanged(UploadFile file)
     /// 预览当前头像方法
     /// </summary>
     /// <returns></returns>
-    public async Task Preview()
+    public async Task Preview(string id)
     {
-        if(ShowPreviewList)
+        if(ShowPreviewList && !string.IsNullOrWhiteSpace(id) && Files.Any(r => r.ValidateId == id))
         {
-            await InvokeVoidAsync("preview", PreviewerId, 0);
+            await InvokeVoidAsync("preview", PreviewerId, Files.IndexOf(Files.First(r => r.ValidateId == id)));
         }
     }
 
diff --git a/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss b/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
index 33efcd27f79..b43f54ca7b0 100644
--- a/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
+++ b/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
@@ -157,6 +157,14 @@
 .upload .upload-body.is-avatar .upload-item:hover .upload-item-actions .upload-item-delete {
     display: block;
     color: var(--bs-danger);
+    padding: 0.1rem;
+    border-radius: 0.5rem;
+    border: 0.1rem solid var(--bs-danger);
+}
+
+.upload .upload-body.is-avatar .upload-item:hover .upload-item-actions .upload-item-delete:hover {
+    color: var(--bs-white);
+    background-color: var(--bs-danger);
 }
 
 .upload .upload-body.is-avatar .upload-item.is-invalid .upload-item-spin {

From 60d29bb6076696b9b3b34fc52468e9a9e9e18198 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 18:44:01 +0800
Subject: [PATCH 02/19] refactor(AvatarUpload): Update unit test

---
 test/UnitTest/Components/UploadAvatarTest.cs | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index 9b32d935dd6..b2fc96a57f8 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -76,8 +76,8 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
             new()
         })));
 
-        // call preview
-        await cut.InvokeAsync(() => cut.Instance.Preview());
+        // call preview // without using reflection, it is not possible to obtain the actual runtime values.
+        await cut.InvokeAsync(() => cut.Instance.Preview(""));
 
         // upload-item-delete
         var button = cut.Find(".upload-item-delete");

From 9f8bd31080ca21250fed77373b94549386bf6b02 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 18:53:46 +0800
Subject: [PATCH 03/19] refactor(AvatarUpload): Refactor the related logic to
 reduce redundant calculations.

---
 src/BootstrapBlazor/Components/Upload/AvatarUpload.razor  | 2 +-
 .../Components/Upload/AvatarUpload.razor.cs               | 8 +++++---
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
index 18d8fe167ae..8bf58e7ebc2 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
@@ -16,7 +16,7 @@
         {
             <div @key="item" class="@GetItemClassString()" id="@item.ValidateId" style="@ItemStyleString">
                 <Avatar Url="@item.PrevUrl" />
-                <div class="upload-item-actions" @onclick="@(() => Preview(item.ValidateId ?? ""))">
+                <div class="upload-item-actions" @onclick="@(() => Preview(item.ValidateId))">
                     <span class="upload-item-delete" @onclick="@(e => OnFileDelete(item))"
                           @onclick:stopPropagation="true">
                         <i class="@DeleteIcon"></i>
diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
index 98a94d9c750..c2e2110f2d8 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
@@ -154,11 +154,13 @@ protected override async Task TriggerOnChanged(UploadFile file)
     /// 预览当前头像方法
     /// </summary>
     /// <returns></returns>
-    public async Task Preview(string id)
+    public async Task Preview(string? id)
     {
-        if(ShowPreviewList && !string.IsNullOrWhiteSpace(id) && Files.Any(r => r.ValidateId == id))
+        if(ShowPreviewList && !string.IsNullOrWhiteSpace(id))
         {
-            await InvokeVoidAsync("preview", PreviewerId, Files.IndexOf(Files.First(r => r.ValidateId == id)));
+            var index = Files.FindIndex(r => r.ValidateId == id);
+            if (index != -1)
+                await InvokeVoidAsync("preview", PreviewerId, index);
         }
     }
 

From 285ffea48005adc54ccf5acd55d51ba6ec067341 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 19:01:21 +0800
Subject: [PATCH 04/19] refactor(AvatarUpload): Update unit test

---
 test/UnitTest/Components/UploadAvatarTest.cs | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index b2fc96a57f8..e6687d36730 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -77,7 +77,11 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         })));
 
         // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview(""));
+        await cut.InvokeAsync(() => cut.Instance.Preview("test-id"));
+
+        // upload-item-actions
+        var img = cut.Find(".upload-item-actions");
+        await cut.InvokeAsync(() => img.Click());
 
         // upload-item-delete
         var button = cut.Find(".upload-item-delete");

From 509573ed50910ab2a9cb37d9f49c4b892ec507a3 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 19:23:24 +0800
Subject: [PATCH 05/19] refactor(AvatarUpload): Unit test need ok uploadFile,
 Files search change to use PrevUrl

---
 src/BootstrapBlazor/Components/Upload/AvatarUpload.razor    | 2 +-
 src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs | 6 +++---
 test/UnitTest/Components/UploadAvatarTest.cs                | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
index 8bf58e7ebc2..1163013955c 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
@@ -16,7 +16,7 @@
         {
             <div @key="item" class="@GetItemClassString()" id="@item.ValidateId" style="@ItemStyleString">
                 <Avatar Url="@item.PrevUrl" />
-                <div class="upload-item-actions" @onclick="@(() => Preview(item.ValidateId))">
+                <div class="upload-item-actions" @onclick="@(() => Preview(item))">
                     <span class="upload-item-delete" @onclick="@(e => OnFileDelete(item))"
                           @onclick:stopPropagation="true">
                         <i class="@DeleteIcon"></i>
diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
index c2e2110f2d8..a6dc6c97c72 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
@@ -154,11 +154,11 @@ protected override async Task TriggerOnChanged(UploadFile file)
     /// 预览当前头像方法
     /// </summary>
     /// <returns></returns>
-    public async Task Preview(string? id)
+    public async Task Preview(UploadFile file)
     {
-        if(ShowPreviewList && !string.IsNullOrWhiteSpace(id))
+        if(ShowPreviewList && !string.IsNullOrWhiteSpace(file.PrevUrl))
         {
-            var index = Files.FindIndex(r => r.ValidateId == id);
+            var index = Files.FindIndex(r => r.PrevUrl == file.PrevUrl);
             if (index != -1)
                 await InvokeVoidAsync("preview", PreviewerId, index);
         }
diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index e6687d36730..0db4d51f6cb 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -67,7 +67,7 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
             pb.Add(a => a.ShowProgress, true);
             pb.Add(a => a.DefaultFileList,
             [
-                new() { FileName = "Test-File" }
+                new() { FileName = "Test-File", PrevUrl = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAkCAYAAAD/yagrAAAE60lEQVR4AWJwL/AB9GIWvI0jURz/L1NomZmZP8p9kWNmhnIbKPdomZmZGcJgO7QsWMbce55Yl11t47FbVdKTYpjOr/+H4y4Z/MpYeJVV8KVvokFRylq9osKfVtGQ/NHyPl2CbNVGwau2oOlmgUDJtDJGzxtvvIA3vRH+7IgeA0VtYhQBtKPlToFgC6RY58aggfwLNKhr0Zry2NnPrpIM2YGW2+UBG1IEmdGVJEVXE+hQXt8joKhLjdGVZHd7TSD9DHmT3J1dheroSF4fhnvUVQwbZx9UOnHSzQjkTN0tIG+8hFdbxet4PQOG4WqJwN1hFVb+xUBmCblxvxRkIE+Q+Yf0T31NSrp4/RV4FhHgoSTchQRZBK4D1+Fe2q2g8CYXU6buQyNDaiZKZhn0IYXHVwbkRQydHyawOAGGisa/o3DvI/jF3QKKiuAy+LKs5CvaXMLdeXb35wbkKTjmReDZHysCBosWJqN7r0jZ/VfgXtIlUNQnVpK7D4nNJSC5BHGi1d108Ppr8MxlF0cJqBSyFJaUfUnvHLyO4cttgaI+NhGB7HE0MaSUks/gU5vwe1gv5tfhmUmAhxME8jbIUtiEDus+fhmDJlgCRY0ylZRZhybKWtNinmYlH9NvL5puO3m9UHOkgzb3xuF5HCkDyhYiSwrYVfQPTpYChTc+E35tG9VJBjGFFNmtVlNMDnjzbx0EBpKq1eTeh2awbArBRuHadBWu6WVB4U/NITfuobYoCZl7QL//wDtr+nTmsgzQh2Kwgtz7QAZWFeGw/RI8s94Kigp1PvzZg2i9x11FDtKn/oZCoZdZxhaAXmG4/ohJKHudLE1Gyu66DOfs10BRR5CU3TKQIrtzj9BAkF991dsMslTZEClLsI+jFmANZYFAdAJl9QG03jWH9GrcFh9QTP4Of6GfJGSpsv1J2aoEKRuWCANNJNqOFAaPAW36rVRMCjVf6ZCtqYF2p6Asxg5mWK6tQamY9RCs8z1wF+FxTR5UqYT/3GC7oCkMHcjxKguq6cnl+Egf2whip3C9Yu56jk+GXXOtv1XIa8L1f3AFkHe9az83AmNanwV/bhfa5JKJ3n1slCUL8dk7CNfvVFMfySRThoxbK7fh18tTZXI2QeySLk88IRGsbHkqQj6wUJ72G5CloCXKZrdbLPgVMgVfQMq5m97bfQWOOeVbaK02nSA2ofn2y662UJE47horLZTe38oDjdxQUhmawocxa0OJ5hXjnZE4w1y0uc/iULKGfk+xNuZxI/BnjhFs+THPq4phmTsbeYPXRjFsJJ+NSMlnInHkxrwzGDjR3uBcG1/B/b/TwZkhubb6tP2oVfTAD2G4kw9vYiA2h+zy4GwYxd7S4qGOgd6oqVn6re1DTXiO4e4wPF+yQlF4ZCBfheSPIjJn+ciS/w93qjA6aZYqeQ5D3dTqvuE6GZNTkov5vqsYvLh7j8u1sWWkLIdBQR+q+XdtaKGhJCWBDpkwgSw9gRpKyoNKw6rjCLCDP4yVflSgWFwt3C0HSUo2BTFYX28fVAaWPpDx7wtwjOSSUszawnUT0KTudlfrFQwZ3WNf867CNZQhk/C8kIFUhJLt/O3Jzn62IYNwrUvA8zws4W61CGlDSfugXMz5pJgiSFYyXMYiRXdH4GmyqaR9UHLxzxG41KAwpZxRPN4kRf85Z5I4MvYfFUFGfemJG40AAAAASUVORK5CYII=" },
             ]);
         });
         input = cut.FindComponent<InputFile>();
@@ -77,7 +77,7 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         })));
 
         // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview("test-id"));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile()));
 
         // upload-item-actions
         var img = cut.Find(".upload-item-actions");

From 84f274e9cd37c87f45afa1e2bdc4ae9fabf7d008 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 20:01:53 +0800
Subject: [PATCH 06/19] refactor(AvatarUpload): Update unit test

---
 test/UnitTest/Components/UploadAvatarTest.cs | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index 0db4d51f6cb..f7fecffb6dc 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -77,15 +77,20 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         })));
 
         // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile()));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData", PrevUrl = "ErrData" }));
 
-        // upload-item-actions
-        var img = cut.Find(".upload-item-actions");
-        await cut.InvokeAsync(() => img.Click());
+        // all data
+        var length = cut.FindAll(".upload-item-actions").Count;
+        for (int i = 0; i < length; i++)
+        {
+            // upload-item-actions
+            var img = cut.Find(".upload-item-actions");
+            await cut.InvokeAsync(() => img.Click());
 
-        // upload-item-delete
-        var button = cut.Find(".upload-item-delete");
-        await cut.InvokeAsync(() => button.Click());
+            // upload-item-delete
+            var button = cut.Find(".upload-item-delete");
+            await cut.InvokeAsync(() => button.Click());
+        }
 
         cut.Contains("btn-browser");
         cut.Render(pb =>

From 7827b37309c45dd6830381de958c087e0bf5c906 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 20:08:49 +0800
Subject: [PATCH 07/19] refactor(AvatarUpload): Update unit test

---
 test/UnitTest/Components/UploadAvatarTest.cs | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index f7fecffb6dc..598d0c603b1 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -77,7 +77,8 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         })));
 
         // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData", PrevUrl = "ErrData" }));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData1", PrevUrl = "    " }));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData2", PrevUrl = "" }));
 
         // all data
         var length = cut.FindAll(".upload-item-actions").Count;

From 7e55079294f1e27bcbe79af8d5523915cdf8aec3 Mon Sep 17 00:00:00 2001
From: momiji-gz302ea <2648863351@qq.com>
Date: Thu, 18 Dec 2025 20:20:33 +0800
Subject: [PATCH 08/19] refactor(AvatarUpload): Update unit test

---
 test/UnitTest/Components/UploadAvatarTest.cs | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index 598d0c603b1..ee0f083df73 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -60,6 +60,11 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         });
         cut.Contains("--bb-upload-item-border-radius: 10px;");
 
+        // ShowPreviewList is false
+        var oldButton = cut.Find(".upload-item-delete");
+        await cut.InvokeAsync(() => oldButton.Click());
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData", PrevUrl = "" }));
+
         // DefaultFileList
         cut.Render(pb =>
         {
@@ -76,9 +81,10 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
             new()
         })));
 
-        // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData1", PrevUrl = "    " }));
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData2", PrevUrl = "" }));
+        // call preview
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData1", PrevUrl = "ErrData" }));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData2", PrevUrl = "    " }));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData3", PrevUrl = null }));
 
         // all data
         var length = cut.FindAll(".upload-item-actions").Count;

From 88aaa0b70b9158e788fe19071de3cad807106597 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:40:16 +0800
Subject: [PATCH 09/19] =?UTF-8?q?refactor:=20=E9=87=8D=E6=9E=84=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Components/Upload/AvatarUpload.razor.cs      | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
index a6dc6c97c72..75242e08144 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
@@ -1,4 +1,4 @@
-// Licensed to the .NET Foundation under one or more agreements.
+// Licensed to the .NET Foundation under one or more agreements.
 // The .NET Foundation licenses this file to you under the Apache 2.0 License
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
@@ -154,13 +154,23 @@ protected override async Task TriggerOnChanged(UploadFile file)
     /// 预览当前头像方法
     /// </summary>
     /// <returns></returns>
-    public async Task Preview(UploadFile file)
+    public async Task Preview()
     {
-        if(ShowPreviewList && !string.IsNullOrWhiteSpace(file.PrevUrl))
+        if (ShowPreviewList)
+        {
+            await InvokeVoidAsync("preview", PreviewerId, 0);
+        }
+    }
+
+    private async Task Preview(UploadFile file)
+    {
+        if (ShowPreviewList && !string.IsNullOrEmpty(file.PrevUrl))
         {
             var index = Files.FindIndex(r => r.PrevUrl == file.PrevUrl);
             if (index != -1)
+            {
                 await InvokeVoidAsync("preview", PreviewerId, index);
+            }
         }
     }
 

From f6047d762911e77aeb0b57ab151c707cbc3990df Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:40:37 +0800
Subject: [PATCH 10/19] =?UTF-8?q?chore:=20=E6=9B=B4=E6=96=B0=E7=BC=96?=
 =?UTF-8?q?=E7=A0=81=E6=96=B9=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/BootstrapBlazor/Components/Upload/AvatarUpload.razor | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
index 1163013955c..74facab4083 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor
@@ -1,4 +1,4 @@
-@namespace BootstrapBlazor.Components
+@namespace BootstrapBlazor.Components
 @typeparam TValue
 @inherits UploadBase<TValue>
 

From 920286ca2de34b29085e8c74792b7e448720ddaa Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:41:14 +0800
Subject: [PATCH 11/19] =?UTF-8?q?style:=20=E5=BE=AE=E8=B0=83=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss b/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
index 0644fe24545..befa842cca1 100644
--- a/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
+++ b/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
@@ -85,7 +85,7 @@
 }
 
 .upload .upload-body.is-list .cancel-icon {
-    margin-left: .5rem;
+    margin-inline-start: .5rem;
     color: var(--bs-danger);
 }
 

From fedc3b8b4113dc2554239544b09f8834c60b66fb Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:41:25 +0800
Subject: [PATCH 12/19] =?UTF-8?q?style:=20=E6=9B=B4=E6=96=B0=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Components/Upload/InputUpload.razor.scss                | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss b/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
index befa842cca1..45f7b40d418 100644
--- a/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
+++ b/src/BootstrapBlazor/Components/Upload/InputUpload.razor.scss
@@ -157,9 +157,9 @@
 .upload .upload-body.is-avatar .upload-item:hover .upload-item-actions .upload-item-delete {
     display: block;
     color: var(--bs-danger);
-    padding: 0.1rem;
-    border-radius: 0.5rem;
-    border: 0.1rem solid var(--bs-danger);
+    padding: 0.25rem;
+    border-radius: var(--bs-border-radius);
+    border: 1px solid var(--bs-danger);
 }
 
 .upload .upload-body.is-avatar .upload-item:hover .upload-item-actions .upload-item-delete:hover {

From 7212c15e308ad38386a115fc51680fc963970cd7 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:43:32 +0800
Subject: [PATCH 13/19] Revert "refactor(AvatarUpload): Update unit test"

This reverts commit 7e55079294f1e27bcbe79af8d5523915cdf8aec3.
---
 test/UnitTest/Components/UploadAvatarTest.cs | 12 +++---------
 1 file changed, 3 insertions(+), 9 deletions(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index ee0f083df73..598d0c603b1 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -60,11 +60,6 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         });
         cut.Contains("--bb-upload-item-border-radius: 10px;");
 
-        // ShowPreviewList is false
-        var oldButton = cut.Find(".upload-item-delete");
-        await cut.InvokeAsync(() => oldButton.Click());
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData", PrevUrl = "" }));
-
         // DefaultFileList
         cut.Render(pb =>
         {
@@ -81,10 +76,9 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
             new()
         })));
 
-        // call preview
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData1", PrevUrl = "ErrData" }));
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData2", PrevUrl = "    " }));
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData3", PrevUrl = null }));
+        // call preview // without using reflection, it is not possible to obtain the actual runtime values.
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData1", PrevUrl = "    " }));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData2", PrevUrl = "" }));
 
         // all data
         var length = cut.FindAll(".upload-item-actions").Count;

From 757b8f0b4276554fedb10f8974cfb7ea3ef12953 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:43:37 +0800
Subject: [PATCH 14/19] Revert "refactor(AvatarUpload): Update unit test"

This reverts commit 7827b37309c45dd6830381de958c087e0bf5c906.
---
 test/UnitTest/Components/UploadAvatarTest.cs | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index 598d0c603b1..f7fecffb6dc 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -77,8 +77,7 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         })));
 
         // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData1", PrevUrl = "    " }));
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData2", PrevUrl = "" }));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData", PrevUrl = "ErrData" }));
 
         // all data
         var length = cut.FindAll(".upload-item-actions").Count;

From 756bd8b69fc24d9f10f7119da56f445a38d029e5 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:43:43 +0800
Subject: [PATCH 15/19] Revert "refactor(AvatarUpload): Update unit test"

This reverts commit 84f274e9cd37c87f45afa1e2bdc4ae9fabf7d008.
---
 test/UnitTest/Components/UploadAvatarTest.cs | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index f7fecffb6dc..0db4d51f6cb 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -77,20 +77,15 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         })));
 
         // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile(){ FileName = "Test-File-HasErrData", PrevUrl = "ErrData" }));
+        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile()));
 
-        // all data
-        var length = cut.FindAll(".upload-item-actions").Count;
-        for (int i = 0; i < length; i++)
-        {
-            // upload-item-actions
-            var img = cut.Find(".upload-item-actions");
-            await cut.InvokeAsync(() => img.Click());
+        // upload-item-actions
+        var img = cut.Find(".upload-item-actions");
+        await cut.InvokeAsync(() => img.Click());
 
-            // upload-item-delete
-            var button = cut.Find(".upload-item-delete");
-            await cut.InvokeAsync(() => button.Click());
-        }
+        // upload-item-delete
+        var button = cut.Find(".upload-item-delete");
+        await cut.InvokeAsync(() => button.Click());
 
         cut.Contains("btn-browser");
         cut.Render(pb =>

From 81a4cc5a4b66156d0daa0d4d09e94ea2099c9ab7 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:44:51 +0800
Subject: [PATCH 16/19] =?UTF-8?q?chore:=20=E9=87=8D=E6=9E=84=E5=8D=95?=
 =?UTF-8?q?=E5=85=83=E6=B5=8B=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/UnitTest/Components/UploadAvatarTest.cs | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index 0db4d51f6cb..9b32d935dd6 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -67,7 +67,7 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
             pb.Add(a => a.ShowProgress, true);
             pb.Add(a => a.DefaultFileList,
             [
-                new() { FileName = "Test-File", PrevUrl = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAkCAYAAAD/yagrAAAE60lEQVR4AWJwL/AB9GIWvI0jURz/L1NomZmZP8p9kWNmhnIbKPdomZmZGcJgO7QsWMbce55Yl11t47FbVdKTYpjOr/+H4y4Z/MpYeJVV8KVvokFRylq9osKfVtGQ/NHyPl2CbNVGwau2oOlmgUDJtDJGzxtvvIA3vRH+7IgeA0VtYhQBtKPlToFgC6RY58aggfwLNKhr0Zry2NnPrpIM2YGW2+UBG1IEmdGVJEVXE+hQXt8joKhLjdGVZHd7TSD9DHmT3J1dheroSF4fhnvUVQwbZx9UOnHSzQjkTN0tIG+8hFdbxet4PQOG4WqJwN1hFVb+xUBmCblxvxRkIE+Q+Yf0T31NSrp4/RV4FhHgoSTchQRZBK4D1+Fe2q2g8CYXU6buQyNDaiZKZhn0IYXHVwbkRQydHyawOAGGisa/o3DvI/jF3QKKiuAy+LKs5CvaXMLdeXb35wbkKTjmReDZHysCBosWJqN7r0jZ/VfgXtIlUNQnVpK7D4nNJSC5BHGi1d108Ppr8MxlF0cJqBSyFJaUfUnvHLyO4cttgaI+NhGB7HE0MaSUks/gU5vwe1gv5tfhmUmAhxME8jbIUtiEDus+fhmDJlgCRY0ylZRZhybKWtNinmYlH9NvL5puO3m9UHOkgzb3xuF5HCkDyhYiSwrYVfQPTpYChTc+E35tG9VJBjGFFNmtVlNMDnjzbx0EBpKq1eTeh2awbArBRuHadBWu6WVB4U/NITfuobYoCZl7QL//wDtr+nTmsgzQh2Kwgtz7QAZWFeGw/RI8s94Kigp1PvzZg2i9x11FDtKn/oZCoZdZxhaAXmG4/ohJKHudLE1Gyu66DOfs10BRR5CU3TKQIrtzj9BAkF991dsMslTZEClLsI+jFmANZYFAdAJl9QG03jWH9GrcFh9QTP4Of6GfJGSpsv1J2aoEKRuWCANNJNqOFAaPAW36rVRMCjVf6ZCtqYF2p6Asxg5mWK6tQamY9RCs8z1wF+FxTR5UqYT/3GC7oCkMHcjxKguq6cnl+Egf2whip3C9Yu56jk+GXXOtv1XIa8L1f3AFkHe9az83AmNanwV/bhfa5JKJ3n1slCUL8dk7CNfvVFMfySRThoxbK7fh18tTZXI2QeySLk88IRGsbHkqQj6wUJ72G5CloCXKZrdbLPgVMgVfQMq5m97bfQWOOeVbaK02nSA2ofn2y662UJE47horLZTe38oDjdxQUhmawocxa0OJ5hXjnZE4w1y0uc/iULKGfk+xNuZxI/BnjhFs+THPq4phmTsbeYPXRjFsJJ+NSMlnInHkxrwzGDjR3uBcG1/B/b/TwZkhubb6tP2oVfTAD2G4kw9vYiA2h+zy4GwYxd7S4qGOgd6oqVn6re1DTXiO4e4wPF+yQlF4ZCBfheSPIjJn+ciS/w93qjA6aZYqeQ5D3dTqvuE6GZNTkov5vqsYvLh7j8u1sWWkLIdBQR+q+XdtaKGhJCWBDpkwgSw9gRpKyoNKw6rjCLCDP4yVflSgWFwt3C0HSUo2BTFYX28fVAaWPpDx7wtwjOSSUszawnUT0KTudlfrFQwZ3WNf867CNZQhk/C8kIFUhJLt/O3Jzn62IYNwrUvA8zws4W61CGlDSfugXMz5pJgiSFYyXMYiRXdH4GmyqaR9UHLxzxG41KAwpZxRPN4kRf85Z5I4MvYfFUFGfemJG40AAAAASUVORK5CYII=" },
+                new() { FileName = "Test-File" }
             ]);
         });
         input = cut.FindComponent<InputFile>();
@@ -76,12 +76,8 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
             new()
         })));
 
-        // call preview // without using reflection, it is not possible to obtain the actual runtime values.
-        await cut.InvokeAsync(() => cut.Instance.Preview(new UploadFile()));
-
-        // upload-item-actions
-        var img = cut.Find(".upload-item-actions");
-        await cut.InvokeAsync(() => img.Click());
+        // call preview
+        await cut.InvokeAsync(() => cut.Instance.Preview());
 
         // upload-item-delete
         var button = cut.Find(".upload-item-delete");

From 2f86dd61622eade1bbea763f9b7aeec53fa120e1 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:56:43 +0800
Subject: [PATCH 17/19] =?UTF-8?q?test:=20=E5=A2=9E=E5=8A=A0=E5=8D=95?=
 =?UTF-8?q?=E5=85=83=E6=B5=8B=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/UnitTest/Components/UploadAvatarTest.cs | 25 ++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/test/UnitTest/Components/UploadAvatarTest.cs b/test/UnitTest/Components/UploadAvatarTest.cs
index 9b32d935dd6..79b0e09ec43 100644
--- a/test/UnitTest/Components/UploadAvatarTest.cs
+++ b/test/UnitTest/Components/UploadAvatarTest.cs
@@ -98,6 +98,31 @@ await cut.InvokeAsync(() => input.Instance.OnChange.InvokeAsync(new InputFileCha
         });
     }
 
+    [Fact]
+    public async Task Preview_Ok()
+    {
+        var cut = Context.Render<AvatarUpload<string>>(pb =>
+        {
+            pb.Add(a => a.DefaultFileList, new List<UploadFile>()
+            {
+                new UploadFile() { PrevUrl = "./sample/preview.jpg" }
+            });
+        });
+
+        var action = cut.Find(".upload-item-actions");
+        await cut.InvokeAsync(() => action.Click());
+
+        cut.Render(pb =>
+        {
+            pb.Add(a => a.DefaultFileList, new List<UploadFile>()
+            {
+                new UploadFile() { PrevUrl = "" }
+            });
+        });
+        action = cut.Find(".upload-item-actions");
+        await cut.InvokeAsync(() => action.Click());
+    }
+
     [Fact]
     public async Task AvatarUpload_ValidateForm_Ok()
     {

From ddcd6f2b2913bdb2ddb20a8a07a6ac029208e485 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 09:59:20 +0800
Subject: [PATCH 18/19] =?UTF-8?q?test:=20=E6=9B=B4=E6=96=B0=E5=8D=95?=
 =?UTF-8?q?=E5=85=83=E6=B5=8B=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
index 75242e08144..9cd596900b5 100644
--- a/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
+++ b/src/BootstrapBlazor/Components/Upload/AvatarUpload.razor.cs
@@ -164,7 +164,7 @@ public async Task Preview()
 
     private async Task Preview(UploadFile file)
     {
-        if (ShowPreviewList && !string.IsNullOrEmpty(file.PrevUrl))
+        if (!string.IsNullOrEmpty(file.PrevUrl))
         {
             var index = Files.FindIndex(r => r.PrevUrl == file.PrevUrl);
             if (index != -1)

From 7ca214f1bcf875b1cf06f765006eb3943824e745 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Fri, 19 Dec 2025 10:00:33 +0800
Subject: [PATCH 19/19] chore: bump version 10.1.4

---
 src/BootstrapBlazor/BootstrapBlazor.csproj | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj
index c284f19acd6..cda610aa65a 100644
--- a/src/BootstrapBlazor/BootstrapBlazor.csproj
+++ b/src/BootstrapBlazor/BootstrapBlazor.csproj
@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>10.1.4-beta07</Version>
+    <Version>10.1.4</Version>
   </PropertyGroup>
 
   <ItemGroup>