@if (IsVisible)
{
    <div class="modal fade show d-block" tabindex="-1" style="background-color: rgba(0,0,0,0.5);">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">@Title</h5>
                    <button type="button" class="btn-close" @onclick="Cancel"></button>
                </div>
                <div class="modal-body">
                    <p>@Message</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" @onclick="Cancel">Cancel</button>
                    <button type="button" class="btn @ConfirmButtonClass" @onclick="Confirm">@ConfirmText</button>
                </div>
            </div>
        </div>
    </div>
}

@code {
    [Parameter]
    public string Title { get; set; } = "Confirm";

    [Parameter]
    public string Message { get; set; } = "Are you sure?";

    [Parameter]
    public string ConfirmText { get; set; } = "Confirm";

    [Parameter]
    public string ConfirmButtonClass { get; set; } = "btn-danger";

    [Parameter]
    public EventCallback OnConfirm { get; set; }

    [Parameter]
    public EventCallback OnCancel { get; set; }

    public bool IsVisible { get; private set; }

    public void Show()
    {
        IsVisible = true;
        StateHasChanged();
    }

    public void Hide()
    {
        IsVisible = false;
        StateHasChanged();
    }

    private async Task Confirm()
    {
        Hide();
        await OnConfirm.InvokeAsync();
    }

    private async Task Cancel()
    {
        Hide();
        await OnCancel.InvokeAsync();
    }
}