Skip to content

feat(BootstrapLabel): add LabelWidth parameter #5265

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Feb 1, 2025
Merged

feat(BootstrapLabel): add LabelWidth parameter #5265

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fcb2a9e
feat: 增加 LabelWidth 参数
ArgoZhang Feb 1, 2025
1271a7f
doc: 代码格式化
ArgoZhang Feb 1, 2025
62e0604
test: 更新单元测试
ArgoZhang Feb 1, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 20 additions & 20 deletions src/BootstrapBlazor.Server/Components/Samples/EditorForms.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,12 +21,12 @@
<GroupBox Title="@Localizer["GroupBoxTitle"]" style="margin-top: 1.5rem;">
<EditorForm Model="@Model">
<FieldItems>
<EditorItem @bind-Field="@context.Education" Readonly="true" />
<EditorItem @bind-Field="@context.Complete" Readonly="true" />
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies" Readonly="true" />
<EditorItem @bind-Field="@context.Education" Readonly="true"></EditorItem>
<EditorItem @bind-Field="@context.Complete" Readonly="true"></EditorItem>
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies" Readonly="true"></EditorItem>
</FieldItems>
<Buttons>
<Button Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]" />
<Button Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]"></Button>
</Buttons>
</EditorForm>
</GroupBox>
Expand All @@ -41,11 +41,11 @@
<ValidateForm Model="@ValidateModel">
<EditorForm TModel="Foo">
<FieldItems>
<EditorItem @bind-Field="@context.DateTime" Readonly="true" />
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies" />
<EditorItem @bind-Field="@context.DateTime" Readonly="true"></EditorItem>
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies"></EditorItem>
</FieldItems>
<Buttons>
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text='@Localizer["SubButtonText"]' />
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]"></Button>
</Buttons>
</EditorForm>
</ValidateForm>
Expand All @@ -57,8 +57,8 @@
<p>@((MarkupString)Localizer["AutoGenerateDescription"].Value)</p>
<EditorForm Model="@Model" AutoGenerateAllItem="false">
<FieldItems>
<EditorItem @bind-Field="@context.Name" />
<EditorItem @bind-Field="@context.Count" />
<EditorItem @bind-Field="@context.Name"></EditorItem>
<EditorItem @bind-Field="@context.Count"></EditorItem>
</FieldItems>
</EditorForm>
</GroupBox>
Expand All @@ -70,22 +70,22 @@
<ValidateForm Model="Model">
<EditorForm Model="Model" AutoGenerateAllItem="false">
<FieldItems>
<EditorItem @bind-Field="@context.Name" />
<EditorItem @bind-Field="@context.Address" />
<EditorItem @bind-Field="@context.Name"></EditorItem>
<EditorItem @bind-Field="@context.Address"></EditorItem>
<EditorItem @bind-Field="@context.Count">
<EditTemplate Context="value">
<div class="col-12 col-sm-6">
<Select SkipValidate="true" @bind-Value="@value.Count" Items="@DummyItems" ShowSearch="true" />
<Select SkipValidate="true" @bind-Value="@value.Count" Items="@DummyItems" ShowSearch="true"></Select>
</div>
<div class="col-12 col-sm-6">
<BootstrapInput Value="@value.Count" Readonly="true" />
<BootstrapInput Value="@value.Count" Readonly="true"></BootstrapInput>
</div>
</EditTemplate>
</EditorItem>
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies" />
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies"></EditorItem>
</FieldItems>
<Buttons>
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]" />
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]"></Button>
</Buttons>
</EditorForm>
</ValidateForm>
Expand All @@ -98,10 +98,10 @@
<ValidateForm Model="@Model">
<EditorForm TModel="Foo" ItemsPerRow="3">
<FieldItems>
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies" />
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies"></EditorItem>
</FieldItems>
<Buttons>
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]" />
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]"></Button>
</Buttons>
</EditorForm>
</ValidateForm>
Expand All @@ -119,11 +119,11 @@
<ValidateForm Model="@Model">
<EditorForm TModel="Foo" ItemsPerRow="2" RowType="RowType.Inline" LabelAlign="Alignment.Right" LabelWidth="80">
<FieldItems>
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies" />
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbies"></EditorItem>
</FieldItems>
<Buttons>
<div class="text-end">
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]" />
<Button ButtonType="ButtonType.Submit" Icon="fa-solid fa-floppy-disk" Text="@Localizer["SubButtonText"]"></Button>
</div>
</Buttons>
</EditorForm>
Expand All @@ -132,4 +132,4 @@

<AttributeTable Items="@GetAttributes()" />

<AttributeTable Title="@Localizer["EditorFormAttributeTitle"]" Items="@GetEditorItemAttributes()" />
<AttributeTable Title="@Localizer["EditorFormAttributeTitle"]" Items="@GetEditorItemAttributes()"></AttributeTable>
2 changes: 1 addition & 1 deletion src/BootstrapBlazor/Components/Label/BootstrapLabel.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,5 +14,5 @@ else

@code {
RenderFragment RenderLabel =>
@<label @attributes="AdditionalAttributes" class="@ClassString">@Value</label>;
@<label @attributes="AdditionalAttributes" class="@ClassString" style="@StyleString">@Value</label>;
}
10 changes: 10 additions & 0 deletions src/BootstrapBlazor/Components/Label/BootstrapLabel.razor.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,22 @@ public partial class BootstrapLabel
[Parameter]
public bool? ShowLabelTooltip { get; set; }

/// <summary>
/// 获得/设置 标签宽度 默认 null 未设置使用全局设置 <code>--bb-row-label-width</code> 值
/// </summary>
[Parameter]
public int? LabelWidth { get; set; }

private bool _showTooltip;

private string? ClassString => CssBuilder.Default("form-label")
.AddClassFromAttributes(AdditionalAttributes)
.Build();

private string? StyleString => CssBuilder.Default()
.AddClass($"--bb-row-label-width: {LabelWidth}px;", LabelWidth.HasValue)
.Build();

/// <summary>
/// <inheritdoc/>
/// </summary>
Expand Down
6 changes: 6 additions & 0 deletions test/UnitTest/Components/TextareaTest.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,12 @@ public void IsShowLabel_OK()

var component = cut.FindComponent<BootstrapLabel>();
Assert.NotNull(component);

component.SetParametersAndRender(pb =>
{
pb.Add(a => a.LabelWidth, 120);
});
cut.Contains("style=\"--bb-row-label-width: 120px;\"");
}

[Fact]
Expand Down