aboutsummaryrefslogtreecommitdiffstats
path: root/vendor/twbs/bootstrap/js/src/collapse.js
diff options
context:
space:
mode:
Diffstat (limited to 'vendor/twbs/bootstrap/js/src/collapse.js')
-rw-r--r--vendor/twbs/bootstrap/js/src/collapse.js185
1 files changed, 66 insertions, 119 deletions
diff --git a/vendor/twbs/bootstrap/js/src/collapse.js b/vendor/twbs/bootstrap/js/src/collapse.js
index 8831510df..33d5674eb 100644
--- a/vendor/twbs/bootstrap/js/src/collapse.js
+++ b/vendor/twbs/bootstrap/js/src/collapse.js
@@ -1,6 +1,6 @@
/**
* --------------------------------------------------------------------------
- * Bootstrap (v5.0.2): collapse.js
+ * Bootstrap (v5.1.3): collapse.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
* --------------------------------------------------------------------------
*/
@@ -32,12 +32,12 @@ const DATA_API_KEY = '.data-api'
const Default = {
toggle: true,
- parent: ''
+ parent: null
}
const DefaultType = {
toggle: 'boolean',
- parent: '(string|element)'
+ parent: '(null|element)'
}
const EVENT_SHOW = `show${EVENT_KEY}`
@@ -50,11 +50,13 @@ const CLASS_NAME_SHOW = 'show'
const CLASS_NAME_COLLAPSE = 'collapse'
const CLASS_NAME_COLLAPSING = 'collapsing'
const CLASS_NAME_COLLAPSED = 'collapsed'
+const CLASS_NAME_DEEPER_CHILDREN = `:scope .${CLASS_NAME_COLLAPSE} .${CLASS_NAME_COLLAPSE}`
+const CLASS_NAME_HORIZONTAL = 'collapse-horizontal'
const WIDTH = 'width'
const HEIGHT = 'height'
-const SELECTOR_ACTIVES = '.show, .collapsing'
+const SELECTOR_ACTIVES = '.collapse.show, .collapse.collapsing'
const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="collapse"]'
/**
@@ -69,10 +71,7 @@ class Collapse extends BaseComponent {
this._isTransitioning = false
this._config = this._getConfig(config)
- this._triggerArray = SelectorEngine.find(
- `${SELECTOR_DATA_TOGGLE}[href="#${this._element.id}"],` +
- `${SELECTOR_DATA_TOGGLE}[data-bs-target="#${this._element.id}"]`
- )
+ this._triggerArray = []
const toggleList = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
@@ -88,10 +87,10 @@ class Collapse extends BaseComponent {
}
}
- this._parent = this._config.parent ? this._getParent() : null
+ this._initializeChildren()
if (!this._config.parent) {
- this._addAriaAndCollapsedClass(this._element, this._triggerArray)
+ this._addAriaAndCollapsedClass(this._triggerArray, this._isShown())
}
if (this._config.toggle) {
@@ -112,7 +111,7 @@ class Collapse extends BaseComponent {
// Public
toggle() {
- if (this._element.classList.contains(CLASS_NAME_SHOW)) {
+ if (this._isShown()) {
this.hide()
} else {
this.show()
@@ -120,30 +119,20 @@ class Collapse extends BaseComponent {
}
show() {
- if (this._isTransitioning || this._element.classList.contains(CLASS_NAME_SHOW)) {
+ if (this._isTransitioning || this._isShown()) {
return
}
- let actives
+ let actives = []
let activesData
- if (this._parent) {
- actives = SelectorEngine.find(SELECTOR_ACTIVES, this._parent)
- .filter(elem => {
- if (typeof this._config.parent === 'string') {
- return elem.getAttribute('data-bs-parent') === this._config.parent
- }
-
- return elem.classList.contains(CLASS_NAME_COLLAPSE)
- })
-
- if (actives.length === 0) {
- actives = null
- }
+ if (this._config.parent) {
+ const children = SelectorEngine.find(CLASS_NAME_DEEPER_CHILDREN, this._config.parent)
+ actives = SelectorEngine.find(SELECTOR_ACTIVES, this._config.parent).filter(elem => !children.includes(elem)) // remove children if greater depth
}
const container = SelectorEngine.findOne(this._selector)
- if (actives) {
+ if (actives.length) {
const tempActiveData = actives.find(elem => container !== elem)
activesData = tempActiveData ? Collapse.getInstance(tempActiveData) : null
@@ -157,17 +146,15 @@ class Collapse extends BaseComponent {
return
}
- if (actives) {
- actives.forEach(elemActive => {
- if (container !== elemActive) {
- Collapse.collapseInterface(elemActive, 'hide')
- }
+ actives.forEach(elemActive => {
+ if (container !== elemActive) {
+ Collapse.getOrCreateInstance(elemActive, { toggle: false }).hide()
+ }
- if (!activesData) {
- Data.set(elemActive, DATA_KEY, null)
- }
- })
- }
+ if (!activesData) {
+ Data.set(elemActive, DATA_KEY, null)
+ }
+ })
const dimension = this._getDimension()
@@ -176,23 +163,17 @@ class Collapse extends BaseComponent {
this._element.style[dimension] = 0
- if (this._triggerArray.length) {
- this._triggerArray.forEach(element => {
- element.classList.remove(CLASS_NAME_COLLAPSED)
- element.setAttribute('aria-expanded', true)
- })
- }
-
- this.setTransitioning(true)
+ this._addAriaAndCollapsedClass(this._triggerArray, true)
+ this._isTransitioning = true
const complete = () => {
+ this._isTransitioning = false
+
this._element.classList.remove(CLASS_NAME_COLLAPSING)
this._element.classList.add(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW)
this._element.style[dimension] = ''
- this.setTransitioning(false)
-
EventHandler.trigger(this._element, EVENT_SHOWN)
}
@@ -204,7 +185,7 @@ class Collapse extends BaseComponent {
}
hide() {
- if (this._isTransitioning || !this._element.classList.contains(CLASS_NAME_SHOW)) {
+ if (this._isTransitioning || !this._isShown()) {
return
}
@@ -223,22 +204,19 @@ class Collapse extends BaseComponent {
this._element.classList.remove(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW)
const triggerArrayLength = this._triggerArray.length
- if (triggerArrayLength > 0) {
- for (let i = 0; i < triggerArrayLength; i++) {
- const trigger = this._triggerArray[i]
- const elem = getElementFromSelector(trigger)
-
- if (elem && !elem.classList.contains(CLASS_NAME_SHOW)) {
- trigger.classList.add(CLASS_NAME_COLLAPSED)
- trigger.setAttribute('aria-expanded', false)
- }
+ for (let i = 0; i < triggerArrayLength; i++) {
+ const trigger = this._triggerArray[i]
+ const elem = getElementFromSelector(trigger)
+
+ if (elem && !this._isShown(elem)) {
+ this._addAriaAndCollapsedClass([trigger], false)
}
}
- this.setTransitioning(true)
+ this._isTransitioning = true
const complete = () => {
- this.setTransitioning(false)
+ this._isTransitioning = false
this._element.classList.remove(CLASS_NAME_COLLAPSING)
this._element.classList.add(CLASS_NAME_COLLAPSE)
EventHandler.trigger(this._element, EVENT_HIDDEN)
@@ -249,8 +227,8 @@ class Collapse extends BaseComponent {
this._queueCallback(complete, this._element, true)
}
- setTransitioning(isTransitioning) {
- this._isTransitioning = isTransitioning
+ _isShown(element = this._element) {
+ return element.classList.contains(CLASS_NAME_SHOW)
}
// Private
@@ -258,44 +236,40 @@ class Collapse extends BaseComponent {
_getConfig(config) {
config = {
...Default,
+ ...Manipulator.getDataAttributes(this._element),
...config
}
config.toggle = Boolean(config.toggle) // Coerce string values
+ config.parent = getElement(config.parent)
typeCheckConfig(NAME, config, DefaultType)
return config
}
_getDimension() {
- return this._element.classList.contains(WIDTH) ? WIDTH : HEIGHT
+ return this._element.classList.contains(CLASS_NAME_HORIZONTAL) ? WIDTH : HEIGHT
}
- _getParent() {
- let { parent } = this._config
-
- parent = getElement(parent)
-
- const selector = `${SELECTOR_DATA_TOGGLE}[data-bs-parent="${parent}"]`
+ _initializeChildren() {
+ if (!this._config.parent) {
+ return
+ }
- SelectorEngine.find(selector, parent)
+ const children = SelectorEngine.find(CLASS_NAME_DEEPER_CHILDREN, this._config.parent)
+ SelectorEngine.find(SELECTOR_DATA_TOGGLE, this._config.parent).filter(elem => !children.includes(elem))
.forEach(element => {
const selected = getElementFromSelector(element)
- this._addAriaAndCollapsedClass(
- selected,
- [element]
- )
+ if (selected) {
+ this._addAriaAndCollapsedClass([element], this._isShown(selected))
+ }
})
-
- return parent
}
- _addAriaAndCollapsedClass(element, triggerArray) {
- if (!element || !triggerArray.length) {
+ _addAriaAndCollapsedClass(triggerArray, isOpen) {
+ if (!triggerArray.length) {
return
}
- const isOpen = element.classList.contains(CLASS_NAME_SHOW)
-
triggerArray.forEach(elem => {
if (isOpen) {
elem.classList.remove(CLASS_NAME_COLLAPSED)
@@ -309,34 +283,22 @@ class Collapse extends BaseComponent {
// Static
- static collapseInterface(element, config) {
- let data = Collapse.getInstance(element)
- const _config = {
- ...Default,
- ...Manipulator.getDataAttributes(element),
- ...(typeof config === 'object' && config ? config : {})
- }
+ static jQueryInterface(config) {
+ return this.each(function () {
+ const _config = {}
+ if (typeof config === 'string' && /show|hide/.test(config)) {
+ _config.toggle = false
+ }
- if (!data && _config.toggle && typeof config === 'string' && /show|hide/.test(config)) {
- _config.toggle = false
- }
+ const data = Collapse.getOrCreateInstance(this, _config)
- if (!data) {
- data = new Collapse(element, _config)
- }
+ if (typeof config === 'string') {
+ if (typeof data[config] === 'undefined') {
+ throw new TypeError(`No method named "${config}"`)
+ }
- if (typeof config === 'string') {
- if (typeof data[config] === 'undefined') {
- throw new TypeError(`No method named "${config}"`)
+ data[config]()
}
-
- data[config]()
- }
- }
-
- static jQueryInterface(config) {
- return this.each(function () {
- Collapse.collapseInterface(this, config)
})
}
}
@@ -353,26 +315,11 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
event.preventDefault()
}
- const triggerData = Manipulator.getDataAttributes(this)
const selector = getSelectorFromElement(this)
const selectorElements = SelectorEngine.find(selector)
selectorElements.forEach(element => {
- const data = Collapse.getInstance(element)
- let config
- if (data) {
- // update parent attribute
- if (data._parent === null && typeof triggerData.parent === 'string') {
- data._config.parent = triggerData.parent
- data._parent = data._getParent()
- }
-
- config = 'toggle'
- } else {
- config = triggerData
- }
-
- Collapse.collapseInterface(element, config)
+ Collapse.getOrCreateInstance(element, { toggle: false }).toggle()
})
})