mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Unbreak lines. (#32304)
This commit is contained in:
parent
f05d64225d
commit
701c6c6e77
9 changed files with 32 additions and 69 deletions
|
@ -397,6 +397,7 @@ class Carousel extends BaseComponent {
|
||||||
_setActiveIndicatorElement(element) {
|
_setActiveIndicatorElement(element) {
|
||||||
if (this._indicatorsElement) {
|
if (this._indicatorsElement) {
|
||||||
const indicators = SelectorEngine.find(SELECTOR_ACTIVE, this._indicatorsElement)
|
const indicators = SelectorEngine.find(SELECTOR_ACTIVE, this._indicatorsElement)
|
||||||
|
|
||||||
for (let i = 0; i < indicators.length; i++) {
|
for (let i = 0; i < indicators.length; i++) {
|
||||||
indicators[i].classList.remove(CLASS_NAME_ACTIVE)
|
indicators[i].classList.remove(CLASS_NAME_ACTIVE)
|
||||||
}
|
}
|
||||||
|
@ -431,8 +432,7 @@ class Carousel extends BaseComponent {
|
||||||
_slide(direction, element) {
|
_slide(direction, element) {
|
||||||
const activeElement = SelectorEngine.findOne(SELECTOR_ACTIVE_ITEM, this._element)
|
const activeElement = SelectorEngine.findOne(SELECTOR_ACTIVE_ITEM, this._element)
|
||||||
const activeElementIndex = this._getItemIndex(activeElement)
|
const activeElementIndex = this._getItemIndex(activeElement)
|
||||||
const nextElement = element || (activeElement &&
|
const nextElement = element || (activeElement && this._getItemByDirection(direction, activeElement))
|
||||||
this._getItemByDirection(direction, activeElement))
|
|
||||||
|
|
||||||
const nextElementIndex = this._getItemIndex(nextElement)
|
const nextElementIndex = this._getItemIndex(nextElement)
|
||||||
const isCycling = Boolean(this._interval)
|
const isCycling = Boolean(this._interval)
|
||||||
|
|
|
@ -124,8 +124,7 @@ class Collapse extends BaseComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
show() {
|
show() {
|
||||||
if (this._isTransitioning ||
|
if (this._isTransitioning || this._element.classList.contains(CLASS_NAME_SHOW)) {
|
||||||
this._element.classList.contains(CLASS_NAME_SHOW)) {
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -212,8 +211,7 @@ class Collapse extends BaseComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
hide() {
|
hide() {
|
||||||
if (this._isTransitioning ||
|
if (this._isTransitioning || !this._element.classList.contains(CLASS_NAME_SHOW)) {
|
||||||
!this._element.classList.contains(CLASS_NAME_SHOW)) {
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -367,8 +367,7 @@ class Dropdown extends BaseComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
static clearMenus(event) {
|
static clearMenus(event) {
|
||||||
if (event && (event.button === RIGHT_MOUSE_BUTTON ||
|
if (event && (event.button === RIGHT_MOUSE_BUTTON || (event.type === 'keyup' && event.key !== TAB_KEY))) {
|
||||||
(event.type === 'keyup' && event.key !== TAB_KEY))) {
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -475,11 +474,13 @@ class Dropdown extends BaseComponent {
|
||||||
|
|
||||||
let index = items.indexOf(event.target)
|
let index = items.indexOf(event.target)
|
||||||
|
|
||||||
if (event.key === ARROW_UP_KEY && index > 0) { // Up
|
// Up
|
||||||
|
if (event.key === ARROW_UP_KEY && index > 0) {
|
||||||
index--
|
index--
|
||||||
}
|
}
|
||||||
|
|
||||||
if (event.key === ARROW_DOWN_KEY && index < items.length - 1) { // Down
|
// Down
|
||||||
|
if (event.key === ARROW_DOWN_KEY && index < items.length - 1) {
|
||||||
index++
|
index++
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -136,11 +136,7 @@ class Modal extends BaseComponent {
|
||||||
this._setEscapeEvent()
|
this._setEscapeEvent()
|
||||||
this._setResizeEvent()
|
this._setResizeEvent()
|
||||||
|
|
||||||
EventHandler.on(this._element,
|
EventHandler.on(this._element, EVENT_CLICK_DISMISS, SELECTOR_DATA_DISMISS, event => this.hide(event))
|
||||||
EVENT_CLICK_DISMISS,
|
|
||||||
SELECTOR_DATA_DISMISS,
|
|
||||||
event => this.hide(event)
|
|
||||||
)
|
|
||||||
|
|
||||||
EventHandler.on(this._dialog, EVENT_MOUSEDOWN_DISMISS, () => {
|
EventHandler.on(this._dialog, EVENT_MOUSEDOWN_DISMISS, () => {
|
||||||
EventHandler.one(this._element, EVENT_MOUSEUP_DISMISS, event => {
|
EventHandler.one(this._element, EVENT_MOUSEUP_DISMISS, event => {
|
||||||
|
@ -237,8 +233,7 @@ class Modal extends BaseComponent {
|
||||||
const transition = this._element.classList.contains(CLASS_NAME_FADE)
|
const transition = this._element.classList.contains(CLASS_NAME_FADE)
|
||||||
const modalBody = SelectorEngine.findOne(SELECTOR_MODAL_BODY, this._dialog)
|
const modalBody = SelectorEngine.findOne(SELECTOR_MODAL_BODY, this._dialog)
|
||||||
|
|
||||||
if (!this._element.parentNode ||
|
if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
|
||||||
this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
|
|
||||||
// Don't move modal's DOM position
|
// Don't move modal's DOM position
|
||||||
document.body.appendChild(this._element)
|
document.body.appendChild(this._element)
|
||||||
}
|
}
|
||||||
|
|
|
@ -30,7 +30,8 @@ const Default = {
|
||||||
template: '<div class="popover" role="tooltip">' +
|
template: '<div class="popover" role="tooltip">' +
|
||||||
'<div class="popover-arrow"></div>' +
|
'<div class="popover-arrow"></div>' +
|
||||||
'<h3 class="popover-header"></h3>' +
|
'<h3 class="popover-header"></h3>' +
|
||||||
'<div class="popover-body"></div></div>'
|
'<div class="popover-body"></div>' +
|
||||||
|
'</div>'
|
||||||
}
|
}
|
||||||
|
|
||||||
const DefaultType = {
|
const DefaultType = {
|
||||||
|
@ -118,8 +119,7 @@ class Popover extends Tooltip {
|
||||||
}
|
}
|
||||||
|
|
||||||
_getContent() {
|
_getContent() {
|
||||||
return this._element.getAttribute('data-bs-content') ||
|
return this._element.getAttribute('data-bs-content') || this.config.content
|
||||||
this.config.content
|
|
||||||
}
|
}
|
||||||
|
|
||||||
_cleanTipClass() {
|
_cleanTipClass() {
|
||||||
|
|
|
@ -196,9 +196,7 @@ class ScrollSpy extends BaseComponent {
|
||||||
_process() {
|
_process() {
|
||||||
const scrollTop = this._getScrollTop() + this._config.offset
|
const scrollTop = this._getScrollTop() + this._config.offset
|
||||||
const scrollHeight = this._getScrollHeight()
|
const scrollHeight = this._getScrollHeight()
|
||||||
const maxScroll = this._config.offset +
|
const maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight()
|
||||||
scrollHeight -
|
|
||||||
this._getOffsetHeight()
|
|
||||||
|
|
||||||
if (this._scrollHeight !== scrollHeight) {
|
if (this._scrollHeight !== scrollHeight) {
|
||||||
this.refresh()
|
this.refresh()
|
||||||
|
@ -223,8 +221,7 @@ class ScrollSpy extends BaseComponent {
|
||||||
for (let i = this._offsets.length; i--;) {
|
for (let i = this._offsets.length; i--;) {
|
||||||
const isActiveTarget = this._activeTarget !== this._targets[i] &&
|
const isActiveTarget = this._activeTarget !== this._targets[i] &&
|
||||||
scrollTop >= this._offsets[i] &&
|
scrollTop >= this._offsets[i] &&
|
||||||
(typeof this._offsets[i + 1] === 'undefined' ||
|
(typeof this._offsets[i + 1] === 'undefined' || scrollTop < this._offsets[i + 1])
|
||||||
scrollTop < this._offsets[i + 1])
|
|
||||||
|
|
||||||
if (isActiveTarget) {
|
if (isActiveTarget) {
|
||||||
this._activate(this._targets[i])
|
this._activate(this._targets[i])
|
||||||
|
|
|
@ -95,15 +95,11 @@ class Tab extends BaseComponent {
|
||||||
relatedTarget: previous
|
relatedTarget: previous
|
||||||
})
|
})
|
||||||
|
|
||||||
if (showEvent.defaultPrevented ||
|
if (showEvent.defaultPrevented || (hideEvent !== null && hideEvent.defaultPrevented)) {
|
||||||
(hideEvent !== null && hideEvent.defaultPrevented)) {
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
this._activate(
|
this._activate(this._element, listElement)
|
||||||
this._element,
|
|
||||||
listElement
|
|
||||||
)
|
|
||||||
|
|
||||||
const complete = () => {
|
const complete = () => {
|
||||||
EventHandler.trigger(previous, EVENT_HIDDEN, {
|
EventHandler.trigger(previous, EVENT_HIDDEN, {
|
||||||
|
@ -129,14 +125,9 @@ class Tab extends BaseComponent {
|
||||||
SelectorEngine.children(container, SELECTOR_ACTIVE)
|
SelectorEngine.children(container, SELECTOR_ACTIVE)
|
||||||
|
|
||||||
const active = activeElements[0]
|
const active = activeElements[0]
|
||||||
const isTransitioning = callback &&
|
const isTransitioning = callback && (active && active.classList.contains(CLASS_NAME_FADE))
|
||||||
(active && active.classList.contains(CLASS_NAME_FADE))
|
|
||||||
|
|
||||||
const complete = () => this._transitionComplete(
|
const complete = () => this._transitionComplete(element, active, callback)
|
||||||
element,
|
|
||||||
active,
|
|
||||||
callback
|
|
||||||
)
|
|
||||||
|
|
||||||
if (active && isTransitioning) {
|
if (active && isTransitioning) {
|
||||||
const transitionDuration = getTransitionDurationFromElement(active)
|
const transitionDuration = getTransitionDurationFromElement(active)
|
||||||
|
|
|
@ -73,7 +73,8 @@ const Default = {
|
||||||
animation: true,
|
animation: true,
|
||||||
template: '<div class="tooltip" role="tooltip">' +
|
template: '<div class="tooltip" role="tooltip">' +
|
||||||
'<div class="tooltip-arrow"></div>' +
|
'<div class="tooltip-arrow"></div>' +
|
||||||
'<div class="tooltip-inner"></div></div>',
|
'<div class="tooltip-inner"></div>' +
|
||||||
|
'</div>',
|
||||||
trigger: 'hover focus',
|
trigger: 'hover focus',
|
||||||
title: '',
|
title: '',
|
||||||
delay: 0,
|
delay: 0,
|
||||||
|
@ -196,10 +197,7 @@ class Tooltip extends BaseComponent {
|
||||||
let context = Data.getData(event.delegateTarget, dataKey)
|
let context = Data.getData(event.delegateTarget, dataKey)
|
||||||
|
|
||||||
if (!context) {
|
if (!context) {
|
||||||
context = new this.constructor(
|
context = new this.constructor(event.delegateTarget, this._getDelegateConfig())
|
||||||
event.delegateTarget,
|
|
||||||
this._getDelegateConfig()
|
|
||||||
)
|
|
||||||
Data.setData(event.delegateTarget, dataKey, context)
|
Data.setData(event.delegateTarget, dataKey, context)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -530,10 +528,7 @@ class Tooltip extends BaseComponent {
|
||||||
|
|
||||||
triggers.forEach(trigger => {
|
triggers.forEach(trigger => {
|
||||||
if (trigger === 'click') {
|
if (trigger === 'click') {
|
||||||
EventHandler.on(this._element,
|
EventHandler.on(this._element, this.constructor.Event.CLICK, this.config.selector, event => this.toggle(event)
|
||||||
this.constructor.Event.CLICK,
|
|
||||||
this.config.selector,
|
|
||||||
event => this.toggle(event)
|
|
||||||
)
|
)
|
||||||
} else if (trigger !== TRIGGER_MANUAL) {
|
} else if (trigger !== TRIGGER_MANUAL) {
|
||||||
const eventIn = trigger === TRIGGER_HOVER ?
|
const eventIn = trigger === TRIGGER_HOVER ?
|
||||||
|
@ -543,16 +538,8 @@ class Tooltip extends BaseComponent {
|
||||||
this.constructor.Event.MOUSELEAVE :
|
this.constructor.Event.MOUSELEAVE :
|
||||||
this.constructor.Event.FOCUSOUT
|
this.constructor.Event.FOCUSOUT
|
||||||
|
|
||||||
EventHandler.on(this._element,
|
EventHandler.on(this._element, eventIn, this.config.selector, event => this._enter(event))
|
||||||
eventIn,
|
EventHandler.on(this._element, eventOut, this.config.selector, event => this._leave(event))
|
||||||
this.config.selector,
|
|
||||||
event => this._enter(event)
|
|
||||||
)
|
|
||||||
EventHandler.on(this._element,
|
|
||||||
eventOut,
|
|
||||||
this.config.selector,
|
|
||||||
event => this._leave(event)
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -562,10 +549,7 @@ class Tooltip extends BaseComponent {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
EventHandler.on(this._element.closest(`.${CLASS_NAME_MODAL}`),
|
EventHandler.on(this._element.closest(`.${CLASS_NAME_MODAL}`), 'hide.bs.modal', this._hideModalHandler)
|
||||||
'hide.bs.modal',
|
|
||||||
this._hideModalHandler
|
|
||||||
)
|
|
||||||
|
|
||||||
if (this.config.selector) {
|
if (this.config.selector) {
|
||||||
this.config = {
|
this.config = {
|
||||||
|
@ -610,8 +594,7 @@ class Tooltip extends BaseComponent {
|
||||||
] = true
|
] = true
|
||||||
}
|
}
|
||||||
|
|
||||||
if (context.getTipElement().classList.contains(CLASS_NAME_SHOW) ||
|
if (context.getTipElement().classList.contains(CLASS_NAME_SHOW) || context._hoverState === HOVER_STATE_SHOW) {
|
||||||
context._hoverState === HOVER_STATE_SHOW) {
|
|
||||||
context._hoverState = HOVER_STATE_SHOW
|
context._hoverState = HOVER_STATE_SHOW
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
|
@ -66,10 +66,7 @@ const getTransitionDurationFromElement = element => {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Get transition-duration of the element
|
// Get transition-duration of the element
|
||||||
let {
|
let { transitionDuration, transitionDelay } = window.getComputedStyle(element)
|
||||||
transitionDuration,
|
|
||||||
transitionDelay
|
|
||||||
} = window.getComputedStyle(element)
|
|
||||||
|
|
||||||
const floatTransitionDuration = Number.parseFloat(transitionDuration)
|
const floatTransitionDuration = Number.parseFloat(transitionDuration)
|
||||||
const floatTransitionDelay = Number.parseFloat(transitionDelay)
|
const floatTransitionDelay = Number.parseFloat(transitionDelay)
|
||||||
|
@ -96,6 +93,7 @@ const emulateTransitionEnd = (element, duration) => {
|
||||||
let called = false
|
let called = false
|
||||||
const durationPadding = 5
|
const durationPadding = 5
|
||||||
const emulatedDuration = duration + durationPadding
|
const emulatedDuration = duration + durationPadding
|
||||||
|
|
||||||
function listener() {
|
function listener() {
|
||||||
called = true
|
called = true
|
||||||
element.removeEventListener(TRANSITION_END, listener)
|
element.removeEventListener(TRANSITION_END, listener)
|
||||||
|
|
Loading…
Reference in a new issue