@aurodesignsystem-dev/auro-formkit 0.0.0-pr1430.0 → 0.0.0-pr1431.0

package/components/checkbox/demo/api.min.js

@@ -142,7 +142,7 @@ let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
   }
 };
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 
@@ -1687,9 +1687,9 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202604082129';
+var formkitVersion = '202604091424';
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 

package/components/checkbox/demo/index.min.js

@@ -134,7 +134,7 @@ let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
   }
 };
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 
@@ -1679,9 +1679,9 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202604082129';
+var formkitVersion = '202604091424';
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 

package/components/checkbox/dist/index.js

@@ -94,7 +94,7 @@ let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
   }
 };
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 
@@ -1632,9 +1632,9 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202604082129';
+var formkitVersion = '202604091424';
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 

package/components/checkbox/dist/registered.js

@@ -94,7 +94,7 @@ let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
   }
 };
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 
@@ -1632,9 +1632,9 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202604082129';
+var formkitVersion = '202604091424';
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 

package/components/combobox/demo/api.html

@@ -54,6 +54,7 @@
     <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-button@latest/+esm" type="module"></script>
     <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-icon@latest/+esm" type="module"></script>
     <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-dialog@latest/+esm" type="module"></script>
+    <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-drawer@latest/+esm" type="module"></script>
     <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-loader@latest/+esm" type="module"></script>
 
     <script type="module" data-demo-script="true">

package/components/combobox/demo/api.js

@@ -5,6 +5,7 @@ import { resetStateExample } from '../apiExamples/reset-state';
 import { setupExternalSelectionExample } from '../apiExamples/external-selection';
 import { valueExample } from '../apiExamples/value';
 import { inDialogExample } from '../apiExamples/in-dialog';
+import { inDrawerExample } from '../apiExamples/in-drawer';
 import { persistentExample } from '../apiExamples/persistent';
 import { swapValueExample } from '../apiExamples/swap-value';
 
@@ -22,7 +23,8 @@ export function initExamples(initCount) {
     resetStateExample();
     setupExternalSelectionExample();
     valueExample();
-    inDialogExample();  
+    inDialogExample();
+    inDrawerExample();
     persistentExample();
     swapValueExample();
   } catch (err) {

package/components/combobox/demo/api.md

@@ -2097,6 +2097,81 @@ export function inDialogExample() {
 <!-- AURO-GENERATED-CONTENT:END -->
 </auro-accordion>
 
+### In Drawer
+
+Example use of component within an `auro-drawer`.
+
+<div class="exampleWrapper">
+  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/in-drawer.html) -->
+  <!-- The below content is automatically added from ./../apiExamples/in-drawer.html -->
+  <div>
+    <auro-button id="combobox-drawer-opener">Combobox in Drawer</auro-button>
+    <auro-drawer id="combobox-drawer">
+      <span slot="header">Combobox in Drawer</span>
+      <div slot="content">
+        <auro-combobox>
+          <span slot="bib.fullscreen.headline">Bib Header</span>
+          <span slot="label">Name</span>
+          <auro-menu>
+            <auro-menuoption value="Apples" id="option-0">Apples</auro-menuoption>
+            <auro-menuoption value="Oranges" id="option-1">Oranges</auro-menuoption>
+            <auro-menuoption value="Peaches" id="option-2">Peaches</auro-menuoption>
+            <auro-menuoption value="Grapes" id="option-3">Grapes</auro-menuoption>
+            <auro-menuoption value="Cherries" id="option-4">Cherries</auro-menuoption>
+            <auro-menuoption static nomatch>No matching option</auro-menuoption>
+          </auro-menu>
+        </auro-combobox>
+      </div>
+    </auro-drawer>
+  </div>
+  <!-- AURO-GENERATED-CONTENT:END -->
+</div>
+<auro-accordion alignRight>
+  <span slot="trigger">See code</span>
+<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/in-drawer.html) -->
+<!-- The below code snippet is automatically added from ./../apiExamples/in-drawer.html -->
+
+```html
+<div>
+  <auro-button id="combobox-drawer-opener">Combobox in Drawer</auro-button>
+  <auro-drawer id="combobox-drawer">
+    <span slot="header">Combobox in Drawer</span>
+    <div slot="content">
+      <auro-combobox>
+        <span slot="bib.fullscreen.headline">Bib Header</span>
+        <span slot="label">Name</span>
+        <auro-menu>
+          <auro-menuoption value="Apples" id="option-0">Apples</auro-menuoption>
+          <auro-menuoption value="Oranges" id="option-1">Oranges</auro-menuoption>
+          <auro-menuoption value="Peaches" id="option-2">Peaches</auro-menuoption>
+          <auro-menuoption value="Grapes" id="option-3">Grapes</auro-menuoption>
+          <auro-menuoption value="Cherries" id="option-4">Cherries</auro-menuoption>
+          <auro-menuoption static nomatch>No matching option</auro-menuoption>
+        </auro-menu>
+      </auro-combobox>
+    </div>
+  </auro-drawer>
+</div>
+```
+<!-- AURO-GENERATED-CONTENT:END -->
+<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/in-drawer.js) -->
+<!-- The below code snippet is automatically added from ./../apiExamples/in-drawer.js -->
+
+```js
+export function inDrawerExample() {
+  document.querySelector("#combobox-drawer-opener").addEventListener("click", () => {
+    const drawer = document.querySelector("#combobox-drawer");
+    if (drawer.hasAttribute('open')) {
+      drawer.removeAttribute('open');
+    } else {
+      drawer.setAttribute('open', true);
+    }
+  });
+};
+```
+<!-- AURO-GENERATED-CONTENT:END -->
+</auro-accordion>
+
 ### Persistent Menu Option with a Custom Event
 
 This example demonstrates a static menu option that will always appears regardless of the suggestion filtering performed. In this example "Add new address" will always be a displayed menu option.

