github / hotkey

Trigger an action on an element with a keyboard shortcut.

Home Page:https://github.github.com/hotkey/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Add a special `Mod` character that translates to either `Meta` on Mac or `Control` on other platforms

theinterned opened this issue · comments

There are many cases where we want to be able to support either the Meta or Control modifier for a shortcut; as opposed to cases where we support both Meta and Control.

One way to handle this would be to add a special Mod character that would map to Meta on Mac / iOS, and Control on Window or Linux.

<button data-hotkey="Mod+s">Save</button>

would map to Meta+s on Mac / Control+s otherwise.

One wrinkle to this is how macOS always renders event.key as lowercase when the metaKey is pressed, regardless of shiftKey. This means the event.key for Mod+Shift+/ for example would be ? when Control+Shift is pressed but / when Meta+Shift is pressed.

See #54 (comment) and #43

Screen Shot 2021-12-10 at 5 57 36 PM

Notice above that when the Control+Meta+Shift are pressed together the result is an upper case event.key! 🤔

Note this would probably involve a comparison function (which we could also export) so that we could match hotkeys like so:

const isEventMatch = hotkeyCompare(eventToHotKeyString(event), 'Mod+k');