WinUI: Add MenuFlyout styling

[Anna Malchow-Perryman (apman)]

Summary

• Style WinUI MenuFlyout presenters, items, separators, submenu chevrons, surfaces/shadows, and directional entrance animations.
• Recolour SVG icons for light/dark and disabled states, including submenu items.
• Add classic and Mica resources, focused tests, and separate Windows visual baselines; document deferred solid-backdrop validation.

Validation

• WinUI theme builds successfully.
• 15 focused MenuFlyout/Mica unit tests pass.
• Classic and Mica MenuFlyout visual regression cases pass separately.

Reviewer notes

• WinUIMica is marked complete; WinUIClassic is marked needs validation against the native solid-backdrop/acrylic fallback. The SampleApp startup selection remains local and is not included in this PR.
  Posted by Copilot SDK in VS Code (agent), on behalf of Anna Malchow-Perryman (@apman).

[Copilot]

Copilot review overview

🟡 Changes recommended

The catalog change enables Linux and macOS visual tests without providing their required MenuFlyout baselines.

Review effort: Balanced
Findings: 1

Open (1)

• Add missing Linux/macOS baselines for WinUI visual regression tests · New

What changed in this PR

Adds WinUI styling for MenuFlyout surfaces, items, icons, submenus, separators, and animations.

Changes:

• Adds classic/Mica resources and complete MenuFlyout templates.
• Adds entrance animations and SVG recolouring.
• Adds focused tests, catalog status, and validation guidance.

File	Description
WinUiMicaProbe.cs	Tests Mica flyout resources.
WinUiMenuFlyoutTests.cs	Tests icons, animations, shadows, and submenus.
ThemeRoot.axaml	Loads scoped SVG styles.
README.md	Documents classic/Mica validation.
MenuFlyoutSvg.styles.axaml	Recolours SVG menu icons.
MenuFlyoutEntrance.cs	Implements entrance animation behavior.
MenuFlyout.axaml	Defines WinUI flyout control themes.
Controls/​_index.axaml	Registers MenuFlyout resources.
ThemeResources.Windows11.axaml	Adds translucent Mica surfaces.
ThemeResources.axaml	Adds classic and state resources.
page-catalog.jsonc	Enables WinUI visual-test discovery.

---

💡 Configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[Copilot]

Copilot review overview

🟡 Changes recommended

Address the three moderate findings in the MenuFlyout template and SVG icon resources.

Review effort: Lite
Findings: 1

Open (1)

• Main presenter ignores dynamic theme padding · New

Resolved since last review (1)

• Add missing Linux/macOS baselines for WinUI visual regression tests

[Copilot]

Copilot review overview

🔵 Needs a closer look

Bind the top-level MenuFlyout presenter’s MaxWidth and MinHeight constraints.

Review effort: Lite
Findings: None

Resolved since last review (1)

• Main presenter ignores dynamic theme padding

Previously missed (1)

In code that hasn't changed since last review

Bind MaxWidth and MinHeight on the outer flyout presenter

src/​Devolutions.AvaloniaTheme.WinUI/​Controls/​MenuFlyout.axaml:29

The outer presenter surface does not bind MaxWidth or MinHeight (unlike the submenu surface below at lines 126-127), so the inherited FlyoutThemeMaxWidth/MenuFlyoutThemeMinHeight constraints are ignored for top-level flyouts. Long menus can grow past the intended width, and short presenters do not receive the minimum height; bind these properties on LayoutRoot as well.

[randy-but-a-ro]

🤖 Pull request was approved automatically: the AI review is complete and all its review threads are resolved. 🎉

Integration Details

{
	"deliveryId": "3b226770-be69-11f1-86a4-087effde52b3",
	"headSha": "6511d2c2d1c78053f0be99ec524f417f5d0efca7",
	"reviewer": "copilot-pull-request-reviewer[bot]"
}

[Anna Malchow-Perryman (apman)]

Addressed the "previously missed" finding from the latest review (Bind MaxWidth and MinHeight on the outer flyout presenter, src/Devolutions.AvaloniaTheme.WinUI/Controls/MenuFlyout.axaml:29).

