What is the current behavior?
When using a vertical BarChart with multiple components and a custom (shared={false}), the tooltip's payload[].payload property refers to the wrong data entry for all rows except the first one. Hovering over bars in the first row works correctly — payload[].payload contains the correct data entry. Hovering over bars in the second or subsequent rows returns incorrect data (usually the data from a different row).
What is the expected behavior?
When hovering over a bar in any row, the tooltip's payload should contain the data entry for that row.
Please provide a demo of the problem in a sandbox
Here is how: https://codesandbox.io/p/sandbox/epic-raman-gkzyx8
Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?
- recharts version: 3.8.1
- React version: 19
Initial investigation suggests the index used to resolve payload may get out of sync with the actual data array when some bars are filtered out internally.
What is the current behavior?
When using a vertical BarChart with multiple components and a custom (shared={false}), the tooltip's payload[].payload property refers to the wrong data entry for all rows except the first one. Hovering over bars in the first row works correctly — payload[].payload contains the correct data entry. Hovering over bars in the second or subsequent rows returns incorrect data (usually the data from a different row).
What is the expected behavior?
When hovering over a bar in any row, the tooltip's payload should contain the data entry for that row.
Please provide a demo of the problem in a sandbox
Here is how: https://codesandbox.io/p/sandbox/epic-raman-gkzyx8
Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?
Initial investigation suggests the index used to resolve payload may get out of sync with the actual data array when some bars are filtered out internally.