Refactored the ConfigurationText component

This commit is contained in:
Thorsten Sommer 2024-09-15 19:00:31 +02:00
parent b99866b8fe
commit 72d392ff27
Signed by: tsommer
GPG Key ID: 371BBA77A02C0108
3 changed files with 60 additions and 5 deletions

View File

@ -3,7 +3,7 @@
<MudTextField <MudTextField
T="string" T="string"
Text="@this.Text()" Text="@this.Text()"
TextChanged="@this.OptionChanged" TextChanged="@this.InternalUpdate"
Label="@this.OptionDescription" Label="@this.OptionDescription"
Disabled="@this.Disabled()" Disabled="@this.Disabled()"
Class="mb-3" Class="mb-3"
@ -11,8 +11,9 @@
AdornmentIcon="@this.Icon" AdornmentIcon="@this.Icon"
AdornmentColor="@this.IconColor" AdornmentColor="@this.IconColor"
UserAttributes="@SPELLCHECK_ATTRIBUTES" UserAttributes="@SPELLCHECK_ATTRIBUTES"
Lines="1" Lines="@this.NumLines"
Immediate="@false" AutoGrow="@this.AutoGrow"
DebounceInterval="500" MaxLines="@this.GetMaxLines"
Immediate="@true"
Variant="Variant.Outlined" Variant="Variant.Outlined"
/> />

View File

@ -1,5 +1,7 @@
using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Components;
using Timer = System.Timers.Timer;
namespace AIStudio.Components; namespace AIStudio.Components;
public partial class ConfigurationText : ConfigurationBase public partial class ConfigurationText : ConfigurationBase
@ -11,7 +13,7 @@ public partial class ConfigurationText : ConfigurationBase
public Func<string> Text { get; set; } = () => string.Empty; public Func<string> Text { get; set; } = () => string.Empty;
/// <summary> /// <summary>
/// An action which is called when the option is changed. /// An action which is called when the text was changed.
/// </summary> /// </summary>
[Parameter] [Parameter]
public Action<string> TextUpdate { get; set; } = _ => { }; public Action<string> TextUpdate { get; set; } = _ => { };
@ -27,6 +29,55 @@ public partial class ConfigurationText : ConfigurationBase
/// </summary> /// </summary>
[Parameter] [Parameter]
public Color IconColor { get; set; } = Color.Default; public Color IconColor { get; set; } = Color.Default;
/// <summary>
/// How many lines should the textfield have?
/// </summary>
[Parameter]
public int NumLines { get; set; } = 1;
/// <summary>
/// What is the maximum number of lines?
/// </summary>
[Parameter]
public int MaxLines { get; set; } = 12;
private string internalText = string.Empty;
private Timer timer = new(TimeSpan.FromMilliseconds(500))
{
AutoReset = false
};
#region Overrides of ConfigurationBase
protected override async Task OnInitializedAsync()
{
this.timer.Elapsed += async (_, _) => await this.InvokeAsync(async () => await this.OptionChanged(this.internalText));
await base.OnInitializedAsync();
}
#region Overrides of ComponentBase
protected override async Task OnParametersSetAsync()
{
this.internalText = this.Text();
await base.OnParametersSetAsync();
}
#endregion
#endregion
private bool AutoGrow => this.NumLines > 1;
private int GetMaxLines => this.AutoGrow ? this.MaxLines : 1;
private void InternalUpdate(string text)
{
this.timer.Stop();
this.internalText = text;
this.timer.Start();
}
private async Task OptionChanged(string updatedText) private async Task OptionChanged(string updatedText)
{ {

View File

@ -0,0 +1,3 @@
# v0.9.12, build 187 (2024-09-xx xx:xx UTC)
- Refactored the `ConfigurationText` component to debounce the input field to prevent unnecessary configuration updates. The component now also supports multiline text.