tooltip/popover: add a customClass option (#31834)

Co-authored-by: XhmikosR <xhmikosr@gmail.com>

js/src/tooltip.js

@@ -41,6 +41,7 @@ const DefaultType = {
   container: '(string|element|boolean)',
   fallbackPlacement: '(string|array)',
   boundary: '(string|element)',
+  customClass: '(string|function)',
   sanitize: 'boolean',
   sanitizeFn: '(null|function)',
   whiteList: 'object',
@@ -70,6 +71,7 @@ const Default = {
   container: false,
   fallbackPlacement: 'flip',
   boundary: 'scrollParent',
+  customClass: '',
   sanitize: true,
   sanitizeFn: null,
   whiteList: DefaultWhitelist,
@@ -284,6 +286,7 @@ class Tooltip {
       this._popper = new Popper(this.element, tip, this._getPopperConfig(attachment))
 
       $(tip).addClass(CLASS_NAME_SHOW)
+      $(tip).addClass(this._getCustomClass())
 
       // If this is a touch-enabled device we add extra
       // empty mouseover listeners to the body's immediate children;
@@ -731,6 +734,10 @@ class Tooltip {
     this.config.animation = initConfigAnimation
   }
 
+  _getCustomClass() {
+    return this.element.getAttribute('data-custom-class') || this.config.customClass
+  }
+
   // Static
 
   static _jQueryInterface(config) {