Refactor ButtonBase, remove styling properties and rename per specs

This commit is contained in:
Matija Koželj 2022-12-27 11:00:20 +01:00
parent 52a577df0d
commit c33820a8a7

View File

@ -1,57 +1,38 @@
using System.Windows.Input; using System.Windows.Input;
using Connected.Annotations;
using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web; using Microsoft.AspNetCore.Components.Web;
using static System.String;
namespace Connected.Components; namespace Connected.Components;
public abstract class ButtonBase : UIComponent public abstract class ButtonBase : UIComponent
{ {
#region EventCallbacks
/// <summary> /// <summary>
/// Button click event. /// Button click event.
/// </summary> /// </summary>
[Parameter] [Parameter]
public EventCallback<MouseEventArgs> OnClick { get; set; } public EventCallback<MouseEventArgs> Clicked { get; set; }
#endregion
#region Content placeholders
/// <summary> /// <summary>
/// Potential activation target for this button. This enables RenderFragments with user-defined /// Potential activation target for this button. This enables RenderFragments with user-defined
/// buttons which will automatically activate the intended functionality. /// buttons which will automatically activate the intended functionality.
/// </summary> /// </summary>
[CascadingParameter] [CascadingParameter]
protected IActivatable Activateable { get; set; } protected IActivatable? Activateable { get; set; }
#endregion
/// <summary> #region Styling properties
/// The HTML element that will be rendered in the root by the component #endregion
/// By default, is a button
/// </summary>
[Parameter]
public string HtmlTag { get; set; } = "button";
#region Behavior properties
/// <summary> /// <summary>
/// The button Type (Button, Submit, Refresh) /// The button Type (Button, Submit, Refresh)
/// </summary> /// </summary>
[Parameter] [Parameter]
public ButtonType ButtonType { get; set; } public ButtonType ButtonType { get; set; }
/// <summary>
/// If true, the button will be disabled.
/// </summary>
[Parameter]
public bool Disabled { get; set; }
/// <summary>
/// The higher the number, the heavier the drop-shadow. 0 for no shadow.
/// </summary>
[Parameter]
public int Elevation { set; get; } = 0;
/// <summary>
/// If true, disables ripple effect.
/// </summary>
[Parameter]
public bool CanRipple { get; set; }
/// <summary> /// <summary>
/// Command executed when the user clicks on an element. /// Command executed when the user clicks on an element.
/// </summary> /// </summary>
@ -64,20 +45,30 @@ public abstract class ButtonBase : UIComponent
[Parameter] [Parameter]
public object? CommandParameters { get; set; } public object? CommandParameters { get; set; }
protected async Task OnClickHandler(MouseEventArgs e) /// <summary>
/// If true, the button will be disabled.
/// </summary>
[Parameter]
public bool Disabled { get; set; }
#endregion
/// <summary>
/// The HTML element that will be rendered in the root by the component
/// By default, is a button
/// </summary>
protected string HtmlTag => ButtonType.ToString().ToLower();
protected async Task OnClick(MouseEventArgs e)
{ {
if (Disabled) if (Disabled)
return; return;
await OnClick.InvokeAsync(e); if (Clicked.HasDelegate)
await Clicked.InvokeAsync(e);
if (Command?.CanExecute(CommandParameters) ?? false) if (Command?.CanExecute(CommandParameters) ?? false)
Command.Execute(CommandParameters); Command.Execute(CommandParameters);
Activateable?.Activate(this, e); Activateable?.Activate(this, e);
} }
protected ElementReference _elementReference;
public ValueTask FocusAsync() => _elementReference.FocusAsync();
} }