Function formatShortcutKey

Formats key combination into human-readable string with platform-specific key names.

Important: ctrl and meta modifiers are treated equivalently for labeling purposes. If both are set, only "Ctrl" (or "Cmd" on macOS) will appear in the output, regardless of which modifier(s) are actually set. For precise control over labeling on specific platforms, consider using a single modifier flag rather than relying on the automatic platform detection.

Platform handling:

• macOS/iOS: Displays "Cmd" instead of "Ctrl"
• Other platforms: Displays "Ctrl"

export function formatShortcutKey(key: ShortcutKey): string {
  const parts: string[] = [];
  const isMac = /Mac|iPhone|iPad|iPod/.test(navigator.userAgent);

  if (key.ctrl || key.meta) {
    parts.push(isMac ? "Cmd" : "Ctrl");
  }
  if (key.shift) {
    parts.push("Shift");
  }
  if (key.alt) {
    parts.push("Alt");
  }

  const keyName = key.key === "/" ? "/" : key.key.toUpperCase();
  parts.push(keyName);

  return parts.join("+");
}
Copy