@aurodesignsystem/auro-library 5.1.0 → 5.2.1

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Semantic Release Automated Changelog
 
+## [5.2.1](https://github.com/AlaskaAirlines/auro-library/compare/v5.2.0...v5.2.1) (2025-06-26)
+
+
+### Performance Improvements
+
+* add deep nested focusable elements support in focustrap ([68b0262](https://github.com/AlaskaAirlines/auro-library/commit/68b0262157f0a2cad24d603e67c59e2b2ea0f76f))
+
+# [5.2.0](https://github.com/AlaskaAirlines/auro-library/compare/v5.1.0...v5.2.0) (2025-06-24)
+
+
+### Features
+
+* add support for component tag name attributes when detecting focusable components ([3a10af3](https://github.com/AlaskaAirlines/auro-library/commit/3a10af334c24bdc52404e7ecf85effb2a1afd574))
+
 # [5.1.0](https://github.com/AlaskaAirlines/auro-library/compare/v5.0.2...v5.1.0) (2025-06-18)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurodesignsystem/auro-library",
-  "version": "5.1.0",
+  "version": "5.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/FocusTrap/FocusTrap.mjs

@@ -58,10 +58,12 @@ export class FocusTrap {
       // Get the active element(s) in the document and shadow root
       // This will include the active element in the shadow DOM if it exists
       // Active element may be inside the shadow DOM depending on delegatesFocus, so we need to check both
-      const actives =  [
-        document.activeElement,
-        ...document.activeElement.shadowRoot && [document.activeElement.shadowRoot.activeElement] || []
-      ]
+      let activeElement = document.activeElement;
+      const actives =  [activeElement];
+      while (activeElement?.shadowRoot?.activeElement) {
+        actives.push(activeElement.shadowRoot.activeElement);
+        activeElement = activeElement.shadowRoot.activeElement;
+      }
 
       // Update the focusable elements
       const focusables = this._getFocusableElements();
@@ -127,4 +129,4 @@ export class FocusTrap {
 
     this.container.removeEventListener('keydown', this._onKeydown);
   }
-}
+}

package/scripts/runtime/Focusables/Focusables.mjs

@@ -39,7 +39,7 @@ export function isFocusableComponent(element) {
   const componentName = element.tagName.toLowerCase();
 
   // Guard Clause: Element is a focusable component
-  if (!FOCUSABLE_COMPONENTS.includes(componentName)) return false;
+  if (!FOCUSABLE_COMPONENTS.some((name) => element.hasAttribute(name) || componentName === name)) return false;
 
   // Guard Clause: Element is not disabled
   if (element.hasAttribute('disabled')) return false;