Merge branch 'main' of https://github.com/dotnetcore/BootstrapBlazor

actions-user · actions-user · commit 45082457dee4 · 2025-08-04T01:48:12.000Z
diff --git a/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor b/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor
@@ -128,7 +128,7 @@
                 <BootstrapInput @bind-Value="@Model.Name" />
             </div>
             <div class="col-12 col-sm-6">
-                <CheckboxList @bind-Value="@SelectedItems" IsButton="true" Items="FooItems" />
+                <CheckboxList @bind-Value="@SelectedItems" IsButton="true" Items="FooItems" ShowLabel="true" DisplayText="Hobby" />
             </div>
         </div>
     </ValidateForm>
diff --git a/src/BootstrapBlazor.Server/Components/Samples/SortableLists.razor b/src/BootstrapBlazor.Server/Components/Samples/SortableLists.razor
@@ -187,7 +187,7 @@
            Introduction="@Localizer["SortableListTableIntro"]"
            Name="Table">
     <SortableList Option="_optionTable" OnUpdate="OnUpdateTable">
-        <Table TItem="Foo" Items="@Items" IsStriped="true" ShowLineNo="true">
+        <Table TItem="Foo" Items="@Items" IsStriped="true" ShowLineNo="true" RenderMode="TableRenderMode.Table">
             <TableColumns>
                 <TableColumn @bind-Field="@context.DateTime" Width="180" />
                 <TableColumn @bind-Field="@context.Name" />
diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj
@@ -1,7 +1,7 @@
 ﻿<Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.9.1-beta02</Version>
+    <Version>9.9.1-beta04</Version>
   </PropertyGroup>
 
   <ItemGroup>
diff --git a/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor b/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor
@@ -13,7 +13,8 @@
         <div class="@ButtonGroupClassString" role="group">
             @foreach (var item in Items)
             {
-                <DynamicElement TagName="span" TriggerClick="!IsDisabled" OnClick="() => OnClick(item)" class="@GetButtonItemClassString(item)">
+                <DynamicElement TagName="span" TriggerClick="!IsDisabled" OnClick="() => OnClick(item)"
+                                class="@GetButtonItemClassString(item)">
                     @item.Text
                 </DynamicElement>
             }
diff --git a/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.cs b/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.cs
@@ -38,7 +38,8 @@ public partial class CheckboxList<TValue> : ValidateBase<TValue>
         .Build();
 
     private string? GetButtonItemClassString(SelectedItem item) => CssBuilder.Default("btn")
-        .AddClass($"active bg-{Color.ToDescriptionString()}", CurrentValueAsString.Split(',', StringSplitOptions.RemoveEmptyEntries).Contains(item.Value))
+        .AddClass($"btn-outline-{Color.ToDescriptionString()}")
+        .AddClass($"active", CurrentValueAsString.Split(',', StringSplitOptions.RemoveEmptyEntries).Contains(item.Value))
         .Build();
 
     /// <summary>
diff --git a/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.scss b/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.scss
@@ -1,4 +1,4 @@
-.checkbox-list {
+﻿.checkbox-list {
     --bb-checkbox-item-width: #{$bb-checkbox-item-width};
     min-height: var(--bb-height);
     height: auto;
@@ -38,7 +38,6 @@
     }
 
     .btn-group {
-        border: var(--bs-border-width) solid var(--bs-border-color);
         display: inline-flex;
         flex: 0 !important;
         flex-wrap: nowrap;
@@ -54,13 +53,19 @@
 
         &.disabled {
             > span {
+                --bs-btn-hover-color: var(--bs-btn-color);
+                --bs-btn-active-color: var(--bs-btn-color);
                 opacity: var(--bs-btn-disabled-opacity);
 
                 &:not(.active) {
                     background-color: var(--bs-secondary-bg);
                 }
             }
         }
+
+        .btn-outline-info {
+            --bs-btn-active-color: #fff;
+        }
     }
 }
 
