Skip to content

Tooltip/popover - change the default value for fallbackPlacements#32437

Merged
XhmikosR merged 4 commits intomainfrom
rohit/main/fallbackPlacements-option
Dec 14, 2020
Merged

Tooltip/popover - change the default value for fallbackPlacements#32437
XhmikosR merged 4 commits intomainfrom
rohit/main/fallbackPlacements-option

Conversation

@rohit2sharma95
Copy link
Copy Markdown
Contributor

@rohit2sharma95 rohit2sharma95 commented Dec 11, 2020

The default value for fallbackPlacements has been changed already in #32405 and here are the remaining things to do.

What this PR does:

  • Remove null from fallbackPlacements types
  • Change the default value for fallbackPlacements
  • Update docs for the tooltip/popover

Why to remove null from fallbackPlacements types and keep array:

  • The default value was previously (in v4) 'flip' that can be achieved by passing the single value in the array, like — [oppositePlacement]. Keeping null also sets the fallbackPlacements to [oppositePlacement] (Default value in Popper)
  • It's better to have clockwise (['top', 'right', 'bottom', 'left']) fallback options so that tooltip/popover can be placed to another side even if the opposite placement doesn't fit.

BTW #32384 is caused because the default value for fallbackPlacements is [oppositePlacement] in Popper and if you check the issue on a bit larger screen, it is not reproduced.

As per Popper's documentation:

If the fallback placement doesn't fit, it reverts back to the original placement.


Not enough space on right (That's why did not flip) Enough space on right (Flipped) After setting clockwise fallback placements in #32405

All SS are from v5.0.0-beta1

This PR probably completes the third todo of #32354: Update docs after #32405

Preview: https://deploy-preview-32437--twbs-bootstrap.netlify.app/docs/5.0/components/popovers/#example

@rohit2sharma95 rohit2sharma95 requested a review from a team as a code owner December 11, 2020 20:30
Comment thread site/content/docs/5.0/components/popovers.md Outdated
@XhmikosR XhmikosR requested review from a team and patrickhlauke December 11, 2020 20:35
Comment thread site/content/docs/5.0/components/popovers.md Outdated
Comment thread site/content/docs/5.0/components/tooltips.md Outdated
The default value for fallbackPlacements is [oppositePlacement] in
Popper (That does not flip the element if there is not enough space for
placing)
@rohit2sharma95 rohit2sharma95 force-pushed the rohit/main/fallbackPlacements-option branch from 7296378 to d08aec3 Compare December 14, 2020 12:27
@XhmikosR XhmikosR changed the title Tooltip/popover — change the default value for fallbackPlacements Tooltip/popover - change the default value for fallbackPlacements Dec 14, 2020
@XhmikosR
Copy link
Copy Markdown
Member

Should we mention this in migration notes @rohit2sharma95 ?

@rohit2sharma95
Copy link
Copy Markdown
Contributor Author

Mentioning it would be better because now the default fallback placement has been changed.

@rohit2sharma95 rohit2sharma95 force-pushed the rohit/main/fallbackPlacements-option branch from 620f982 to 87b0286 Compare December 14, 2020 13:05
@XhmikosR XhmikosR mentioned this pull request Dec 14, 2020
4 tasks
@XhmikosR XhmikosR merged commit 042a4a2 into main Dec 14, 2020
@XhmikosR XhmikosR deleted the rohit/main/fallbackPlacements-option branch December 14, 2020 18:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants