Remove TRANSITION_END from utils (#32394)

js/src/alert.js

@@ -7,7 +7,6 @@
 
 import {
   defineJQueryPlugin,
-  TRANSITION_END,
   emulateTransitionEnd,
   getElementFromSelector,
   getTransitionDurationFromElement
@@ -83,7 +82,7 @@ class Alert extends BaseComponent {
 
     const transitionDuration = getTransitionDurationFromElement(element)
 
-    EventHandler.one(element, TRANSITION_END, () => this._destroyElement(element))
+    EventHandler.one(element, 'transitionend', () => this._destroyElement(element))
     emulateTransitionEnd(element, transitionDuration)
   }
 

js/src/carousel.js

@@ -7,7 +7,6 @@
 
 import {
   defineJQueryPlugin,
-  TRANSITION_END,
   emulateTransitionEnd,
   getElementFromSelector,
   getTransitionDurationFromElement,
@@ -480,7 +479,7 @@ class Carousel extends BaseComponent {
 
       const transitionDuration = getTransitionDurationFromElement(activeElement)
 
-      EventHandler.one(activeElement, TRANSITION_END, () => {
+      EventHandler.one(activeElement, 'transitionend', () => {
         nextElement.classList.remove(directionalClassName, orderClassName)
         nextElement.classList.add(CLASS_NAME_ACTIVE)
 

js/src/collapse.js

@@ -7,7 +7,6 @@
 
 import {
   defineJQueryPlugin,
-  TRANSITION_END,
   emulateTransitionEnd,
   getSelectorFromElement,
   getElementFromSelector,
@@ -203,7 +202,7 @@ class Collapse extends BaseComponent {
     const scrollSize = `scroll${capitalizedDimension}`
     const transitionDuration = getTransitionDurationFromElement(this._element)
 
-    EventHandler.one(this._element, TRANSITION_END, complete)
+    EventHandler.one(this._element, 'transitionend', complete)
 
     emulateTransitionEnd(this._element, transitionDuration)
     this._element.style[dimension] = `${this._element[scrollSize]}px`
@@ -253,7 +252,7 @@ class Collapse extends BaseComponent {
     this._element.style[dimension] = ''
     const transitionDuration = getTransitionDurationFromElement(this._element)
 
-    EventHandler.one(this._element, TRANSITION_END, complete)
+    EventHandler.one(this._element, 'transitionend', complete)
     emulateTransitionEnd(this._element, transitionDuration)
   }
 

js/src/modal.js

@@ -7,7 +7,6 @@
 
 import {
   defineJQueryPlugin,
-  TRANSITION_END,
   emulateTransitionEnd,
   getElementFromSelector,
   getTransitionDurationFromElement,
@@ -184,7 +183,7 @@ class Modal extends BaseComponent {
     if (transition) {
       const transitionDuration = getTransitionDurationFromElement(this._element)
 
-      EventHandler.one(this._element, TRANSITION_END, event => this._hideModal(event))
+      EventHandler.one(this._element, 'transitionend', event => this._hideModal(event))
       emulateTransitionEnd(this._element, transitionDuration)
     } else {
       this._hideModal()
@@ -272,7 +271,7 @@ class Modal extends BaseComponent {
     if (transition) {
       const transitionDuration = getTransitionDurationFromElement(this._dialog)
 
-      EventHandler.one(this._dialog, TRANSITION_END, transitionComplete)
+      EventHandler.one(this._dialog, 'transitionend', transitionComplete)
       emulateTransitionEnd(this._dialog, transitionDuration)
     } else {
       transitionComplete()
@@ -377,7 +376,7 @@ class Modal extends BaseComponent {
 
       const backdropTransitionDuration = getTransitionDurationFromElement(this._backdrop)
 
-      EventHandler.one(this._backdrop, TRANSITION_END, callback)
+      EventHandler.one(this._backdrop, 'transitionend', callback)
       emulateTransitionEnd(this._backdrop, backdropTransitionDuration)
     } else if (!this._isShown && this._backdrop) {
       this._backdrop.classList.remove(CLASS_NAME_SHOW)
@@ -389,7 +388,7 @@ class Modal extends BaseComponent {
 
       if (this._element.classList.contains(CLASS_NAME_FADE)) {
         const backdropTransitionDuration = getTransitionDurationFromElement(this._backdrop)
-        EventHandler.one(this._backdrop, TRANSITION_END, callbackRemove)
+        EventHandler.one(this._backdrop, 'transitionend', callbackRemove)
         emulateTransitionEnd(this._backdrop, backdropTransitionDuration)
       } else {
         callbackRemove()
@@ -413,11 +412,11 @@ class Modal extends BaseComponent {
 
     this._element.classList.add(CLASS_NAME_STATIC)
     const modalTransitionDuration = getTransitionDurationFromElement(this._dialog)
-    EventHandler.off(this._element, TRANSITION_END)
-    EventHandler.one(this._element, TRANSITION_END, () => {
+    EventHandler.off(this._element, 'transitionend')
+    EventHandler.one(this._element, 'transitionend', () => {
       this._element.classList.remove(CLASS_NAME_STATIC)
       if (!isModalOverflowing) {
-        EventHandler.one(this._element, TRANSITION_END, () => {
+        EventHandler.one(this._element, 'transitionend', () => {
           this._element.style.overflowY = ''
         })
         emulateTransitionEnd(this._element, modalTransitionDuration)

js/src/tab.js

@@ -7,7 +7,6 @@
 
 import {
   defineJQueryPlugin,
-  TRANSITION_END,
   emulateTransitionEnd,
   getElementFromSelector,
   getTransitionDurationFromElement,
@@ -132,7 +131,7 @@ class Tab extends BaseComponent {
       const transitionDuration = getTransitionDurationFromElement(active)
       active.classList.remove(CLASS_NAME_SHOW)
 
-      EventHandler.one(active, TRANSITION_END, complete)
+      EventHandler.one(active, 'transitionend', complete)
       emulateTransitionEnd(active, transitionDuration)
     } else {
       complete()

js/src/toast.js

@@ -7,7 +7,6 @@
 
 import {
   defineJQueryPlugin,
-  TRANSITION_END,
   emulateTransitionEnd,
   getTransitionDurationFromElement,
   reflow,
@@ -116,7 +115,7 @@ class Toast extends BaseComponent {
     if (this._config.animation) {
       const transitionDuration = getTransitionDurationFromElement(this._element)
 
-      EventHandler.one(this._element, TRANSITION_END, complete)
+      EventHandler.one(this._element, 'transitionend', complete)
       emulateTransitionEnd(this._element, transitionDuration)
     } else {
       complete()
@@ -143,7 +142,7 @@ class Toast extends BaseComponent {
     if (this._config.animation) {
       const transitionDuration = getTransitionDurationFromElement(this._element)
 
-      EventHandler.one(this._element, TRANSITION_END, complete)
+      EventHandler.one(this._element, 'transitionend', complete)
       emulateTransitionEnd(this._element, transitionDuration)
     } else {
       complete()

js/src/tooltip.js

@@ -9,7 +9,6 @@ import * as Popper from '@popperjs/core'
 
 import {
   defineJQueryPlugin,
-  TRANSITION_END,
   emulateTransitionEnd,
   findShadowRoot,
   getTransitionDurationFromElement,
@@ -317,7 +316,7 @@ class Tooltip extends BaseComponent {
 
       if (this.tip.classList.contains(CLASS_NAME_FADE)) {
         const transitionDuration = getTransitionDurationFromElement(this.tip)
-        EventHandler.one(this.tip, TRANSITION_END, complete)
+        EventHandler.one(this.tip, 'transitionend', complete)
         emulateTransitionEnd(this.tip, transitionDuration)
       } else {
         complete()
@@ -367,7 +366,7 @@ class Tooltip extends BaseComponent {
     if (this.tip.classList.contains(CLASS_NAME_FADE)) {
       const transitionDuration = getTransitionDurationFromElement(tip)
 
-      EventHandler.one(tip, TRANSITION_END, complete)
+      EventHandler.one(tip, 'transitionend', complete)
       emulateTransitionEnd(tip, transitionDuration)
     } else {
       complete()

js/src/util/index.js

@@ -205,7 +205,6 @@ const defineJQueryPlugin = (name, plugin) => {
 }
 
 export {
-  TRANSITION_END,
   getUID,
   getSelectorFromElement,
   getElementFromSelector,