add mac compatibility mode #15

myandrienko · 2024-03-06T15:13:28Z

This change is potentially controversial, so consider it RFC rather than something final :)

On Mac a common modifier for hotkeys is Meta (aka Cmd, aka ⌘), while Ctrl is usually avoided. On the other hand, it's very uncommon for the Meta key to be used for app-level hotkeys on Windows or Linux.

To provide a familiar experience for users on all platforms, I suggest the Mac compatibility mode, which treats the Meta modifier as if it is Ctrl on Macs (unless both are used). So on Mac meta+b invokes ctrl+b, meta+ctrl+b still invokes meta+ctrl+b.

To keep the API minimal, I'm piggybacking on top of the overrides object, because basically this is a special kind of an override. A special opaque object MAC_COMPAT is exported, which can be mixed in with the rest of the overrides.

import { hotkeyKeyUX, startKeyUX, MAC_COMPAT } from 'keyux'

startKeyUX(window, [
  hotkeyKeyUX({ ...MAC_COMPAT })
])

getHotKeyHint also supports this and renders Ctrl as ⌘.

I'm open to all suggestions regarding the API and the idea in general.

ai · 2024-03-06T23:38:06Z

I thought about something this as well. I think we should have it, at least as an option.

I will think about architecture after I finish my task at the conference. Around next week

ai · 2024-03-11T22:07:36Z

hotkey.js

@@ -59,14 +61,14 @@ function checkHotkey(where, code, overrides) {
  )
 }

