List component, with ListItem component. It has roving tabindex functionality built in, i.e. up and down navigation with arrow keys only. Press Tab to focus on the list group, then navigate using arrow keys. When you focus out of group, and focus back in, it remembers the index of your last selected item and focuses on that.
Data fetching functionality is now local to List component. There are multiple if statements with error codes. We can put in better error handling later
Add types in types.d.ts, and consume using JSDoc
This below you see, where the focus is dancing around item to item, is being done through Up/Down Arrow keys only
PuruVJ
commented
3 years ago
Frontend
Listcomponent, withListItemcomponent. It has roving tabindex functionality built in, i.e. up and down navigation with arrow keys only. Press Tab to focus on the list group, then navigate using arrow keys. When you focus out of group, and focus back in, it remembers the index of your last selected item and focuses on that.Listcomponent. There are multiple if statements with error codes. We can put in better error handling laterThis below you see, where the focus is dancing around item to item, is being done through Up/Down Arrow keys only