Repository navigation
Bump @wordpress/block-editor, compose, and friends; migrate global-styles bridge - #111123
Merged
Merged
Conversation
added 3 commits
May 28, 2026 11:31
… icons, private-apis Bumps the WordPress monorepo packages used by Calypso to their latest stable versions, completing the upgrade started in #111100: - @wordpress/block-editor 15.13 → 15.20 - @wordpress/block-library 9.32 → 9.46 - @wordpress/format-library 5.32 → 5.47 - @wordpress/icons 10.27 → 13.2 - @wordpress/compose 7.45 → 8.0 - @wordpress/private-apis 1.46 → 1.47 Carries three yarn patches: - @wordpress/compose 8.0 — guards `view = window` default parameters in `useViewportMatch` / `useMediaQuery` so the hooks can be imported under SSR. An upstream fix is already merged (WordPress/gutenberg#76446) and this patch can be dropped once a compose release containing it ships. - @wordpress/block-editor 15.20 — (a) optional-chains the `defaultView` access in `useTypingObserver`'s cleanup so a typing-iframe unmount stops throwing `Cannot read properties of null`; (b) widens the package's `exports` field to surface `./build-module/components/iframe/get-compatibility-styles`, which `packages/verbum-block-editor` reaches into. - @wordpress/global-styles-ui 1.13 — widens the `exports` field only (no code changes) to surface `./build-module/hooks` and `./build-module/context`, used by the global-styles bridge migration in the following commit.
Between block-editor 15.5 and 15.10, upstream moved the global-styles hooks/context/equality helpers out of `@wordpress/block-editor`'s private APIs and into the new public `@wordpress/global-styles-ui` and `@wordpress/global-styles-engine` packages. Rewrites the gutenberg bridge to consume the new APIs while keeping the surface exported to Calypso consumers (`useGlobalSetting`, `useGlobalStyle`, `useSafeGlobalStylesOutput`, `GlobalStylesContext`, etc.) unchanged. - `useGlobalSetting` / `useGlobalStyle` now alias the public `useSetting` / `useStyle` hooks from `@wordpress/global-styles-ui`. - `useSafeGlobalStylesOutput` is reimplemented over the engine: read the merged config from `GlobalStylesContext` and call `generateGlobalStyles( merged, getBlockTypes() )`, returning the same `[ stylesheets, settings ]` tuple shape that consumers expect. - `areGlobalStyleConfigsEqual` was removed upstream; it's inlined here as two `fast-deep-equal` calls on the styles/settings slices, matching the pre-refactor behavior. - TypeScript's `node` classic module resolution doesn't honor the `exports` field, so a small `.d.ts` shim redirects the deep imports to the package's own `build-types` declarations. - `font-pairing-variations/preview.tsx` updates its cast to match the readonly-tuple return shape of the new `useGlobalSetting`.
…ct import The deep `@wordpress/format-library/build-module/default-formats` import verbum was using was hidden behind the package's `exports` field in 5.46+, so it can no longer be reached. The package's public surface is the main entry, which auto-registers all 15 built-in formats (bold, italic, link, code, image, strikethrough, underline, textColor, subscript, superscript, keyboard, unknown, language, math, nonBreakingSpace) via top-level side effects. Replace the deep import with `import '@wordpress/format-library'` and turn `loadTextFormatting` into a no-op that exists only to preserve the public API of `@automattic/verbum-block-editor`. The Reader quick-post caller no longer needs the `extraFormats` argument (verbum already registers `heading`-compatible formats unconditionally), so drop it.
Jetpack Cloud Live (direct link)
Automattic for Agencies Live (direct link)
|
Contributor
|
This PR modifies the release build for the following Calypso Apps: For info about this notification, see here: PCYsg-OT6-p2
To test WordPress.com changes, run |
added 8 commits
May 28, 2026 11:49
The bump to `@wordpress/compose@8.0` in this PR removed the optional
chaining around `mediaQueryList?.matches` that 7.45's `useMediaQuery`
relied on. With 8.0, `view.matchMedia(query)` is assumed to return a real
`MediaQueryList`.
Calypso's test framework defines `global.matchMedia = jest.fn(query => ({
matches: false, ... }))` once in `test/client/setup-test-framework.js`.
This test's `beforeEach` was calling `jest.resetAllMocks()`, which wipes
the implementation of every `jest.fn()` — including the framework-level
matchMedia. The next call to `matchMedia(query)` then returned undefined,
and `StepContainerV2`'s `useViewportMatch` would crash trying to read
`.matches` on it.
Switch to `jest.clearAllMocks()` (clears call history but keeps mock
implementations), matching the sibling `playground-error.tsx` test in
the same directory.
The bump of `@wordpress/compose` from 7.45 to 8.0 in this PR added a `useFocusOnMount.Mode` namespace export with a strict literal union type: `boolean | 'firstElement' | 'firstInputElement'`. Previously the namespace didn't exist, so `useFocusOnMount.Mode` resolved to `any` and the `"container"` value used in three A4A popovers (introduced in #111038) type-checked without complaint. At runtime, `"container"` and `true` are equivalent — both fall through to `setFocus(node)` on the popover wrapper in both 7.45 and 8.0, since the implementation only special-cases `false`, `'firstElement'`, and `'firstInputElement'`. Switching to the JSX prop shorthand `focusOnMount` (which evaluates to `true`) preserves behavior — focus moves into the popover wrapper, `onFocusOutside` keeps working, and "Learn more" links inside are no longer auto-focused — while satisfying the narrowed type.
The helper wasn't removed upstream, just renamed and made public: `@wordpress/block-editor`'s private `areGlobalStyleConfigsEqual` lives in `@wordpress/global-styles-engine` as `areGlobalStylesEqual` now, with an identical implementation (the same two `fast-deep-equal` calls on the `styles` and `settings` slices). Import the renamed helper instead of carrying our own copy. The single call site casts via `Parameters< typeof areGlobalStyleConfigsEqual >[0]` because Calypso's `GlobalStylesObject` is structurally compatible with the engine's `GlobalStylesConfig` for these two slices but doesn't satisfy the stricter TS signature. Also drops the direct `fast-deep-equal` dep from `packages/global-styles/package.json`, which is no longer used in the package.
xavier-lc
commented
May 28, 2026
| ); | ||
|
|
||
| const useSafeGlobalStylesOutput = () => { | ||
| const useSafeGlobalStylesOutput = (): [ unknown[], Record< string, unknown > ] => { |
Contributor
Author
There was a problem hiding this comment.
Historical context for useSafeGlobalStylesOutput: it replaces the removed useGlobalStylesOutput hook that used to live in @wordpress/block-editor private APIs. The function preserves the same [ stylesheets, settings ] tuple shape downstream consumers were already using, and wraps the engine call in a try/catch that reports failures to Sentry instead of crashing the page.
2 of 9 tasks
1 of 10 tasks
1 of 10 tasks
Member
|
Yo yo! Compose was released, and the patch is no longer needed #112001 |
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
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.
Fixes DOTCOM-17286
Part of #105909 — continues the WordPress monorepo bumps that started in #111100.
Proposed Changes
Three sequential commits:
package.jsonfiles, with three yarn patches:@wordpress/compose@8.0— guardsview = windowdefault parameters inuseViewportMatch/useMediaQueryso the hooks can be imported under SSR. Removal path known: useMediaQuery: support in-iframe queries by accepting Window instance WordPress/gutenberg#76446 is already merged upstream; this patch can be dropped once a compose release containing it ships.@wordpress/block-editor@15.20— (a) optional-chains thedefaultViewaccess inuseTypingObserver's cleanup so an iframe unmount stops throwingCannot read properties of null; (b) widens theexportsfield to surface./build-module/components/iframe/get-compatibility-styles, whichpackages/verbum-block-editorreaches into. Upstream issue for (a) to be filed.@wordpress/global-styles-ui@1.13— widens theexportsfield only (no code changes) to surface./build-module/hooksand./build-module/context, used by the global-styles bridge migration in the following commit.packages/global-stylesto the newglobal-styles-uiand-enginepackages. Between block-editor 15.5 and 15.10, upstream moved the global-styles hooks/context/equality helpers out of@wordpress/block-editor's private APIs and into the new public packages. The Calypso-facing surface (useGlobalSetting,useGlobalStyle,useSafeGlobalStylesOutput,GlobalStylesContext, etc.) is unchanged.@wordpress/format-libraryside-effect import instead of the deepdefault-formatsimport, which is no longer reachable through the package'sexportsfield.Why are these changes being made?
To keep Calypso current with upstream Gutenberg and unblock further consumers. Splitting from #111100 keeps each PR atomic — that one landed the intermediate-step bump that didn't touch global-styles, and this one finishes the work.
Testing Instructions
yarnthenyarn start.http://calypso.localhost:3000/theme/primarium(or any other theme with style variations). Verify:useSafeGlobalStylesOutputis exercised here).Pre-merge Checklist