Tooltip migration: block-editor + block-directory consumers (1/5)#78411
Draft
ciampo wants to merge 2 commits into
Draft
Tooltip migration: block-editor + block-directory consumers (1/5)#78411ciampo wants to merge 2 commits into
ciampo wants to merge 2 commits into
Conversation
|
Size Change: +63 kB (+0.79%) Total Size: 8.03 MB 📦 View Changed
ℹ️ View Unchanged
|
ciampo
force-pushed
the
cursor/tooltip-migration-1-block-editor
branch
from
72496c7 to
e5718cb
Compare
ciampo
force-pushed
the
cursor/tooltip-migration-1-block-editor
branch
from
e5718cb to
92c23d5
Compare
Migrates 7 consumer call sites in `@wordpress/block-directory` and
`@wordpress/block-editor` from the legacy `Tooltip` exported by
`@wordpress/components` to the compositional `Tooltip` exported by
`@wordpress/ui` (built on top of base-ui under the hood):
- block-directory/downloadable-block-list-item
- block-editor/block-patterns-list (WithToolTip)
- block-editor/global-styles/shadow-panel-components
- block-editor/inserter/media-tab/media-preview
- block-editor/inspector-controls-tabs
- block-editor/list-view/block-select-button (non-interactive trigger; flagged for a11y follow-up)
- block-editor/preset-input-control/custom-value-controls
Also lands the jscodeshift codemod used to perform the mechanical rewrite
across all 5 PRs of the migration (tools/codemods/tooltip-components-to-ui.js):
npx jscodeshift -t tools/codemods/tooltip-components-to-ui.js \
--extensions=js,jsx,ts,tsx --parser=tsx \
packages/<scope>
Per-call-site `Tooltip.Provider`s are *not* introduced by the codemod;
group-coordination is handled by shell-level `<Tooltip.Provider>`s
mounted in the edit-post / edit-site / boot PRs.
Part of the broader migration tracked in
#78095 (the new @wordpress/ui Tooltip API).
…ents` Adds `Tooltip` to the `@wordpress/ui` allowlist used by the `use-recommended-components` rule. Without this, consumers migrating from the legacy `@wordpress/components` `Tooltip` to the new compositional `@wordpress/ui` `Tooltip` (built on base-ui, introduced in #78095) would trip the rule on every migrated call site.
ciampo
force-pushed
the
cursor/tooltip-migration-1-block-editor
branch
from
92c23d5 to
6157346
Compare
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
ciampo
commented
May 19, 2026
ciampo
commented
May 19, 2026
Contributor
Author
|
Moving back to draft as I spotted some regressions in Fix in #78441 |
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.
What?
Follow up to #78095.
Migrates 7 consumer call sites in
@wordpress/block-directoryand@wordpress/block-editorfrom the legacyTooltip(@wordpress/components) to the new compositionalTooltip(@wordpress/ui, built on base-ui). Part 1 of a 5-PR series; also lands the one-shot jscodeshift codemod used across the whole series.Sites migrated in this PR
block-directory/components/downloadable-block-list-itemblock-editor/components/block-patterns-list(WithToolTip)block-editor/components/global-styles/shadow-panel-componentsblock-editor/components/inserter/media-tab/media-previewblock-editor/components/inspector-controls-tabsblock-editor/components/list-view/block-select-button— non-interactive trigger; flagged for a11y follow-upblock-editor/components/preset-input-control/custom-value-controlsFull 5-PR plan
Tooltip.Provider)Tooltip.Provider)Why?
#78095 introduced the new compositional
TooltipAPI in@wordpress/ui. This PR series migrates all consumers outside@wordpress/componentsitself to the new API, so that future tooltip work (delays, providers, positioner, base-ui upgrades) can happen in one place.Note
Call sites inside
@wordpress/components(notablyButton's internal Tooltip andTooltipInternalContext) stay on the legacy implementation — tracked as a separate follow-up.How?
Each
<Tooltip>is rewritten to the compositional API. The mechanical rewrite is automated by a jscodeshift codemod added in this PR; the few sites the codemod can't safely handle (shortcut, dynamicplacement, multi-child, …) are finished by hand in later PRs.API mapping
The new
Tooltip.Triggerdefaults to a<button>and supports non-button anchors via therenderprop (base-ui takes over event/ref wiring on the rendered element — no double wrapping).Codemod
npx jscodeshift -t tools/codemods/tooltip-components-to-ui.js \ --extensions=js,jsx,ts,tsx --parser=tsx \ packages/<scope>Tooltipspecifier (named or aliased, e.g.Tooltip as WCTooltip) from@wordpress/componentstoimport { Tooltip } from '@wordpress/ui'.<Tooltip>…</Tooltip>JSX usage, emits<Tooltip.Root [key]><Tooltip.Trigger render={ child } /><Tooltip.Popup [positioner] [className]>{ text }</Tooltip.Popup></Tooltip.Root>.shortcut,delay,hideOnClick,position, spread attributes, dynamic placements, or any unknown attribute.The codemod is a one-shot artifact; it can be removed once the 5-PR series merges.
Notes
Tooltip.Provideris emitted. Group coordination (instant-open after the first tooltip in a group) is handled by a single shell-level<Tooltip.Provider>introduced in PRs 2 and 5.aria-describedbyis no longer injected into triggers — the new tooltips are visual-only. Reviewers may want to flag specific sites forPopover+openOnHoverfollow-up.Testing Instructions
[data-wp-compat-overlay-slot]so they stack above components overlays (cross-library check from [ui] Tooltip: Default portal container to the wp compat overlay slot #78095).npm run test:unit -- packages/block-editor packages/block-directory— Jest unit tests should pass.Testing Instructions for Keyboard
Tabs.Tab,Composite.Item, etc.) and confirm the tooltip opens on focus and closes on blur /Esc.<span aria-hidden>trigger inlist-view/block-select-buttonis not keyboard-reachable on purpose; flagged above for a11y follow-up.Screenshots or screencast
No visual change is intended versus the legacy
Tooltip(same placement, same text, same hover/focus behaviour). N/A.Use of AI Tools
This PR was authored with assistance from Cursor (Claude). All changes were reviewed by a human before being committed; the codemod and migrated files were also exercised locally (Jest, lint, Prettier) before being pushed.