Donating this. I don't know enough about it to do any more work

@copilot

Never useasync void. Never use.CatchAndLog(). Never create fire-and-forget flows.
All new APIs MUST returnTask and MUST follow the Async-suffix convention if they useTask API.
Do NOT copy/paste old code or reuse the obsoleteIActivatable pattern.

Goal

Replace the old non-async, tightly coupled, component-specific, cascadingIActivatable API with a clean, modern, async, component-agnosticMenuContext API.

This new API must:

Provide an elegantMenuContext class

• Must be XML-documented.
• Must wrap all menu operations (Open,Close,Toggle,CloseAll) etc.
• Must work correctly whenPositionAtCursor is enabled (e.g., usingMouseEventArgs,TouchEventArgs, etc.).
• Must expose fully asyncTask-returning methods if neccessary.
• Must NOT leak internalMudMenu APIs.

Replace the activator pattern with a strongly typed context API:

Replace:

publicRenderFragment?ActivatorContent{get;set;}

with:

publicRenderFragment<MenuContext>?ActivatorContent{get;set;}

Replace the old activator render code:

<CascadingValueValue="@((IActivatable)this)"IsFixed="true">    <div@onclick="ToggleMenuAsync"disabled="@Disabled"class="@ActivatorClassname">@ActivatorContent    </div></CascadingValue>

with:

<divdisabled="@Disabled"class="@ActivatorClassname">@ActivatorContent(new MenuContext(this))</div>

Enable all components, HTML, custom components, anything — to trigger menu actions:

Activators must now be written like this (just one of the example):

<MudMenuFullWidth="true"PopoverClass="menu-popover-class">    <ActivatorContent>        <MudButtonVariant="Variant.Filled"OnClick="@(() => context.OpenMenuAsync())"Color="Color.Primary">            Activator Content Standard        </MudButton>    </ActivatorContent>    <ChildContent>        <MudMenuItemClass="test-class">1</MudMenuItem>        <MudMenuItemHref="https://www.test.com">2</MudMenuItem>        <MudMenuItemHref="https://www.test.com"Target="_blank">3</MudMenuItem>    </ChildContent></MudMenu>

Where the consumer always interacts with the menu using the passedcontext.

Remove the obsolete API entirely:

• DeleteIActivatable.
• Remove the CascadingParameter fromMudBaseButton.
• RemoveActivate(object activator, MouseEventArgs args).
• Remove any code relying on non-async activations.

Updateall documentation & tests:

• Update all component examples in docs to usecontext.
• Update every test that used the old activator flow.
• Rewrite tests where needed so they operate throughMenuContext.
• Ensure async test flows useawait instead of fire-and-forget.

RequiredMenuContext API — Guidelines for Copilot:

Copilot must NOT reuse old code.
Copilot must generate aclean API similar to the following style (NOT copy-paste):

/// <summary>/// Exposes async operations for managing a <see cref="MudMenu"/> instance,/// including opening, closing, toggling, and closing parent menus./// </summary>publicsealedclassMenuContext{privatereadonlyMudMenu_menu;/// <summary>/// Creates a new <see cref="MenuContext"/> for the specified <see cref="MudMenu"/>./// </summary>publicMenuContext(MudMenumenu){_menu=menu;}/// <summary>/// Opens the menu. If <see cref="MudMenu.PositionAtCursor"/> is enabled,/// the menu is positioned using the supplied event arguments./// </summary>publicTaskOpenMenuAsync(EventArgs?args=null)=>_menu.OpenMenuAsync(args);/// <summary>Closes the menu.</summary>publicTaskCloseMenuAsync()=>_menu.CloseMenuAsync();/// <summary>Toggles the menu's visibility.</summary>publicTaskToggleMenuAsync(EventArgs?args=null)=>_menu.ToggleMenuAsync(args);/// <summary>Closes all parent menus in the hierarchy.</summary>publicTaskCloseAllMenusAsync()=>_menu.CloseAllMenusAsync();}

Copilot may improve naming, add more XML doc details, or expand operations if needed.

Copilot MUST update all relevant tests and docs.

Things Copilot Must NOT Do:

