[TabPanel] Type mismatch between tabContext and tanPanel

[blackcow1987]

Steps to reproduce

According to TabPanel's type definition, value must be a string.

https://github.com/mui/material-ui/blob/v6.1.4/packages/mui-lab/src/TabPanel/TabPanel.d.ts#L24

  /**
   * The `value` of the corresponding `Tab`. Must use the index of the `Tab` when
   * no `value` was passed to `Tab`.
   */
  value: string;
};

But according to TabContext's type definition, value must be a string or number.

https://github.com/mui/material-ui/blob/v6.1.4/packages/mui-lab/src/TabContext/TabContext.d.ts#L16

  /**
   * The value of the currently selected `Tab`.
   */
  value: string | number;
}

When using TabContext, because the currently active tab information is stored in the Context and compared within the TabPanel component, the value ​​of the two components must use the same type.

https://github.com/mui/material-ui/blob/v6.1.4/packages/mui-lab/src/TabPanel/TabPanel.js#L50

  const context = useTabContext();
  if (context === null) {
    throw new TypeError('No TabContext provided');
  }
  const id = getPanelId(context, value);
  const tabId = getTabId(context, value);

  return (
    <TabPanelRoot
      aria-labelledby={tabId}
      className={clsx(classes.root, className)}
      hidden={value !== context.value}

Current behavior

The value ​​of TabContext and TabPanel are using different types.

Expected behavior

The value ​​of TabContext and TabPanel must use the same type.

Context

No response

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: TabPanel

[mj12albert]

value: string | number looks correct to me, @blackcow1987 are you interested in opening a PR?

[blackcow1987]

@mj12albert Yes, I'm checking out the guidelines for contribution :)

[ZeeshanTamboli]

This was fixed in #44207

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

@blackcow1987 How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.