[charts] onAxisClick not working when the chart layout is horizontal

[mohamad-selman]

Steps to reproduce

Link to live example: https://stackblitz.com/~/github.com/mohamad-selman/mui-charts-issue-demo

Steps:

1. Add a BarChart
2. Set the layout prop to horizontal
3. Add an onAxisClick callback
4. Click on any axis

For example:

<BarChart
  height={500}
  layout="horizontal"
  series={[
    { label: "Earnings", data: [35, 44, 24, 34] },
  ]}
  yAxis={[{ data: ['Q1', 'Q2', 'Q3', 'Q4'], scaleType: 'band' }]}
  onAxisClick={(_ev, d) => console.log(d)}
/>

Current behavior

When clicking on any axis, the second argument of the onAxisClick callback is missing the information about the line/bar elements. The dataIndex is always -1 and axisValue is undefined.

{
    "dataIndex": -1,
    "seriesValues": {}
}

Expected behavior

The second argument should contain data about the clicked axis and items associated with it. For example:

{
    "dataIndex": 1,
    "axisValue": "Q2",
    "seriesValues": {
        "auto-generated-id-0": 44
    }
}

Context

No response

Your environment

System:
OS: macOS 14.6.1
Binaries:
Node: 20.15.0 - ~/.nvm/versions/node/v20.15.0/bin/node
npm: 10.7.0 - ~/.nvm/versions/node/v20.15.0/bin/npm
pnpm: 9.7.1 - /opt/homebrew/bin/pnpm
Browsers:
Chrome: Not Found
Edge: Not Found
Safari: 17.6
npmPackages:
@emotion/react: ^11.13.0 => 11.13.3
@emotion/styled: ^11.13.0 => 11.13.0
@mui/icons-material: ^5.16.7 => 5.16.7
@mui/lab: 5.0.0-alpha.173 => 5.0.0-alpha.173
@mui/material: ^5.16.7 => 5.16.7
@mui/x-charts: ^7.13.0 => 7.16.0
@mui/x-date-pickers: ^7.13.0 => 7.13.0
@types/react: ^18.3.3 => 18.3.3
react: 18.3.1 => 18.3.1
react-dom: 18.3.1 => 18.3.1
typescript: ^5.5.4 => 5.5.4

Search keywords: onAxisClick

[alexfauquette]

Thanks for reporting this issue. It's a regression we fixed for tooltip but missed for the axisClick. I'm opening a PR to solve it 👍

[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

We value your feedback @mohamad-selman! How was your experience with our support team?
If you could spare a moment, we'd love to hear your thoughts in this brief Support Satisfaction survey. Your insights help us improve!