Upgrade React to 19 and WordPress packages to React 19-compatible versions#3642
Merged
Conversation
… versions - React: 18.2.0 → 19.2.6 (react, react-dom, @types/react, @types/react-dom) - @wordpress/components: 33.0.0 → 34.0.0 - @wordpress/compose: 7.36.0 → 8.0.0 - @wordpress/element: 6.39.0 → 7.0.0 - @wordpress/dataviews: 14.2.0 → 15.0.0 - @wordpress/icons: 13.1.0 → 13.2.0 (unpin; React 19 resolves the prior issue) - @wordpress/i18n, @wordpress/react-i18n, and several apps/ui WP packages bumped - @rive-app/react-canvas: 4.12.0 → 4.18.0 (first version with React 19 peer dep support) - Root devDependencies now include react/react-dom to ensure a single hoisted copy for tests - Rename @WordPress+components+33.0.0.patch → @WordPress+components+34.0.0.patch - Fix React 19 TypeScript breaking changes: useRef<T>() → useRef<T>(undefined), ForwardedRef type, RefObject<T | null>, LegacyRef spreads in react-markdown consumers, allowpopups boolean attribute, Tooltip.Popup API (side → positioner prop) Closes #3590, #3637
@wordpress/components v34 depends on date-fns@^4.x, which conflicts with the root date-fns@3.x required by tools/common. npm therefore keeps the package in apps/studio/node_modules rather than hoisting it to root node_modules. The root postinstall ran patch-package --patch-dir apps/studio/patches from the repo root, but patch-package looks in root node_modules, so it couldn't find @wordpress/components and failed. Fix: move the @wordpress/components patch file to apps/studio/patches-local/ and apply it via a sub-shell cd that runs patch-package from within apps/studio, where the package actually lives. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@wordpress/components v34 depends on date-fns@^4.x, which conflicted with the date-fns@^3.x declared in tools/common and apps/studio, preventing npm from hoisting the package to root node_modules. The root postinstall patch-package call then failed because it couldn't find @wordpress/components there. Bump date-fns from ^3.3.1 to ^4.1.0 in both tools/common and apps/studio so root node_modules resolves date-fns v4, allowing @wordpress/components to hoist normally. Also reverts the patches-local workaround from the previous commit. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
React 19 removes the global JSX namespace. Replace JSX.Element with ReactElement and JSX.IntrinsicElements with React.ComponentPropsWithRef in the affected files. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Both apps/studio and apps/ui declare react@^19.2.6, which is enough for npm to hoist a single copy to root node_modules. The root entry was added as a workaround for a dual-React problem that no longer exists after fixing hoisting via the date-fns v4 upgrade. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…/ui Icon Change Button's icon prop from ReactElement (any) to the exact type that @wordpress/ui's Icon expects — ReactElement<ComponentProps<'svg'>> — derived via ComponentProps<typeof Icon>['icon']. This removes the as-cast at the usage site and makes the type mismatch visible at call sites rather than hiding it. Update ShortcutIcon in site-shortcuts to derive from Button's icon prop type rather than @wordpress/icons's Icon (which uses the wider ReactElement<any>), keeping the types consistent across the chain. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- connect-button.tsx: move @wordpress/i18n import before react (import order) - button/index.tsx: format Icon props onto one line (prettier) - sync/index.tsx: prefix unused syncSites with _ to satisfy no-unused-vars Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Collaborator
📊 Performance Test ResultsComparing a62b505 vs trunk app-size
site-editor
site-startup
Results are median values from multiple test runs. Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff) |
gcsecsey
approved these changes
May 29, 2026
Member
gcsecsey
left a comment
gcsecsey
left a comment
There was a problem hiding this comment.
LGTM, and with these changes, sites keep working normally.
This file contains hidden or 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
3 participants
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.
Related issues
Closes #3590
Closes #3637
How AI was used in this PR
This PR was created with Claude Code. All changes were reviewed and verified with passing typecheck and full test suite.
Proposed Changes
This PR combines two Dependabot PRs (#3590 and #3637) that have a circular dependency — the new
@wordpress/components@34,@wordpress/element@7,@wordpress/compose@8, and@wordpress/dataviews@15all require React 19 as a peer dependency, making them impossible to land independently.Package upgrades:
react/react-dom: 18.2.0 → 19.2.6@types/react/@types/react-dom: 18.x → 19.x@wordpress/components: 33.0.0 → 34.0.0@wordpress/compose: 7.36.0 → 8.0.0@wordpress/element: 6.39.0 → 7.0.0@wordpress/dataviews: 14.2.0 → 15.0.0@wordpress/icons: 13.1.0 → 13.2.0 (unpinned — the prior pin was a pre-React 19 workaround)@wordpress/i18n,@wordpress/react-i18n, and severalapps/uiWP packages bumped@rive-app/react-canvas: 4.12.0 → 4.18.0 (adds React 19 peer dep support)date-fns: ^3.3.1 → ^4.1.0 intools/commonandapps/studio— required so@wordpress/components@34Patch file:
@wordpress+components+33.0.0.patch→@wordpress+components+34.0.0.patchTypeScript fixes for React 19 breaking changes:
useRef<T>()→useRef<T>(undefined)(no-arg overload removed for non-DOM refs)ForwardRefRenderFunctionsecond param updated toReact.ForwardedRef<T>RefObject<T | null>propagated through prop types (React 19useRef(null)is now nullable)reffrom react-markdownExtraPropsspreads to avoid v18/v19LegacyRefmismatchallowpopups="true"→allowpopups={true}(boolean attribute)Tooltip.Popup sideprop migrated topositioner={<Tooltip.Positioner side={...} />}(@wordpress/ui 0.14 API change)JSX.Element→ReactElement,JSX.IntrinsicElements→React.ComponentPropsWithRef(global JSX namespace removed in React 19)Testing Instructions
npm run typecheck— passes cleannpm test— 1941/1941 tests passnpm start— app starts locally and sites run normallyPre-merge Checklist
npm test)