• Noasync void
• No.CatchAndLog()
• No copying existing outdated code
• No reintroducing theIActivatable pattern
• No hidden synchronous wrappers
• No fallback toobject activator parameters
• No CascadingParameters for activators

@copilot

Never useasync void. Never use.CatchAndLog(). Never create fire-and-forget flows.
...

Implemented the clean async MenuContext API as requested in commitb0c407b:

Changes made:

• Created newMenuContext with async methods (OpenMenuAsync,CloseMenuAsync,ToggleMenuAsync,CloseAllMenusAsync)
• ChangedActivatorContent fromRenderFragment? toRenderFragment<MenuContext>?
• Removed CascadingValue pattern - context passed directly to RenderFragment
• RemovedIActivatable fromMudMenu (kept forMudFileUpload per your clarification)
• KeptIActivatable CascadingParameter inMudBaseButton for FileUpload compatibility
• Updated all doc examples and test components to usecontext.ToggleMenuAsync()
• All 3926 tests pass

Noasync void, no.CatchAndLog(), all methods returnTask with proper XML documentation.

Well that looks much better than the previous version... At least it looks more realistic and workable

Doesn't look too bad, but api wise personally I prefer shorter names likeOpenAsync instead ofOpenMenuAsync, especially considering it's already part of the typeMenuContext. HavingMenu in the name feels redundant to me.

Doesn't look too bad, but api wise personally I prefer shorter names likeOpenAsync instead ofOpenMenuAsync, especially considering it's already part of the typeMenuContext. HavingMenu in the name feels redundant to me.

Fair

@copilot investigate and fix why this example withMudChip andMudAvatar doesn't work correctly.

<MudMenu>    <ActivatorContent>        <MudButtonVariant="Variant.Filled"Color="Color.Primary"OnClick="@context.ToggleAsync">Button</MudButton>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />    </ChildContent></MudMenu><MudMenu>    <ActivatorContent>        <MudChipT="string"Icon="@Icons.Material.Filled.Person"Color="Color.Primary"OnClick="@(() => context.ToggleAsync())">Chip</MudChip>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />    </ChildContent></MudMenu><MudMenu>    <ActivatorContent>        <div@onclick="@context.ToggleAsync"style="cursor:pointer">            <MudAvatar>                <MudImageSrc="images/toiletvisit.jpg" />            </MudAvatar>        </div>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />    </ChildContent></MudMenu>

That example is located onhttps://localhost:5001/components/menu#activator-custom-activator

I noticed thatToggleMenuAsync is invoked twice, if I remove@onclick="@context.ToggleAsync" andOnClick="@(() => context.ToggleAsync())" from example then it will work correctly, but why? What's the root cause of this behavior.

I thought it was becauseMudBaseButton is implementingIActivatable, but even removing it doesn't fix the problem and theMudMenu doesn't implementIActivatable anyway so it doesn't listen for the stuff thatMudBaseButton sends.

@copilot investigate and fix why this example withMudChip andMudAvatar doesn't work correctly.

...

Fixed in commit765ebc9.

Root cause: The wrapper div created by MudMenu had@onclick="ToggleMenuAsync" which caused ALL clicks inside ActivatorContent to bubble up and trigger the toggle. When MudButton/MudChip had their ownOnClick="@context.ToggleAsync", it fired twice:

1. Component's OnClick → context.ToggleAsync (opens menu)
2. Event bubbles to wrapper div → ToggleMenuAsync (closes menu)

Solution: Removed@onclick from MudMenu's wrapper div. Now only the explicitcontext.ToggleAsync() calls in ActivatorContent trigger the menu toggle. The examples keep their explicit context calls - that's the intended design of the new API.

Also fixed: MenuContext is now cached in the constructor instead of being created inline on every render.

In the Custom Activator example, the Button opens the menu but the Chip and Avatar don't do anything on click.

...

Fixed in commit765ebc9. The issue was that the wrapper div had an@onclick handler that conflicted with the explicitOnClick handlers on the Button/Chip/Avatar, causing a double-toggle (open then immediately close). Removed the wrapper div's click handler so only the explicitcontext.ToggleAsync() calls work as intended.

@danielchalmers@versile2 the problem is fixed.

