1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-26 06:44:35 +02:00

Use a streamlined way to trigger component dismiss (#34170)

* use a streamlined way to trigger component dismiss

* add documentation

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
GeoSot
2021-07-28 17:39:32 +03:00
committed by GitHub
parent 047145e808
commit 4bfd8a2cbc
12 changed files with 184 additions and 71 deletions

View File

@@ -20,6 +20,7 @@ import ScrollBarHelper from './util/scrollbar'
import BaseComponent from './base-component'
import Backdrop from './util/backdrop'
import FocusTrap from './util/focustrap'
import { enableDismissTrigger } from './util/component-functions'
/**
* ------------------------------------------------------------------------
@@ -62,11 +63,9 @@ const CLASS_NAME_FADE = 'fade'
const CLASS_NAME_SHOW = 'show'
const CLASS_NAME_STATIC = 'modal-static'
const SELECTOR = '.modal'
const SELECTOR_DIALOG = '.modal-dialog'
const SELECTOR_MODAL_BODY = '.modal-body'
const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="modal"]'
const SELECTOR_DATA_DISMISS = '[data-bs-dismiss="modal"]'
/**
* ------------------------------------------------------------------------
@@ -143,11 +142,7 @@ class Modal extends BaseComponent {
this._showBackdrop(() => this._showElement(relatedTarget))
}
hide(event) {
if (event && ['A', 'AREA'].includes(event.target.tagName)) {
event.preventDefault()
}
hide() {
if (!this._isShown || this._isTransitioning) {
return
}
@@ -421,12 +416,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
data.toggle(this)
})
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_DISMISS, function (event) {
const target = getElementFromSelector(this) || this.closest(SELECTOR)
const modal = Modal.getOrCreateInstance(target)
modal.hide(event)
})
enableDismissTrigger(Modal)
/**
* ------------------------------------------------------------------------