mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-08 14:46:34 +02:00
Tooltip/popover - change the default value for fallbackPlacements
(#32437)
The default Popper `fallbackPlacements` value is `[oppositePlacement]`. - 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. Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
@@ -51,7 +51,7 @@ const DefaultType = {
|
||||
selector: '(string|boolean)',
|
||||
placement: '(string|function)',
|
||||
container: '(string|element|boolean)',
|
||||
fallbackPlacements: '(null|array)',
|
||||
fallbackPlacements: 'array',
|
||||
boundary: '(string|element)',
|
||||
customClass: '(string|function)',
|
||||
sanitize: 'boolean',
|
||||
@@ -81,7 +81,7 @@ const Default = {
|
||||
selector: false,
|
||||
placement: 'top',
|
||||
container: false,
|
||||
fallbackPlacements: null,
|
||||
fallbackPlacements: ['top', 'right', 'bottom', 'left'],
|
||||
boundary: 'clippingParents',
|
||||
customClass: '',
|
||||
sanitize: true,
|
||||
@@ -466,22 +466,16 @@ class Tooltip extends BaseComponent {
|
||||
// Private
|
||||
|
||||
_getPopperConfig(attachment) {
|
||||
const flipModifier = {
|
||||
name: 'flip',
|
||||
options: {
|
||||
altBoundary: true,
|
||||
fallbackPlacements: ['top', 'right', 'bottom', 'left']
|
||||
}
|
||||
}
|
||||
|
||||
if (this.config.fallbackPlacements) {
|
||||
flipModifier.options.fallbackPlacements = this.config.fallbackPlacements
|
||||
}
|
||||
|
||||
const defaultBsConfig = {
|
||||
placement: attachment,
|
||||
modifiers: [
|
||||
flipModifier,
|
||||
{
|
||||
name: 'flip',
|
||||
options: {
|
||||
altBoundary: true,
|
||||
fallbackPlacements: this.config.fallbackPlacements
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'preventOverflow',
|
||||
options: {
|
||||
|
Reference in New Issue
Block a user