Custom context menu is triggered on tap/click on mobile browser (iOS Safari)

[habbes]

Hello, I'm using the ContextMenu component to create a custom context menu for some items on my web page. On desktop browser, the context menu is displayed when you right-click trigger component, as expected.

However, on a touchscreen mobile device (iOS Safari), the context menu shows up when you simply tap/click the trigger component. Triggering the menu when you tap an item is very disruptive in my case because I have a different handler for the click/tap event. I would have expected the context menu to show up after a long tap, not a simple tap.

My workaround is to hide the context menu on small screens using media queries (it's better for me not show the menu than to show it unexpectedly in ways that can disrupt or annoy the user), but I'd like to know whether it's possible to configure the menu to appear on long-taps and whether this is the expected behaviour for custom context menu on mobile devices.

I'm using radix-vue 1.5.3.

My code looks something like:

<ContextMenuRoot>
    <ContextMenuTrigger>
      <slot></slot>
    </ContextMenuTrigger>
    <ContextMenuPortal>
      <ContextMenuContent 
        class="min-w-[220px] z-30 bg-white outline-none rounded-md p-[5px] shadow-[0px_10px_38px_-10px_rgba(22,_23,_24,_0.35),_0px_10px_20px_-15px_rgba(22,_23,_24,_0.2)] will-change-[opacity,transform] data-[side=top]:animate-slideDownAndFade data-[side=right]:animate-slideLeftAndFade data-[side=bottom]:animate-slideUpAndFade data-[side=left]:animate-slideRightAndFade"
          :side-offset="5"
      >
        <slot name="menu"></slot>
      </ContextMenuContent>
    </ContextMenuPortal>
  </ContextMenuRoot>