-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Support React 19 #4558
Comments
React 19 will be added to peerDependencies when recharts supports it. Edit: Current alpha https://www.npmjs.com/package/recharts/v/2.13.0-alpha.4 |
Going to edit the title if you don't mind to just "Support React 19", and use this to track support in 2.x |
Alpha release - https://www.npmjs.com/package/recharts/v/2.13.0-alpha.0 use this to determine what is breaking/what isn't. I just don't have bandwidth to fix it myself Things that I know are broken: Bar |
https://www.npmjs.com/package/recharts/v/2.13.0-alpha.2 Please test this one as well on all React versions 16.8-19 to see if anyone runs into issues. Thanks! 🚀 |
In order to use React 19 one must override the
|
appreciate your work @ckifer |
My only issue remaining is |
@juliusmarminge Not sure why the types broke, are there React 19 types released? I can't seem to reproduce. But might need to add explicit Also noticed that @rauchg - I think probably another defaultProps issue that hasn't been caught yet. Will take another look Edit: for Legend for now you can just add the defaultProps back yourself (not sure if you can do this in Tremor)
|
I've also noticed a particular difference only when updating from I have an AreaChart (without set height/width) wrapped with ResponsiveContainer:
After updating though, the same exact code does not render the graph in any way I have tried with both set/dynamic dimensions on the AreaChart component, ResponsiveContainer or the other wrapping html tags (following the examples on the docs website) but the chart either doesn't render at all or loses all the responsive features it had before. Is this also true on your end? |
@emanuele-moricci this sounds like your version of react-is hasn't been overridden #4558 (comment) Try to npm ls react-is and see if it gives you multiple versions. |
And you'd be right! For future reference: After that, I cancelled the |
You definitely need to force
|
https://www.npmjs.com/package/recharts/v/2.13.0-alpha.3 Alpha-3 should fix the Legend issues mentioned above. Please continue to report other issues as you run into them, thanks! |
Thanks @tobiaslins will look into it |
@tobiaslins I can reproduce here https://codesandbox.io/p/sandbox/stacked-bar-chart-7fwfgj |
recharts/src/util/ChartUtils.ts Line 1064 in fad4d30
This is why stacks fail - we expect an axisId to be present but it isn't getting defaulted because of the way defaulProps are read. This one doesn't seem as reasonable to refactor as the other ones so for now specifying axisIds on you graphical items and axes should fix it. Will work on a fix in the meantime |
<!--- Provide a general summary of your changes in the Title above --> ## Description <!--- Describe your changes in detail --> Safely re-add defaultProps to places where props are being read directly from graphical items to fix issues with current alpha release Fixes stacked bars and stacked areas. maybe more ## Related Issue <!--- This project only accepts pull requests related to open issues --> <!--- If suggesting a new feature or change, please discuss it in an issue first --> <!--- If fixing a bug, there should be an issue describing it with steps to reproduce --> <!--- Please link to the issue here: --> #4558 ## Motivation and Context <!--- Why is this change required? What problem does it solve? --> support react 19 in 2.x. Lots of defaultProps issues ## How Has This Been Tested? <!--- Please describe in detail how you tested your changes. --> <!--- Include details of your testing environment, and the tests you ran to --> <!--- see how your change affects other areas of the code, etc. --> See tests added. These now pass in R19 and 18 ## Screenshots (if appropriate): ## Types of changes <!--- What types of changes does your code introduce? Put an `x` in all the boxes that apply: --> - [X] Bug fix (non-breaking change which fixes an issue) - [ ] New feature (non-breaking change which adds functionality) - [ ] Breaking change (fix or feature that would cause existing functionality to change) ## Checklist: <!--- Go over all the following points, and put an `x` in all the boxes that apply. --> <!--- If you're unsure about any of these, don't hesitate to ask. We're here to help! --> - [ ] My change requires a change to the documentation. - [ ] I have updated the documentation accordingly. - [X] I have added tests to cover my changes. - [ ] I have added a storybook story or extended an existing story to show my changes --------- Co-authored-by: Coltin Kifer <[email protected]>
https://www.npmjs.com/package/recharts/v/2.13.0-alpha.4 @tobiaslins should be good to go now |
Do you want to request a feature or report a bug?
Bug
What is the current behavior?
Charts do not render when using React 19, or when using NextJS 14.3 (which uses React 19).
If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via codesandbox or similar (template: https://codesandbox.io/p/sandbox/simple-line-chart-v25dl4).
Install react@rc or react@beta
Observe charts do not render
https://github.com/justinh00k/recharts-react19-repro
What is the expected behavior?
Charts render
Which versions of Recharts, and which browser / OS are affected by this issue? Did this work in previous versions of Recharts?
2.12.7 / No
The text was updated successfully, but these errors were encountered: