alert.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. import $ from 'jquery'
  2. import Util from './util'
  3. /**
  4. * --------------------------------------------------------------------------
  5. * Bootstrap (v4.1.3): alert.js
  6. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  7. * --------------------------------------------------------------------------
  8. */
  9. const Alert = (($) => {
  10. /**
  11. * ------------------------------------------------------------------------
  12. * Constants
  13. * ------------------------------------------------------------------------
  14. */
  15. const NAME = 'alert'
  16. const VERSION = '4.1.3'
  17. const DATA_KEY = 'bs.alert'
  18. const EVENT_KEY = `.${DATA_KEY}`
  19. const DATA_API_KEY = '.data-api'
  20. const JQUERY_NO_CONFLICT = $.fn[NAME]
  21. const Selector = {
  22. DISMISS : '[data-dismiss="alert"]'
  23. }
  24. const Event = {
  25. CLOSE : `close${EVENT_KEY}`,
  26. CLOSED : `closed${EVENT_KEY}`,
  27. CLICK_DATA_API : `click${EVENT_KEY}${DATA_API_KEY}`
  28. }
  29. const ClassName = {
  30. ALERT : 'alert',
  31. FADE : 'fade',
  32. SHOW : 'show'
  33. }
  34. /**
  35. * ------------------------------------------------------------------------
  36. * Class Definition
  37. * ------------------------------------------------------------------------
  38. */
  39. class Alert {
  40. constructor(element) {
  41. this._element = element
  42. }
  43. // Getters
  44. static get VERSION() {
  45. return VERSION
  46. }
  47. // Public
  48. close(element) {
  49. let rootElement = this._element
  50. if (element) {
  51. rootElement = this._getRootElement(element)
  52. }
  53. const customEvent = this._triggerCloseEvent(rootElement)
  54. if (customEvent.isDefaultPrevented()) {
  55. return
  56. }
  57. this._removeElement(rootElement)
  58. }
  59. dispose() {
  60. $.removeData(this._element, DATA_KEY)
  61. this._element = null
  62. }
  63. // Private
  64. _getRootElement(element) {
  65. const selector = Util.getSelectorFromElement(element)
  66. let parent = false
  67. if (selector) {
  68. parent = document.querySelector(selector)
  69. }
  70. if (!parent) {
  71. parent = $(element).closest(`.${ClassName.ALERT}`)[0]
  72. }
  73. return parent
  74. }
  75. _triggerCloseEvent(element) {
  76. const closeEvent = $.Event(Event.CLOSE)
  77. $(element).trigger(closeEvent)
  78. return closeEvent
  79. }
  80. _removeElement(element) {
  81. $(element).removeClass(ClassName.SHOW)
  82. if (!$(element).hasClass(ClassName.FADE)) {
  83. this._destroyElement(element)
  84. return
  85. }
  86. const transitionDuration = Util.getTransitionDurationFromElement(element)
  87. $(element)
  88. .one(Util.TRANSITION_END, (event) => this._destroyElement(element, event))
  89. .emulateTransitionEnd(transitionDuration)
  90. }
  91. _destroyElement(element) {
  92. $(element)
  93. .detach()
  94. .trigger(Event.CLOSED)
  95. .remove()
  96. }
  97. // Static
  98. static _jQueryInterface(config) {
  99. return this.each(function () {
  100. const $element = $(this)
  101. let data = $element.data(DATA_KEY)
  102. if (!data) {
  103. data = new Alert(this)
  104. $element.data(DATA_KEY, data)
  105. }
  106. if (config === 'close') {
  107. data[config](this)
  108. }
  109. })
  110. }
  111. static _handleDismiss(alertInstance) {
  112. return function (event) {
  113. if (event) {
  114. event.preventDefault()
  115. }
  116. alertInstance.close(this)
  117. }
  118. }
  119. }
  120. /**
  121. * ------------------------------------------------------------------------
  122. * Data Api implementation
  123. * ------------------------------------------------------------------------
  124. */
  125. $(document).on(
  126. Event.CLICK_DATA_API,
  127. Selector.DISMISS,
  128. Alert._handleDismiss(new Alert())
  129. )
  130. /**
  131. * ------------------------------------------------------------------------
  132. * jQuery
  133. * ------------------------------------------------------------------------
  134. */
  135. $.fn[NAME] = Alert._jQueryInterface
  136. $.fn[NAME].Constructor = Alert
  137. $.fn[NAME].noConflict = function () {
  138. $.fn[NAME] = JQUERY_NO_CONFLICT
  139. return Alert._jQueryInterface
  140. }
  141. return Alert
  142. })($)
  143. export default Alert