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

Changes to Alert component to match the others (#33402)

Browse Source 
Alert.js: Refactor code to match the other components
* Use this._element
* Remove handleDismiss method and keep its functionality on event
* Change JqueryInterface to be more generic
* Correct docs to be aligned with code, and add undocumented functionality
* Update alerts.md

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
GeoSot
2021-06-28 16:34:47 +03:00
committed by GitHub
parent 45d26de728
commit 70dd7f6ff5
3 changed files with 61 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
js/src/alert.js
View File

@@ -7,7 +7,8 @@
import {
defineJQueryPlugin,
getElementFromSelector
getElementFromSelector,
isDisabled
} from './util/index'
import EventHandler from './dom/event-handler'
import BaseComponent from './base-component'
@@ -48,38 +49,24 @@ class Alert extends BaseComponent {
// Public
close(element) {
const rootElement = element ? this._getRootElement(element) : this._element
const customEvent = this._triggerCloseEvent(rootElement)
close() {
const closeEvent = EventHandler.trigger(this._element, EVENT_CLOSE)
if (customEvent === null || customEvent.defaultPrevented) {
if (closeEvent.defaultPrevented) {
return
}
this._removeElement(rootElement)
this._element.classList.remove(CLASS_NAME_SHOW)
const isAnimated = this._element.classList.contains(CLASS_NAME_FADE)
this._queueCallback(() => this._destroyElement(), this._element, isAnimated)
}
// Private
_getRootElement(element) {
return getElementFromSelector(element) || element.closest(`.${CLASS_NAME_ALERT}`)
}
_triggerCloseEvent(element) {
return EventHandler.trigger(element, EVENT_CLOSE)
}
_removeElement(element) {
element.classList.remove(CLASS_NAME_SHOW)
const isAnimated = element.classList.contains(CLASS_NAME_FADE)
this._queueCallback(() => this._destroyElement(element), element, isAnimated)
}
_destroyElement(element) {
element.remove()
EventHandler.trigger(element, EVENT_CLOSED)
_destroyElement() {
this._element.remove()
EventHandler.trigger(this._element, EVENT_CLOSED)
this.dispose()
}
// Static
@@ -88,21 +75,17 @@ class Alert extends BaseComponent {
return this.each(function () {
const data = Alert.getOrCreateInstance(this)
if (config === 'close') {
data[config](this)
if (typeof config !== 'string') {
return
}
if (data[config] === undefined || config.startsWith('_') || config === 'constructor') {
throw new TypeError(`No method named "${config}"`)
}
data[config](this)
})
}
static handleDismiss(alertInstance) {
return function (event) {
if (event) {
event.preventDefault()
}
alertInstance.close(this)
}
}
}
/**
@@ -111,7 +94,19 @@ class Alert extends BaseComponent {
* ------------------------------------------------------------------------
*/
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DISMISS, Alert.handleDismiss(new Alert()))
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DISMISS, function (event) {
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault()
}
if (isDisabled(this)) {
return
}
const target = getElementFromSelector(this) || this.closest(`.${CLASS_NAME_ALERT}`)
const alert = Alert.getOrCreateInstance(target)
alert.close()
})
/**
* ------------------------------------------------------------------------