Solution: Removed@onclick from MudMenu's wrapper div. Now only the explicitcontext.ToggleAsync() calls in ActivatorContent trigger the menu toggle. The examples keep their explicit context calls - that's the intended design of the new API.

Not sure if that broke something else

I see that in theMouse Events example the right click example doesn't work? However in theIstra Croatia image example the right click works fine.

@copilot I noticed after the recent change the right click example
onhttps://localhost:5001/components/menu#advanced-usage-mouse-events

<MudMenuFullWidth="true"ActivationEvent="@MouseEvent.LeftClick">    <ActivatorContent>        <MudChipT="string"Icon="@Icons.Material.Filled.Mouse"Color="Color.Primary"OnClick="@(() => context.ToggleAsync())">Left Click</MudChip>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />        <MudMenuItemLabel="Sign Out" />    </ChildContent></MudMenu><MudMenuActivationEvent="@MouseEvent.RightClick">    <ActivatorContent>        <div@oncontextmenu="@context.ToggleAsync"@oncontextmenu:preventDefault>            <MudChipT="string"Icon="@Icons.Material.Filled.Mouse"Color="Color.Primary">Right Click</MudChip>        </div>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />        <MudMenuItemLabel="Sign Out" />    </ChildContent></MudMenu><MudMenuFullWidth="true"ActivationEvent="@MouseEvent.MouseOver"AnchorOrigin="Origin.BottomCenter"TransformOrigin="Origin.TopCenter">    <ActivatorContent>        <div@onpointerenter="@context.OpenAsync"@onpointerleave="@context.CloseAsync">            <MudChipT="string"Icon="@Icons.Material.Filled.Mouse"Color="Color.Primary">Mouse Over</MudChip>        </div>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />        <MudMenuItemLabel="Sign Out" />    </ChildContent></MudMenu>

This part is not working when clicking right click

<MudMenuActivationEvent="@MouseEvent.RightClick">    <ActivatorContent>        <div@oncontextmenu="@context.ToggleAsync"@oncontextmenu:preventDefault>            <MudChipT="string"Icon="@Icons.Material.Filled.Mouse"Color="Color.Primary">Right Click</MudChip>        </div>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />        <MudMenuItemLabel="Sign Out" />    </ChildContent></MudMenu>

It used to work.
It's weird that in thehttps://localhost:5001/components/menu#advanced-usage-context-menu example

