CustomSelectControl: switch to ariakit-based implementation #63258
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
tyxla
force-pushed
the
remove/custom-select-control-v1-legacy
branch
from
9d6ae25
to
d9a99ee
Compare
|
Size Change: -7.75 kB (-0.44%) Total Size: 1.75 MB
ℹ️ View Unchanged
|
85 tasks
ciampo
added
[Package] Components
ciampo
changed the title
CustomSelectControl: switch to ariakit-based implementation
ciampo
requested review from
ajitbohra,
tellthemachines and
ellatrix
as code owners
|
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
changed the title
CustomSelectControl: switch to ariakit-based implementation
ciampo
added
the
Needs Dev Note
mirka
approved these changes
Jul 10, 2024
ciampo
changed the title
ciampo
force-pushed
the
remove/custom-select-control-v1-legacy
branch
from
1ae412e
to
639bec6
Compare
|
Thank you for the feedback. I'll have a final round of smoking tests and merge tomorrow |
carstingaxion
pushed a commit
to carstingaxion/gutenberg
that referenced
this pull request
Jul 18, 2024
…s#63258) * Remove V1-related code * Move files over from v2 folder * Update Storybook files * Fix imports & exports * Remove mentions of downshift * Remove downshift dependency * Import directly from components package instead of private APIs * Move V2 implementation out of /default-component subfolder * Add back legacy classnames * Move V1 types to V1 folder * CHANGELOG * Remove "Legacy" from V1 types * Update and align README and JSDocs * apply feedback * apply feedback * Updated CHANGELOG --------- Co-authored-by: ciampo <mciampini@git.wordpress.org> Co-authored-by: tyxla <tyxla@git.wordpress.org> Co-authored-by: mirka <0mirka00@git.wordpress.org>
There was a problem hiding this comment.
Hi @ciampo and @mirka, I just noticed that the font appearance control is sitting at a different position vertically than all the other controls in the Typography panel now. Could that have been caused by this PR? It seems a possible candidate, but I haven't done a detailed look into other recent changes to this component. Here's a quick screenshot of how it's looking in trunk:
Note that the Appearance label sits lower than Line Height along with its select box.
I've opened an issue over in #63886.
2 tasks
This was referenced Jul 25, 2024
This was referenced Aug 6, 2024
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?
Part of #55023
Replace the legacy,
downshift-based implementation ofCustomSelectControl, with the newariakit-based implementation. The public APIs of the component shouldn't be affected.Why?
For a few reasons:
downshiftas a dependency of the projectSee #55023 for more info.
How?
Note
For now, the new
ariakitV1 imports base components and styles from the V2. As we further the development of the V2 version, we may have to "duplicate" this code so that the V1 implementation becomes standalone, and the V2 can diverge without worrying about repercussions on V1.Testing Instructions
I recommend reviewing this PR commit-by-commit to minimize the noise
downshiftorCustomSelectControlV2outside of the source folders✍️ Dev note
The
CustomSelectControlcomponent has been completely rewritten usingariakit. Notably, this refactor enables the removal of thedownshiftlibrary as a dependency of the Gutenberg repository, causing a~7.75 kBdecrease for the@wordpress/componentspackage bundle size.While there are no breaking changes to the component public APIs, the refactor also allowed us to make a few improvements to the component:
comboboxrole instead ofbutton, in line with the WAI-ARIA specs;__experimentalShowSelectedHintandoptions[]. __experimentalHintprops have been unprefixed and stabilized;max-heighthasn't changed, the popover's height adapts to the available space, without causing extra overflow on the page;