cmdk icon indicating copy to clipboard operation
cmdk copied to clipboard

Add keydown listeners on individual items

Open SorenHolstHansen opened this issue 1 year ago • 10 comments

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?

SorenHolstHansen avatar May 08 '23 07:05 SorenHolstHansen

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

joaom00 avatar May 11 '23 03:05 joaom00

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

SorenHolstHansen avatar May 11 '23 07:05 SorenHolstHansen

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

mclean25 avatar Jan 30 '24 02:01 mclean25

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.

pacocoursey avatar Jan 30 '24 06:01 pacocoursey

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.

mclean25 avatar Jan 31 '24 16:01 mclean25

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 :)

crlaferla avatar Mar 19 '24 21:03 crlaferla

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

Schmedu avatar Apr 19 '24 20:04 Schmedu

Bumppp

crlaferla avatar Jun 30 '24 14:06 crlaferla

This would be a really nice feature to have.

jaydevelopsstuff avatar Aug 04 '24 00:08 jaydevelopsstuff