<Button OnClick="HandleClick"
        Display="flex"
        Color="danger">
    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"></path>
    </svg>
    <span class="ml-2">@ButtonText</span>
</Button>

@code {
    /// <summary>
    /// The event to call in the parent when the delete button is clicked.
    /// </summary>
    [Parameter]
    public EventCallback OnClick { get; set; }

    /// <summary>
    /// The text to display on the button.
    /// </summary>
    [Parameter]
    public string ButtonText { get; set; } = "Delete";

    /// <summary>
    /// Handles the button click event.
    /// </summary>
    private async Task HandleClick()
    {
        await OnClick.InvokeAsync();
    }
}
