tbleckert / react-select-search

⚡️ Lightweight select component for React
https://react-select-search.com
MIT License
675 stars 149 forks source link

options scrolling on down/up array keys pressed #201

Closed shreyasrh9 closed 3 years ago

shreyasrh9 commented 3 years ago

Fix for #200

ezgif com-gif-maker (1)

vercel[bot] commented 3 years ago

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/tbleckert/react-select-search/Cz211unP5ak4M6ZdP1Ku5aR2ZdnL
✅ Preview: https://react-select-search-git-fork-shreyasrh9-option-ac5417-tbleckert.vercel.app

VidvathK commented 3 years ago

This is a very useful feature. Thanks for the fix @shreyasrh9 . Amazing work.

tbleckert commented 3 years ago

First of all @shreyasrh9 , thanks for the work! A few comments. The preview is broken, seems like you've missed to import useRef. You also need to build the dist files (npm run bundle). Regarding the solution, two things:

  1. The scrolling should not happen on every render, only when ref.current changes, by utilizing useEffect.
  2. I think it would be better to fix the scrolling we already have, they would create conflicts otherwise (see Components/Options.jsx). The problem is we exit too early (it's a recent bug).