package/components/combobox/demo/api.min.js

@@ -52,6 +52,17 @@ function inDialogExample() {
   });
 }
 
+function inDrawerExample() {
+  document.querySelector("#combobox-drawer-opener").addEventListener("click", () => {
+    const drawer = document.querySelector("#combobox-drawer");
+    if (drawer.hasAttribute('open')) {
+      drawer.removeAttribute('open');
+    } else {
+      drawer.setAttribute('open', true);
+    }
+  });
+}
+
 function persistentExample() {
   const persistentExample = document.querySelector('#persistent');
 
@@ -1421,10 +1432,19 @@ const comboboxKeyboardStrategy = {
     }
   },
 
-  Escape(component, _evt, ctx) {
-    if (ctx.isExpanded && ctx.isModal) {
+  Escape(component, evt, ctx) {
+    if (!ctx.isExpanded) {
+      return;
+    }
+
+    // Prevent the Escape key from bubbling up and closing any parent dialogs / drawers / popups
+    evt.stopPropagation();
+
+    if (ctx.isModal) {
       component.setTriggerInputFocus();
     }
+
+    component.hideBib();
   },
 
   Home(component, evt, ctx) {
@@ -1485,7 +1505,7 @@ const comboboxKeyboardStrategy = {
 
 /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
 
-let AuroLibraryRuntimeUtils$2$1 = class AuroLibraryRuntimeUtils {
+let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
 
   /* eslint-disable jsdoc/require-param */
 
@@ -3274,7 +3294,6 @@ class AuroFloatingUI {
     this.focusHandler = null;
     this.clickHandler = null;
     this.keyDownHandler = null;
-    this.touchHandler = null;
 
     /**
      * @private
@@ -3692,28 +3711,6 @@ class AuroFloatingUI {
     setTimeout(() => {
       window.addEventListener("click", this.clickHandler);
     }, 0);
-
-    // iOS Safari does not fire `click` on non-interactive elements, so
-    // tapping an inert backdrop never reaches the click handler above.
-    // Mirror the same outside-tap logic with a passive touchstart listener.
-    this.touchHandler = (evt) => {
-      const element = this.element;
-      if (!element?.bib) {
-        return;
-      }
-
-      // fullscreen (modal) dialog handles its own dismissal
-      if (element.bib.hasAttribute("isfullscreen")) {
-        return;
-      }
-
-      const path = evt.composedPath();
-      if (!path.includes(element.trigger) && !path.includes(element.bib)) {
-        this.hideBib("click");
-      }
-    };
-
-    window.addEventListener("touchstart", this.touchHandler, { passive: true });
   }
 
   cleanupHideHandlers() {
@@ -3729,11 +3726,6 @@ class AuroFloatingUI {
       this.clickHandler = null;
     }
 
-    if (this.touchHandler) {
-      window.removeEventListener("touchstart", this.touchHandler);
-      this.touchHandler = null;
-    }
-
     if (this.keyDownHandler) {
       document.removeEventListener("keydown", this.keyDownHandler);
       this.keyDownHandler = null;
@@ -4526,89 +4518,6 @@ let p$4 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
 
 var iconVersion$3 = '9.1.2';
 
-// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
-// See LICENSE in the project root for license information.
-
-// ---------------------------------------------------------------------
-
-/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
-
-let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
-
-  /* eslint-disable jsdoc/require-param */
-
-  /**
-   * This will register a new custom element with the browser.
-   * @param {String} name - The name of the custom element.
-   * @param {Object} componentClass - The class to register as a custom element.
-   * @returns {void}
-   */
-  registerComponent(name, componentClass) {
-    if (!customElements.get(name)) {
-      customElements.define(name, class extends componentClass {});
-    }
-  }
-
-  /**
-   * Finds and returns the closest HTML Element based on a selector.
-   * @returns {void}
-   */
-  closestElement(
-    selector, // selector like in .closest()
-    base = this, // extra functionality to skip a parent
-    __Closest = (el, found = el && el.closest(selector)) =>
-      !el || el === document || el === window
-        ? null // standard .closest() returns null for non-found selectors also
-        : found
-          ? found // found a selector INside this element
-          : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
-  ) {
-    return __Closest(base);
-  }
-  /* eslint-enable jsdoc/require-param */
-
-  /**
-   * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
-   * @param {Object} elem - The element to check.
-   * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
-   * @returns {void}
-   */
-  handleComponentTagRename(elem, tagName) {
-    const tag = tagName.toLowerCase();
-    const elemTag = elem.tagName.toLowerCase();
-
-    if (elemTag !== tag) {
-      elem.setAttribute(tag, true);
-    }
-  }
-
-  /**
-   * Validates if an element is a specific Auro component.
-   * @param {Object} elem - The element to validate.
-   * @param {String} tagName - The name of the Auro component to check against.
-   * @returns {Boolean} - Returns true if the element is the specified Auro component.
-   */
-  elementMatch(elem, tagName) {
-    const tag = tagName.toLowerCase();
-    const elemTag = elem.tagName.toLowerCase();
-
-    return elemTag === tag || elem.hasAttribute(tag);
-  }
-
-  /**
-   * Gets the text content of a named slot.
-   * @returns {String}
-   * @private
-   */
-  getSlotText(elem, name) {
-    const slot = elem.shadowRoot?.querySelector(`slot[name="${name}"]`);
-    const nodes = slot?.assignedNodes({ flatten: true }) || [];
-    const text = nodes.map(n => n.textContent?.trim()).join(' ').trim();
-
-    return text || null;
-  }
-};
-
 /**
  * Computes display state once per keydown event.
  * Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
@@ -5291,7 +5200,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$4 {
   }
 };
 
-var formkitVersion$2 = '202604082129';
+var formkitVersion$2 = '202604091424';
 
 let AuroElement$2 = class AuroElement extends i$4 {
   static get properties() {
@@ -5397,7 +5306,7 @@ let AuroElement$2 = class AuroElement extends i$4 {
   }
 };
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 
@@ -5502,7 +5411,7 @@ class AuroDropdown extends AuroElement$2 {
     /**
      * @private
      */
-    this.runtimeUtils = new AuroLibraryRuntimeUtils$2$1();
+    this.runtimeUtils = new AuroLibraryRuntimeUtils$1$2();
 
     /**
      * @private
@@ -5920,7 +5829,7 @@ class AuroDropdown extends AuroElement$2 {
    *
    */
   static register(name = "auro-dropdown") {
-    AuroLibraryRuntimeUtils$2$1.prototype.registerComponent(name, AuroDropdown);
+    AuroLibraryRuntimeUtils$1$2.prototype.registerComponent(name, AuroDropdown);
   }
 
   /**
@@ -13055,7 +12964,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$4 {
   }
 };
 
-var formkitVersion$1 = '202604082129';
+var formkitVersion$1 = '202604091424';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -14120,7 +14029,7 @@ class AuroBibtemplate extends i$4 {
   }
 }
 
-var formkitVersion = '202604082129';
+var formkitVersion = '202604091424';
 
 var styleCss$3 = i$7`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
 
@@ -14460,7 +14369,7 @@ class AuroHelpText extends i$4 {
   }
 }
 
-// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
+// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
 
 
@@ -14983,7 +14892,7 @@ class AuroCombobox extends AuroElement {
    * @returns {void}
    */
   activateFirstEnabledAvailableOption() {
-    const firstEnabledOptionIndex = this.availableOptions.findIndex((opt) => !opt.disabled);
+    const firstEnabledOptionIndex = this.availableOptions.findIndex((opt) => !opt.disabled && !opt.noMatch);
     this.updateActiveOption(firstEnabledOptionIndex);
   }
 
@@ -14997,7 +14906,7 @@ class AuroCombobox extends AuroElement {
 
     // Work backwards through the available options array to find the last enabled option
     for (let index = this.availableOptions.length - 1; index >= 0; index -= 1) {
-      if (!this.availableOptions[index].disabled) {
+      if (!this.availableOptions[index].disabled && !this.availableOptions[index].noMatch) {
         lastEnabledOptionIndex = index;
         break;
       }
@@ -18120,7 +18029,8 @@ function initExamples(initCount) {
     resetStateExample();
     setupExternalSelectionExample();
     valueExample();
-    inDialogExample();  
+    inDialogExample();
+    inDrawerExample();
     persistentExample();
     swapValueExample();
   } catch (err) {