How can I navigate a list through arrow keys?
```js
{SearchResult.map((country)=>{
            return <div className='border-b'>{country.properties.name}</div>
      })}
```

What do you mean by navigate? Highlight list items or what?

its a search suggestion. kind of drop down of countries when i type. but i want to select the right country using the arrow keys

I suggest you use `<datalist>` element
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist

It handles arrow key navigation out of the box

I can use many npm packages if were to handle it out of the box