diff --git a/src/BootstrapBlazor/Components/Collapse/Collapse.razor b/src/BootstrapBlazor/Components/Collapse/Collapse.razor
@@ -19,13 +19,16 @@
                                 @item.HeaderTemplate
                             </div>
                         }
-                        else if(!string.IsNullOrEmpty(item.Icon))
-                        {
-                            <i class="@GetItemIconString(item)"></i>
-                        }
                         else
                         {
-                            <span>@item.Text</span>
+                            if (!string.IsNullOrEmpty(item.Icon))
+                            {
+                                <i class="@GetItemIconString(item)"></i>
+                            }
+                            if (!string.IsNullOrEmpty(item.Text))
+                            {
+                                <span>@item.Text</span>
+                            }
                         }
                     </div>
                 </div>
diff --git a/src/BootstrapBlazor/Components/Radio/RadioList.razor.cs b/src/BootstrapBlazor/Components/Radio/RadioList.razor.cs
@@ -46,7 +46,8 @@ public partial class RadioList<TValue>
         .Build();
 
     private string? GetButtonItemClassString(SelectedItem item) => CssBuilder.Default("btn")
-        .AddClass($"active bg-{Color.ToDescriptionString()}", CurrentValueAsString == item.Value)
+        .AddClass($"btn-outline-{Color.ToDescriptionString()}")
+        .AddClass("active", CurrentValueAsString == item.Value)
         .Build();
 
     /// <summary>
diff --git a/src/BootstrapBlazor/Components/Radio/RadioList.razor.scss b/src/BootstrapBlazor/Components/Radio/RadioList.razor.scss
@@ -1,4 +1,4 @@
-.radio-list {
+﻿.radio-list {
     --bb-radio-item-width: #{$bb-radio-item-width};
     --bb-radio-item-padding: #{$bb-radio-item-padding};
     --bb-radio-group-item-active-color: #{$bb-radio-group-item-active-color};
@@ -24,7 +24,6 @@
     }
 
     &.btn-group {
-        border: var(--bs-border-width) solid var(--bs-border-color);
         display: inline-flex;
         flex: 0 !important;
         flex-wrap: nowrap;
@@ -39,12 +38,18 @@
         }
 
         &.disabled > span {
+            --bs-btn-hover-color: var(--bs-btn-color);
+            --bs-btn-active-color: var(--bs-btn-color);
             opacity: var(--bs-btn-disabled-opacity);
 
             &:not(.active) {
                 background-color: var(--bs-secondary-bg);
             }
         }
+
+        .btn-outline-info {
+            --bs-btn-active-color: var(--bb-radio-group-item-active-color);
+        }
     }
 
     &.btn-group-vertical {
diff --git a/src/BootstrapBlazor/Components/SortableList/ISortableList.cs b/src/BootstrapBlazor/Components/SortableList/ISortableList.cs
@@ -0,0 +1,14 @@
+﻿// 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
+
+namespace BootstrapBlazor.Components;
+
+/// <summary>
+/// SortableList 组件接口
+/// </summary>
+public interface ISortableList
+{
+
+}
diff --git a/src/BootstrapBlazor/Components/Table/Table.razor b/src/BootstrapBlazor/Components/Table/Table.razor
@@ -243,7 +243,7 @@
                         }
                         else
                         {
-                            <DynamicElement class="@GetRowClassString(item, "table-row")" @key="item"
+                            <DynamicElement class="@GetRowClassString(item, "table-row")" @key="GetKeyByITem(item)"
                                             TriggerContextMenu="ContextMenuZone != null" OnContextMenu="e => OnContextMenu(e, item)"
                                             @ontouchstart="e => OnTouchStart(e, item)"
                                             @ontouchend="OnTouchEnd"
@@ -692,7 +692,7 @@
     </thead>;
 
     RenderFragment<TItem> RenderRow => item =>
-    @<DynamicElement TagName="tr" class="@GetRowClassString(item)" @key="item"
+    @<DynamicElement TagName="tr" class="@GetRowClassString(item)" @key="GetKeyByITem(item)"
                      TriggerContextMenu="ContextMenuZone != null" OnContextMenu="e => OnContextMenu(e, item)"
                      @ontouchstart="e => OnTouchStart(e, item)" @ontouchend="OnTouchEnd"
                      TriggerClick="@(ClickToSelect || OnClickRowCallback != null)" OnClick="() => ClickRow(item)"
diff --git a/src/BootstrapBlazor/Components/Table/Table.razor.cs b/src/BootstrapBlazor/Components/Table/Table.razor.cs
@@ -198,6 +198,12 @@ private string GetSortTooltip(ITableColumn col) => SortName != col.GetFieldName(
     [Parameter]
     public bool ShowColumnWidthTooltip { get; set; }
 
+    ///// <summary>
+    ///// 获得/设置 行 Key 回调方法
+    ///// </summary>
+    //[Parameter]
+    //public Func<TItem, object?>? OnGetRowKey { get; set; }
+
     private string ScrollWidthString => $"width: {ActualScrollWidth}px;";
 
     private string? GetScrollStyleString(bool condition) => condition
@@ -780,6 +786,9 @@ public async Task ExpandDetailRow(TItem item)
     [CascadingParameter]
     private ContextMenuZone? ContextMenuZone { get; set; }
 
+    [CascadingParameter]
+    private ISortableList? SortableList { get; set; }
+
     [Inject]
     [NotNull]
     private IIconTheme? IconTheme { get; set; }
@@ -1681,6 +1690,8 @@ private void OnTouchEnd()
         TouchStart = false;
     }
 
+    private object? GetKeyByITem(TItem item) => SortableList != null ? item : null; //OnGetRowKey?.Invoke(item);
+
     /// <summary>
     /// Dispose 方法
     /// </summary>
diff --git a/src/BootstrapBlazor/Components/Table/Table.razor.scss b/src/BootstrapBlazor/Components/Table/Table.razor.scss
@@ -963,3 +963,7 @@ form .table .table-cell > textarea {
         border-bottom-color: var(--bs-primary);
     }
 }
