Overriding right click behavior

[shinlos]

Hello,

How would it be possible to override the right click behavior?

I am attempting to implement a custom context menu to be triggered on right click. This was done by implementing a function which takes in the coordinates of the click event, and displays a context menu at the place the user clicked.

However, this would also trigger the browser's own context menu to open as well, on top of the custom context menu opening. Is there a way in which something like event.preventDefault() can be done to prevent the browser's context menu from opening? There only seems to be event.stop() which is meant to stop the propogation of the event.

https://codesandbox.io/s/modest-rain-11im9?file=/src/App.tsx

In addition to that, I would like to note that the mouse events for onClick and onRightClick do not seem to be typed correctly. According to the docs, the types for the aforementioned click events are as follows ((e: MouseEvent) => void) | undefined

However, it does not take the MouseEvent, but instead appears to take the following shape (recorded by console logging the argument passed into the function, has been reproduced on codesandbox)

{
Za: {
  x: number
  y: number}
}
latLng: {
  lat: () => number
  lng: () => number
}
pixel: {
  x: number
  y: number
}
tb: MouseEvent

As can be seen from above, the MouseEvent is a child property of the return type under tb

On the other hand, when checking the typescript types, it is typed differently as follows onRightClick?: (e: google.maps.MouseEvent) => void;

google.maps.MouseEvent has the following interface

interface MouseEvent {
    /** Prevents this event from propagating further. */
    stop(): void;
    /**
     * The latitude/longitude that was below the cursor when the event
     * occurred.
     */
    latLng: LatLng;
}

There appears to be inconsistency and missing attributes to the types for the mouse events, as Za, pixel, and tb are missing from the property list.

Your Environment

os: windows

node --version v12.13.1 react version v16.10.2 @react-google-maps/api version v1.9.2

[JustFly1984]

@shinlos Your PR is welcome. You can set some conditional prop and wrap event.preventDefault() in if statement. I will merge it asap and publish new version.