@namespace Lumeo

<button class="@CssClass" role="menuitem" @onclick="HandleClick" disabled="@Disabled" @attributes="AdditionalAttributes">
    @ChildContent
</button>

@code {
    [CascadingParameter] public ContextMenu.ContextMenuContext? Context { get; set; }
    [Parameter] public RenderFragment? ChildContent { get; set; }
    [Parameter] public EventCallback OnClick { get; set; }
    [Parameter] public bool Disabled { get; set; }
    [Parameter] public string? Class { get; set; }
    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }

    private string CssClass => $"relative flex w-full cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 min-h-11 sm:min-h-0 text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed {Class}".Trim();

    private async Task HandleClick()
    {
        await OnClick.InvokeAsync();
        if (Context is not null)
        {
            await Context.SetOpen.InvokeAsync(false);
        }
    }
}
