ComboboxControl: add new opt-in prop #45796
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
brookewp
added
[Type] Enhancement
|
|
|
Size Change: +37 B (0%) Total Size: 1.31 MB
ℹ️ View Unchanged
|
49 tasks
|
Hey @brookewp 👋 Thank you for working on this! I just had a quick question — the PR description mentions “...replacing margin overrides with new opt-in prop…”, but looking at the code changes, I don't see any CSS margin override being removed — is that on purpose? |
Good question @ciampo! I had copied the title/description from my other related PR for consistency, but it isn't happening here, so it's unclear. I'll update the title now! |
brookewp
changed the title
brookewp
force-pushed
the
update/comboboxcontrol-margin
branch
from
92985c2 to
2e4d99c
Compare
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?
Adding new opt-in prop
__nextHasNoMarginBottomto usages ofComboboxControlin the Gutenberg codebase.Why?
Part of this project: #38730
The tl;dr is
BaseControlhas amargin-bottomwhich makes it difficult to reuse and results in inconsistent use.How?
By adding the prop
__nextHasNoMarginBottom.Additional Notes
There is a bottom margin for
UserControlin trunk. However, this is causing inconsistent spacing, so I believe this is a positive change. Here you can see how the title has no margin above and touches the padding. Whereas, at the bottom it has extra space (other sections aren't like this). See the orange outline below the text and above the padding to see the inconsistent margin that is removed in this PR:Testing Instructions
To test this, you'll need to look for the following
ComboboxComponent(dropdowns) and ensure that the margin is the same as before (margin-bottomof 0) for thedivwith classcomponents-base-control__field. Screenshots below are how it looks in core right now.Before going through the steps, ensure you have at least two published pages and then you can complete all the steps from a single page editor.
For
UserControlFor
PostAuthorEdit(block library)For this to work, you need at least 25 editors on the site (same with the component below). Or you can edit line 26
const minimumUsersForCombobox = 25;and change the value 25 to 1 inpackages/block-library/src/post-author/edit.js. Then:For
PostAuthorComboBox(editor)For this to work, you need at least 25 editors on the site. Or you can edit line 14
const minimumUsersForCombobox = 25;and change the value 25 to 1 inpackages/editor/src/components/post-author/index.js. Then:For
PageAtttributesParent