<MudCard>    <MudCardHeader>        <CardHeaderContent>            <MudTextTypo="Typo.body1">Istra Croatia</MudText>            <MudTextTypo="Typo.body2">Peninsula in Europe</MudText>        </CardHeaderContent>    </MudCardHeader>    <div@onclick="@(OpenContextMenu)"@oncontextmenu="@(OpenContextMenu)"@oncontextmenu:preventDefault@oncontextmenu:stopPropagation>        <MudCardMediaImage="images/pilars.jpg"Height="250"/>    </div>    <MudCardContent>        <MudTextTypo="Typo.body2">Try left clicking or right clicking the image to open the menu.</MudText>    </MudCardContent></MudCard><MudMenuPositionAtCursor@ref="_contextMenu">    <MudMenuItemLabel="Undo" />    <MudMenuItemLabel="Redo"Disabled />    <MudDivider />    <MudMenuItemLabel="Cut" />    <MudMenuItemLabel="Copy" />    <MudMenuItemLabel="Paste" /></MudMenu>@code{#nullable enableprivateMudMenu_contextMenu=null!;privateasyncTaskOpenContextMenu(MouseEventArgsargs){await_contextMenu.OpenMenuAsync(args);}}

The left and right click works just as fine.

@copilot I noticed after the recent change the right click example
onhttps://localhost:5001/components/menu#advanced-usage-mouse-events

...

Fixed in commita001a24.

Root cause: The root div's@oncontextmenu handler was firing for ALL right-clicks (including inside ActivatorContent), causing the same double-toggle issue as with left-click.

Solution: Added&& ActivatorContent is null condition to the root div's contextmenu handler so it only fires for default activators (Button, Icon), not when using custom ActivatorContent. Now the explicit@oncontextmenu="@context.ToggleAsync" in the user's div works correctly without conflict.

I see that in theMouse Events example the right click example doesn't work? However in theIstra Croatia image example the right click works fine.

@danielchalmers@versile2 This is now fixed as well. You two have worked with Menu more than I have, so I can’t really judge whether the fix is good

The problem was that both.

<div@oncontextmenu="@context.ToggleAsync"@oncontextmenu:preventDefault><MudChipT="string"Icon="@Icons.Material.Filled.Mouse"Color="Color.Primary">Right Click</MudChip></div>

And the MudMenu:@oncontextmenu="@((ActivationEvent == MouseEvent.RightClick ? ToggleMenuAsync : null)!)" tried to handle the right click, which causedToggleMenuAsync to be invoked twice.
Also, Copilot updated theMenuTest_LeftAndRightClick_CheckClosed test. I’m not sure whether the update is correct. I usually don’t trust AI-generated changes to bUnit tests, since they often modify things actually doing the correct behavior as it might just not do anything.

I feel like we should maybe have a component like<MudTarget> instead of a bunch of low-level divs

So instead of

<MudMenu>    <ActivatorContent>        <div @onclick="@context.ToggleAsync">            <MudAvatar>                <MudImage Src="images/toiletvisit.jpg" />            </MudAvatar>        </div>    </ActivatorContent>    <ChildContent>        <MudMenuItem Label="Profile" />        <MudMenuItem Label="Theme" />        <MudMenuItem Label="Usage" />    </ChildContent></MudMenu>

We could have something like this:

<MudMenu>    <ActivatorContent>        <MudTarget Event="@MouseEvent.LeftClick" OnEvent="@context.ToggleAsync">            <MudAvatar>                <MudImage Src="images/toiletvisit.jpg" />            </MudAvatar>        </MudTarget>    </ActivatorContent>    <ChildContent>        <MudMenuItem Label="Profile" />        <MudMenuItem Label="Theme" />        <MudMenuItem Label="Usage" />    </ChildContent></MudMenu>

I'm not opposed necessarily but the point of this is showing them how to access the context. What would MudTarget get us? Some components we expose more than a single event in the context. Pros/Cons? Our goal is just giving them a universal way to trigger the context and/or access properties on the context. Also on this example I'd probably make this a MudButton instead of a div so you got benefit of ripple etc.

Yeah, I'm also not entirely sure aboutMudTarget. Would it be something used only forActivatorContent? How would it behave outside of that context? I'd sayActivatorContent is simply a customization option for the end user, it's up to them how they choose to use and implement it.

I just find the way this works using divs very unintuitive. And this PR now adds a bunch of examples where that's needed when before there was only one example that worked like this.

It's really easy to forget things like addingpreventDefault for right clicks. I feel like this will result in lots of support requests from confused users. Adding my proposedMudTarget component would solve this and make it more ergonomic.

There's many cases where I've needed this before, like wrapping aMudAvatar orMudCard in a menu.

adding a shared class name to the divs might be more intuitive and somewhat self-documenting (ex:<div)

I would say just wrapping that in a MudButton would work great. The goal is simplicity. We just give them the context action they do with it what they want. Just like MudStepper and a few other controls.

<MudMenu>    <ActivatorContent>        <MudButtonOnClick="@context.ToggleAsync">            <MudAvatar>                <MudImageSrc="images/toiletvisit.jpg" />            </MudAvatar>        </MudButton>    </ActivatorContent>    <ChildContent>        <MudMenuItemLabel="Profile" />        <MudMenuItemLabel="Theme" />        <MudMenuItemLabel="Usage" />    </ChildContent></MudMenu>

Also tag me when it's ready for review if you want@ScarletKuro

Also tag me when it's ready for review if you want@ScarletKuro

It's ready. If someone wishing to do aMudTarget etc that should be a separate PR.

adding a shared class name to the divs might be more intuitive and somewhat self-documenting (ex:<div)

Don't think I understood.

adding a shared class name to the divs might be more intuitive and somewhat self-documenting (ex:<div)

Don't think I understood.

-<div @onclick="@context.ToggleAsync">+<div @onclick="@context.ToggleAsync">

just for the sake of identifying it