React 19 Support for Atlaskit Components

Atlassian Ecosystem Design
1

Similar to the React 18 topic (see link in following replies below), it would be great to get support for React 19 in the @atlaskit/* components.

Right now, various TypeScript errors occur, because the JSX type needs to be imported - the global namespace has been removed:

Error: components/widgets/AtlassianMutationError.tsx(20,13): error TS2786: 'ErrorMessage' cannot be used as a JSX component.
  Its type '({ children, testId }: MessageProps) => Element' is not a valid JSX element type.
    Type '({ children, testId }: MessageProps) => Element' is not assignable to type '(props: any) => ReactNode | Promise<ReactNode>'.
      Type 'Element' is not assignable to type 'ReactNode | Promise<ReactNode>'.

or this:

Error: components/AtlassianVersionPicker.tsx(169,20): error TS7006: Parameter 'option' implicitly has an 'any' type.

on this code:

import Select from '@atlaskit/select';

<Select onChange={(option) => {}} />

I’m not sure if there are any other incompatibilities other than the JSX import, but the React 19 Upgrade Guide (and the included codemods) can be helpful here:

If the @atlaskit/* components were open source and allowed community contribution, community members may be able to help with this too.

2 Likes
2

The React 18 topic by @umang.savaliya, with Atlassian responses by douges and @SamiJaatinen is over here btw:

3

…oh also Atlassian responses to the React 18 post linked above by @KylorHall and @douges

4

I’ve commented on React 19 in the React 18 RFC, but it’s been more more than 5 months, so it’s fair to say a bit more.

There’s been no change in support or new plans for React 19, I can say it’s being discussed, but the timeframe between even a successful spike and landing that to Atlaskit would be multiple months, so I can pretty confidently say this wouldn’t land in 2025.

What I’m hoping for at the least is wider levels of React.StrictMode support as we clean up some technical debt from our React 18 migration, which for many packages will mean React 19 support (I’m not certain about the TypeScript error though), as today you will hit things like legacy context in all popups, modals, etc., and other blockers.

I’d say watch out for an RFC around React 19 similar to how we did with React 18, but I wouldn’t expect that to land this year.

1 Like
5

@KylorHall thanks for the update! Looking forward to this landing.

I resolved the TS types problems in node_modules in the unfamiliar code of @atlaskit/form, @atlaskit/select and @atlaskit/react-select using patch-package in 1.5-2 hours, so I guess that part is pretty quick.

But maybe there are further issues that require a bit more work.

There’s no appetite from Atlassian to allow submissions from the wider open source community, correct? It’s possible that this could be fixed much faster than internally if community contributions were allowed.

1 Like
6

@karlhorky Yeah, there’s no real way to contribute back to the Atlassian Design System or Atlaskit in general as it’s not open source, but only mirrored, there’s just no way to create a PR or anything.

However, given you’ve done the legwork, if you can send me the patches (either via this thread or a DM), I can see about contributing them into those packages, and possibly systemically. I don’t actually know or have encountered the issue you talked about in my React 19 spike, but I might’ve been blocked by something else first, but if it’s a change that can co-exist and be maintainable in our codebase, I’ll try. Can’t promise anything, but I’ll see what I can do.

1 Like
7

Yeah, there’s no real way to contribute back to the Atlassian Design System or Atlaskit in general as it’s not open source, but only mirrored, there’s just no way to create a PR or anything.

Alright - too bad. Maybe Atlassian would be open to changing that in future.

However, given you’ve done the legwork, if you can send me the patches (either via this thread or a DM), I can see about contributing them into those packages

Ok, that’s a nice offer, thanks! Let me see what I can do once I have a tested version.

1 Like