Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Components: fix ToggleGroupControlBackdrop not updating size when isAdaptiveWidth prop changes #34595

Merged
merged 4 commits into from
Sep 7, 2021

Conversation

ciampo
Copy link
Contributor

@ciampo ciampo commented Sep 6, 2021

Description

This PR fixes an issue occurring in ToggleGroupControl — the backdrop element, in charge of highlighting the selected element, doesn't currently update its size/position when the isAdaptiveWidth prop changes.

To fix this issue, this PR simply forwards the isAdaptiveProp from the parent ToggleGroupControl component to the ToggleGroupControlBackdrop, and it uses it as an additional dependency for the useEffect hook that recalculates the backdrop position/size.

Fixes #34587

How has this been tested?

Screenshots

Before:

togglegroup-befire.mp4

After:

togglegroup-after.mp4

Types of changes

Bug fix

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • I've tested my changes with keyboard and screen readers.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • N/A I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).

@ciampo ciampo added [Type] Bug An existing feature does not function as intended [Package] Components /packages/components [Feature] Component System WordPress component system labels Sep 6, 2021
@ciampo ciampo self-assigned this Sep 6, 2021
Copy link
Contributor

@ntsekouras ntsekouras left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks Marco! This works well!

Failures will be fixed after this one: #34596

@ciampo ciampo force-pushed the fix/components-toggle-group-selected-bg-update branch from abf838d to ac243fd Compare September 7, 2021 07:58
@ciampo ciampo merged commit 491eb8a into trunk Sep 7, 2021
@ciampo ciampo deleted the fix/components-toggle-group-selected-bg-update branch September 7, 2021 09:36
@github-actions github-actions bot added this to the Gutenberg 11.5 milestone Sep 7, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Component System WordPress component system [Package] Components /packages/components [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

ToggleGroupControl: backdrop doesn't update when changing isAdaptiveWidth prop
2 participants