Add keydown listeners on individual items

[SorenHolstHansen]

We recently started using this package for our command palette. It works very nice, sot hanks for that.

We want a setup where we can "step through" an item which then brings up a new page. We use cmd+enter for that at the moment, where we have a global listener to see if the cmd button is pressed, and then we use that in onSelect to see if we should select an element or step through. However we would very much like to use tabs instead of cmd+enter, but we found no good way of doing this.

We could either add a global listener for tabs, but there is no way for us of knowing which page the highlighted item is pointing to, and the onKeyDown prop on the item did not get called on tabs.

Is there anyway you can add support for this, or is there already a good way to do this?

[joaom00]

I believe that onKeyDown does not work because the focus remains on the input.

Maybe a way to be done would be like this? https://codesandbox.io/s/cmdk-playground-x6f91e?file=/src/App.tsx

[SorenHolstHansen]

Uhh, yeah that works! Guess I will have to go with that for now

[mclean25]

@SorenHolstHansen Did you figure out how to do this? I don't see how the linked example helps here...

[pacocoursey]

I plan to support this. I do agree that Tab is the more natural way to go "deeper" into a command menu item that has more values to show.

[mclean25]

FWIW, I was looking into this to try and see if I could attach an event listener to the "selected" item in the menu changing. What I want to do is pre-fetch certain data when one of the items in the menu is highlighted.

[crlaferla]

Just chiming in to add that we're trying to build this too @pacocoursey! Any idea when it will be supported?

Love the package btw :)

[Schmedu]

Any updates on this @pacocoursey That would be awesome :-)

[crlaferla]

Bumppp