mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-08 22:56:46 +02:00
Code Issues Releases Wiki Activity

Popover/Tooltip: streamline config property to start with underscore (#33381)

Browse Source
This commit is contained in:
GeoSot
2021-05-12 12:15:59 +03:00
committed by GitHub
parent 15d0105393
commit 9a9e22475c
3 changed files with 41 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
js/src/popover.js
View File

@@ -112,7 +112,7 @@ class Popover extends Tooltip {
} }
_getContent() { _getContent() {
return this._element.getAttribute('data-bs-content') || this.config.content return this._element.getAttribute('data-bs-content') || this._config.content
} }
_cleanTipClass() { _cleanTipClass() {

74
js/src/tooltip.js
View File

@@ -139,7 +139,7 @@ class Tooltip extends BaseComponent {
this._popper = null this._popper = null
// Protected // Protected
this.config = this._getConfig(config) this._config = this._getConfig(config)
this.tip = null this.tip = null
this._setListeners() this._setListeners()
@@ -245,13 +245,13 @@ class Tooltip extends BaseComponent {
this.setContent() this.setContent()
if (this.config.animation) { if (this._config.animation) {
tip.classList.add(CLASS_NAME_FADE) tip.classList.add(CLASS_NAME_FADE)
} }
const placement = typeof this.config.placement === 'function' ? const placement = typeof this._config.placement === 'function' ?
this.config.placement.call(this, tip, this._element) : this._config.placement.call(this, tip, this._element) :
this.config.placement this._config.placement
const attachment = this._getAttachment(placement) const attachment = this._getAttachment(placement)
this._addAttachmentClass(attachment) this._addAttachmentClass(attachment)
@@ -272,7 +272,7 @@ class Tooltip extends BaseComponent {
tip.classList.add(CLASS_NAME_SHOW) tip.classList.add(CLASS_NAME_SHOW)
const customClass = typeof this.config.customClass === 'function' ? this.config.customClass() : this.config.customClass const customClass = typeof this._config.customClass === 'function' ? this._config.customClass() : this._config.customClass
if (customClass) { if (customClass) {
tip.classList.add(...customClass.split(' ')) tip.classList.add(...customClass.split(' '))
} }
@@ -368,7 +368,7 @@ class Tooltip extends BaseComponent {
} }
const element = document.createElement('div') const element = document.createElement('div')
element.innerHTML = this.config.template element.innerHTML = this._config.template
this.tip = element.children[0] this.tip = element.children[0]
return this.tip return this.tip
@@ -391,7 +391,7 @@ class Tooltip extends BaseComponent {
} }
// content is a DOM node or a jQuery // content is a DOM node or a jQuery
if (this.config.html) { if (this._config.html) {
if (content.parentNode !== element) { if (content.parentNode !== element) {
element.innerHTML = '' element.innerHTML = ''
element.appendChild(content) element.appendChild(content)
@@ -403,9 +403,9 @@ class Tooltip extends BaseComponent {
return return
} }
if (this.config.html) { if (this._config.html) {
if (this.config.sanitize) { if (this._config.sanitize) {
content = sanitizeHtml(content, this.config.allowList, this.config.sanitizeFn) content = sanitizeHtml(content, this._config.allowList, this._config.sanitizeFn)
} }
element.innerHTML = content element.innerHTML = content
@@ -418,9 +418,9 @@ class Tooltip extends BaseComponent {
let title = this._element.getAttribute('data-bs-original-title') let title = this._element.getAttribute('data-bs-original-title')
if (!title) { if (!title) {
title = typeof this.config.title === 'function' ? title = typeof this._config.title === 'function' ?
this.config.title.call(this._element) : this._config.title.call(this._element) :
this.config.title this._config.title
} }
return title return title
@@ -453,7 +453,7 @@ class Tooltip extends BaseComponent {
} }
_getOffset() { _getOffset() {
const { offset } = this.config const { offset } = this._config
if (typeof offset === 'string') { if (typeof offset === 'string') {
return offset.split(',').map(val => Number.parseInt(val, 10)) return offset.split(',').map(val => Number.parseInt(val, 10))
@@ -473,7 +473,7 @@ class Tooltip extends BaseComponent {
{ {
name: 'flip', name: 'flip',
options: { options: {
fallbackPlacements: this.config.fallbackPlacements fallbackPlacements: this._config.fallbackPlacements
} }
}, },
{ {
@@ -485,7 +485,7 @@ class Tooltip extends BaseComponent {
{ {
name: 'preventOverflow', name: 'preventOverflow',
options: { options: {
boundary: this.config.boundary boundary: this._config.boundary
} }
}, },
{ {
@@ -510,7 +510,7 @@ class Tooltip extends BaseComponent {
return { return {
...defaultBsPopperConfig, ...defaultBsPopperConfig,
...(typeof this.config.popperConfig === 'function' ? this.config.popperConfig(defaultBsPopperConfig) : this.config.popperConfig) ...(typeof this._config.popperConfig === 'function' ? this._config.popperConfig(defaultBsPopperConfig) : this._config.popperConfig)
} }
} }
@@ -519,15 +519,15 @@ class Tooltip extends BaseComponent {
} }
_getContainer() { _getContainer() {
if (this.config.container === false) { if (this._config.container === false) {
return document.body return document.body
} }
if (isElement(this.config.container)) { if (isElement(this._config.container)) {
return this.config.container return this._config.container
} }
return SelectorEngine.findOne(this.config.container) return SelectorEngine.findOne(this._config.container)
} }
_getAttachment(placement) { _getAttachment(placement) {
@@ -535,11 +535,11 @@ class Tooltip extends BaseComponent {
} }
_setListeners() { _setListeners() {
const triggers = this.config.trigger.split(' ') const triggers = this._config.trigger.split(' ')
triggers.forEach(trigger => { triggers.forEach(trigger => {
if (trigger === 'click') { if (trigger === 'click') {
EventHandler.on(this._element, this.constructor.Event.CLICK, this.config.selector, event => this.toggle(event)) EventHandler.on(this._element, 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 ?
this.constructor.Event.MOUSEENTER : this.constructor.Event.MOUSEENTER :
@@ -548,8 +548,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, eventIn, this.config.selector, event => this._enter(event)) EventHandler.on(this._element, eventIn, this._config.selector, event => this._enter(event))
EventHandler.on(this._element, eventOut, this.config.selector, event => this._leave(event)) EventHandler.on(this._element, eventOut, this._config.selector, event => this._leave(event))
} }
}) })
@@ -561,9 +561,9 @@ class Tooltip extends BaseComponent {
EventHandler.on(this._element.closest(`.${CLASS_NAME_MODAL}`), 'hide.bs.modal', this._hideModalHandler) EventHandler.on(this._element.closest(`.${CLASS_NAME_MODAL}`), 'hide.bs.modal', this._hideModalHandler)
if (this.config.selector) { if (this._config.selector) {
this.config = { this._config = {
...this.config, ...this._config,
trigger: 'manual', trigger: 'manual',
selector: '' selector: ''
} }
@@ -604,7 +604,7 @@ class Tooltip extends BaseComponent {
context._hoverState = HOVER_STATE_SHOW context._hoverState = HOVER_STATE_SHOW
if (!context.config.delay || !context.config.delay.show) { if (!context._config.delay || !context._config.delay.show) {
context.show() context.show()
return return
} }
@@ -613,7 +613,7 @@ class Tooltip extends BaseComponent {
if (context._hoverState === HOVER_STATE_SHOW) { if (context._hoverState === HOVER_STATE_SHOW) {
context.show() context.show()
} }
}, context.config.delay.show) }, context._config.delay.show)
} }
_leave(event, context) { _leave(event, context) {
@@ -633,7 +633,7 @@ class Tooltip extends BaseComponent {
context._hoverState = HOVER_STATE_OUT context._hoverState = HOVER_STATE_OUT
if (!context.config.delay || !context.config.delay.hide) { if (!context._config.delay || !context._config.delay.hide) {
context.hide() context.hide()
return return
} }
@@ -642,7 +642,7 @@ class Tooltip extends BaseComponent {
if (context._hoverState === HOVER_STATE_OUT) { if (context._hoverState === HOVER_STATE_OUT) {
context.hide() context.hide()
} }
}, context.config.delay.hide) }, context._config.delay.hide)
} }
_isWithActiveTrigger() { _isWithActiveTrigger() {
@@ -701,10 +701,10 @@ class Tooltip extends BaseComponent {
_getDelegateConfig() { _getDelegateConfig() {
const config = {} const config = {}
if (this.config) { if (this._config) {
for (const key in this.config) { for (const key in this._config) {
if (this.constructor.Default[key] !== this.config[key]) { if (this.constructor.Default[key] !== this._config[key]) {
config[key] = this.config[key] config[key] = this._config[key]
} }
} }
} }

6
js/tests/unit/tooltip.spec.js
View File

@@ -80,7 +80,7 @@ describe('Tooltip', () => {
const tooltipEl = fixtureEl.querySelector('a') const tooltipEl = fixtureEl.querySelector('a')
const tooltip = new Tooltip(tooltipEl) const tooltip = new Tooltip(tooltipEl)
expect(tooltip.config.sanitize).toEqual(true) expect(tooltip._config.sanitize).toEqual(true)
}) })
it('should convert title and content to string if numbers', () => { it('should convert title and content to string if numbers', () => {
@@ -92,8 +92,8 @@ describe('Tooltip', () => {
content: 7 content: 7
}) })
expect(tooltip.config.title).toEqual('1') expect(tooltip._config.title).toEqual('1')
expect(tooltip.config.content).toEqual('7') expect(tooltip._config.content).toEqual('7')
}) })
it('should enable selector delegation', done => { it('should enable selector delegation', done => {