@coreui/coreui 5.0.0-alpha.0 → 5.0.0-alpha.2

package/js/src/dom/manipulator.js

@@ -1,9 +1,9 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): dom/manipulator.js
+ * CoreUI dom/manipulator.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's dom/manipulator.js
+ * This is a modified version of the Bootstrap's dom/manipulator.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
@@ -55,7 +55,7 @@ const Manipulator = {
     }
 
     const attributes = {}
-    const coreuiKeys = Object.keys(element.dataset).filter(key => key.startsWith('coreu') && !key.startsWith('coreuiConfig'))
+    const coreuiKeys = Object.keys(element.dataset).filter(key => key.startsWith('coreui') && !key.startsWith('coreuiConfig'))
 
     for (const key of coreuiKeys) {
       let pureKey = key.replace(/^coreui/, '')

package/js/src/dom/selector-engine.js

@@ -1,9 +1,9 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): dom/selector-engine.js
+ * CoreUI dom/selector-engine.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's dom/selector-engine.js
+ * This is a modified version of the Bootstrap's dom/selector-engine.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */

package/js/src/dropdown.js

@@ -1,6 +1,6 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): dropdown.js
+ * CoreUI dropdown.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's dropdown.js
@@ -9,6 +9,10 @@
  */
 
 import * as Popper from '@popperjs/core'
