Nested elements with `role='tab'` are triggering tab change

If any child element of a TabPanel has role='tab' clicking on that element will cause the selected tab to become the first tab.

Example:

Clicking on <span>hello</hello> will cause the selected tab to change.

import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';

export default () => (
  <Tabs>
    <TabList>
      <Tab>Title 1</Tab>
      <Tab>Title 2</Tab>
    </TabList>

    <TabPanel>
      <h2>Any content 1</h2>
    </TabPanel>
    <TabPanel>
      <h2>Any content 2</h2>


      <div role='tab'>
          <span>hello</span>
      </div>
    </TabPanel>
  </Tabs>
);

Use Case:
Seems plausible that someone might want to use the 'tab' role on a nested element. In my particular case I'm using https://github.com/react-component/collapse within a TabPanel.

Beginne damit, das JSX-Beispiel mit einem verschachtelten Element zu reproduzieren, das role='tab' verwendet, und verfolge anschließend, wie sich Klicks innerhalb von TabPanel auf die Tab-Auswahl auswirken. Die Aufgabe ist erledigt, wenn das Klicken auf das verschachtelte role='tab'-Element den ausgewählten Tab nicht mehr ändert, während normale Tab-Wechsel weiterhin funktionieren.