OnyxFlyoutMenu disappears when user clicks on menu item

[duyle112]

In case having checkbox group inside OnyxFlyoutMenu, when a user clicks on an item within the OnyxFlyoutMenu component, the entire menu unexpectedly disappears instead of maintaining its open state or closing gracefully based on the intended behavior.
Expected Behavior

• Menu should remain open when clicking on non-actionable items (if applicable)
• Menu should close gracefully when clicking on outside the flyout menu
• Menu state should be controlled and predictable based on the component's design intent

Actual Behavior

• Menu disappears immediately upon clicking any item
• This may be causing poor UX as users cannot interact with menu items as expected

Steps to reproduce
Imagine having filter function in OnyxDataGrid header column with multiple selection. I am using custom features .e.g.:
const withCustomFeature = createFeature(() => ({ name: Symbol("name"), header: { actions: () => [ { menuItems: [ h(OnyxCheckboxGroup , {options: options, withCheckAll: true}), ], showFlyoutMenu: true, }, ], }, }));

1. Click to open flyout menu in header
2. Click to any menu item within the filter dialog
3. Observe that the entire flyout menu disappears unexpectedly, closing the filter dialog

[JoCa96]

Moved from discussion to issues: #3964

[ChristianBusshoff]

Hey @duyle112 ,

Currently, you have to implement this manually (Example).

Please be aware that nesting a Checkbox there is not the intended use case and is semantically incorrect. However, to solve this properly, we've just created a ticket (#5126) to add a native Checkbox variant to the FlyoutMenu.