+import BaseComponent from './base-component.js'
+import EventHandler from './dom/event-handler.js'
+import Manipulator from './dom/manipulator.js'
+import SelectorEngine from './dom/selector-engine.js'
 import {
   defineJQueryPlugin,
   execute,
@@ -20,10 +24,6 @@ import {
   isVisible,
   noop
 } from './util/index.js'
-import EventHandler from './dom/event-handler.js'
-import Manipulator from './dom/manipulator.js'
-import SelectorEngine from './dom/selector-engine.js'
-import BaseComponent from './base-component.js'
 
 /**
  * Constants
@@ -99,7 +99,7 @@ class Dropdown extends BaseComponent {
 
     this._popper = null
     this._parent = this._element.parentNode // dropdown wrapper
-    // todo: v6 revert #37011 & change markup https://getbootstrap.com/docs/5.3/forms/input-group/
+    // TODO: v6 revert #37011 & change markup https://getbootstrap.com/docs/5.3/forms/input-group/
     this._menu = SelectorEngine.next(this._element, SELECTOR_MENU)[0] ||
       SelectorEngine.prev(this._element, SELECTOR_MENU)[0] ||
       SelectorEngine.findOne(SELECTOR_MENU, this._parent)
@@ -314,7 +314,7 @@ class Dropdown extends BaseComponent {
 
     // Disable Popper if we have a static display or Dropdown is in Navbar
     if (this._inNavbar || this._config.display === 'static') {
-      Manipulator.setDataAttribute(this._menu, 'popper', 'static') // todo:v6 remove
+      Manipulator.setDataAttribute(this._menu, 'popper', 'static') // TODO: v6 remove
       defaultBsPopperConfig.modifiers = [{
         name: 'applyStyles',
         enabled: false
@@ -412,7 +412,7 @@ class Dropdown extends BaseComponent {
 
     event.preventDefault()
 
-    // todo: v6 revert #37011 & change markup https://getbootstrap.com/docs/5.3/forms/input-group/
+    // TODO: v6 revert #37011 & change markup https://getbootstrap.com/docs/5.3/forms/input-group/
     const getToggleButton = this.matches(SELECTOR_DATA_TOGGLE) ?
       this :
       (SelectorEngine.prev(this, SELECTOR_DATA_TOGGLE)[0] ||

package/js/src/modal.js

@@ -1,6 +1,6 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): modal.js
+ * CoreUI modal.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's modal.js
@@ -8,14 +8,14 @@
  * --------------------------------------------------------------------------
  */
 
-import { defineJQueryPlugin, isRTL, isVisible, reflow } from './util/index.js'
+import BaseComponent from './base-component.js'
 import EventHandler from './dom/event-handler.js'
 import SelectorEngine from './dom/selector-engine.js'
-import ScrollBarHelper from './util/scrollbar.js'
-import BaseComponent from './base-component.js'
 import Backdrop from './util/backdrop.js'
-import FocusTrap from './util/focustrap.js'
 import { enableDismissTrigger } from './util/component-functions.js'
+import FocusTrap from './util/focustrap.js'
+import { defineJQueryPlugin, isRTL, isVisible, reflow } from './util/index.js'
+import ScrollBarHelper from './util/scrollbar.js'
 
 /**
  * Constants
@@ -142,12 +142,12 @@ class Modal extends BaseComponent {
   }
 
   dispose() {
-    for (const htmlElement of [window, this._dialog]) {
-      EventHandler.off(htmlElement, EVENT_KEY)
-    }
+    EventHandler.off(window, EVENT_KEY)
+    EventHandler.off(this._dialog, EVENT_KEY)
 
     this._backdrop.dispose()
     this._focustrap.deactivate()
+
     super.dispose()
   }
 
@@ -211,7 +211,6 @@ class Modal extends BaseComponent {
       }
 
       if (this._config.keyboard) {
-        event.preventDefault()
         this.hide()
         return
       }

package/js/src/navigation.js

@@ -1,16 +1,16 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): navigation.js
+ * CoreUI navigation.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
 
-import { defineJQueryPlugin } from './util/index.js'
+import BaseComponent from './base-component.js'
 import Data from './dom/data.js'
 import EventHandler from './dom/event-handler.js'
 import Manipulator from './dom/manipulator.js'
 import SelectorEngine from './dom/selector-engine.js'
-import BaseComponent from './base-component.js'
+import { defineJQueryPlugin } from './util/index.js'
 
 /**
  * ------------------------------------------------------------------------

package/js/src/offcanvas.js

@@ -1,25 +1,25 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): offcanvas.js
+ * CoreUI offcanvas.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's offcanvas.js
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  * --------------------------------------------------------------------------
  */
 
+import BaseComponent from './base-component.js'
+import EventHandler from './dom/event-handler.js'
+import SelectorEngine from './dom/selector-engine.js'
+import Backdrop from './util/backdrop.js'
+import { enableDismissTrigger } from './util/component-functions.js'
+import FocusTrap from './util/focustrap.js'
 import {
   defineJQueryPlugin,
   isDisabled,
   isVisible
 } from './util/index.js'
 import ScrollBarHelper from './util/scrollbar.js'
-import EventHandler from './dom/event-handler.js'
-import BaseComponent from './base-component.js'
-import SelectorEngine from './dom/selector-engine.js'
-import Backdrop from './util/backdrop.js'
-import FocusTrap from './util/focustrap.js'
-import { enableDismissTrigger } from './util/component-functions.js'
 
 /**
  * Constants
@@ -201,12 +201,12 @@ class Offcanvas extends BaseComponent {
         return
       }
 
-      if (!this._config.keyboard) {
-        EventHandler.trigger(this._element, EVENT_HIDE_PREVENTED)
+      if (this._config.keyboard) {
+        this.hide()
         return
       }
 
-      this.hide()
+      EventHandler.trigger(this._element, EVENT_HIDE_PREVENTED)
     })
   }
 

package/js/src/popover.js

@@ -1,6 +1,6 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): popover.js
+ * CoreUI popover.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's popover.js
@@ -8,8 +8,8 @@
  * --------------------------------------------------------------------------
  */
 
-import { defineJQueryPlugin } from './util/index.js'
 import Tooltip from './tooltip.js'
+import { defineJQueryPlugin } from './util/index.js'
 
 /**
  * Constants

package/js/src/scrollspy.js

@@ -1,6 +1,6 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): scrollspy.js
+ * CoreUI scrollspy.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's scrollspy.js
@@ -8,10 +8,10 @@
  * --------------------------------------------------------------------------
  */
 
-import { defineJQueryPlugin, getElement, isDisabled, isVisible } from './util/index.js'
+import BaseComponent from './base-component.js'
 import EventHandler from './dom/event-handler.js'
 import SelectorEngine from './dom/selector-engine.js'
-import BaseComponent from './base-component.js'
+import { defineJQueryPlugin, getElement, isDisabled, isVisible } from './util/index.js'
 
 /**
  * Constants
@@ -211,11 +211,11 @@ class ScrollSpy extends BaseComponent {
         continue
       }
 
-      const observableSection = SelectorEngine.findOne(anchor.hash, this._element)
+      const observableSection = SelectorEngine.findOne(decodeURI(anchor.hash), this._element)
 
       // ensure that the observableSection exists & is visible
       if (isVisible(observableSection)) {
-        this._targetLinks.set(anchor.hash, anchor)
+        this._targetLinks.set(decodeURI(anchor.hash), anchor)
         this._observableSections.set(anchor.hash, observableSection)
       }
     }

package/js/src/sidebar.js

@@ -1,16 +1,16 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): sidebar.js
+ * CoreUI sidebar.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
 
-import { defineJQueryPlugin } from './util/index.js'
-import ScrollBarHelper from './util/scrollbar.js'
-import EventHandler from './dom/event-handler.js'
 import BaseComponent from './base-component.js'
+import EventHandler from './dom/event-handler.js'
 import Manipulator from './dom/manipulator.js'
+import { defineJQueryPlugin } from './util/index.js'
 import Backdrop from './util/backdrop.js'
+import ScrollBarHelper from './util/scrollbar.js'
 
 /**
  * ------------------------------------------------------------------------

package/js/src/tab.js

@@ -1,6 +1,6 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): tab.js
+ * CoreUI tab.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's tab.js
@@ -8,10 +8,10 @@
  * --------------------------------------------------------------------------
  */
 
-import { defineJQueryPlugin, getNextActiveElement, isDisabled } from './util/index.js'
+import BaseComponent from './base-component.js'
 import EventHandler from './dom/event-handler.js'
 import SelectorEngine from './dom/selector-engine.js'
-import BaseComponent from './base-component.js'
+import { defineJQueryPlugin, getNextActiveElement, isDisabled } from './util/index.js'
 
 /**
  * Constants
@@ -33,6 +33,8 @@ const ARROW_LEFT_KEY = 'ArrowLeft'
 const ARROW_RIGHT_KEY = 'ArrowRight'
 const ARROW_UP_KEY = 'ArrowUp'
 const ARROW_DOWN_KEY = 'ArrowDown'
+const HOME_KEY = 'Home'
+const END_KEY = 'End'
 
 const CLASS_NAME_ACTIVE = 'active'
 const CLASS_NAME_FADE = 'fade'
@@ -46,7 +48,7 @@ const NOT_SELECTOR_DROPDOWN_TOGGLE = ':not(.dropdown-toggle)'
 const SELECTOR_TAB_PANEL = '.list-group, .nav, [role="tablist"]'
 const SELECTOR_OUTER = '.nav-item, .list-group-item'
 const SELECTOR_INNER = `.nav-link${NOT_SELECTOR_DROPDOWN_TOGGLE}, .list-group-item${NOT_SELECTOR_DROPDOWN_TOGGLE}, [role="tab"]${NOT_SELECTOR_DROPDOWN_TOGGLE}`
-const SELECTOR_DATA_TOGGLE = '[data-coreui-toggle="tab"], [data-coreui-toggle="pill"], [data-coreui-toggle="list"]' // todo:v6: could be only `tab`
+const SELECTOR_DATA_TOGGLE = '[data-coreui-toggle="tab"], [data-coreui-toggle="pill"], [data-coreui-toggle="list"]' // TODO: could only be `tab` in v6
 const SELECTOR_INNER_ELEM = `${SELECTOR_INNER}, ${SELECTOR_DATA_TOGGLE}`
 
 const SELECTOR_DATA_TOGGLE_ACTIVE = `.${CLASS_NAME_ACTIVE}[data-coreui-toggle="tab"], .${CLASS_NAME_ACTIVE}[data-coreui-toggle="pill"], .${CLASS_NAME_ACTIVE}[data-coreui-toggle="list"]`
@@ -62,7 +64,7 @@ class Tab extends BaseComponent {
 
     if (!this._parent) {
       return
-      // todo: should Throw exception on v6
+      // TODO: should throw exception in v6
       // throw new TypeError(`${element.outerHTML} has not a valid parent ${SELECTOR_INNER_ELEM}`)
     }
 
@@ -154,14 +156,22 @@ class Tab extends BaseComponent {
   }
 
   _keydown(event) {
-    if (!([ARROW_LEFT_KEY, ARROW_RIGHT_KEY, ARROW_UP_KEY, ARROW_DOWN_KEY].includes(event.key))) {
+    if (!([ARROW_LEFT_KEY, ARROW_RIGHT_KEY, ARROW_UP_KEY, ARROW_DOWN_KEY, HOME_KEY, END_KEY].includes(event.key))) {
       return
     }
 
     event.stopPropagation()// stopPropagation/preventDefault both added to support up/down keys without scrolling the page
     event.preventDefault()
-    const isNext = [ARROW_RIGHT_KEY, ARROW_DOWN_KEY].includes(event.key)
-    const nextActiveElement = getNextActiveElement(this._getChildren().filter(element => !isDisabled(element)), event.target, isNext, true)
+
+    const children = this._getChildren().filter(element => !isDisabled(element))
+    let nextActiveElement
+
+    if ([HOME_KEY, END_KEY].includes(event.key)) {
+      nextActiveElement = children[event.key === HOME_KEY ? 0 : children.length - 1]
+    } else {
+      const isNext = [ARROW_RIGHT_KEY, ARROW_DOWN_KEY].includes(event.key)
+      nextActiveElement = getNextActiveElement(children, event.target, isNext, true)
+    }
 
     if (nextActiveElement) {
       nextActiveElement.focus({ preventScroll: true })
@@ -215,7 +225,7 @@ class Tab extends BaseComponent {
     this._setAttributeIfNotExists(target, 'role', 'tabpanel')
 
     if (child.id) {
-      this._setAttributeIfNotExists(target, 'aria-labelledby', `#${child.id}`)
+      this._setAttributeIfNotExists(target, 'aria-labelledby', `${child.id}`)
     }
   }
 

package/js/src/toast.js

@@ -1,6 +1,6 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): toast.js
+ * CoreUI toast.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's toast.js
@@ -8,10 +8,10 @@
  * --------------------------------------------------------------------------
  */
 
-import { defineJQueryPlugin, reflow } from './util/index.js'
-import EventHandler from './dom/event-handler.js'
 import BaseComponent from './base-component.js'
+import EventHandler from './dom/event-handler.js'
 import { enableDismissTrigger } from './util/component-functions.js'
+import { defineJQueryPlugin, reflow } from './util/index.js'
 
 /**
  * Constants

package/js/src/tooltip.js

@@ -1,6 +1,6 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): tooltip.js
+ * CoreUI tooltip.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
  * This component is a modified version of the Bootstrap's tooltip.js
@@ -9,11 +9,11 @@
  */
 
 import * as Popper from '@popperjs/core'
-import { defineJQueryPlugin, execute, findShadowRoot, getElement, getUID, isRTL, noop } from './util/index.js'
-import { DefaultAllowlist } from './util/sanitizer.js'
+import BaseComponent from './base-component.js'
 import EventHandler from './dom/event-handler.js'
 import Manipulator from './dom/manipulator.js'
-import BaseComponent from './base-component.js'
+import { defineJQueryPlugin, execute, findShadowRoot, getElement, getUID, isRTL, noop } from './util/index.js'
+import { DefaultAllowlist } from './util/sanitizer.js'
 import TemplateFactory from './util/template-factory.js'
 
 /**
@@ -65,7 +65,7 @@ const Default = {
   delay: 0,
   fallbackPlacements: ['top', 'right', 'bottom', 'left'],
   html: false,
-  offset: [0, 0],
+  offset: [0, 6],
   placement: 'top',
   popperConfig: null,
   sanitize: true,
@@ -200,7 +200,7 @@ class Tooltip extends BaseComponent {
       return
     }
 
-    // todo v6 remove this OR make it optional
+    // TODO: v6 remove this or make it optional
     this._disposePopper()
 
     const tip = this._getTipElement()
@@ -305,14 +305,14 @@ class Tooltip extends BaseComponent {
   _createTipElement(content) {
     const tip = this._getTemplateFactory(content).toHtml()
 
-    // todo: remove this check on v6
+    // TODO: remove this check in v6
     if (!tip) {
       return null
     }
 
     tip.classList.remove(CLASS_NAME_FADE, CLASS_NAME_SHOW)
-    // todo: on v6 the following can be achieved with CSS only
-    tip.classList.add(`cui-${this.constructor.NAME}-auto`)
+    // TODO: v6 the following can be achieved with CSS only
+    tip.classList.add(`bs-${this.constructor.NAME}-auto`)
 
     const tipId = getUID(this.constructor.NAME).toString()
 

package/js/src/util/backdrop.js

@@ -1,16 +1,16 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): util/backdrop.js
+ * CoreUI util/backdrop.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's util/backdrop.js
+ * This is a modified version of the Bootstrap's util/backdrop.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
 
 import EventHandler from '../dom/event-handler.js'
-import { execute, executeAfterTransition, getElement, reflow } from './index.js'
 import Config from './config.js'
+import { execute, executeAfterTransition, getElement, reflow } from './index.js'
 
 /**
  * Constants

package/js/src/util/component-functions.js

@@ -1,16 +1,16 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): util/component-functions.js
+ * CoreUI util/component-functions.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's util/component-functions.js
+ * This is a modified version of the Bootstrap's util/component-functions.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
 
 import EventHandler from '../dom/event-handler.js'
-import { isDisabled } from './index.js'
 import SelectorEngine from '../dom/selector-engine.js'
+import { isDisabled } from './index.js'
 
 const enableDismissTrigger = (component, method = 'hide') => {
   const clickEvent = `click.dismiss${component.EVENT_KEY}`

package/js/src/util/config.js

@@ -1,15 +1,15 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): util/config.js
+ * CoreUI util/config.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's util/config.js
+ * This is a modified version of the Bootstrap's util/config.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
 
-import { isElement, toType } from './index.js'
 import Manipulator from '../dom/manipulator.js'
+import { isElement, toType } from './index.js'
 
 /**
  * Class definition

package/js/src/util/focustrap.js

@@ -1,9 +1,9 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): util/focustrap.js
+ * CoreUI util/focustrap.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's util/focustrap.js
+ * This is a modified version of the Bootstrap's util/focustrap.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */

package/js/src/util/index.js

@@ -1,9 +1,9 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): util/index.js
+ * CoreUI util/index.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's util/index.js
+ * This is a modified version of the Bootstrap's util/index.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */

