@aurodesignsystem/auro-library 4.2.0 → 4.2.1

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # Semantic Release Automated Changelog
 
+## [4.2.1](https://github.com/AlaskaAirlines/auro-library/compare/v4.2.0...v4.2.1) (2025-04-14)
+
+
+### Bug Fixes
+
+* add SSR env condition check in floatingUI ([c71a77e](https://github.com/AlaskaAirlines/auro-library/commit/c71a77ed805dc2e61593dd0c483a01c9f19e2a01))
+* correct method call to hide dropdown in AuroFloatingUI class ([44e30fc](https://github.com/AlaskaAirlines/auro-library/commit/44e30fc384be9adbcd3f493faba4c2f652c019f3))
+* not to hide bib on blur event with mouse being pressed ([8808ee6](https://github.com/AlaskaAirlines/auro-library/commit/8808ee6911ccfb81c0e9a0ed23762852983e1239))
+* remove bib on disconnect in floatingUI ([b5a2935](https://github.com/AlaskaAirlines/auro-library/commit/b5a29358910199589422067ad30767c99bb16daa))
+* setup mousePressChecker in floatingUI's configure function ([6136d36](https://github.com/AlaskaAirlines/auro-library/commit/6136d36a980802dc56a0bea9d9aa12b7bf3e6621))
+
 # [4.2.0](https://github.com/AlaskaAirlines/auro-library/compare/v4.1.1...v4.2.0) (2025-04-10)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurodesignsystem/auro-library",
-  "version": "4.2.0",
+  "version": "4.2.1",
   "description": "This repository holds shared scripts, utilities, and workflows utilized across repositories along the Auro Design System.",
   "repository": {
     "type": "git",

package/scripts/runtime/floatingUI.mjs

@@ -6,6 +6,33 @@ import { autoUpdate, computePosition, offset, autoPlacement, flip } from '@float
 const MAX_CONFIGURATION_COUNT = 10;
 
 export default class AuroFloatingUI {
+
+  /**
+   * @private
+   */
+  static isMousePressed = false;
+
+  /**
+   * @private
+   */
+  static isMousePressHandlerInitialized = false;
+
+  /**
+   * @private
+   */
+  static setupMousePressChecker() {
+    if (!AuroFloatingUI.isMousePressHandlerInitialized && window && window.addEventListener) {
+      AuroFloatingUI.isMousePressHandlerInitialized = true;
+
+      const mouseEventGlobalHandler = (event) => {
+        AuroFloatingUI.isMousePressed = event.type === 'mousedown';
+      };
+
+      window.addEventListener('mousedown', mouseEventGlobalHandler);
+      window.addEventListener('mouseup', mouseEventGlobalHandler);
+    }
+  }
+
   constructor(element, behavior) {
     this.element = element;
     this.behavior = behavior;
@@ -197,7 +224,7 @@ export default class AuroFloatingUI {
 
         setTimeout(() => {
           this.configureBibStrategy(value);
-        });
+        }, 0);
       }
 
       if (this.element.isPopoverVisible) {
@@ -244,6 +271,11 @@ export default class AuroFloatingUI {
    * If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
    */
   handleFocusLoss() {
+    // if mouse is being pressed, skip and let click event to handle the action
+    if (AuroFloatingUI.isMousePressed) {
+      return;
+    }
+
     if (this.element.noHideOnThisFocusLoss ||
       this.element.hasAttribute('noHideOnThisFocusLoss')) {
       return;
@@ -312,7 +344,7 @@ export default class AuroFloatingUI {
     // it conflicts if showBib gets call from a button that's not this.element.trigger
     setTimeout(() => {
       window.addEventListener('click', this.clickHandler);
-    });
+    }, 0);
   }
 
   cleanupHideHandlers() {
@@ -461,8 +493,9 @@ export default class AuroFloatingUI {
           }
           break;
         case 'blur':
-          // send this task to end of the queue to wait a frame in case focus moves within the floating element/bib
-          setTimeout(() => this.handleFocusLoss());
+          // send this task 100ms later queue to
+          // wait a frame in case focus moves within the floating element/bib
+          setTimeout(() => this.handleFocusLoss(), 0);
           break;
         case 'click':
           if (document.activeElement === document.body) {
@@ -530,6 +563,8 @@ export default class AuroFloatingUI {
   }
 
   configure(elem, eventPrefix) {
+    AuroFloatingUI.setupMousePressChecker();
+
     this.eventPrefix = eventPrefix;
     if (this.element !== elem) {
       this.element = elem;
@@ -570,16 +605,22 @@ export default class AuroFloatingUI {
 
   disconnect() {
     this.cleanupHideHandlers();
-    this.element.cleanup?.();
-
-    // Remove event & keyboard listeners
-    if (this.element?.trigger) {
-      this.element.trigger.removeEventListener('keydown', this.handleEvent);
-      this.element.trigger.removeEventListener('click', this.handleEvent);
-      this.element.trigger.removeEventListener('mouseenter', this.handleEvent);
-      this.element.trigger.removeEventListener('mouseleave', this.handleEvent);
-      this.element.trigger.removeEventListener('focus', this.handleEvent);
-      this.element.trigger.removeEventListener('blur', this.handleEvent);
+    if (this.element) {
+      this.element.cleanup?.();
+
+      if (this.element.bib) {
+        this.element.shadowRoot.append(this.element.bib);
+      }
+  
+      // Remove event & keyboard listeners
+      if (this.element?.trigger) {
+        this.element.trigger.removeEventListener('keydown', this.handleEvent);
+        this.element.trigger.removeEventListener('click', this.handleEvent);
+        this.element.trigger.removeEventListener('mouseenter', this.handleEvent);
+        this.element.trigger.removeEventListener('mouseleave', this.handleEvent);
+        this.element.trigger.removeEventListener('focus', this.handleEvent);
+        this.element.trigger.removeEventListener('blur', this.handleEvent);
+      }
     }
   }
 }