aboutsummaryrefslogtreecommitdiff
path: root/js/src
diff options
context:
space:
mode:
Diffstat (limited to 'js/src')
-rw-r--r--js/src/alert.js8
-rw-r--r--js/src/base-component.js8
-rw-r--r--js/src/button.js6
-rw-r--r--js/src/carousel.js15
-rw-r--r--js/src/collapse.js21
-rw-r--r--js/src/dom/event-handler.js12
-rw-r--r--js/src/dom/selector-engine.js51
-rw-r--r--js/src/dropdown.js13
-rw-r--r--js/src/modal.js18
-rw-r--r--js/src/offcanvas.js19
-rw-r--r--js/src/popover.js4
-rw-r--r--js/src/scrollspy.js8
-rw-r--r--js/src/tab.js14
-rw-r--r--js/src/toast.js8
-rw-r--r--js/src/tooltip.js26
-rw-r--r--js/src/util/backdrop.js6
-rw-r--r--js/src/util/component-functions.js7
-rw-r--r--js/src/util/config.js7
-rw-r--r--js/src/util/focustrap.js6
-rw-r--r--js/src/util/index.js66
-rw-r--r--js/src/util/scrollbar.js6
-rw-r--r--js/src/util/swipe.js6
-rw-r--r--js/src/util/template-factory.js10
23 files changed, 174 insertions, 171 deletions
diff --git a/js/src/alert.js b/js/src/alert.js
index 59de828e9..a58408b7a 100644
--- a/js/src/alert.js
+++ b/js/src/alert.js
@@ -5,10 +5,10 @@
* --------------------------------------------------------------------------
*/
-import { defineJQueryPlugin } from './util/index'
-import EventHandler from './dom/event-handler'
-import BaseComponent from './base-component'
-import { enableDismissTrigger } from './util/component-functions'
+import { defineJQueryPlugin } from './util/index.js'
+import EventHandler from './dom/event-handler.js'
+import BaseComponent from './base-component.js'
+import { enableDismissTrigger } from './util/component-functions.js'
/**
* Constants
diff --git a/js/src/base-component.js b/js/src/base-component.js
index 0c1a2592d..ea266cee8 100644
--- a/js/src/base-component.js
+++ b/js/src/base-component.js
@@ -5,10 +5,10 @@
* --------------------------------------------------------------------------
*/
-import Data from './dom/data'
-import { executeAfterTransition, getElement } from './util/index'
-import EventHandler from './dom/event-handler'
-import Config from './util/config'
+import Data from './dom/data.js'
+import { executeAfterTransition, getElement } from './util/index.js'
+import EventHandler from './dom/event-handler.js'
+import Config from './util/config.js'
/**
* Constants
diff --git a/js/src/button.js b/js/src/button.js
index 03e76041a..f3185cb89 100644
--- a/js/src/button.js
+++ b/js/src/button.js
@@ -5,9 +5,9 @@
* --------------------------------------------------------------------------
*/
-import { defineJQueryPlugin } from './util/index'
-import EventHandler from './dom/event-handler'
-import BaseComponent from './base-component'
+import { defineJQueryPlugin } from './util/index.js'
+import EventHandler from './dom/event-handler.js'
+import BaseComponent from './base-component.js'
/**
* Constants
diff --git a/js/src/carousel.js b/js/src/carousel.js
index 24bbe392a..d190075eb 100644
--- a/js/src/carousel.js
+++ b/js/src/carousel.js
@@ -7,18 +7,17 @@
import {
defineJQueryPlugin,
- getElementFromSelector,
getNextActiveElement,
isRTL,
isVisible,
reflow,
triggerTransitionEnd
-} from './util/index'
-import EventHandler from './dom/event-handler'
-import Manipulator from './dom/manipulator'
-import SelectorEngine from './dom/selector-engine'
-import Swipe from './util/swipe'
-import BaseComponent from './base-component'
+} 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 Swipe from './util/swipe.js'
+import BaseComponent from './base-component.js'
/**
* Constants
@@ -431,7 +430,7 @@ class Carousel extends BaseComponent {
*/
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_SLIDE, function (event) {
- const target = getElementFromSelector(this)
+ const target = SelectorEngine.getElementFromSelector(this)
if (!target || !target.classList.contains(CLASS_NAME_CAROUSEL)) {
return
diff --git a/js/src/collapse.js b/js/src/collapse.js
index 204d18081..16250c870 100644
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -8,13 +8,11 @@
import {
defineJQueryPlugin,
getElement,
- getElementFromSelector,
- getSelectorFromElement,
reflow
-} from './util/index'
-import EventHandler from './dom/event-handler'
-import SelectorEngine from './dom/selector-engine'
-import BaseComponent from './base-component'
+} from './util/index.js'
+import EventHandler from './dom/event-handler.js'
+import SelectorEngine from './dom/selector-engine.js'
+import BaseComponent from './base-component.js'
/**
* Constants
@@ -68,7 +66,7 @@ class Collapse extends BaseComponent {
const toggleList = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
for (const elem of toggleList) {
- const selector = getSelectorFromElement(elem)
+ const selector = SelectorEngine.getSelectorFromElement(elem)
const filterElement = SelectorEngine.find(selector)
.filter(foundElement => foundElement === this._element)
@@ -185,7 +183,7 @@ class Collapse extends BaseComponent {
this._element.classList.remove(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW)
for (const trigger of this._triggerArray) {
- const element = getElementFromSelector(trigger)
+ const element = SelectorEngine.getElementFromSelector(trigger)
if (element && !this._isShown(element)) {
this._addAriaAndCollapsedClass([trigger], false)
@@ -229,7 +227,7 @@ class Collapse extends BaseComponent {
const children = this._getFirstLevelChildren(SELECTOR_DATA_TOGGLE)
for (const element of children) {
- const selected = getElementFromSelector(element)
+ const selected = SelectorEngine.getElementFromSelector(element)
if (selected) {
this._addAriaAndCollapsedClass([element], this._isShown(selected))
@@ -285,10 +283,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
event.preventDefault()
}
- const selector = getSelectorFromElement(this)
- const selectorElements = SelectorEngine.find(selector)
-
- for (const element of selectorElements) {
+ for (const element of SelectorEngine.getMultipleElementsFromSelector(this)) {
Collapse.getOrCreateInstance(element, { toggle: false }).toggle()
}
})
diff --git a/js/src/dom/event-handler.js b/js/src/dom/event-handler.js
index 9876d7733..fde195e7c 100644
--- a/js/src/dom/event-handler.js
+++ b/js/src/dom/event-handler.js
@@ -5,7 +5,7 @@
* --------------------------------------------------------------------------
*/
-import { getjQuery } from '../util/index'
+import { getjQuery } from '../util/index.js'
/**
* Constants
@@ -198,9 +198,8 @@ function removeHandler(element, events, typeEvent, handler, delegationSelector)
function removeNamespacedHandlers(element, events, typeEvent, namespace) {
const storeElementEvent = events[typeEvent] || {}
- for (const handlerKey of Object.keys(storeElementEvent)) {
+ for (const [handlerKey, event] of Object.entries(storeElementEvent)) {
if (handlerKey.includes(namespace)) {
- const event = storeElementEvent[handlerKey]
removeHandler(element, events, typeEvent, event.callable, event.delegationSelector)
}
}
@@ -248,11 +247,10 @@ const EventHandler = {
}
}
- for (const keyHandlers of Object.keys(storeElementEvent)) {
+ for (const [keyHandlers, event] of Object.entries(storeElementEvent)) {
const handlerKey = keyHandlers.replace(stripUidRegex, '')
if (!inNamespace || originalTypeEvent.includes(handlerKey)) {
- const event = storeElementEvent[keyHandlers]
removeHandler(element, events, typeEvent, event.callable, event.delegationSelector)
}
}
@@ -300,8 +298,8 @@ const EventHandler = {
}
}
-function hydrateObj(obj, meta) {
- for (const [key, value] of Object.entries(meta || {})) {
+function hydrateObj(obj, meta = {}) {
+ for (const [key, value] of Object.entries(meta)) {
try {
obj[key] = value
} catch {
diff --git a/js/src/dom/selector-engine.js b/js/src/dom/selector-engine.js
index 1ba104f9e..da93a35be 100644
--- a/js/src/dom/selector-engine.js
+++ b/js/src/dom/selector-engine.js
@@ -5,11 +5,32 @@
* --------------------------------------------------------------------------
*/
-import { isDisabled, isVisible } from '../util/index'
+import { isDisabled, isVisible, parseSelector } from '../util/index.js'
-/**
- * Constants
- */
+const getSelector = element => {
+ let selector = element.getAttribute('data-bs-target')
+
+ if (!selector || selector === '#') {
+ let hrefAttribute = element.getAttribute('href')
+
+ // The only valid content that could double as a selector are IDs or classes,
+ // so everything starting with `#` or `.`. If a "real" URL is used as the selector,
+ // `document.querySelector` will rightfully complain it is invalid.
+ // See https://github.com/twbs/bootstrap/issues/32273
+ if (!hrefAttribute || (!hrefAttribute.includes('#') && !hrefAttribute.startsWith('.'))) {
+ return null
+ }
+
+ // Just in case some CMS puts out a full URL with the anchor appended
+ if (hrefAttribute.includes('#') && !hrefAttribute.startsWith('#')) {
+ hrefAttribute = `#${hrefAttribute.split('#')[1]}`
+ }
+
+ selector = hrefAttribute && hrefAttribute !== '#' ? hrefAttribute.trim() : null
+ }
+
+ return parseSelector(selector)
+}
const SelectorEngine = {
find(selector, element = document.documentElement) {
@@ -77,6 +98,28 @@ const SelectorEngine = {
].map(selector => `${selector}:not([tabindex^="-"])`).join(',')
return this.find(focusables, element).filter(el => !isDisabled(el) && isVisible(el))
+ },
+
+ getSelectorFromElement(element) {
+ const selector = getSelector(element)
+
+ if (selector) {
+ return SelectorEngine.findOne(selector) ? selector : null
+ }
+
+ return null
+ },
+
+ getElementFromSelector(element) {
+ const selector = getSelector(element)
+
+ return selector ? SelectorEngine.findOne(selector) : null
+ },
+
+ getMultipleElementsFromSelector(element) {
+ const selector = getSelector(element)
+
+ return selector ? SelectorEngine.find(selector) : []
}
}
diff --git a/js/src/dropdown.js b/js/src/dropdown.js
index 9596baa9a..c699598f7 100644
--- a/js/src/dropdown.js
+++ b/js/src/dropdown.js
@@ -8,6 +8,7 @@
import * as Popper from '@popperjs/core'
import {
defineJQueryPlugin,
+ execute,
getElement,
getNextActiveElement,
isDisabled,
@@ -15,11 +16,11 @@ import {
isRTL,
isVisible,
noop
-} from './util/index'
-import EventHandler from './dom/event-handler'
-import Manipulator from './dom/manipulator'
-import SelectorEngine from './dom/selector-engine'
-import BaseComponent from './base-component'
+} 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
@@ -319,7 +320,7 @@ class Dropdown extends BaseComponent {
return {
...defaultBsPopperConfig,
- ...(typeof this._config.popperConfig === 'function' ? this._config.popperConfig(defaultBsPopperConfig) : this._config.popperConfig)
+ ...execute(this._config.popperConfig, [defaultBsPopperConfig])
}
}
diff --git a/js/src/modal.js b/js/src/modal.js
index 26c7e8c93..da1bcdca3 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -5,14 +5,14 @@
* --------------------------------------------------------------------------
*/
-import { defineJQueryPlugin, getElementFromSelector, isRTL, isVisible, reflow } from './util/index'
-import EventHandler from './dom/event-handler'
-import SelectorEngine from './dom/selector-engine'
-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'
+import { defineJQueryPlugin, isRTL, isVisible, reflow } from './util/index.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'
/**
* Constants
@@ -336,7 +336,7 @@ class Modal extends BaseComponent {
*/
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
- const target = getElementFromSelector(this)
+ const target = SelectorEngine.getElementFromSelector(this)
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault()
diff --git a/js/src/offcanvas.js b/js/src/offcanvas.js
index 7dd06fd71..6dd1e720f 100644
--- a/js/src/offcanvas.js
+++ b/js/src/offcanvas.js
@@ -7,17 +7,16 @@
import {
defineJQueryPlugin,
- getElementFromSelector,
isDisabled,
isVisible
-} from './util/index'
-import ScrollBarHelper from './util/scrollbar'
-import EventHandler from './dom/event-handler'
-import BaseComponent from './base-component'
-import SelectorEngine from './dom/selector-engine'
-import Backdrop from './util/backdrop'
-import FocusTrap from './util/focustrap'
-import { enableDismissTrigger } from './util/component-functions'
+} 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
@@ -231,7 +230,7 @@ class Offcanvas extends BaseComponent {
*/
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
- const target = getElementFromSelector(this)
+ const target = SelectorEngine.getElementFromSelector(this)
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault()
diff --git a/js/src/popover.js b/js/src/popover.js
index 1b09dd425..477545672 100644
--- a/js/src/popover.js
+++ b/js/src/popover.js
@@ -5,8 +5,8 @@
* --------------------------------------------------------------------------
*/
-import { defineJQueryPlugin } from './util/index'
-import Tooltip from './tooltip'
+import { defineJQueryPlugin } from './util/index.js'
+import Tooltip from './tooltip.js'
/**
* Constants
diff --git a/js/src/scrollspy.js b/js/src/scrollspy.js
index 01aba997d..b2c8555c7 100644
--- a/js/src/scrollspy.js
+++ b/js/src/scrollspy.js
@@ -5,10 +5,10 @@
* --------------------------------------------------------------------------
*/
-import { defineJQueryPlugin, getElement, isDisabled, isVisible } from './util/index'
-import EventHandler from './dom/event-handler'
-import SelectorEngine from './dom/selector-engine'
-import BaseComponent from './base-component'
+import { defineJQueryPlugin, getElement, isDisabled, isVisible } from './util/index.js'
+import EventHandler from './dom/event-handler.js'
+import SelectorEngine from './dom/selector-engine.js'
+import BaseComponent from './base-component.js'
/**
* Constants
diff --git a/js/src/tab.js b/js/src/tab.js
index 8dc4644c9..efd0398ff 100644
--- a/js/src/tab.js
+++ b/js/src/tab.js
@@ -5,10 +5,10 @@
* --------------------------------------------------------------------------
*/
-import { defineJQueryPlugin, getElementFromSelector, getNextActiveElement, isDisabled } from './util/index'
-import EventHandler from './dom/event-handler'
-import SelectorEngine from './dom/selector-engine'
-import BaseComponent from './base-component'
+import { defineJQueryPlugin, getNextActiveElement, isDisabled } from './util/index.js'
+import EventHandler from './dom/event-handler.js'
+import SelectorEngine from './dom/selector-engine.js'
+import BaseComponent from './base-component.js'
/**
* Constants
@@ -106,7 +106,7 @@ class Tab extends BaseComponent {
element.classList.add(CLASS_NAME_ACTIVE)
- this._activate(getElementFromSelector(element)) // Search and activate/show the proper section
+ this._activate(SelectorEngine.getElementFromSelector(element)) // Search and activate/show the proper section
const complete = () => {
if (element.getAttribute('role') !== 'tab') {
@@ -133,7 +133,7 @@ class Tab extends BaseComponent {
element.classList.remove(CLASS_NAME_ACTIVE)
element.blur()
- this._deactivate(getElementFromSelector(element)) // Search and deactivate the shown section too
+ this._deactivate(SelectorEngine.getElementFromSelector(element)) // Search and deactivate the shown section too
const complete = () => {
if (element.getAttribute('role') !== 'tab') {
@@ -203,7 +203,7 @@ class Tab extends BaseComponent {
}
_setInitialAttributesOnTargetPanel(child) {
- const target = getElementFromSelector(child)
+ const target = SelectorEngine.getElementFromSelector(child)
if (!target) {
return
diff --git a/js/src/toast.js b/js/src/toast.js
index a7fe7751d..7c6c7c10b 100644
--- a/js/src/toast.js
+++ b/js/src/toast.js
@@ -5,10 +5,10 @@
* --------------------------------------------------------------------------
*/
-import { defineJQueryPlugin, reflow } from './util/index'
-import EventHandler from './dom/event-handler'
-import BaseComponent from './base-component'
-import { enableDismissTrigger } from './util/component-functions'
+import { defineJQueryPlugin, reflow } from './util/index.js'
+import EventHandler from './dom/event-handler.js'
+import BaseComponent from './base-component.js'
+import { enableDismissTrigger } from './util/component-functions.js'
/**
* Constants
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 748a0e198..85c4a39c8 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -6,12 +6,12 @@
*/
import * as Popper from '@popperjs/core'
-import { defineJQueryPlugin, findShadowRoot, getElement, getUID, isRTL, noop } from './util/index'
-import { DefaultAllowlist } from './util/sanitizer'
-import EventHandler from './dom/event-handler'
-import Manipulator from './dom/manipulator'
-import BaseComponent from './base-component'
-import TemplateFactory from './util/template-factory'
+import { defineJQueryPlugin, execute, findShadowRoot, getElement, getUID, isRTL, noop } from './util/index.js'
+import { DefaultAllowlist } from './util/sanitizer.js'
+import EventHandler from './dom/event-handler.js'
+import Manipulator from './dom/manipulator.js'
+import BaseComponent from './base-component.js'
+import TemplateFactory from './util/template-factory.js'
/**
* Constants
@@ -370,9 +370,7 @@ class Tooltip extends BaseComponent {
}
_createPopper(tip) {
- const placement = typeof this._config.placement === 'function' ?
- this._config.placement.call(this, tip, this._element) :
- this._config.placement
+ const placement = execute(this._config.placement, [this, tip, this._element])
const attachment = AttachmentMap[placement.toUpperCase()]
return Popper.createPopper(this._element, tip, this._getPopperConfig(attachment))
}
@@ -392,7 +390,7 @@ class Tooltip extends BaseComponent {
}
_resolvePossibleFunction(arg) {
- return typeof arg === 'function' ? arg.call(this._element) : arg
+ return execute(arg, [this._element])
}
_getPopperConfig(attachment) {
@@ -438,7 +436,7 @@ class Tooltip extends BaseComponent {
return {
...defaultBsPopperConfig,
- ...(typeof this._config.popperConfig === 'function' ? this._config.popperConfig(defaultBsPopperConfig) : this._config.popperConfig)
+ ...execute(this._config.popperConfig, [defaultBsPopperConfig])
}
}
@@ -579,9 +577,9 @@ class Tooltip extends BaseComponent {
_getDelegateConfig() {
const config = {}
- for (const key in this._config) {
- if (this.constructor.Default[key] !== this._config[key]) {
- config[key] = this._config[key]
+ for (const [key, value] of Object.entries(this._config)) {
+ if (this.constructor.Default[key] !== value) {
+ config[key] = value
}
}
diff --git a/js/src/util/backdrop.js b/js/src/util/backdrop.js
index 78279e056..ee560b85e 100644
--- a/js/src/util/backdrop.js
+++ b/js/src/util/backdrop.js
@@ -5,9 +5,9 @@
* --------------------------------------------------------------------------
*/
-import EventHandler from '../dom/event-handler'
-import { execute, executeAfterTransition, getElement, reflow } from './index'
-import Config from './config'
+import EventHandler from '../dom/event-handler.js'
+import { execute, executeAfterTransition, getElement, reflow } from './index.js'
+import Config from './config.js'
/**
* Constants
diff --git a/js/src/util/component-functions.js b/js/src/util/component-functions.js
index c2f99cceb..15f2f8c52 100644
--- a/js/src/util/component-functions.js
+++ b/js/src/util/component-functions.js
@@ -5,8 +5,9 @@
* --------------------------------------------------------------------------
*/
-import EventHandler from '../dom/event-handler'
-import { getElementFromSelector, isDisabled } from './index'
+import EventHandler from '../dom/event-handler.js'
+import { isDisabled } from './index.js'
+import SelectorEngine from '../dom/selector-engine.js'
const enableDismissTrigger = (component, method = 'hide') => {
const clickEvent = `click.dismiss${component.EVENT_KEY}`
@@ -21,7 +22,7 @@ const enableDismissTrigger = (component, method = 'hide') => {
return
}
- const target = getElementFromSelector(this) || this.closest(`.${name}`)
+ const target = SelectorEngine.getElementFromSelector(this) || this.closest(`.${name}`)
const instance = component.getOrCreateInstance(target)
// Method argument is left, for Alert and only, as it doesn't implement the 'hide' method
diff --git a/js/src/util/config.js b/js/src/util/config.js
index 1205905f7..a37fe52a1 100644
--- a/js/src/util/config.js
+++ b/js/src/util/config.js
@@ -5,8 +5,8 @@
* --------------------------------------------------------------------------
*/
-import { isElement, toType } from './index'
-import Manipulator from '../dom/manipulator'
+import { isElement, toType } from './index.js'
+import Manipulator from '../dom/manipulator.js'
/**
* Class definition
@@ -49,8 +49,7 @@ class Config {
}
_typeCheckConfig(config, configTypes = this.constructor.DefaultType) {
- for (const property of Object.keys(configTypes)) {
- const expectedTypes = configTypes[property]
+ for (const [property, expectedTypes] of Object.entries(configTypes)) {
const value = config[property]
const valueType = isElement(value) ? 'element' : toType(value)
diff --git a/js/src/util/focustrap.js b/js/src/util/focustrap.js
index ef6916679..1736c4f7c 100644
--- a/js/src/util/focustrap.js
+++ b/js/src/util/focustrap.js
@@ -5,9 +5,9 @@
* --------------------------------------------------------------------------
*/
-import EventHandler from '../dom/event-handler'
-import SelectorEngine from '../dom/selector-engine'
-import Config from './config'
+import EventHandler from '../dom/event-handler.js'
+import SelectorEngine from '../dom/selector-engine.js'
+import Config from './config.js'
/**
* Constants
diff --git a/js/src/util/index.js b/js/src/util/index.js
index 297e57149..77de14d3a 100644
--- a/js/src/util/index.js
+++ b/js/src/util/index.js
@@ -9,6 +9,20 @@ const MAX_UID = 1_000_000
const MILLISECONDS_MULTIPLIER = 1000
const TRANSITION_END = 'transitionend'
+/**
+ * Properly escape IDs selectors to handle weird IDs
+ * @param {string} selector
+ * @returns {string}
+ */
+const parseSelector = selector => {
+ if (selector && window.CSS && window.CSS.escape) {
+ // document.querySelector needs escaping to handle IDs (html5+) containing for instance /
+ selector = selector.replace(/#([^\s"#']+)/g, (match, id) => `#${CSS.escape(id)}`)
+ }
+
+ return selector
+}
+
// Shout-out Angus Croll (https://goo.gl/pxwQGp)
const toType = object => {
if (object === null || object === undefined) {
@@ -30,47 +44,6 @@ const getUID = prefix => {
return prefix
}
-const getSelector = element => {
- let selector = element.getAttribute('data-bs-target')
-
- if (!selector || selector === '#') {
- let hrefAttribute = element.getAttribute('href')
-
- // The only valid content that could double as a selector are IDs or classes,
- // so everything starting with `#` or `.`. If a "real" URL is used as the selector,
- // `document.querySelector` will rightfully complain it is invalid.
- // See https://github.com/twbs/bootstrap/issues/32273
- if (!hrefAttribute || (!hrefAttribute.includes('#') && !hrefAttribute.startsWith('.'))) {
- return null
- }
-
- // Just in case some CMS puts out a full URL with the anchor appended
- if (hrefAttribute.includes('#') && !hrefAttribute.startsWith('#')) {
- hrefAttribute = `#${hrefAttribute.split('#')[1]}`
- }
-
- selector = hrefAttribute && hrefAttribute !== '#' ? hrefAttribute.trim() : null
- }
-
- return selector
-}
-
-const getSelectorFromElement = element => {
- const selector = getSelector(element)
-
- if (selector) {
- return document.querySelector(selector) ? selector : null
- }
-
- return null
-}
-
-const getElementFromSelector = element => {
- const selector = getSelector(element)
-
- return selector ? document.querySelector(selector) : null
-}
-
const getTransitionDurationFromElement = element => {
if (!element) {
return 0
@@ -117,7 +90,7 @@ const getElement = object => {
}
if (typeof object === 'string' && object.length > 0) {
- return document.querySelector(object)
+ return document.querySelector(parseSelector(object))
}
return null
@@ -249,10 +222,8 @@ const defineJQueryPlugin = plugin => {
})
}
-const execute = callback => {
- if (typeof callback === 'function') {
- callback()
- }
+const execute = (possibleCallback, args = [], defaultValue = possibleCallback) => {
+ return typeof possibleCallback === 'function' ? possibleCallback(...args) : defaultValue
}
const executeAfterTransition = (callback, transitionElement, waitForTransition = true) => {
@@ -318,10 +289,8 @@ export {
executeAfterTransition,
findShadowRoot,
getElement,
- getElementFromSelector,
getjQuery,
getNextActiveElement,
- getSelectorFromElement,
getTransitionDurationFromElement,
getUID,
isDisabled,
@@ -330,6 +299,7 @@ export {
isVisible,
noop,
onDOMContentLoaded,
+ parseSelector,
reflow,
triggerTransitionEnd,
toType
diff --git a/js/src/util/scrollbar.js b/js/src/util/scrollbar.js
index 5cac7b6d1..f6bd9de31 100644
--- a/js/src/util/scrollbar.js
+++ b/js/src/util/scrollbar.js
@@ -5,9 +5,9 @@
* --------------------------------------------------------------------------
*/
-import SelectorEngine from '../dom/selector-engine'
-import Manipulator from '../dom/manipulator'
-import { isElement } from './index'
+import SelectorEngine from '../dom/selector-engine.js'
+import Manipulator from '../dom/manipulator.js'
+import { isElement } from './index.js'
/**
* Constants
diff --git a/js/src/util/swipe.js b/js/src/util/swipe.js
index 7126360ce..fe04a2437 100644
--- a/js/src/util/swipe.js
+++ b/js/src/util/swipe.js
@@ -5,9 +5,9 @@
* --------------------------------------------------------------------------
*/
-import Config from './config'
-import EventHandler from '../dom/event-handler'
-import { execute } from './index'
+import Config from './config.js'
+import EventHandler from '../dom/event-handler.js'
+import { execute } from './index.js'
/**
* Constants
diff --git a/js/src/util/template-factory.js b/js/src/util/template-factory.js
index cf402fa3b..5046f0e31 100644
--- a/js/src/util/template-factory.js
+++ b/js/src/util/template-factory.js
@@ -5,10 +5,10 @@
* --------------------------------------------------------------------------
*/
-import { DefaultAllowlist, sanitizeHtml } from './sanitizer'
-import { getElement, isElement } from '../util/index'
-import SelectorEngine from '../dom/selector-engine'
-import Config from './config'
+import { DefaultAllowlist, sanitizeHtml } from './sanitizer.js'
+import { execute, getElement, isElement } from './index.js'
+import SelectorEngine from '../dom/selector-engine.js'
+import Config from './config.js'
/**
* Constants
@@ -143,7 +143,7 @@ class TemplateFactory extends Config {
}
_resolvePossibleFunction(arg) {
- return typeof arg === 'function' ? arg(this) : arg
+ return execute(arg, [this])
}
_putElementInTemplate(element, templateElement) {