+
+.bb-sortable tr {
+    cursor: pointer;
+}
diff --git a/src/BootstrapBlazor/Components/ValidateForm/BootstrapBlazorDataAnnotationsValidator.cs b/src/BootstrapBlazor/Components/ValidateForm/BootstrapBlazorDataAnnotationsValidator.cs
@@ -10,7 +10,7 @@ namespace BootstrapBlazor.Components;
 /// <summary>
 /// BootstrapBlazorDataAnnotationsValidator 验证组件
 /// </summary>
-public class BootstrapBlazorDataAnnotationsValidator : ComponentBase
+public class BootstrapBlazorDataAnnotationsValidator : ComponentBase, IDisposable
 {
     /// <summary>
     /// 获得/设置 当前编辑数据上下文
@@ -23,30 +23,110 @@ public class BootstrapBlazorDataAnnotationsValidator : ComponentBase
     /// 获得/设置 当前编辑窗体上下文
     /// </summary>
     [CascadingParameter]
+    [NotNull]
     private ValidateForm? ValidateForm { get; set; }
 
     [Inject]
     [NotNull]
     private IServiceProvider? Provider { get; set; }
 
+    [NotNull]
+    private ValidationMessageStore? _message = null;
+
     /// <summary>
     /// 初始化方法
     /// </summary>
     protected override void OnInitialized()
     {
         if (ValidateForm == null)
         {
-            throw new InvalidOperationException($"{nameof(Components.BootstrapBlazorDataAnnotationsValidator)} requires a cascading " +
-                $"parameter of type {nameof(Components.ValidateForm)}. For example, you can use {nameof(Components.BootstrapBlazorDataAnnotationsValidator)} " +
-                $"inside an {nameof(Components.ValidateForm)}.");
+            throw new InvalidOperationException($"{nameof(BootstrapBlazorDataAnnotationsValidator)} requires a cascading parameter of type {nameof(Components.ValidateForm)}. For example, you can use {nameof(BootstrapBlazorDataAnnotationsValidator)} inside an {nameof(Components.ValidateForm)}.");
         }
 
-        CurrentEditContext.AddEditContextDataAnnotationsValidation(ValidateForm, Provider);
+        _message = new ValidationMessageStore(CurrentEditContext);
+        AddEditContextDataAnnotationsValidation();
     }
 
     /// <summary>
     /// 手动验证表单方法
     /// </summary>
     /// <returns></returns>
     internal bool Validate() => CurrentEditContext.Validate();
+
+    private void AddEditContextDataAnnotationsValidation()
+    {
+        CurrentEditContext.OnValidationRequested += OnValidationRequested;
+        CurrentEditContext.OnFieldChanged += OnFieldChanged;
+    }
+
+    private void RemoveEditContextDataAnnotationsValidation()
+    {
+        CurrentEditContext.OnValidationRequested -= OnValidationRequested;
+        CurrentEditContext.OnFieldChanged -= OnFieldChanged;
+    }
+
+    private void OnValidationRequested(object? sender, ValidationRequestedEventArgs args)
+    {
+        _ = ValidateModel(CurrentEditContext, _message, Provider);
+    }
+
+    private void OnFieldChanged(object? sender, FieldChangedEventArgs args)
+    {
+        _ = ValidateField(CurrentEditContext, _message, args.FieldIdentifier, Provider);
+    }
+
+    private async Task ValidateModel(EditContext editContext, ValidationMessageStore messages, IServiceProvider provider)
+    {
+        var validationContext = new ValidationContext(editContext.Model, provider, null);
+        var validationResults = new List<ValidationResult>();
+        await ValidateForm.ValidateObject(validationContext, validationResults);
+
+        messages.Clear();
+        foreach (var validationResult in validationResults.Where(v => !string.IsNullOrEmpty(v.ErrorMessage)))
+        {
+            foreach (var memberName in validationResult.MemberNames)
+            {
+                if (!string.IsNullOrEmpty(memberName))
+                {
+                    messages.Add(editContext.Field(memberName), validationResult.ErrorMessage!);
+                }
+            }
+        }
+        editContext.NotifyValidationStateChanged();
+    }
+
+    private async Task ValidateField(EditContext editContext, ValidationMessageStore messages, FieldIdentifier field, IServiceProvider provider)
+    {
+        // 获取验证消息
+        var validationResults = new List<ValidationResult>();
+        var validationContext = new ValidationContext(field.Model, provider, null)
+        {
+            MemberName = field.FieldName,
+            DisplayName = field.GetDisplayName()
+        };
+
+        await ValidateForm.ValidateFieldAsync(validationContext, validationResults);
+
+        messages.Clear(field);
+        messages.Add(field, validationResults.Where(v => !string.IsNullOrEmpty(v.ErrorMessage)).Select(result => result.ErrorMessage!));
+
+        editContext.NotifyValidationStateChanged();
+    }
+
+    private void Dispose(bool disposing)
+    {
+        if (disposing)
+        {
+            RemoveEditContextDataAnnotationsValidation();
+        }
+    }
+
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    public void Dispose()
+    {
+        Dispose(true);
+        GC.SuppressFinalize(this);
+    }
 }
