docs: add explanation for mouse button event modifiers (vuejs#3090)

* docs: add explanation for mouse button event modifiers

* docs: unwrap mouse button modifiers explanation out of highlighted block

Author: midskyey

src/guide/essentials/event-handling.md

@@ -357,3 +357,5 @@ The `.exact` modifier allows control of the exact combination of system modifier
 - `.middle`
 
 These modifiers restrict the handler to events triggered by a specific mouse button.
+
+Note, however, that `.left`, `.right`, and `.middle` modifier names are based on the typical right-handed mouse layout, but in fact represent "main", "secondary", and "auxiliary" pointing device event triggers, respectively, and not the actual physical buttons. So that for a left-handed mouse layout the "main" button might physically be the right one but would trigger the `.left` modifier handler. Or a trackpad might trigger the `.left` handler with a one-finger tap, the `.right` handler with a two-finger tap, and the `.middle` handler with a three-finger tap. Similarly, other devices and event sources generating "mouse" events might have trigger modes that are not related to "left" and "right" whatsoever.