aboutsummaryrefslogtreecommitdiffstats
path: root/vendor/twbs/bootstrap/js/src/util/scrollbar.js
diff options
context:
space:
mode:
Diffstat (limited to 'vendor/twbs/bootstrap/js/src/util/scrollbar.js')
-rw-r--r--vendor/twbs/bootstrap/js/src/util/scrollbar.js77
1 files changed, 47 insertions, 30 deletions
diff --git a/vendor/twbs/bootstrap/js/src/util/scrollbar.js b/vendor/twbs/bootstrap/js/src/util/scrollbar.js
index a90f21a79..6ddc063e4 100644
--- a/vendor/twbs/bootstrap/js/src/util/scrollbar.js
+++ b/vendor/twbs/bootstrap/js/src/util/scrollbar.js
@@ -1,6 +1,6 @@
/**
* --------------------------------------------------------------------------
- * Bootstrap (v5.1.3): util/scrollBar.js
+ * Bootstrap (v5.2.0): util/scrollBar.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
* --------------------------------------------------------------------------
*/
@@ -9,14 +9,25 @@ import SelectorEngine from '../dom/selector-engine'
import Manipulator from '../dom/manipulator'
import { isElement } from './index'
+/**
+ * Constants
+ */
+
const SELECTOR_FIXED_CONTENT = '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top'
const SELECTOR_STICKY_CONTENT = '.sticky-top'
+const PROPERTY_PADDING = 'padding-right'
+const PROPERTY_MARGIN = 'margin-right'
+
+/**
+ * Class definition
+ */
class ScrollBarHelper {
constructor() {
this._element = document.body
}
+ // Public
getWidth() {
// https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes
const documentWidth = document.documentElement.clientWidth
@@ -27,55 +38,62 @@ class ScrollBarHelper {
const width = this.getWidth()
this._disableOverFlow()
// give padding to element to balance the hidden scrollbar width
- this._setElementAttributes(this._element, 'paddingRight', calculatedValue => calculatedValue + width)
+ this._setElementAttributes(this._element, PROPERTY_PADDING, calculatedValue => calculatedValue + width)
// trick: We adjust positive paddingRight and negative marginRight to sticky-top elements to keep showing fullwidth
- this._setElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight', calculatedValue => calculatedValue + width)
- this._setElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight', calculatedValue => calculatedValue - width)
+ this._setElementAttributes(SELECTOR_FIXED_CONTENT, PROPERTY_PADDING, calculatedValue => calculatedValue + width)
+ this._setElementAttributes(SELECTOR_STICKY_CONTENT, PROPERTY_MARGIN, calculatedValue => calculatedValue - width)
+ }
+
+ reset() {
+ this._resetElementAttributes(this._element, 'overflow')
+ this._resetElementAttributes(this._element, PROPERTY_PADDING)
+ this._resetElementAttributes(SELECTOR_FIXED_CONTENT, PROPERTY_PADDING)
+ this._resetElementAttributes(SELECTOR_STICKY_CONTENT, PROPERTY_MARGIN)
+ }
+
+ isOverflowing() {
+ return this.getWidth() > 0
}
+ // Private
_disableOverFlow() {
this._saveInitialAttribute(this._element, 'overflow')
this._element.style.overflow = 'hidden'
}
- _setElementAttributes(selector, styleProp, callback) {
+ _setElementAttributes(selector, styleProperty, callback) {
const scrollbarWidth = this.getWidth()
const manipulationCallBack = element => {
if (element !== this._element && window.innerWidth > element.clientWidth + scrollbarWidth) {
return
}
- this._saveInitialAttribute(element, styleProp)
- const calculatedValue = window.getComputedStyle(element)[styleProp]
- element.style[styleProp] = `${callback(Number.parseFloat(calculatedValue))}px`
+ this._saveInitialAttribute(element, styleProperty)
+ const calculatedValue = window.getComputedStyle(element).getPropertyValue(styleProperty)
+ element.style.setProperty(styleProperty, `${callback(Number.parseFloat(calculatedValue))}px`)
}
this._applyManipulationCallback(selector, manipulationCallBack)
}
- reset() {
- this._resetElementAttributes(this._element, 'overflow')
- this._resetElementAttributes(this._element, 'paddingRight')
- this._resetElementAttributes(SELECTOR_FIXED_CONTENT, 'paddingRight')
- this._resetElementAttributes(SELECTOR_STICKY_CONTENT, 'marginRight')
- }
-
- _saveInitialAttribute(element, styleProp) {
- const actualValue = element.style[styleProp]
+ _saveInitialAttribute(element, styleProperty) {
+ const actualValue = element.style.getPropertyValue(styleProperty)
if (actualValue) {
- Manipulator.setDataAttribute(element, styleProp, actualValue)
+ Manipulator.setDataAttribute(element, styleProperty, actualValue)
}
}
- _resetElementAttributes(selector, styleProp) {
+ _resetElementAttributes(selector, styleProperty) {
const manipulationCallBack = element => {
- const value = Manipulator.getDataAttribute(element, styleProp)
- if (typeof value === 'undefined') {
- element.style.removeProperty(styleProp)
- } else {
- Manipulator.removeDataAttribute(element, styleProp)
- element.style[styleProp] = value
+ const value = Manipulator.getDataAttribute(element, styleProperty)
+ // We only want to remove the property if the value is `null`; the value can also be zero
+ if (value === null) {
+ element.style.removeProperty(styleProperty)
+ return
}
+
+ Manipulator.removeDataAttribute(element, styleProperty)
+ element.style.setProperty(styleProperty, value)
}
this._applyManipulationCallback(selector, manipulationCallBack)
@@ -84,13 +102,12 @@ class ScrollBarHelper {
_applyManipulationCallback(selector, callBack) {
if (isElement(selector)) {
callBack(selector)
- } else {
- SelectorEngine.find(selector, this._element).forEach(callBack)
+ return
}
- }
- isOverflowing() {
- return this.getWidth() > 0
+ for (const sel of SelectorEngine.find(selector, this._element)) {
+ callBack(sel)
+ }
}
}