title: How to make notification list elements traversable through key up and down button in react?
body: <p>I have written this react component where I want the list element to be traversable thorough the key up and down buttons. I am able to do using tab-index with tab and shift tab, but instead I want to use key up and down.</p>
  <pre><code>export const NotificationListComponent: React.FunctionComponent&lt;INotifications&gt; = (
    props
  ) =&gt; {
    return (
      &lt;&gt;
        {props.notifications &amp;&amp;
          props.notifications.map((item) =&gt; {
            return (
              &lt;li
                key={item.notificationId}
                style={NotificationListStyle}
                role=&quot;listitem&quot;
                tabIndex={0}
              &gt;
                &lt;NotificationItemComponent {...item} /&gt;
              &lt;/li&gt;
            );
          })}
      &lt;/&gt;
    );
  };```
  </code></pre>