@aurodesignsystem/auro-formkit 6.0.2 → 6.0.3

package/components/combobox/dist/index.js

@@ -4910,7 +4910,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$2 = '202607291953';
+var formkitVersion$2 = '202608111803';
 
 let AuroElement$2 = class AuroElement extends LitElement {
   static get properties() {
@@ -5612,6 +5612,15 @@ class AuroDropdown extends AuroElement$2 {
 
   connectedCallback() {
     super.connectedCallback();
+    // Re-register trigger event listeners removed by floater.disconnect() in
+    // disconnectedCallback(). Fires when a parent element (e.g. auro-drawer)
+    // moves this element to a new DOM location. firstUpdated() won't re-run,
+    // so without this the trigger click/keydown handlers are permanently gone.
+    // Guard on floater.element so this is a no-op on the initial connect
+    // (before firstUpdated() has called configure()).
+    if (this.floater?.element) {
+      this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
+    }
   }
 
   disconnectedCallback() {
@@ -18592,7 +18601,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$1 = '202607291953';
+var formkitVersion$1 = '202608111803';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -19748,7 +19757,7 @@ class AuroBibtemplate extends LitElement {
   }
 }
 
-var formkitVersion = '202607291953';
+var formkitVersion = '202608111803';
 
 var styleCss$1 = css`.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}`;
 
@@ -21554,7 +21563,17 @@ class AuroCombobox extends AuroElement {
       return;
     }
 
-    this.value = this.input.value;
+    // Skip this write during a display-value sync: that path sets the input to
+    // the selected option's LABEL, which is not its machine value. When an
+    // option's label differs from its value (and especially when several
+    // options share a value but render distinct labels — AB#1602086), writing
+    // the label back into this.value clobbers the machine value the selection
+    // listener just set (this.value = optionSelected.value), collapsing the
+    // selection. _syncingBibValue still tracks (that mirrors user-typed text
+    // from the fullscreen bib, where value should follow the input).
+    if (!this._syncingDisplayValue) {
+      this.value = this.input.value;
+    }
 
     // Ignore re-entrant input events caused by programmatic value sets.
     if (this._syncingBibValue || this._syncingDisplayValue) {
@@ -21818,33 +21837,53 @@ class AuroCombobox extends AuroElement {
       }
 
       if (this.input.value !== this.value) {
-        // Clear menu.value AND menu.optionSelected together. Clearing only
-        // menu.value leaves the previously-selected option element pinned
-        // as menu.optionSelected; a later auroMenu-selectedOption event
-        // would then write its stale .value back into combobox.value
-        // (e.g. Tab-after-Backspace re-selecting the prior option).
-        if (this.menu.value || this.menu.optionSelected) {
-          this.menu.clearSelection();
-        }
+        // A fresh user selection leaves the input showing the option's LABEL
+        // while this.value holds its machine value, so input.value !== this.value
+        // is expected whenever label ≠ value. In that case the menu's current
+        // selection is authoritative — and when several options share a value it
+        // is the ONLY thing that records WHICH same-value option the user picked
+        // (the menu tracks it by element identity via `_selectedKey`). Clearing
+        // it here drops that key; the ensuing value-only re-resolution then
+        // collapses the selection onto the first same-value option (AB#1602086).
+        // So only treat the divergence as a stale menu when the selected option
+        // does NOT match the new value.
+        const menuSelectionMatchesValue =
+          this.menu.optionSelected &&
+          // optionSelected is a single element here (scalar `.value`). A multiselect
+          // menu exposes it as an ARRAY, which has no scalar `.value` to compare, so
+          // that shape can't be a single-option match — fall through to the clear path.
+          !Array.isArray(this.menu.optionSelected) &&
+          this.menu.optionSelected.value === this.value;
+
+        if (!menuSelectionMatchesValue) {
+          // Clear menu.value AND menu.optionSelected together. Clearing only
+          // menu.value leaves the previously-selected option element pinned
+          // as menu.optionSelected; a later auroMenu-selectedOption event
+          // would then write its stale .value back into combobox.value
+          // (e.g. Tab-after-Backspace re-selecting the prior option).
+          if (this.menu.value || this.menu.optionSelected) {
+            this.menu.clearSelection();
+          }
 
-        if (!this.persistInput) {
-          this.syncInputValuesAcrossTriggerAndBib(this.value || '');
-        }
+          if (!this.persistInput) {
+            this.syncInputValuesAcrossTriggerAndBib(this.value || '');
+          }
 
-        // Programmatic value with no matching option: updateFilter will close
-        // the bib silently (see line 648 — no noMatchOption + 0 results
-        // hides). Announce so screen-reader users hear the request was
-        // dropped. Gated on `input.value !== this.value` so this never fires
-        // for user typing — that path always reconciles input.value to
-        // this.value before updated() runs.
-        if (
-          this.value &&
-          this.menu &&
-          this.menu.options &&
-          this.menu.options.length > 0 &&
-          !this.menu.options.some((opt) => opt.value === this.value)
-        ) {
-          announceToScreenReader(this._getAnnouncementRoot(), `No matching option for ${this.value}`);
+          // Programmatic value with no matching option: updateFilter will close
+          // the bib silently (see line 648 — no noMatchOption + 0 results
+          // hides). Announce so screen-reader users hear the request was
+          // dropped. Gated on `input.value !== this.value` so this never fires
+          // for user typing — that path always reconciles input.value to
+          // this.value before updated() runs.
+          if (
+            this.value &&
+            this.menu &&
+            this.menu.options &&
+            this.menu.options.length > 0 &&
+            !this.menu.options.some((opt) => opt.value === this.value)
+          ) {
+            announceToScreenReader(this._getAnnouncementRoot(), `No matching option for ${this.value}`);
+          }
         }
       }
 

package/components/combobox/dist/registered.js

@@ -4910,7 +4910,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$2 = '202607291953';
+var formkitVersion$2 = '202608111803';
 
 let AuroElement$2 = class AuroElement extends LitElement {
   static get properties() {
@@ -5612,6 +5612,15 @@ class AuroDropdown extends AuroElement$2 {
 
   connectedCallback() {
     super.connectedCallback();
+    // Re-register trigger event listeners removed by floater.disconnect() in
+    // disconnectedCallback(). Fires when a parent element (e.g. auro-drawer)
+    // moves this element to a new DOM location. firstUpdated() won't re-run,
+    // so without this the trigger click/keydown handlers are permanently gone.
+    // Guard on floater.element so this is a no-op on the initial connect
+    // (before firstUpdated() has called configure()).
+    if (this.floater?.element) {
+      this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
+    }
   }
 
   disconnectedCallback() {
@@ -18592,7 +18601,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$1 = '202607291953';
+var formkitVersion$1 = '202608111803';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -19748,7 +19757,7 @@ class AuroBibtemplate extends LitElement {
   }
 }
 
-var formkitVersion = '202607291953';
+var formkitVersion = '202608111803';
 
 var styleCss$1 = css`.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}`;
 
@@ -21554,7 +21563,17 @@ class AuroCombobox extends AuroElement {
       return;
     }
 
-    this.value = this.input.value;
+    // Skip this write during a display-value sync: that path sets the input to
+    // the selected option's LABEL, which is not its machine value. When an
+    // option's label differs from its value (and especially when several
+    // options share a value but render distinct labels — AB#1602086), writing
+    // the label back into this.value clobbers the machine value the selection
+    // listener just set (this.value = optionSelected.value), collapsing the
+    // selection. _syncingBibValue still tracks (that mirrors user-typed text
+    // from the fullscreen bib, where value should follow the input).
+    if (!this._syncingDisplayValue) {
+      this.value = this.input.value;
+    }
 
     // Ignore re-entrant input events caused by programmatic value sets.
     if (this._syncingBibValue || this._syncingDisplayValue) {
@@ -21818,33 +21837,53 @@ class AuroCombobox extends AuroElement {
       }
 
       if (this.input.value !== this.value) {
-        // Clear menu.value AND menu.optionSelected together. Clearing only
-        // menu.value leaves the previously-selected option element pinned
-        // as menu.optionSelected; a later auroMenu-selectedOption event
-        // would then write its stale .value back into combobox.value
-        // (e.g. Tab-after-Backspace re-selecting the prior option).
-        if (this.menu.value || this.menu.optionSelected) {
-          this.menu.clearSelection();
-        }
+        // A fresh user selection leaves the input showing the option's LABEL
+        // while this.value holds its machine value, so input.value !== this.value
+        // is expected whenever label ≠ value. In that case the menu's current
+        // selection is authoritative — and when several options share a value it
+        // is the ONLY thing that records WHICH same-value option the user picked
+        // (the menu tracks it by element identity via `_selectedKey`). Clearing
+        // it here drops that key; the ensuing value-only re-resolution then
+        // collapses the selection onto the first same-value option (AB#1602086).
+        // So only treat the divergence as a stale menu when the selected option
+        // does NOT match the new value.
+        const menuSelectionMatchesValue =
+          this.menu.optionSelected &&
+          // optionSelected is a single element here (scalar `.value`). A multiselect
+          // menu exposes it as an ARRAY, which has no scalar `.value` to compare, so
+          // that shape can't be a single-option match — fall through to the clear path.
+          !Array.isArray(this.menu.optionSelected) &&
+          this.menu.optionSelected.value === this.value;
+
+        if (!menuSelectionMatchesValue) {
+          // Clear menu.value AND menu.optionSelected together. Clearing only
+          // menu.value leaves the previously-selected option element pinned
+          // as menu.optionSelected; a later auroMenu-selectedOption event
+          // would then write its stale .value back into combobox.value
+          // (e.g. Tab-after-Backspace re-selecting the prior option).
+          if (this.menu.value || this.menu.optionSelected) {
+            this.menu.clearSelection();
+          }
 
-        if (!this.persistInput) {
-          this.syncInputValuesAcrossTriggerAndBib(this.value || '');
-        }
+          if (!this.persistInput) {
+            this.syncInputValuesAcrossTriggerAndBib(this.value || '');
+          }
 
-        // Programmatic value with no matching option: updateFilter will close
-        // the bib silently (see line 648 — no noMatchOption + 0 results
-        // hides). Announce so screen-reader users hear the request was
-        // dropped. Gated on `input.value !== this.value` so this never fires
-        // for user typing — that path always reconciles input.value to
-        // this.value before updated() runs.
-        if (
-          this.value &&
-          this.menu &&
-          this.menu.options &&
-          this.menu.options.length > 0 &&
-          !this.menu.options.some((opt) => opt.value === this.value)
-        ) {
-          announceToScreenReader(this._getAnnouncementRoot(), `No matching option for ${this.value}`);
+          // Programmatic value with no matching option: updateFilter will close
+          // the bib silently (see line 648 — no noMatchOption + 0 results
+          // hides). Announce so screen-reader users hear the request was
+          // dropped. Gated on `input.value !== this.value` so this never fires
+          // for user typing — that path always reconciles input.value to
+          // this.value before updated() runs.
+          if (
+            this.value &&
+            this.menu &&
+            this.menu.options &&
+            this.menu.options.length > 0 &&
+            !this.menu.options.some((opt) => opt.value === this.value)
+          ) {
+            announceToScreenReader(this._getAnnouncementRoot(), `No matching option for ${this.value}`);
+          }
         }
       }
 

package/components/counter/demo/customize.min.js

@@ -1117,7 +1117,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
   }
 };
 
-var formkitVersion$1 = '202607291953';
+var formkitVersion$1 = '202608111803';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -1522,7 +1522,7 @@ class AuroCounter extends i$2 {
             aria-valuemax="${this.max}"
             aria-valuemin="${this.min}"
             aria-valuenow="${this.value}"
-            aria-valuetext="${this.value !== undefined ? this.value : this.min}"
+            aria-valuetext="'${this.value !== undefined ? this.value : this.min}'"
             role="spinbutton"
             tabindex="${this.disabled ? '-1' : '0'}"
           >
@@ -5288,7 +5288,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202607291953';
+var formkitVersion = '202608111803';
 
 let AuroElement$1 = class AuroElement extends i$2 {
   static get properties() {
@@ -5990,6 +5990,15 @@ class AuroDropdown extends AuroElement$1 {
 
   connectedCallback() {
     super.connectedCallback();
+    // Re-register trigger event listeners removed by floater.disconnect() in
+    // disconnectedCallback(). Fires when a parent element (e.g. auro-drawer)
+    // moves this element to a new DOM location. firstUpdated() won't re-run,
+    // so without this the trigger click/keydown handlers are permanently gone.
+    // Guard on floater.element so this is a no-op on the initial connect
+    // (before firstUpdated() has called configure()).
+    if (this.floater?.element) {
+      this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
+    }
   }
 
   disconnectedCallback() {
@@ -8179,6 +8188,22 @@ class AuroCounterGroup extends AuroElement {
   }
 }
 
+function dropdownCounterExample() {
+  const elem = document.querySelector('#dropdownCouterExample');
+  const resetBtn = elem.querySelector("#dropdownCounterExampleResetbutton") || elem.dropdown.bib.querySelector("#dropdownCounterExampleResetbutton");
+  const saveBtn = elem.querySelector("#dropdownCounterExampleSavebutton") || elem.dropdown.bib.querySelector("#dropdownCounterExampleSavebutton");
+
+  resetBtn.addEventListener('click', () => {
+    elem.counters.forEach(counter => {
+      counter.value = 0;
+    });
+  });
+
+  saveBtn.addEventListener('click', () => {
+    elem.dropdown.hide();
+  });
+}
+
 /* eslint-disable jsdoc/require-jsdoc, no-magic-numbers, no-param-reassign */
 
 AuroCounter.register();
@@ -8187,6 +8212,16 @@ AuroCounterGroup.register('custom-counter-group');
 AuroCounter.register('custom-counter');
 
 function initExamples(initialCount = 0) {
+  try {
+    dropdownCounterExample();
+  } catch (err) {
+    if (initialCount <= 20) {
+      // setTimeout handles issue where content is sometimes loaded after the functions get called
+      setTimeout(() => {
+        initExamples(initialCount + 1);
+      }, 100);
+    }
+  }
 }
 
 export { initExamples };

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

@@ -1117,7 +1117,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
   }
 };
 
-var formkitVersion$1 = '202607291953';
+var formkitVersion$1 = '202608111803';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -1522,7 +1522,7 @@ class AuroCounter extends i$2 {
             aria-valuemax="${this.max}"
             aria-valuemin="${this.min}"
             aria-valuenow="${this.value}"
-            aria-valuetext="${this.value !== undefined ? this.value : this.min}"
+            aria-valuetext="'${this.value !== undefined ? this.value : this.min}'"
             role="spinbutton"
             tabindex="${this.disabled ? '-1' : '0'}"
           >
@@ -5288,7 +5288,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202607291953';
+var formkitVersion = '202608111803';
 
 let AuroElement$1 = class AuroElement extends i$2 {
   static get properties() {
@@ -5990,6 +5990,15 @@ class AuroDropdown extends AuroElement$1 {
 
   connectedCallback() {
     super.connectedCallback();
+    // Re-register trigger event listeners removed by floater.disconnect() in
+    // disconnectedCallback(). Fires when a parent element (e.g. auro-drawer)
+    // moves this element to a new DOM location. firstUpdated() won't re-run,
+    // so without this the trigger click/keydown handlers are permanently gone.
+    // Guard on floater.element so this is a no-op on the initial connect
+    // (before firstUpdated() has called configure()).
+    if (this.floater?.element) {
+      this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
+    }
   }
 
   disconnectedCallback() {

package/components/counter/dist/index.js

@@ -1067,7 +1067,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$1 = '202607291953';
+var formkitVersion$1 = '202608111803';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -1472,7 +1472,7 @@ class AuroCounter extends LitElement {
             aria-valuemax="${this.max}"
             aria-valuemin="${this.min}"
             aria-valuenow="${this.value}"
-            aria-valuetext="${this.value !== undefined ? this.value : this.min}"
+            aria-valuetext="'${this.value !== undefined ? this.value : this.min}'"
             role="spinbutton"
             tabindex="${this.disabled ? '-1' : '0'}"
           >
@@ -5220,7 +5220,7 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202607291953';
+var formkitVersion = '202608111803';
 
 let AuroElement$1 = class AuroElement extends LitElement {
   static get properties() {
@@ -5922,6 +5922,15 @@ class AuroDropdown extends AuroElement$1 {
 
   connectedCallback() {
     super.connectedCallback();
+    // Re-register trigger event listeners removed by floater.disconnect() in
+    // disconnectedCallback(). Fires when a parent element (e.g. auro-drawer)
+    // moves this element to a new DOM location. firstUpdated() won't re-run,
+    // so without this the trigger click/keydown handlers are permanently gone.
+    // Guard on floater.element so this is a no-op on the initial connect
+    // (before firstUpdated() has called configure()).
+    if (this.floater?.element) {
+      this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
+    }
   }
 
   disconnectedCallback() {

package/components/counter/dist/registered.js

@@ -1067,7 +1067,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$1 = '202607291953';
+var formkitVersion$1 = '202608111803';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -1472,7 +1472,7 @@ class AuroCounter extends LitElement {
             aria-valuemax="${this.max}"
             aria-valuemin="${this.min}"
             aria-valuenow="${this.value}"
-            aria-valuetext="${this.value !== undefined ? this.value : this.min}"
+            aria-valuetext="'${this.value !== undefined ? this.value : this.min}'"
             role="spinbutton"
             tabindex="${this.disabled ? '-1' : '0'}"
           >
@@ -5220,7 +5220,7 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202607291953';
+var formkitVersion = '202608111803';
 
 let AuroElement$1 = class AuroElement extends LitElement {
   static get properties() {
@@ -5922,6 +5922,15 @@ class AuroDropdown extends AuroElement$1 {
 
   connectedCallback() {
     super.connectedCallback();
+    // Re-register trigger event listeners removed by floater.disconnect() in
+    // disconnectedCallback(). Fires when a parent element (e.g. auro-drawer)
+    // moves this element to a new DOM location. firstUpdated() won't re-run,
+    // so without this the trigger click/keydown handlers are permanently gone.
+    // Guard on floater.element so this is a no-op on the initial connect
+    // (before firstUpdated() has called configure()).
+    if (this.floater?.element) {
+      this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
+    }
   }
 
   disconnectedCallback() {