search

pacocoursey / cmdk

Fast, unstyled command menu React component.
https://cmdk.paco.me
MIT License
9.98k stars 287 forks source link

Support custom `loop` prop function for virtualization #299

Open Lexachoc opened 2 months ago

Lexachoc commented 2 months ago

https://github.com/pacocoursey/cmdk?tab=readme-ov-file#command-cmdk-root

<Command loop />

I wonder if it is possible to pass a custom function for the loop prop? So that when using e.g. TanStack Virtual. The <Command.Item can be looped from the virtual end instead of from the end in the dom. (Please correct me if I use the wrong word, I'm new to react).

Currently, when using the TanStack Virtual + loop prop, it behaves like this: recording

It is normal and as expected to go down from the top with the arrow, but when going up, the item does not reach the end of the virtual list, but the end of the dom. Same for when doing up from the bottom, the item does not reach the top of the virtual list, but the top of the dom.

So it would be nice to have a custom function for loop prop to scroll to top/bottom: e.g., call parentRef.current?.scrollTo({ top: 0}); when reaching the bottom of the list, and press the down arrow.