Connected.Components/Components/UIComponent.cs

using Microsoft.AspNetCore.Components;

namespace Connected.Components;

public abstract class UIComponent : ComponentBase
{
    /// <summary>
    /// User class names, separated by space.
    /// </summary>
    [Parameter]
    public string Class { get; set; }

    /// <summary>
    /// User styles, applied on top of the component's own classes and styles.
    /// </summary>
    [Parameter]
    public string Style { get; set; }

    /// <summary>
    /// Use Tag to attach any user data object to the component for your convenience.
    /// </summary>
    [Parameter]
    public object Tag { get; set; }

    /// <summary>
    /// UserAttributes carries all attributes you add to the component that don't match any of its parameters.
    /// They will be splatted onto the underlying HTML tag.
    /// </summary>
    [Parameter(CaptureUnmatchedValues = true)]
    public Dictionary<string, object> UserAttributes { get; set; } = new();

    /// <summary>
    /// If the UserAttributes contain an ID make it accessible for WCAG labelling of input fields
    /// </summary>
    public string FieldId => UserAttributes.TryGetValue("id", out var id) ? id.ToString() : $"input-{Guid.NewGuid()}";
}