HxContextMenu

Ready-made context menu (based on Bootstrap Dropdown).

<HxContextMenu>
    <HxContextMenuItem OnClick="() => SetMessage(1)">
        Item 1
    </HxContextMenuItem>
    <HxContextMenuItem OnClick="() => SetMessage(2)">
        Item 2
    </HxContextMenuItem>
</HxContextMenu>

@message

@code {
    private string message;

    private void SetMessage(int item)
    {
        message = $"Item number {item} has been selected";
    }
}

API

Parameters

Name Type Description
ChildContent RenderFragment Content of the component.

CSS Variables

Name Description Default
--hx-context-menu-button-border-radius Border radius. .325rem
--hx-context-menu-button-hover-background Background of the context menu button on hover. var(--bs-gray-300)

HxContextMenuItem

API

Parameters

Name Type Description
ChildContent RenderFragment Custom item content to be rendered.
ConfirmationQuestion string Displays HxMessageBox to get a confirmation.
Enabled bool?
Icon IconBase Item icon (use BootstrapIcon).
OnClickStopPropagation bool Stop onClick-event propagation. Deafult is true.
Text string Item text.

Event callbacks

Name Type Description
OnClick EventCallback Item clicked event.

Methods

Method Returns Description
HandleClick(MouseEventArgs args) Task
An unhandled error has occurred. Reload 🗙