fix(FilterableMultiselect): extend focus around entire input #7615
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
|
Deploy preview for carbon-elements ready! Built with commit 3a0e0f7 |
|
Deploy preview for carbon-components-react ready! Built with commit 3a0e0f7 https://deploy-preview-7615--carbon-components-react.netlify.app |
emyarod
reviewed
Jan 21, 2021
There was a problem hiding this comment.
this will likely conflict with #7518 but I am already exploring a way to achieve this style and still avoid dynamic padding calculation, haven't committed it in this PR yet but I'll add it after I resolve the filter tag styling in that PR first
|
@emyarod oh nice! I'll close this one out since it seems like you've got a fix in the works 🎉 👍 |
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.
Closes #7535
Changelog
New
clear selectionbuttonpadding-leftbased on the number of items shown. Currently handles single-digit and double-digit values. If needed, we can add more logic to handle triple-digit numbers and beyond pretty easily (Logic)Testing / Reviewing
Navigate to Filterable Multiselect and select a few items. You should see the padding adjust when an item is selected and the focus should extend around the entire Multiselect. Add more items to the story to test double-digit numbers