Differentiate Menu Popover opened via contextMenu trigger

[phuoccss]

Provide a general summary of the feature here

Currently I'm setting a margin on menu's Popover via CSS. The value depends on whether there's OverlayArrow.

When trigger is contextMenu, the margin should be 0. However, there's no way to tell from CSS.

🤔 Expected Behavior?

A way to differentiate Menu Popover's trigger.

😯 Current Behavior

No way to differentiate Menu Popover's trigger.

💁 Possible Solution

No response

🔦 Context

NA

💻 Examples

No response

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[devongovett]

hmm, Popover has data-trigger but this is the triggering component (which is always MenuTrigger for menus).

You could wrap MenuTrigger in a custom component and add an attribute that way though?

function MenuTrigger(props: MenuTriggerProps) {
  let [trigger, menu] = React.Children.toArray(props.children);
  return (
    <AriaMenuTrigger {...props}>
      {trigger}
      <Popover data-menu-trigger={props.trigger}>{menu}</Popover>
    </AriaMenuTrigger>
  );
}

[phuoccss]

thanks for your suggestion. that works.