chore(merge main) patched commit → 0cf3633 (#1114)

Orange-OpenSource · Mar 2, 2022 · 7cc4953 · 7cc4953
1 parent b466b27
commit 7cc4953
Show file tree

Hide file tree

Showing 81 changed files with 4,061 additions and 4,359 deletions.
diff --git a/.bundlewatch.config.json b/.bundlewatch.config.json
@@ -26,11 +26,11 @@
     },
     {
       "path": "./dist/css/boosted.css",
-      "maxSize": "30.0 kB"
+      "maxSize": "30.1 kB"
     },
     {
       "path": "./dist/css/boosted.min.css",
-      "maxSize": "27.8 kB"
+      "maxSize": "28.0 kB"
     },
     {
       "path": "./dist/js/boosted.bundle.js",

diff --git a/.github/workflows/issue-close-require.yml b/.github/workflows/issue-close-require.yml
@@ -0,0 +1,19 @@
+name: Close Issue Awaiting Reply
+
+on:
+  schedule:
+    - cron: "0 0 * * *"
+
+jobs:
+  issue-close-require:
+    runs-on: ubuntu-latest
+    if: github.repository == 'Orange-OpenSource/Orange-Boosted-Bootstrap'
+    steps:
+      - name: awaiting reply
+        uses: actions-cool/issues-helper@v3
+        with:
+          actions: "close-issues"
+          labels: "awaiting-reply"
+          inactive-day: 14
+          body: |
+            As the issue was labeled with `awaiting-reply`, but there has been no response in 14 days, this issue will be closed. If you have any questions, you can comment/reply.
diff --git a/.github/workflows/issue-labeled.yml b/.github/workflows/issue-labeled.yml
@@ -0,0 +1,19 @@
+name: Issue Labeled
+
+on:
+  issues:
+    types: [labeled]
+
+jobs:
+  issue-labeled:
+    if: github.repository == 'Orange-OpenSource/Orange-Boosted-Bootstrap'
+    runs-on: ubuntu-latest
+    steps:
+      - name: awaiting reply
+        if: github.event.label.name == 'awaiting-reply'
+        uses: actions-cool/issues-helper@v3
+        with:
+          actions: "create-comment"
+          token: ${{ secrets.GITHUB_TOKEN }}
+          body: |
+            Hello @${{ github.event.issue.user.login }}. Bug reports must include a **live demo** of the issue. Per our [contributing guidelines](https://github.com/Orange-OpenSource/Orange-Boosted-Bootstrap/blob/main/.github/CONTRIBUTING.md), please create a reduced test case on [CodePen](https://codepen.io/) or [JS Bin](https://jsbin.com/) and report back with your link, Boosted version, and specific browser and Operating System details.
diff --git a/README.md b/README.md
@@ -64,57 +64,58 @@ Read the [Getting started page](https://boosted.orange.com/docs/5.1/getting-star
 
 Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations.
 
-<details><summary>Download contents</summary>
-
-```text
-boosted/
-├── css/
-│   ├── boosted-grid.css
-│   ├── boosted-grid.css.map
-│   ├── boosted-grid.min.css
-│   ├── boosted-grid.min.css.map
-│   ├── boosted-grid.rtl.css
-│   ├── boosted-grid.rtl.css.map
-│   ├── boosted-grid.rtl.min.css
-│   ├── boosted-grid.rtl.min.css.map
-│   ├── boosted-reboot.css
-│   ├── boosted-reboot.css.map
-│   ├── boosted-reboot.min.css
-│   ├── boosted-reboot.min.css.map
-│   ├── boosted-reboot.rtl.css
-│   ├── boosted-reboot.rtl.css.map
-│   ├── boosted-reboot.rtl.min.css
-│   ├── boosted-reboot.rtl.min.css.map
-│   ├── boosted-utilities.css
-│   ├── boosted-utilities.css.map
-│   ├── boosted-utilities.min.css
-│   ├── boosted-utilities.min.css.map
-│   ├── boosted-utilities.rtl.css
-│   ├── boosted-utilities.rtl.css.map
-│   ├── boosted-utilities.rtl.min.css
-│   ├── boosted-utilities.rtl.min.css.map
-│   ├── boosted.css
-│   ├── boosted.css.map
-│   ├── boosted.min.css
-│   ├── boosted.min.css.map
-│   ├── boosted.rtl.css
-│   ├── boosted.rtl.css.map
-│   ├── boosted.rtl.min.css
-│   └── boosted.rtl.min.css.map
-└── js/
-    ├── boosted.bundle.js
-    ├── boosted.bundle.js.map
-    ├── boosted.bundle.min.js
-    ├── boosted.bundle.min.js.map
-    ├── boosted.esm.js
-    ├── boosted.esm.js.map
-    ├── boosted.esm.min.js
-    ├── boosted.esm.min.js.map
-    ├── boosted.js
-    ├── boosted.js.map
-    ├── boosted.min.js
-    └── boosted.min.js.map
-```
+<details>
+  <summary>Download contents</summary>
+
+  ```text
+  boosted/
+  ├── css/
+  │   ├── boosted-grid.css
+  │   ├── boosted-grid.css.map
+  │   ├── boosted-grid.min.css
+  │   ├── boosted-grid.min.css.map
+  │   ├── boosted-grid.rtl.css
+  │   ├── boosted-grid.rtl.css.map
+  │   ├── boosted-grid.rtl.min.css
+  │   ├── boosted-grid.rtl.min.css.map
+  │   ├── boosted-reboot.css
+  │   ├── boosted-reboot.css.map
+  │   ├── boosted-reboot.min.css
+  │   ├── boosted-reboot.min.css.map
+  │   ├── boosted-reboot.rtl.css
+  │   ├── boosted-reboot.rtl.css.map
+  │   ├── boosted-reboot.rtl.min.css
+  │   ├── boosted-reboot.rtl.min.css.map
+  │   ├── boosted-utilities.css
+  │   ├── boosted-utilities.css.map
+  │   ├── boosted-utilities.min.css
+  │   ├── boosted-utilities.min.css.map
+  │   ├── boosted-utilities.rtl.css
+  │   ├── boosted-utilities.rtl.css.map
+  │   ├── boosted-utilities.rtl.min.css
+  │   ├── boosted-utilities.rtl.min.css.map
+  │   ├── boosted.css
+  │   ├── boosted.css.map
+  │   ├── boosted.min.css
+  │   ├── boosted.min.css.map
+  │   ├── boosted.rtl.css
+  │   ├── boosted.rtl.css.map
+  │   ├── boosted.rtl.min.css
+  │   └── boosted.rtl.min.css.map
+  └── js/
+      ├── boosted.bundle.js
+      ├── boosted.bundle.js.map
+      ├── boosted.bundle.min.js
+      ├── boosted.bundle.min.js.map
+      ├── boosted.esm.js
+      ├── boosted.esm.js.map
+      ├── boosted.esm.min.js
+      ├── boosted.esm.min.js.map
+      ├── boosted.js
+      ├── boosted.js.map
+      ├── boosted.min.js
+      └── boosted.min.js.map
+  ```
 </details>
 
 We provide compiled CSS and JS (`boosted.*`), as well as compiled and minified CSS and JS (`boosted.min.*`). [Source maps](https://developers.google.com/web/tools/chrome-devtools/javascript/source-maps) (`boosted.*.map`) are available for use with certain browsers' developer tools. Bundled JS files (`boosted.bundle.js` and minified `boosted.bundle.min.js`) include [Popper](https://popper.js.org/).

diff --git a/config.yml b/config.yml
@@ -103,3 +103,7 @@ params:
     popper_hash:                    "sha384-q9CRHqZndzlxGLOj+xrdLDJa9ittGte1NksRmgJKeCV9DrM7Kz868XYqsKWPpAmn"
     focus_visible:                  "https://cdn.jsdelivr.net/npm/focus-visible@5.2.0/dist/focus-visible.min.js"
     focus_visible_hash:             "sha384-xRa5B8rCDfdg0npZcxAh+RXswrbFk3g6dlHVeABeluN8EIwdyljz/LqJgc2R3KNA"
+
+  anchors:
+    min: 2
+    max: 5
diff --git a/js/src/base-component.js b/js/src/base-component.js
@@ -76,6 +76,10 @@ class BaseComponent extends Config {
   static get EVENT_KEY() {
     return `.${this.DATA_KEY}`
   }
+
+  static eventName(name) {
+    return `${name}${this.EVENT_KEY}`
+  }
 }
 
 export default BaseComponent
diff --git a/js/src/carousel.js b/js/src/carousel.js
@@ -348,9 +348,8 @@ class Carousel extends BaseComponent {
     return getNextActiveElement(this._items, activeElement, isNext, this._config.wrap)
   }
 
-  _triggerSlideEvent(relatedTarget, eventDirectionName) {
+  _triggerSlideEvent(relatedTarget, fromIndex, eventDirectionName) {
     const targetIndex = this._getItemIndex(relatedTarget)
-    const fromIndex = this._getItemIndex(this._getActive())
 
     return EventHandler.trigger(this._element, EVENT_SLIDE, {
       relatedTarget,
@@ -360,7 +359,7 @@ class Carousel extends BaseComponent {
     })
   }
 
-  _setActiveIndicatorElement(element) {
+  _setActiveIndicatorElement(index) {
     if (!this._indicatorsElement) {
       return
     }
@@ -370,7 +369,7 @@ class Carousel extends BaseComponent {
     activeIndicator.classList.remove(CLASS_NAME_ACTIVE)
     activeIndicator.removeAttribute('aria-current')
 
-    const newActiveIndicator = SelectorEngine.findOne(`[data-bs-slide-to="${this._getItemIndex(element)}"]`, this._indicatorsElement)
+    const newActiveIndicator = SelectorEngine.findOne(`[data-bs-slide-to="${index}"]`, this._indicatorsElement)
 
     if (newActiveIndicator) {
       newActiveIndicator.classList.add(CLASS_NAME_ACTIVE)
@@ -421,7 +420,7 @@ class Carousel extends BaseComponent {
       return
     }
 
-    const slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName)
+    const slideEvent = this._triggerSlideEvent(nextElement, activeElementIndex, eventDirectionName)
     if (slideEvent.defaultPrevented) {
       return
     }
@@ -437,18 +436,9 @@ class Carousel extends BaseComponent {
       this.pause()
     }
 
-    this._setActiveIndicatorElement(nextElement)
+    this._setActiveIndicatorElement(nextElementIndex)
     this._activeElement = nextElement
 
-    const triggerSlidEvent = () => {
-      EventHandler.trigger(this._element, EVENT_SLID, {
-        relatedTarget: nextElement,
-        direction: eventDirectionName,
-        from: activeElementIndex,
-        to: nextElementIndex
-      })
-    }
-
     // Boosted mod: enable/disable prev/next controls when wrap=false
     if (!this._config.wrap) {
       const prevControl = SelectorEngine.findOne(SELECTOR_CONTROL_PREV, this._element)
@@ -465,39 +455,40 @@ class Carousel extends BaseComponent {
     }
     // End mod
 
-    if (this._element.classList.contains(CLASS_NAME_SLIDE)) {
-      nextElement.classList.add(orderClassName)
-
-      reflow(nextElement)
-
-      activeElement.classList.add(directionalClassName)
-      nextElement.classList.add(directionalClassName)
+    nextElement.classList.add(orderClassName)
 
-      const completeCallBack = () => {
-        nextElement.classList.remove(directionalClassName, orderClassName)
-        nextElement.classList.add(CLASS_NAME_ACTIVE)
+    reflow(nextElement)
 
-        activeElement.classList.remove(CLASS_NAME_ACTIVE, orderClassName, directionalClassName)
-
-        this._isSliding = false
-
-        setTimeout(triggerSlidEvent, 0)
-      }
+    activeElement.classList.add(directionalClassName)
+    nextElement.classList.add(directionalClassName)
 
-      this._queueCallback(completeCallBack, activeElement, true)
-    } else {
-      activeElement.classList.remove(CLASS_NAME_ACTIVE)
+    const completeCallBack = () => {
+      nextElement.classList.remove(directionalClassName, orderClassName)
       nextElement.classList.add(CLASS_NAME_ACTIVE)
 
+      activeElement.classList.remove(CLASS_NAME_ACTIVE, orderClassName, directionalClassName)
+
       this._isSliding = false
-      triggerSlidEvent()
+
+      EventHandler.trigger(this._element, EVENT_SLID, {
+        relatedTarget: nextElement,
+        direction: eventDirectionName,
+        from: activeElementIndex,
+        to: nextElementIndex
+      })
     }
 
+    this._queueCallback(completeCallBack, activeElement, this._isAnimated())
+
     if (isCycling) {
       this.cycle()
     }
   }
 
+  _isAnimated() {
+    return this._element.classList.contains(CLASS_NAME_SLIDE)
+  }
+
   _getActive() {
     return SelectorEngine.findOne(SELECTOR_ACTIVE_ITEM, this._element)
   }
@@ -575,7 +566,6 @@ class Carousel extends BaseComponent {
     }
 
     const config = {
-      ...Manipulator.getDataAttributes(target),
       ...Manipulator.getDataAttributes(this)
     }
     const slideIndex = this.getAttribute('data-bs-slide-to')
@@ -604,7 +594,7 @@ EventHandler.on(window, EVENT_LOAD_DATA_API, () => {
   const carousels = SelectorEngine.find(SELECTOR_DATA_RIDE)
 
   for (const carousel of carousels) {
-    Carousel.carouselInterface(carousel, Carousel.getInstance(carousel))
+    Carousel.getOrCreateInstance(carousel)
   }
 })
 

diff --git a/js/src/dropdown.js b/js/src/dropdown.js
@@ -49,7 +49,8 @@ const CLASS_NAME_DROPUP = 'dropup'
 const CLASS_NAME_DROPEND = 'dropend'
 const CLASS_NAME_DROPSTART = 'dropstart'
 
-const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="dropdown"]'
+const SELECTOR_DATA_TOGGLE = '[data-bs-toggle="dropdown"]:not(.disabled):not(:disabled)'
+const SELECTOR_DATA_TOGGLE_SHOWN = `${SELECTOR_DATA_TOGGLE}.${CLASS_NAME_SHOW}`
 const SELECTOR_MENU = '.dropdown-menu'
 const SELECTOR_NAVBAR = '.navbar'
 const SELECTOR_NAVBAR_NAV = '.navbar-nav'
@@ -341,18 +342,14 @@ class Dropdown extends BaseComponent {
       return
     }
 
-    const toggles = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
+    const openToggles = SelectorEngine.find(SELECTOR_DATA_TOGGLE_SHOWN)
 
-    for (const toggle of toggles) {
+    for (const toggle of openToggles) {
       const context = Dropdown.getInstance(toggle)
       if (!context || context._config.autoClose === false) {
         continue
       }
 
-      if (!context._isShown()) {
-        continue
-      }
-
       const composedPath = event.composedPath()
       const isMenuTarget = composedPath.includes(context._menu)
       if (
@@ -410,10 +407,6 @@ class Dropdown extends BaseComponent {
     event.preventDefault()
     event.stopPropagation()
 
-    if (isDisabled(this)) {
-      return
-    }
-
     const getToggleButton = SelectorEngine.findOne(SELECTOR_DATA_TOGGLE, delegateTarget.parentNode)
     const instance = Dropdown.getOrCreateInstance(getToggleButton)