+
@GetListOptions(Items)
diff --git a/src/Core/Components/List/FluentSelect.razor b/src/Core/Components/List/FluentSelect.razor
index 94a4da69ab..f3e631554c 100644
--- a/src/Core/Components/List/FluentSelect.razor
+++ b/src/Core/Components/List/FluentSelect.razor
@@ -3,6 +3,7 @@
@typeparam TOption
@InlineStyleValue
+
@GetListOptions(Items)
diff --git a/src/Core/Components/List/ListComponentBase.cs b/src/Core/Components/List/ListComponentBase.cs
index 483d41f34c..120dc5575d 100644
--- a/src/Core/Components/List/ListComponentBase.cs
+++ b/src/Core/Components/List/ListComponentBase.cs
@@ -61,10 +61,29 @@ protected string? InternalValue
[Parameter]
public string? Height { get; set; }
+ ///
+ /// Text displayed just above the component
+ ///
+ [Parameter]
+ public string? Label { get; set; }
+
+ ///
+ /// Content displayed just above the component
+ ///
+ [Parameter]
+ public RenderFragment? LabelTemplate { get; set; }
+
///
/// Text used on aria-label attribute.
///
[Parameter]
+ public virtual string? AriaLabel { get; set; }
+
+ ///
+ /// Text used on aria-label attribute.
+ ///
+ [Parameter]
+ [Obsolete("Use AriaLabel instead")]
public virtual string? Title { get; set; }
///
@@ -487,4 +506,12 @@ protected virtual void AddSelectedItem(TOption? item)
_selectedOptions.Add(item);
}
+
+ ///
+ protected internal string? GetAriaLabel()
+ {
+#pragma warning disable CS0618 // Type or member is obsolete
+ return string.IsNullOrEmpty(AriaLabel) ? Title : AriaLabel;
+#pragma warning restore CS0618 // Type or member is obsolete
+ }
}
diff --git a/src/Core/Components/NumberField/FluentNumberField.razor b/src/Core/Components/NumberField/FluentNumberField.razor
index 609faa9266..7faa4b3174 100644
--- a/src/Core/Components/NumberField/FluentNumberField.razor
+++ b/src/Core/Components/NumberField/FluentNumberField.razor
@@ -3,6 +3,7 @@
@typeparam TValue where TValue : new()
@using System.Globalization;
@using System.Reflection;
+
+ @Label
+ @LabelTemplate
@ChildContent
diff --git a/src/Core/Components/Radio/FluentRadio.razor.cs b/src/Core/Components/Radio/FluentRadio.razor.cs
index 21a16b41f7..5b8bba51e9 100644
--- a/src/Core/Components/Radio/FluentRadio.razor.cs
+++ b/src/Core/Components/Radio/FluentRadio.razor.cs
@@ -16,6 +16,24 @@ public partial class FluentRadio<[DynamicallyAccessedMembers(DynamicallyAccessed
[Parameter]
public bool Readonly { get; set; }
+ ///
+ /// Text displayed just above the component
+ ///
+ [Parameter]
+ public string? Label { get; set; }
+
+ ///
+ /// Content displayed just above the component
+ ///
+ [Parameter]
+ public RenderFragment? LabelTemplate { get; set; }
+
+ ///
+ /// Text used on aria-label attribute.
+ ///
+ [Parameter]
+ public virtual string? AriaLabel { get; set; }
+
///
/// The value of the element
///
diff --git a/src/Core/Components/Radio/FluentRadioGroup.razor b/src/Core/Components/Radio/FluentRadioGroup.razor
index 7c07ab3757..ebe4d9ca22 100644
--- a/src/Core/Components/Radio/FluentRadioGroup.razor
+++ b/src/Core/Components/Radio/FluentRadioGroup.razor
@@ -2,7 +2,9 @@
@inherits FluentInputBase
@typeparam TValue
+
/// Gets or sets the orientation of the group. See
///
diff --git a/src/Core/Components/Search/FluentSearch.razor b/src/Core/Components/Search/FluentSearch.razor
index 204ed6dd3c..70b339ed63 100644
--- a/src/Core/Components/Search/FluentSearch.razor
+++ b/src/Core/Components/Search/FluentSearch.razor
@@ -1,5 +1,6 @@
@namespace Microsoft.Fast.Components.FluentUI
@inherits FluentInputBase
+
@typeparam TValue
@attribute [CascadingTypeParameter(nameof(TValue))]
+@LabelTemplate
+ @Label
+ @LabelTemplate
@ChildContent
@if (!string.IsNullOrEmpty(CheckedMessage))
{
diff --git a/src/Core/Components/TextArea/FluentTextArea.razor b/src/Core/Components/TextArea/FluentTextArea.razor
index fe2a1ff1ad..3b29537de3 100644
--- a/src/Core/Components/TextArea/FluentTextArea.razor
+++ b/src/Core/Components/TextArea/FluentTextArea.razor
@@ -1,5 +1,6 @@
@namespace Microsoft.Fast.Components.FluentUI
@inherits FluentInputBase
+
+
My label
+
+100
\ No newline at end of file
diff --git a/tests/Core/NumberField/FluentNumberFieldTests.FluentNumberField_LabelTemplate.verified.html b/tests/Core/NumberField/FluentNumberFieldTests.FluentNumberField_LabelTemplate.verified.html
new file mode 100644
index 0000000000..c0889989f3
--- /dev/null
+++ b/tests/Core/NumberField/FluentNumberFieldTests.FluentNumberField_LabelTemplate.verified.html
@@ -0,0 +1,5 @@
+
+
+100
\ No newline at end of file
diff --git a/tests/Core/NumberField/FluentNumberFieldTests.cs b/tests/Core/NumberField/FluentNumberFieldTests.cs
index 9ae564b233..855ab67a04 100644
--- a/tests/Core/NumberField/FluentNumberFieldTests.cs
+++ b/tests/Core/NumberField/FluentNumberFieldTests.cs
@@ -1,5 +1,6 @@
using Bunit;
using FluentAssertions;
+using Microsoft.AspNetCore.Components;
using Xunit;
namespace Microsoft.Fast.Components.FluentUI.Tests.NumberField;
@@ -513,4 +514,39 @@ public void FluentNumberField_AdditionalParameters()
// Assert
cut.Verify();
}
+
+ [Fact]
+ public void FluentNumberField_LabelTemplate()
+ {
+ int currentValue = 100;
+
+ // Arrange && Act
+ var cut = TestContext.RenderComponent>(parameters =>
+ {
+ parameters.Bind(p => p.Value, currentValue, newValue => currentValue = 101);
+ parameters.Add(p => p.LabelTemplate, "My label
");
+ parameters.AddChildContent("100");
+ });
+
+ // Assert
+ cut.Verify();
+ }
+
+ [Fact]
+ public void FluentNumberField_Label()
+ {
+ int currentValue = 100;
+ TestContext.JSInterop.Mode = JSRuntimeMode.Loose;
+
+ // Arrange && Act
+ var cut = TestContext.RenderComponent>(parameters =>
+ {
+ parameters.Bind(p => p.Value, currentValue, newValue => currentValue = 101);
+ parameters.Add(p => p.Label, "My label");
+ parameters.AddChildContent("100");
+ });
+
+ // Assert
+ cut.Verify();
+ }
}
\ No newline at end of file