@aurodesignsystem/auro-library 5.2.2 → 5.3.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Semantic Release Automated Changelog
 
+# [5.3.0](https://github.com/AlaskaAirlines/auro-library/compare/v5.2.3...v5.3.0) (2025-07-04)
+
+
+### Features
+
+* add event type to auroDropdown-toggled for keyboard detection ([d7ec5b7](https://github.com/AlaskaAirlines/auro-library/commit/d7ec5b755cee75d0371bf3202d5a382ce20cd47c))
+
+## [5.2.3](https://github.com/AlaskaAirlines/auro-library/compare/v5.2.2...v5.2.3) (2025-07-02)
+
+
+### Bug Fixes
+
+* check for matchWidth before forcing dropdown width ([706f7ee](https://github.com/AlaskaAirlines/auro-library/commit/706f7eefe15d2ab5f5e208a14fe6e337d5b4e1c5))
+
 ## [5.2.2](https://github.com/AlaskaAirlines/auro-library/compare/v5.2.1...v5.2.2) (2025-06-27)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurodesignsystem/auro-library",
-  "version": "5.2.2",
+  "version": "5.3.0",
   "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

@@ -95,7 +95,7 @@ export default class AuroFloatingUI {
    */
   mirrorSize() {
     // mirror the boxsize from bibSizer
-    if (this.element.bibSizer) {
+    if (this.element.bibSizer && this.element.matchWidth) {
       const sizerStyle = window.getComputedStyle(this.element.bibSizer);
       const bibContent = this.element.bib.shadowRoot.querySelector(".container");
       if (sizerStyle.width !== '0px') {
@@ -307,13 +307,13 @@ export default class AuroFloatingUI {
     if (this.element.contains(activeElement) || this.element.bib?.contains(activeElement)) {
       return;
     }
-    
+
     // if fullscreen bib is in fullscreen mode, do not close
     if (this.element.bib.hasAttribute('isfullscreen')) {
       return;
     }
 
-    this.hideBib();
+    this.hideBib("keydown");
   }
 
   setupHideHandlers() {
@@ -338,7 +338,7 @@ export default class AuroFloatingUI {
           document.expandedAuroFormkitDropdown = null;
           document.expandedAuroFloater = this;
         } else {
-          this.hideBib();
+          this.hideBib("click");
         }
       }
     };
@@ -351,7 +351,7 @@ export default class AuroFloatingUI {
           // if something else is open, let it handle itself
           return;
         }
-        this.hideBib();
+        this.hideBib("keydown");
       }
     };
 
@@ -434,7 +434,11 @@ export default class AuroFloatingUI {
     }
   }
 
-  hideBib() {
+  /**
+   * Hides the floating UI element.
+   * @param {String} eventType - The event type that triggered the hiding action.
+   */
+  hideBib(eventType = "unknown") {
     if (!this.element.disabled && !this.element.noToggle) {
       this.lockScroll(false);
       this.element.triggerChevron?.removeAttribute('data-expanded');
@@ -445,7 +449,7 @@ export default class AuroFloatingUI {
       if (this.showing) {
         this.cleanupHideHandlers();
         this.showing = false;
-        this.dispatchEventDropdownToggle();
+        this.dispatchEventDropdownToggle(eventType);
       }
     }
     document.expandedAuroFloater = null;
@@ -454,11 +458,13 @@ export default class AuroFloatingUI {
   /**
    * @private
    * @returns {void} Dispatches event with an object showing the state of the dropdown.
+   * @param {String} eventType - The event type that triggered the toggle action.
    */
-  dispatchEventDropdownToggle() {
+  dispatchEventDropdownToggle(eventType) {
     const event = new CustomEvent(this.eventPrefix ? `${this.eventPrefix}-toggled` : 'toggled', {
       detail: {
         expanded: this.showing,
+        eventType: eventType || "unknown",
       },
       composed: true
     });
@@ -468,7 +474,7 @@ export default class AuroFloatingUI {
 
   handleClick() {
     if (this.element.isPopoverVisible) {
-      this.hideBib();
+      this.hideBib("click");
     } else {
       this.showBib();
     }
@@ -495,7 +501,7 @@ export default class AuroFloatingUI {
 
             event.preventDefault();
             this.handleClick();
-          } 
+          }
           break;
         case 'mouseenter':
           if (this.element.hoverToggle) {
@@ -504,7 +510,7 @@ export default class AuroFloatingUI {
           break;
         case 'mouseleave':
           if (this.element.hoverToggle) {
-            this.hideBib();
+            this.hideBib("mouseleave");
           }
           break;
         case 'focus':