chore(merge main): patched commit → 548be2e

.bundlewatch.config.json

@@ -34,27 +34,27 @@
     },
     {
       "path": "./dist/js/boosted.bundle.js",
-      "maxSize": "45.3 kB"
+      "maxSize": "46.7 kB"
     },
     {
       "path": "./dist/js/boosted.bundle.min.js",
-      "maxSize": "22.9 kB"
+      "maxSize": "23.6 kB"
     },
     {
       "path": "./dist/js/boosted.esm.js",
-      "maxSize": "27.4 kB"
+      "maxSize": "28.8 kB"
     },
     {
       "path": "./dist/js/boosted.esm.min.js",
-      "maxSize": "18.4 kB"
+      "maxSize": "19.1 kB"
     },
     {
       "path": "./dist/js/boosted.js",
-      "maxSize": "28.1 kB"
+      "maxSize": "29.6 kB"
     },
     {
       "path": "./dist/js/boosted.min.js",
-      "maxSize": "16 kB"
+      "maxSize": "16.6 kB"
     }
   ],
   "ci": {

.eslintignore

@@ -1,6 +1,6 @@
 **/*.min.js
 **/dist/
 **/vendor/
-/_gh_pages/
+/_site/
 /js/coverage/
 /site/static/sw.js

.github/workflows/percy.yml

@@ -64,7 +64,7 @@ jobs:
       - name: Percy Test
         uses: percy/snapshot-action@v0.1.2
         with:
-          build-directory: "_gh_pages/"
+          build-directory: "_site/"
           flags: "--snapshot-files ./docs/5.0/guidelines/**/*.html,./docs/5.0/examples/cheatsheet/index.html,./docs/5.0/examples/cheatsheet-rtl/index.html"
           verbose: true
         env:

.gitignore

@@ -1,5 +1,5 @@
 # Ignore docs files
-/_gh_pages/
+/_site/
 # Hugo resources folder
 /resources/
 

.stylelintignore

@@ -1,5 +1,5 @@
 **/*.min.css
 **/dist/
 **/vendor/
-/_gh_pages/
+/_site/
 /js/coverage/

build/build-plugins.js

@@ -35,6 +35,7 @@ const bsPlugins = {
   Collapse: path.resolve(__dirname, '../js/src/collapse.js'),
   Dropdown: path.resolve(__dirname, '../js/src/dropdown.js'),
   Modal: path.resolve(__dirname, '../js/src/modal.js'),
+  OffCanvas: path.resolve(__dirname, '../js/src/offcanvas.js'),
   Popover: path.resolve(__dirname, '../js/src/popover.js'),
   ScrollSpy: path.resolve(__dirname, '../js/src/scrollspy.js'),
   Tab: path.resolve(__dirname, '../js/src/tab.js'),
@@ -71,7 +72,7 @@ const getConfigByPluginKey = pluginKey => {
     }
   }
 
-  if (pluginKey === 'Alert' || pluginKey === 'Tab') {
+  if (pluginKey === 'Alert' || pluginKey === 'Tab' || pluginKey === 'OffCanvas') {
     return defaultPluginConfig
   }
 

build/change-version.js

@@ -90,7 +90,7 @@ function main(args) {
   const newVersion = args[1]
   const EXCLUDED_DIRS = new Set([
     '.git',
-    '_gh_pages',
+    '_site',
     'node_modules',
     'resources'
   ])

build/ship.sh

@@ -47,7 +47,7 @@ npm run release
 printf "\n%s=======================================================%s" "$magenta" "$end"
 printf "\n%sCopy it over...%s" "$magenta" "$end"
 printf "\n%s=======================================================\n%s" "$magenta" "$end"
-cp -rf _gh_pages/. ../bs-docs/
+cp -rf _site/. ../bs-docs/
 printf "\nDone!\n"
 
 printf "\n%s=======================================================%s" "$green" "$end"

build/vnu-jar.js

@@ -51,7 +51,7 @@ childProcess.exec('java -version', (error, stdout, stderr) => {
     '--no-langdetect',
     '--Werror',
     `--filterpattern "${ignores}"`,
-    '_gh_pages/',
+    '_site/',
     'js/tests/'
   ]
 

build/zip-examples.js

@@ -16,7 +16,7 @@ const pkg = require('../package.json')
 
 const versionShort = pkg.config.version_short
 const distFolder = `boosted-${pkg.version}-examples`
-const rootDocsDir = '_gh_pages'
+const rootDocsDir = '_site'
 const docsDir = `${rootDocsDir}/docs/${versionShort}/`
 
 // these are the files we need in the examples

config.yml

@@ -20,7 +20,7 @@ enableRobotsTXT:        true
 metaDataFormat:         "yaml"
 disableKinds:           ["404", "taxonomy", "taxonomyTerm", "RSS"]
 
-publishDir:             "_gh_pages"
+publishDir:             "_site"
 
 module:
   mounts:

js/index.esm.js

@@ -11,6 +11,7 @@ import Carousel from './src/carousel'
 import Collapse from './src/collapse'
 import Dropdown from './src/dropdown'
 import Modal from './src/modal'
+import OffCanvas from './src/offcanvas'
 import Popover from './src/popover'
 import ScrollSpy from './src/scrollspy'
 import Tab from './src/tab'
@@ -25,6 +26,7 @@ export {
   Collapse,
   Dropdown,
   Modal,
+  OffCanvas,
   Popover,
   ScrollSpy,
   Tab,

js/index.umd.js

@@ -11,6 +11,7 @@ import Carousel from './src/carousel'
 import Collapse from './src/collapse'
 import Dropdown from './src/dropdown'
 import Modal from './src/modal'
+import OffCanvas from './src/offcanvas'
 import Popover from './src/popover'
 import ScrollSpy from './src/scrollspy'
 import Tab from './src/tab'
@@ -25,6 +26,7 @@ export default {
   Collapse,
   Dropdown,
   Modal,
+  OffCanvas,
   Popover,
   ScrollSpy,
   Tab,

js/src/alert.js

@@ -98,7 +98,7 @@ class Alert extends BaseComponent {
 
   static jQueryInterface(config) {
     return this.each(function () {
-      let data = Data.getData(this, DATA_KEY)
+      let data = Data.get(this, DATA_KEY)
 
       if (!data) {
         data = new Alert(this)

js/src/base-component.js

@@ -24,18 +24,18 @@ class BaseComponent {
     }
 
     this._element = element
-    Data.setData(this._element, this.constructor.DATA_KEY, this)
+    Data.set(this._element, this.constructor.DATA_KEY, this)
   }
 
   dispose() {
-    Data.removeData(this._element, this.constructor.DATA_KEY)
+    Data.remove(this._element, this.constructor.DATA_KEY)
     this._element = null
   }
 
   /** Static */
 
   static getInstance(element) {
-    return Data.getData(element, this.DATA_KEY)
+    return Data.get(element, this.DATA_KEY)
   }
 
   static get VERSION() {

js/src/button.js

@@ -51,7 +51,7 @@ class Button extends BaseComponent {
 
   static jQueryInterface(config) {
     return this.each(function () {
-      let data = Data.getData(this, DATA_KEY)
+      let data = Data.get(this, DATA_KEY)
 
       if (!data) {
         data = new Button(this)
@@ -75,7 +75,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, event => {
 
   const button = event.target.closest(SELECTOR_DATA_TOGGLE)
 
-  let data = Data.getData(button, DATA_KEY)
+  let data = Data.get(button, DATA_KEY)
   if (!data) {
     data = new Button(button)
   }

js/src/carousel.js

@@ -609,7 +609,7 @@ class Carousel extends BaseComponent {
   // Static
 
   static carouselInterface(element, config) {
-    let data = Data.getData(element, DATA_KEY)
+    let data = Data.get(element, DATA_KEY)
     let _config = {
       ...Default,
       ...Manipulator.getDataAttributes(element)
@@ -668,7 +668,7 @@ class Carousel extends BaseComponent {
     Carousel.carouselInterface(target, config)
 
     if (slideIndex) {
-      Data.getData(target, DATA_KEY).to(slideIndex)
+      Data.get(target, DATA_KEY).to(slideIndex)
     }
 
     event.preventDefault()
@@ -687,7 +687,7 @@ EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
   const carousels = SelectorEngine.find(SELECTOR_DATA_RIDE)
 
   for (let i = 0, len = carousels.length; i < len; i++) {
-    Carousel.carouselInterface(carousels[i], Data.getData(carousels[i], DATA_KEY))
+    Carousel.carouselInterface(carousels[i], Data.get(carousels[i], DATA_KEY))
   }
 })
 

js/src/collapse.js

@@ -147,7 +147,7 @@ class Collapse extends BaseComponent {
     const container = SelectorEngine.findOne(this._selector)
     if (actives) {
       const tempActiveData = actives.find(elem => container !== elem)
-      activesData = tempActiveData ? Data.getData(tempActiveData, DATA_KEY) : null
+      activesData = tempActiveData ? Data.get(tempActiveData, DATA_KEY) : null
 
       if (activesData && activesData._isTransitioning) {
         return
@@ -166,7 +166,7 @@ class Collapse extends BaseComponent {
         }
 
         if (!activesData) {
-          Data.setData(elemActive, DATA_KEY, null)
+          Data.set(elemActive, DATA_KEY, null)
         }
       })
     }
@@ -332,7 +332,7 @@ class Collapse extends BaseComponent {
   // Static
 
   static collapseInterface(element, config) {
-    let data = Data.getData(element, DATA_KEY)
+    let data = Data.get(element, DATA_KEY)
     const _config = {
       ...Default,
       ...Manipulator.getDataAttributes(element),
@@ -380,7 +380,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
   const selectorElements = SelectorEngine.find(selector)
 
   selectorElements.forEach(element => {
-    const data = Data.getData(element, DATA_KEY)
+    const data = Data.get(element, DATA_KEY)
     let config
     if (data) {
       // update parent attribute

js/src/dom/data.js

@@ -11,57 +11,47 @@
  * ------------------------------------------------------------------------
  */
 
-const mapData = (() => {
-  const storeData = {}
-  let id = 1
-  return {
-    set(element, key, data) {
-      if (typeof element.bsKey === 'undefined') {
-        element.bsKey = {
-          key,
-          id
-        }
-        id++
-      }
+const elementMap = new Map()
 
-      storeData[element.bsKey.id] = data
-    },
-    get(element, key) {
-      if (!element || typeof element.bsKey === 'undefined') {
-        return null
-      }
-
-      const keyProperties = element.bsKey
-      if (keyProperties.key === key) {
-        return storeData[keyProperties.id]
-      }
+export default {
+  set(element, key, instance) {
+    if (!elementMap.has(element)) {
+      elementMap.set(element, new Map())
+    }
 
-      return null
-    },
-    delete(element, key) {
-      if (typeof element.bsKey === 'undefined') {
-        return
-      }
+    const instanceMap = elementMap.get(element)
 
-      const keyProperties = element.bsKey
-      if (keyProperties.key === key) {
-        delete storeData[keyProperties.id]
-        delete element.bsKey
-      }
+    // make it clear we only want one instance per element
+    // can be removed later when multiple key/instances are fine to be used
+    if (!instanceMap.has(key) && instanceMap.size !== 0) {
+      // eslint-disable-next-line no-console
+      console.error(`Bootstrap doesn't allow more than one instance per element. Bound instance: ${Array.from(instanceMap.keys())[0]}.`)
+      return
     }
-  }
-})()
 
-const Data = {
-  setData(instance, key, data) {
-    mapData.set(instance, key, data)
+    instanceMap.set(key, instance)
   },
-  getData(instance, key) {
-    return mapData.get(instance, key)
+
+  get(element, key) {
+    if (elementMap.has(element)) {
+      return elementMap.get(element).get(key) || null
+    }
+
+    return null
   },
-  removeData(instance, key) {
-    mapData.delete(instance, key)
+
+  remove(element, key) {
+    if (!elementMap.has(element)) {
+      return
+    }
+
+    const instanceMap = elementMap.get(element)
+
+    instanceMap.delete(key)
+
+    // free up element references if there are no instances left for an element
+    if (instanceMap.size === 0) {
+      elementMap.delete(element)
+    }
   }
 }
-
-export default Data