fix: Add support for React 18 #265
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Upgrade to support using React 18, while also maintaining backwards compatibility and handling React 17.
Key Changes
React Render API
The approach was heavily inspired by the approach used by Storybook, while avoiding the need to add config to control the version. Playroom decides which version of the render API to use based on the version of
react-domit resolves.Code editor
The react-codemirror2 editor is unmaintained and not compatible with React 18 (using legacy APIs and not throwing the peer dependency warning). As it is just a thin react wrapper with no additional dependencies, and given the legacy lifecycle hooks still work, we opted to embed a copy while we investigate a Codemirror 6 migration separately.
As part of bringing it in there were some minor modifications:
Extras
Use
@ts-expect-errordeclaration instead of@ts-ignoreand fix handful of issues where types were available.Closes #261