|
|
|
|
using Connected.Annotations;
|
|
|
|
|
using Microsoft.AspNetCore.Components;
|
|
|
|
|
|
|
|
|
|
namespace Connected.Components;
|
|
|
|
|
|
|
|
|
|
public partial class ToggleIconButton : UIComponent
|
|
|
|
|
{
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The toggled value.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Behavior)]
|
|
|
|
|
public bool Toggled { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// Fires whenever toggled is changed.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter] public EventCallback<bool> ToggledChanged { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The Icon that will be used in the untoggled state.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Behavior)]
|
|
|
|
|
public string Icon { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The Icon that will be used in the toggled state.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Behavior)]
|
|
|
|
|
public string ToggledIcon { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// Title of the icon used for accessibility.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Behavior)]
|
|
|
|
|
public string Title { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// Title used in toggled state, if different.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Behavior)]
|
|
|
|
|
public string ToggledTitle { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The color of the icon in the untoggled state. It supports the theme colors.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Appearance)]
|
|
|
|
|
public ThemeColor Color { get; set; } = ThemeColor.Default;
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The color of the icon in the toggled state. It supports the theme colors.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Appearance)]
|
|
|
|
|
public ThemeColor ToggledColor { get; set; } = ThemeColor.Default;
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The Size of the component in the untoggled state.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Appearance)]
|
|
|
|
|
public Size Size { get; set; } = Size.Medium;
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The Size of the component in the toggled state.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Appearance)]
|
|
|
|
|
public Size ToggledSize { get; set; } = Size.Medium;
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// If set uses a negative margin.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Appearance)]
|
|
|
|
|
public Edge Edge { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// If true, disables ripple effect.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Appearance)]
|
|
|
|
|
public bool DisableRipple { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// If true, the button will be disabled.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Behavior)]
|
|
|
|
|
public bool Disabled { get; set; }
|
|
|
|
|
|
|
|
|
|
/// <summary>
|
|
|
|
|
/// The variant to use.
|
|
|
|
|
/// </summary>
|
|
|
|
|
[Parameter]
|
|
|
|
|
[Category(CategoryTypes.Button.Appearance)]
|
|
|
|
|
public Variant Variant { get; set; } = Variant.Text;
|
|
|
|
|
|
|
|
|
|
public Task Toggle()
|
|
|
|
|
{
|
|
|
|
|
return SetToggledAsync(!Toggled);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
protected internal async Task SetToggledAsync(bool toggled)
|
|
|
|
|
{
|
|
|
|
|
if (Disabled)
|
|
|
|
|
return;
|
|
|
|
|
if (Toggled != toggled)
|
|
|
|
|
{
|
|
|
|
|
Toggled = toggled;
|
|
|
|
|
await ToggledChanged.InvokeAsync(Toggled);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|