Fixed in 3acd95e: the outer MenuFlyoutPresenter's LayoutRoot border now also binds MaxWidth="{DynamicResource FlyoutThemeMaxWidth}" and MinHeight="{DynamicResource MenuFlyoutThemeMinHeight}", matching the submenu surface. I verified with a headless test that the border's MaxWidth previously read back as Infinity (the base theme's inherited setter for that property is not applied once the derived ControlTheme overrides the Template), and now correctly resolves to 456/32. Added regression assertions for both properties (on the outer surface and the submenu surface) to the existing Flyout_and_submenu_have_shadow_padding_and_small_chevron test; all 316 tests in the project pass.

Posted by Copilot SDK in VS Code (agent), on behalf of Anna Malchow-Perryman (@apman).

[Copilot]

Copilot review overview

🟡 Changes recommended

Preserve presenter layout overrides and scope the Separator theme to MenuFlyout content.

Review effort: Lite
Findings: 1

Open (1)

• Bind flyout template parts to presenter properties · New

[Copilot]

Copilot review overview

🔵 Needs a closer look

Resolve the unscoped Separator style and duplicate submenu animation subscriptions.

Review effort: Lite
Findings: None

Resolved since last review (1)

• Bind flyout template parts to presenter properties

Previously missed (1)

In code that hasn't changed since last review

Scope menu separator styling to MenuFlyout descendants

src/​Devolutions.AvaloniaTheme.WinUI/​Controls/​MenuFlyout.axaml:153

This adds an implicit {x:Type Separator} theme to the WinUI theme, so every Separator in the consuming scope—including ordinary panels and SeparatorDemo—will receive MenuFlyout's 1px height and 12,4 margin. The repository explicitly guards against this pattern because menu separator styling must be scoped to menu descendants (tests/Devolutions.AvaloniaControls.Tests/MenuPackContractTests.cs:597-650). Use a selector style scoped to MenuFlyoutPresenter/nested MenuItem descendants instead.

[randy-but-a-ro]

🤖 Pull request was approved automatically: the AI review is complete and all its review threads are resolved. 🎉

Integration Details

{
	"deliveryId": "c7694140-be6e-11f1-8cad-a94a7234324a",
	"headSha": "7dd83f6aa0412fdf6e5d9609e983b292af31f7b5",
	"reviewer": "copilot-pull-request-reviewer[bot]"
}

[Anna Malchow-Perryman (apman)]

Addressed the "previously missed" finding from the latest review (Scope menu separator styling to MenuFlyout descendants, src/Devolutions.AvaloniaTheme.WinUI/Controls/MenuFlyout.axaml:153).

Fixed in f208be7: removed the implicit {x:Type Separator} ControlTheme (which restyled every Separator in the consuming app, not just menu ones) and moved the styling into a new Controls/MenuFlyoutSeparator.styles.axaml using a descendant selector (ContextMenu Separator, MenuFlyoutPresenter Separator, Menu Separator, MenuItem Separator), merged via StyleInclude in ThemeRoot.axaml. This matches the convention already established by the Linux/macOS/DevExpress themes' own Separator.styles.axaml and the regression guard in MenuPackContractTests.cs. Added a test (Separator_styling_is_scoped_to_menu_descendants) asserting a standalone Separator keeps Fluent's default Background while one inside a MenuFlyoutPresenter gets the WinUI value. Full test suite (318 tests) passes.
Posted by Copilot SDK in VS Code (agent), on behalf of Anna Malchow-Perryman (@apman).

[Copilot]

Copilot review overview

🔵 Needs a closer look

Isolate separator styling and serialize access to the process-wide Mica test override.

Review effort: Lite
Findings: None

[randy-but-a-ro]

🤖 Pull request was approved automatically: the AI review is complete and all its review threads are resolved. 🎉

Integration Details

{
	"deliveryId": "fc86f180-be71-11f1-8e83-9d86a9f40e91",
	"headSha": "f208be7a821895d1d573d558acf1f57e4ae6d03b",
	"reviewer": "copilot-pull-request-reviewer[bot]"
}