-function findHotKey(event, where, overrides) {
+function findHotKey(event, window, where, overrides) {


Can we use window.document and avoid where?

Sure, done.

ai · 2024-03-11T22:09:30Z

compat.js

+const MAC_COMPAT_KEY = Symbol('macCompat')
+export const MAC_COMPAT = { [MAC_COMPAT_KEY]: true }
+
+export function applyCompat(code, window, overrides, dir = 'forward') {


Since we are fighting for every bite of the library, let’s remove dir argument if we are not using it right now.

I don't really like dir as well, but we need some kind of indication of the direction we're transforming in: either one way for hotkeys (meta -> ctrl), or in the reverse direction for hints (ctrl -> meta). I removed the default parameter value though.

README.md

myandrienko · 2024-03-12T10:51:48Z

Glad you're back from the conf :) Updated the API.

compat.js

ai · 2024-03-12T16:42:49Z

compat.js

+  return (code, window, dir) => {
+    if (
+      window.navigator.platform.indexOf('Mac') === 0 &&
+      code.indexOf('meta+ctrl') === -1


Let's use includes() instead

ai · 2024-03-13T20:45:19Z

index.d.ts

@@ -49,7 +55,10 @@ export type HotkeyOverride = Record<string, string>
 * ])
 * ```
 */
-export function hotkeyKeyUX(overrides?: HotkeyOverride): KeyUXModule
+export function hotkeyKeyUX(
+  overrides?: HotkeyOverride,


Hm, can be overrides a transformer too?

hotkeyKeyUX([overrides(config), macCompact])

What do you think?

Yes, I mentioned that earlier: #15 (comment) :)

Since it looks like you agree, I'll go ahead and implement this.

ai · 2024-03-14T11:35:17Z

index.js

  let realCode = code
  for (let i in overrides) {
    if (overrides[i] === code) {
      realCode = i
      break
    }
  }
+  transformers.forEach(


Let’s write it as:

for (let transformer of transformers) { realCode = transform(realCode, window, 'r') }

To avoid (x = 1)

myandrienko · 2024-03-19T17:21:35Z

@ai Just letting you know, this PR is not abandoned, I will have time to revisit it later this week 👍

myandrienko · 2024-04-04T14:13:58Z

I've rebased this PR to be on top of #20. Let's revisit it when (and if) #20 gets merged.

built on top of the transformers api

ai · 2024-04-04T15:54:41Z

README.md

+
+### Mac Compatibility Mode
+
+It's common to use the Meta (<kbd>⌘</kbd>) modifier for hotkeys on Mac, while


Suggested change

It's common to use the Meta (<kbd>⌘</kbd>) modifier for hotkeys on Mac, while

It’s common to use the Meta (<kbd>⌘</kbd>) modifier for hotkeys on Mac, while

ai · 2024-04-04T15:54:59Z

README.md

+### Mac Compatibility Mode
+
+It's common to use the Meta (<kbd>⌘</kbd>) modifier for hotkeys on Mac, while
+Window and Linux usually favor the Ctrl key. To provide familiar experience on


Suggested change

Window and Linux usually favor the Ctrl key. To provide familiar experience on

Window and Linux usually favor the <kbd>Ctrl</kbd>. To provide familiar experience on

ai · 2024-04-04T15:55:30Z

README.md

+getHotKeyHint(window, 'ctrl+b', [macCompat])
+```
+
+Hotkeys pressed with the Meta modifier will work as if the Ctrl modifier was


Let’s use <kbd> on every key mentioning.

The more text modifiers make reading easier.

Yes, looks nicer for sure.

compat.js

package.json

ai · 2024-04-04T16:07:13Z

Nice. Thanks. I will release it after the shower.

Do you have Twitter account to mention you?

myandrienko · 2024-04-04T16:11:54Z

Thanks for reviewing so quickly! I'm not really on Twitter, but if you're comfortable doing so, you can link my Telegram channel: https://t.me/smalldogenergy - although it's fine if you won't :)

ai · 2024-04-04T16:37:17Z

Thanks. Released in 0.7.

ai reviewed Mar 11, 2024

View reviewed changes

README.md Outdated Show resolved Hide resolved

myandrienko force-pushed the mac-compat branch from 316c642 to 3851f96 Compare March 12, 2024 10:45

myandrienko requested a review from ai March 12, 2024 10:51

ai reviewed Mar 12, 2024

View reviewed changes

compat.js Outdated Show resolved Hide resolved

ai reviewed Mar 12, 2024

View reviewed changes

ai reviewed Mar 13, 2024

View reviewed changes

ai reviewed Mar 14, 2024

View reviewed changes

myandrienko mentioned this pull request Apr 4, 2024

add transformers api #20

Merged

myandrienko force-pushed the mac-compat branch 2 times, most recently from d313aca to f27a89b Compare April 4, 2024 14:13

add mac compatibility mode

00d07e1

built on top of the transformers api

myandrienko force-pushed the mac-compat branch from f27a89b to 00d07e1 Compare April 4, 2024 15:48

update demo

96e9bcc

myandrienko requested a review from ai April 4, 2024 15:51

ai reviewed Apr 4, 2024

View reviewed changes

compat.js Show resolved Hide resolved

ai reviewed Apr 4, 2024

View reviewed changes

package.json Outdated Show resolved Hide resolved

myandrienko added 2 commits April 4, 2024 18:01

styling fixes

c181724

update size

4ee25f5

myandrienko requested a review from ai April 4, 2024 16:04

prettier

3d5cd4d

ai approved these changes Apr 4, 2024

View reviewed changes

ai merged commit 022b05d into ai:main Apr 4, 2024
4 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

add mac compatibility mode #15

add mac compatibility mode #15

myandrienko commented Mar 6, 2024 •

edited

Loading

ai commented Mar 6, 2024

ai Mar 11, 2024

myandrienko Mar 12, 2024

ai Mar 11, 2024

myandrienko Mar 12, 2024

myandrienko commented Mar 12, 2024

ai Mar 12, 2024

myandrienko Mar 12, 2024

ai Mar 13, 2024

myandrienko Mar 14, 2024

ai Mar 14, 2024

myandrienko commented Mar 19, 2024

myandrienko commented Apr 4, 2024 •

edited

Loading

ai Apr 4, 2024

ai Apr 4, 2024

ai Apr 4, 2024

myandrienko Apr 4, 2024

ai commented Apr 4, 2024

myandrienko commented Apr 4, 2024

ai commented Apr 4, 2024


		### Mac Compatibility Mode

		It's common to use the Meta (<kbd>⌘</kbd>) modifier for hotkeys on Mac, while

	It's common to use the Meta (<kbd>⌘</kbd>) modifier for hotkeys on Mac, while
	It’s common to use the Meta (<kbd>⌘</kbd>) modifier for hotkeys on Mac, while

	Window and Linux usually favor the Ctrl key. To provide familiar experience on
	Window and Linux usually favor the <kbd>Ctrl</kbd>. To provide familiar experience on

add mac compatibility mode #15

add mac compatibility mode #15

Conversation

myandrienko commented Mar 6, 2024 • edited Loading

ai commented Mar 6, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

myandrienko commented Mar 12, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

myandrienko commented Mar 19, 2024

myandrienko commented Apr 4, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ai commented Apr 4, 2024

myandrienko commented Apr 4, 2024

ai commented Apr 4, 2024

myandrienko commented Mar 6, 2024 •

edited

Loading

myandrienko commented Apr 4, 2024 •

edited

Loading