Skip to content

Conversation

@amazon7737
Copy link

Summary

This PR improves accessibility of the Command component when macOS VoiceOver is enabled.

When VoiceOver is active, arrow keys are handled by the screen reader.
However, the current implementation in cmdk calls preventDefault() on arrow keys,
which prevents VoiceOver from moving focus between items.

This change allows arrow key events to pass through on macOS, enabling proper screen reader navigation.

What was changed

  • Added onKeyDown handler to Command wrapper
  • Detect macOS platform (navigator.platform.includes("Mac"))
  • Allow VoiceOver to handle ArrowDown / ArrowUp events without being intercepted
  • No behavior changes for non-macOS environments

Reproduction (before fix)

  1. Enable VoiceOver on macOS
  2. Open the Command demo (/docs/components/command)
  3. Try navigating items with the keyboard
    → Focus does not move

After fix

  • VoiceOver is now able to navigate Command items using arrow keys naturally
  • Tested on:
    • macOS Sonoma 14.x
    • Chrome, Safari

Why this is safe

  • Non-macOS platforms are unaffected
  • No impact on existing keyboard interactions
  • Follows expected a11y behavior for screen reader users

Fixes: #8853

@vercel
Copy link

vercel bot commented Nov 23, 2025

@amazon7737 is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[bug]: Unable to navigate command component using Keyboard when Mac Voiceover screen reader is enabled

1 participant