@aurodesignsystem-dev/auro-formkit 0.0.0-pr1395.2 → 0.0.0-pr1396.0

package/components/dropdown/dist/registered.js

@@ -2936,6 +2936,7 @@ class AuroDropdownBib extends LitElement {
 
     this.shape = "rounded";
     this.matchWidth = false;
+    this.hasActiveDescendant = false;
   }
 
   static get styles() {
@@ -3022,6 +3023,18 @@ class AuroDropdownBib extends LitElement {
        */
       dialogRole: {
         type: String
+      },
+
+      /**
+       * Set by auro-dropdown when a menu option is highlighted via
+       * aria-activedescendant. The dialog keyboard bridge checks this
+       * flag so that Enter selects the highlighted option instead of
+       * activating the focused interactive element (e.g. the trigger
+       * button, or the bibtemplate close button in fullscreen).
+       * @private
+       */
+      hasActiveDescendant: {
+        type: Boolean
       }
     };
   }
@@ -3105,7 +3118,7 @@ class AuroDropdownBib extends LitElement {
   /**
    * Forwards the dialog's native `cancel` event (fired on ESC) as
    * an `auro-bib-cancel` custom event so parent components can close.
-   * @param {HTMLDialogElement} dialog
+   * @param {HTMLDialogElement} dialog - The dialog element to attach the cancel listener to.
    * @private
    */
   _setupCancelHandler(dialog) {
@@ -3149,7 +3162,7 @@ class AuroDropdownBib extends LitElement {
    *   is a secondary path for parent components that also listen for
    *   Escape keydown.
    *
-   * @param {HTMLDialogElement} dialog
+   * @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
    * @private
    */
   _setupKeyboardBridge(dialog) {
@@ -3168,15 +3181,23 @@ class AuroDropdownBib extends LitElement {
 
       // Custom elements (auro-button) don't get the native Enter→click
       // behavior that <button> has. Find the button in the composed path
-      // and click it directly.
+      // and click it directly — but only when no menu option is
+      // highlighted. In fullscreen mode focus stays on the close button
+      // while arrow keys move the active-descendant highlight through
+      // the listbox. If the user presses Enter with an option
+      // highlighted, the intent is to select that option, not to click
+      // the close button. In that case we fall through and bridge the
+      // Enter key to the parent component's keyboard strategy.
       if (event.key === 'Enter') {
-        const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
-        const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
-        if (btn) {
-          event.preventDefault();
-          event.stopPropagation();
-          btn.click();
-          return;
+        if (!this.hasActiveDescendant) {
+          const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
+          const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
+          if (btn) {
+            event.preventDefault();
+            event.stopPropagation();
+            btn.click();
+            return;
+          }
         }
       }
 
@@ -3291,6 +3312,8 @@ class AuroDropdownBib extends LitElement {
    * Closes the dialog.
    */
   close() {
+    this.hasActiveDescendant = false;
+
     const dialog = this.shadowRoot.querySelector('dialog');
 
     if (dialog && dialog.open) {
@@ -3568,7 +3591,7 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202603241855';
+var formkitVersion = '202603242359';
 
 class AuroElement extends LitElement {
   static get properties() {
@@ -3887,6 +3910,15 @@ class AuroDropdown extends AuroElement {
       this.trigger.ariaActiveDescendantElement = null;
       this.trigger.removeAttribute('aria-activedescendant');
     }
+
+    // In fullscreen, focus stays on the close button while arrow keys
+    // highlight options via active-descendant. Without this flag the
+    // keyboard bridge clicks the close button on Enter (closing the
+    // bib without selecting). When true, the bridge skips the button
+    // click and forwards Enter to the parent to make the selection.
+    if (this.bibContent) {
+      this.bibContent.hasActiveDescendant = this.isBibFullscreen && Boolean(element);
+    }
   }
 
   // function to define props used within the scope of this component