package/js/src/util/sanitizer.js

@@ -1,56 +1,16 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): util/sanitizer.js
+ * CoreUI util/sanitizer.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's util/sanitizer.js
+ * This is a modified version of the Bootstrap's util/sanitizer.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
 
-const uriAttributes = new Set([
-  'background',
-  'cite',
-  'href',
-  'itemtype',
-  'longdesc',
-  'poster',
-  'src',
-  'xlink:href'
-])
-
+// js-docs-start allow-list
 const ARIA_ATTRIBUTE_PATTERN = /^aria-[\w-]*$/i
 
-/**
- * A pattern that recognizes a commonly useful subset of URLs that are safe.
- *
- * Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
- */
-const SAFE_URL_PATTERN = /^(?:(?:https?|mailto|ftp|tel|file|sms):|[^#&/:?]*(?:[#/?]|$))/i
-
-/**
- * A pattern that matches safe data URLs. Only matches image, video and audio types.
- *
- * Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
- */
-const DATA_URL_PATTERN = /^data:(?:image\/(?:bmp|gif|jpeg|jpg|png|tiff|webp)|video\/(?:mpeg|mp4|ogg|webm)|audio\/(?:mp3|oga|ogg|opus));base64,[\d+/a-z]+=*$/i
-
-const allowedAttribute = (attribute, allowedAttributeList) => {
-  const attributeName = attribute.nodeName.toLowerCase()
-
-  if (allowedAttributeList.includes(attributeName)) {
-    if (uriAttributes.has(attributeName)) {
-      return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue) || DATA_URL_PATTERN.test(attribute.nodeValue))
-    }
-
-    return true
-  }
-
-  // Check if a regular expression validates the attribute.
-  return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp)
-    .some(regex => regex.test(attributeName))
-}
-
 export const DefaultAllowlist = {
   // Global attributes allowed on any supplied element below.
   '*': ['class', 'dir', 'id', 'lang', 'role', ARIA_ATTRIBUTE_PATTERN],
@@ -84,6 +44,43 @@ export const DefaultAllowlist = {
   u: [],
   ul: []
 }
+// js-docs-end allow-list
+
+const uriAttributes = new Set([
+  'background',
+  'cite',
+  'href',
+  'itemtype',
+  'longdesc',
+  'poster',
+  'src',
+  'xlink:href'
+])
+
+/**
+ * A pattern that recognizes URLs that are safe wrt. XSS in URL navigation
+ * contexts.
+ *
+ * Shout-out to Angular https://github.com/angular/angular/blob/15.2.8/packages/core/src/sanitization/url_sanitizer.ts#L38
+ */
+// eslint-disable-next-line unicorn/better-regex
+const SAFE_URL_PATTERN = /^(?!javascript:)(?:[a-z0-9+.-]+:|[^&:/?#]*(?:[/?#]|$))/i
+
+const allowedAttribute = (attribute, allowedAttributeList) => {
+  const attributeName = attribute.nodeName.toLowerCase()
+
+  if (allowedAttributeList.includes(attributeName)) {
+    if (uriAttributes.has(attributeName)) {
+      return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue))
+    }
+
+    return true
+  }
+
+  // Check if a regular expression validates the attribute.
+  return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp)
+    .some(regex => regex.test(attributeName))
+}
 
 export function sanitizeHtml(unsafeHtml, allowList, sanitizeFunction) {
   if (!unsafeHtml.length) {

package/js/src/util/scrollbar.js

@@ -1,15 +1,15 @@
 /**
  * --------------------------------------------------------------------------
- * CoreUI (__COREUI_VERSION__): util/scrollBar.js
+ * CoreUI util/scrollBar.js
  * Licensed under MIT (https://github.com/coreui/coreui/blob/main/LICENSE)
  *
- * This component is a modified version of the Bootstrap's  util/scrollBar.js
+ * This is a modified version of the Bootstrap's util/scrollBar.js
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  * --------------------------------------------------------------------------
  */
 
-import SelectorEngine from '../dom/selector-engine.js'
 import Manipulator from '../dom/manipulator.js'
+import SelectorEngine from '../dom/selector-engine.js'
 import { isElement } from './index.js'
 
 /**