Added a text slider component

This commit is contained in:
Thorsten Sommer 2024-08-04 11:51:42 +02:00
parent 3aeba836ff
commit 397b4e48de
Signed by: tsommer
GPG Key ID: 371BBA77A02C0108
2 changed files with 85 additions and 0 deletions

View File

@ -0,0 +1,7 @@
@typeparam T
<MudField Label="@this.Label" Variant="Variant.Outlined" Class="mb-3" Disabled="@this.Disabled()">
<MudSlider T="@T" Size="Size.Medium" Value="@this.Value" ValueChanged="@this.ValueUpdated" Min="@this.Min" Max="@this.Max" Step="@this.Step" Immediate="@true" Disabled="@this.Disabled()">
@this.Value @this.Unit
</MudSlider>
</MudField>

View File

@ -0,0 +1,78 @@
using System.Numerics;
using Microsoft.AspNetCore.Components;
namespace AIStudio.Components.Blocks;
public partial class MudTextSlider<T> : ComponentBase where T : struct, INumber<T>
{
/// <summary>
/// The minimum value for the slider.
/// </summary>
[Parameter]
public T Min { get; set; } = T.Zero;
/// <summary>
/// The maximum value for the slider.
/// </summary>
[Parameter]
public T Max { get; set; } = T.One;
/// <summary>
/// The step size for the slider.
/// </summary>
[Parameter]
public T Step { get; set; } = T.One;
/// <summary>
/// The unit to display next to the slider's value.
/// </summary>
[Parameter]
public string Unit { get; set; } = string.Empty;
[Parameter]
public T Value { get; set; }
[Parameter]
public EventCallback<T> ValueChanged { get; set; }
/// <summary>
/// The label to display above the slider.
/// </summary>
[Parameter]
public string Label { get; set; } = string.Empty;
[Parameter]
public Func<bool> Disabled { get; set; } = () => false;
#region Overrides of ComponentBase
protected override async Task OnInitializedAsync()
{
await this.EnsureMinMax();
await base.OnInitializedAsync();
}
protected override async Task OnParametersSetAsync()
{
await this.EnsureMinMax();
await base.OnParametersSetAsync();
}
#endregion
private async Task EnsureMinMax()
{
if (this.Value < this.Min)
await this.ValueUpdated(this.Min);
else if(this.Value > this.Max)
await this.ValueUpdated(this.Max);
}
private async Task ValueUpdated(T value)
{
this.Value = value;
await this.ValueChanged.InvokeAsync(this.Value);
}
}