diff --git a/src/BootstrapBlazor/Extensions/BootstrapBlazorEditContextDataAnnotationsExtensions.cs b/src/BootstrapBlazor/Extensions/BootstrapBlazorEditContextDataAnnotationsExtensions.cs
diff --git a/test/UnitTest/Components/RadioTest.cs b/test/UnitTest/Components/RadioTest.cs

Original file line number	Diff line number	Diff line change
`@@ -13,7 +13,8 @@`
`13`	`13`	`<div class="@ButtonGroupClassString" role="group">`
`14`	`14`	`@foreach (var item in Items)`
`15`	`15`	`{`
`16`		`- <DynamicElement TagName="span" TriggerClick="!IsDisabled" OnClick="() => OnClick(item)" class="@GetButtonItemClassString(item)">`
	`16`	`+ <DynamicElement TagName="span" TriggerClick="!IsDisabled" OnClick="() => OnClick(item)"`
	`17`	`+ class="@GetButtonItemClassString(item)">`
`17`	`18`	`@item.Text`
`18`	`19`	`</DynamicElement>`
`19`	`20`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-.checkbox-list {`
	`1`	`+.checkbox-list {`
`2`	`2`	`--bb-checkbox-item-width: #{$bb-checkbox-item-width};`
`3`	`3`	`min-height: var(--bb-height);`
`4`	`4`	`height: auto;`
`@@ -38,7 +38,6 @@`
`38`	`38`	`}`
`39`	`39`
`40`	`40`	`.btn-group {`
`41`		`- border: var(--bs-border-width) solid var(--bs-border-color);`
`42`	`41`	`display: inline-flex;`
`43`	`42`	`flex: 0 !important;`
`44`	`43`	`flex-wrap: nowrap;`
`@@ -54,13 +53,19 @@`
`54`	`53`
`55`	`54`	`&.disabled {`
`56`	`55`	`> span {`
	`56`	`+ --bs-btn-hover-color: var(--bs-btn-color);`
	`57`	`+ --bs-btn-active-color: var(--bs-btn-color);`
`57`	`58`	`opacity: var(--bs-btn-disabled-opacity);`
`58`	`59`
`59`	`60`	`&:not(.active) {`
`60`	`61`	`background-color: var(--bs-secondary-bg);`
`61`	`62`	`}`
`62`	`63`	`}`
`63`	`64`	`}`
	`65`	`+`
	`66`	`+ .btn-outline-info {`
	`67`	`+ --bs-btn-active-color: #fff;`
	`68`	`+ }`
`64`	`69`	`}`
`65`	`70`	`}`
`66`	`71`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-.radio-list {`
	`1`	`+.radio-list {`
`2`	`2`	`--bb-radio-item-width: #{$bb-radio-item-width};`
`3`	`3`	`--bb-radio-item-padding: #{$bb-radio-item-padding};`
`4`	`4`	`--bb-radio-group-item-active-color: #{$bb-radio-group-item-active-color};`
`@@ -24,7 +24,6 @@`
`24`	`24`	`}`
`25`	`25`
`26`	`26`	`&.btn-group {`
`27`		`- border: var(--bs-border-width) solid var(--bs-border-color);`
`28`	`27`	`display: inline-flex;`
`29`	`28`	`flex: 0 !important;`
`30`	`29`	`flex-wrap: nowrap;`
`@@ -39,12 +38,18 @@`
`39`	`38`	`}`
`40`	`39`
`41`	`40`	`&.disabled > span {`
	`41`	`+ --bs-btn-hover-color: var(--bs-btn-color);`
	`42`	`+ --bs-btn-active-color: var(--bs-btn-color);`
`42`	`43`	`opacity: var(--bs-btn-disabled-opacity);`
`43`	`44`
`44`	`45`	`&:not(.active) {`
`45`	`46`	`background-color: var(--bs-secondary-bg);`
`46`	`47`	`}`
`47`	`48`	`}`
	`49`	`+`
	`50`	`+ .btn-outline-info {`
	`51`	`+ --bs-btn-active-color: var(--bb-radio-group-item-active-color);`
	`52`	`+ }`
`48`	`53`	`}`
`49`	`54`
`50`	`55`	`&.btn-group-vertical {`