Id not being passed to the onChange function

[Anuj]

Hi @davidtheclark! The library is great, thank you for open sourcing it!

I have been running into one issue. I was trying to replicate the stateless demo, and can get the tabs to switch. But the function being passed as the onChange prop is not being passed the id on tabChange. I imagine it is a n00b mistake, but any pointers would me much appreciated.

Here is what my render function works like -

return (
  <AriaTabPanel.Wrapper
    onChange={this.handleTabChange}
    activeTabId = {this.state.activeTab}
    letterNavigation
  >
      <AriaTabPanel.TabList>
        <ul className = {styles['Tabs-tablist']}>
          {renderTabHeadings()}
        </ul>
      </AriaTabPanel.TabList>
      <div className = {styles['Tabs-panel']}>
        {renderTabContents()}
      </div>
  </AriaTabPanel.Wrapper>
);

The handleTabChange function is not getting the tabId parameter. This is what that looks like:

handleTabChange = (newActiveTabId) => {
  //TODO: change router here when updated
  console.log(newActiveTabId); //is always undefined :(
};

Thank you!

[David Clark]

@oyeanuj How are your tabs switching if your not getting the argument you expect? Are you sure this.handleTabChange is defined? It seems that the onChange handler is being called as expected in the demo and the code (https://github.com/davidtheclark/react-aria-tabpanel/blob/master/lib/createManager.js#L68), so I'm not sure what I could do to help here.