Skip to content
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

[Feature Request]: Add support react@19 #3155

Open
2 tasks done
rktyt opened this issue Dec 24, 2024 · 4 comments
Open
2 tasks done

[Feature Request]: Add support react@19 #3155

rktyt opened this issue Dec 24, 2024 · 4 comments
Assignees
Labels
enhancement New feature or request

Comments

@rktyt
Copy link

rktyt commented Dec 24, 2024

Description

react 19 not yet added to peerDependencies

Code of Conduct

@rktyt rktyt added the enhancement New feature or request label Dec 24, 2024
@avinashbot avinashbot self-assigned this Jan 6, 2025
@bmv437
Copy link

bmv437 commented Jan 15, 2025

I noticed that when I attempted to upgrade, that the behavior of the SpaceBetween component changed. When I dug deeper, I found that this was due to the use of the react-keyed-flatten-children package that the SpaceBetween component depends on for introspecting fragments and flattening children:

https://github.com/cloudscape-design/components/blob/main/src/space-between/internal.tsx#L24-L27

Let's take this example:

<SpaceBetween>
  <div>First</div>
  {someCondition && (
    <>
      <div>Second</div>
      <div>Third</div>
    </>
  )}
</SpaceBetween>

In React 18, you'd see even spacing between all three divs.

In React 19, because react-keyed-flatten-children is no longer flattening out the children of fragments, it treats the fragment around Second and Third as one unit. This means there's space between First and the fragment, but not between Second and Third.

I've filed an issue with react-keyed-flatten-children here:
grrowl/react-keyed-flatten-children#20

@bmv437
Copy link

bmv437 commented Jan 21, 2025

The issue with react-keyed-flatten-children has been fixed in version v3.1.0. Since it still maintains backwards compatibility back to React 15, it can be upgraded safely.

@CarterWilde
Copy link

Hello, I was wondering if there was an estimated completion date on this?

@johannes-weber
Copy link
Member

Hello and thanks for reaching out! We are actively working on making Cloudscape React 19 compatible.
We cannot share any concrete ETA yet and keep this request posted once done.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

5 participants