diff options
Diffstat (limited to 'vendor/twbs/bootstrap/js/src/tooltip.js')
| -rw-r--r-- | vendor/twbs/bootstrap/js/src/tooltip.js | 179 |
1 files changed, 83 insertions, 96 deletions
diff --git a/vendor/twbs/bootstrap/js/src/tooltip.js b/vendor/twbs/bootstrap/js/src/tooltip.js index 81a2dedc6..c431459e1 100644 --- a/vendor/twbs/bootstrap/js/src/tooltip.js +++ b/vendor/twbs/bootstrap/js/src/tooltip.js @@ -1,7 +1,7 @@ /** * -------------------------------------------------------------------------- - * Bootstrap (v4.3.1): tooltip.js - * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * Bootstrap (v4.5.2): tooltip.js + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) * -------------------------------------------------------------------------- */ @@ -20,7 +20,7 @@ import Util from './util' */ const NAME = 'tooltip' -const VERSION = '4.3.1' +const VERSION = '4.5.2' const DATA_KEY = 'bs.tooltip' const EVENT_KEY = `.${DATA_KEY}` const JQUERY_NO_CONFLICT = $.fn[NAME] @@ -43,7 +43,8 @@ const DefaultType = { boundary : '(string|element)', sanitize : 'boolean', sanitizeFn : '(null|function)', - whiteList : 'object' + whiteList : 'object', + popperConfig : '(null|object)' } const AttachmentMap = { @@ -71,13 +72,12 @@ const Default = { boundary : 'scrollParent', sanitize : true, sanitizeFn : null, - whiteList : DefaultWhitelist + whiteList : DefaultWhitelist, + popperConfig : null } -const HoverState = { - SHOW : 'show', - OUT : 'out' -} +const HOVER_STATE_SHOW = 'show' +const HOVER_STATE_OUT = 'out' const Event = { HIDE : `hide${EVENT_KEY}`, @@ -92,24 +92,16 @@ const Event = { MOUSELEAVE : `mouseleave${EVENT_KEY}` } -const ClassName = { - FADE : 'fade', - SHOW : 'show' -} - -const Selector = { - TOOLTIP : '.tooltip', - TOOLTIP_INNER : '.tooltip-inner', - ARROW : '.arrow' -} +const CLASS_NAME_FADE = 'fade' +const CLASS_NAME_SHOW = 'show' -const Trigger = { - HOVER : 'hover', - FOCUS : 'focus', - CLICK : 'click', - MANUAL : 'manual' -} +const SELECTOR_TOOLTIP_INNER = '.tooltip-inner' +const SELECTOR_ARROW = '.arrow' +const TRIGGER_HOVER = 'hover' +const TRIGGER_FOCUS = 'focus' +const TRIGGER_CLICK = 'click' +const TRIGGER_MANUAL = 'manual' /** * ------------------------------------------------------------------------ @@ -119,10 +111,6 @@ const Trigger = { class Tooltip { constructor(element, config) { - /** - * Check for Popper dependency - * Popper - https://popper.js.org - */ if (typeof Popper === 'undefined') { throw new TypeError('Bootstrap\'s tooltips require Popper.js (https://popper.js.org/)') } @@ -211,7 +199,7 @@ class Tooltip { context._leave(null, context) } } else { - if ($(this.getTipElement()).hasClass(ClassName.SHOW)) { + if ($(this.getTipElement()).hasClass(CLASS_NAME_SHOW)) { this._leave(null, this) return } @@ -226,7 +214,7 @@ class Tooltip { $.removeData(this.element, this.constructor.DATA_KEY) $(this.element).off(this.constructor.EVENT_KEY) - $(this.element).closest('.modal').off('hide.bs.modal') + $(this.element).closest('.modal').off('hide.bs.modal', this._hideModalHandler) if (this.tip) { $(this.tip).remove() @@ -236,7 +224,7 @@ class Tooltip { this._timeout = null this._hoverState = null this._activeTrigger = null - if (this._popper !== null) { + if (this._popper) { this._popper.destroy() } @@ -274,7 +262,7 @@ class Tooltip { this.setContent() if (this.config.animation) { - $(tip).addClass(ClassName.FADE) + $(tip).addClass(CLASS_NAME_FADE) } const placement = typeof this.config.placement === 'function' @@ -293,29 +281,9 @@ class Tooltip { $(this.element).trigger(this.constructor.Event.INSERTED) - this._popper = new Popper(this.element, tip, { - placement: attachment, - modifiers: { - offset: this._getOffset(), - flip: { - behavior: this.config.fallbackPlacement - }, - arrow: { - element: Selector.ARROW - }, - preventOverflow: { - boundariesElement: this.config.boundary - } - }, - onCreate: (data) => { - if (data.originalPlacement !== data.placement) { - this._handlePopperPlacementChange(data) - } - }, - onUpdate: (data) => this._handlePopperPlacementChange(data) - }) + this._popper = new Popper(this.element, tip, this._getPopperConfig(attachment)) - $(tip).addClass(ClassName.SHOW) + $(tip).addClass(CLASS_NAME_SHOW) // If this is a touch-enabled device we add extra // empty mouseover listeners to the body's immediate children; @@ -334,12 +302,12 @@ class Tooltip { $(this.element).trigger(this.constructor.Event.SHOWN) - if (prevHoverState === HoverState.OUT) { + if (prevHoverState === HOVER_STATE_OUT) { this._leave(null, this) } } - if ($(this.tip).hasClass(ClassName.FADE)) { + if ($(this.tip).hasClass(CLASS_NAME_FADE)) { const transitionDuration = Util.getTransitionDurationFromElement(this.tip) $(this.tip) @@ -355,7 +323,7 @@ class Tooltip { const tip = this.getTipElement() const hideEvent = $.Event(this.constructor.Event.HIDE) const complete = () => { - if (this._hoverState !== HoverState.SHOW && tip.parentNode) { + if (this._hoverState !== HOVER_STATE_SHOW && tip.parentNode) { tip.parentNode.removeChild(tip) } @@ -377,7 +345,7 @@ class Tooltip { return } - $(tip).removeClass(ClassName.SHOW) + $(tip).removeClass(CLASS_NAME_SHOW) // If this is a touch-enabled device we remove the extra // empty mouseover listeners we added for iOS support @@ -385,11 +353,11 @@ class Tooltip { $(document.body).children().off('mouseover', null, $.noop) } - this._activeTrigger[Trigger.CLICK] = false - this._activeTrigger[Trigger.FOCUS] = false - this._activeTrigger[Trigger.HOVER] = false + this._activeTrigger[TRIGGER_CLICK] = false + this._activeTrigger[TRIGGER_FOCUS] = false + this._activeTrigger[TRIGGER_HOVER] = false - if ($(this.tip).hasClass(ClassName.FADE)) { + if ($(this.tip).hasClass(CLASS_NAME_FADE)) { const transitionDuration = Util.getTransitionDurationFromElement(tip) $(tip) @@ -425,8 +393,8 @@ class Tooltip { setContent() { const tip = this.getTipElement() - this.setElementContent($(tip.querySelectorAll(Selector.TOOLTIP_INNER)), this.getTitle()) - $(tip).removeClass(`${ClassName.FADE} ${ClassName.SHOW}`) + this.setElementContent($(tip.querySelectorAll(SELECTOR_TOOLTIP_INNER)), this.getTitle()) + $(tip).removeClass(`${CLASS_NAME_FADE} ${CLASS_NAME_SHOW}`) } setElementContent($element, content) { @@ -468,6 +436,35 @@ class Tooltip { // Private + _getPopperConfig(attachment) { + const defaultBsConfig = { + placement: attachment, + modifiers: { + offset: this._getOffset(), + flip: { + behavior: this.config.fallbackPlacement + }, + arrow: { + element: SELECTOR_ARROW + }, + preventOverflow: { + boundariesElement: this.config.boundary + } + }, + onCreate: (data) => { + if (data.originalPlacement !== data.placement) { + this._handlePopperPlacementChange(data) + } + }, + onUpdate: (data) => this._handlePopperPlacementChange(data) + } + + return { + ...defaultBsConfig, + ...this.config.popperConfig + } + } + _getOffset() { const offset = {} @@ -513,36 +510,27 @@ class Tooltip { this.config.selector, (event) => this.toggle(event) ) - } else if (trigger !== Trigger.MANUAL) { - const eventIn = trigger === Trigger.HOVER + } else if (trigger !== TRIGGER_MANUAL) { + const eventIn = trigger === TRIGGER_HOVER ? this.constructor.Event.MOUSEENTER : this.constructor.Event.FOCUSIN - const eventOut = trigger === Trigger.HOVER + const eventOut = trigger === TRIGGER_HOVER ? this.constructor.Event.MOUSELEAVE : this.constructor.Event.FOCUSOUT $(this.element) - .on( - eventIn, - this.config.selector, - (event) => this._enter(event) - ) - .on( - eventOut, - this.config.selector, - (event) => this._leave(event) - ) + .on(eventIn, this.config.selector, (event) => this._enter(event)) + .on(eventOut, this.config.selector, (event) => this._leave(event)) } }) - $(this.element).closest('.modal').on( - 'hide.bs.modal', - () => { - if (this.element) { - this.hide() - } + this._hideModalHandler = () => { + if (this.element) { + this.hide() } - ) + } + + $(this.element).closest('.modal').on('hide.bs.modal', this._hideModalHandler) if (this.config.selector) { this.config = { @@ -582,18 +570,18 @@ class Tooltip { if (event) { context._activeTrigger[ - event.type === 'focusin' ? Trigger.FOCUS : Trigger.HOVER + event.type === 'focusin' ? TRIGGER_FOCUS : TRIGGER_HOVER ] = true } - if ($(context.getTipElement()).hasClass(ClassName.SHOW) || context._hoverState === HoverState.SHOW) { - context._hoverState = HoverState.SHOW + if ($(context.getTipElement()).hasClass(CLASS_NAME_SHOW) || context._hoverState === HOVER_STATE_SHOW) { + context._hoverState = HOVER_STATE_SHOW return } clearTimeout(context._timeout) - context._hoverState = HoverState.SHOW + context._hoverState = HOVER_STATE_SHOW if (!context.config.delay || !context.config.delay.show) { context.show() @@ -601,7 +589,7 @@ class Tooltip { } context._timeout = setTimeout(() => { - if (context._hoverState === HoverState.SHOW) { + if (context._hoverState === HOVER_STATE_SHOW) { context.show() } }, context.config.delay.show) @@ -621,7 +609,7 @@ class Tooltip { if (event) { context._activeTrigger[ - event.type === 'focusout' ? Trigger.FOCUS : Trigger.HOVER + event.type === 'focusout' ? TRIGGER_FOCUS : TRIGGER_HOVER ] = false } @@ -631,7 +619,7 @@ class Tooltip { clearTimeout(context._timeout) - context._hoverState = HoverState.OUT + context._hoverState = HOVER_STATE_OUT if (!context.config.delay || !context.config.delay.hide) { context.hide() @@ -639,7 +627,7 @@ class Tooltip { } context._timeout = setTimeout(() => { - if (context._hoverState === HoverState.OUT) { + if (context._hoverState === HOVER_STATE_OUT) { context.hide() } }, context.config.delay.hide) @@ -722,8 +710,7 @@ class Tooltip { } _handlePopperPlacementChange(popperData) { - const popperInstance = popperData.instance - this.tip = popperInstance.popper + this.tip = popperData.instance.popper this._cleanTipClass() this.addAttachmentClass(this._getAttachment(popperData.placement)) } @@ -736,7 +723,7 @@ class Tooltip { return } - $(tip).removeClass(ClassName.FADE) + $(tip).removeClass(CLASS_NAME_FADE) this.config.animation = false this.hide() this.show() |