@aurodesignsystem-dev/auro-formkit 0.0.0-pr1600.3 → 0.0.0-pr1603.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/components/checkbox/demo/customize.min.js +1 -1
  2. package/components/checkbox/demo/getting-started.min.js +1 -1
  3. package/components/checkbox/demo/index.min.js +1 -1
  4. package/components/checkbox/dist/index.js +1 -1
  5. package/components/checkbox/dist/registered.js +1 -1
  6. package/components/combobox/demo/customize.min.js +100 -4
  7. package/components/combobox/demo/getting-started.min.js +100 -4
  8. package/components/combobox/demo/index.min.js +100 -4
  9. package/components/combobox/dist/auro-combobox.d.ts +22 -0
  10. package/components/combobox/dist/index.js +84 -4
  11. package/components/combobox/dist/registered.js +84 -4
  12. package/components/counter/demo/customize.min.js +2 -2
  13. package/components/counter/demo/index.min.js +2 -2
  14. package/components/counter/dist/index.js +2 -2
  15. package/components/counter/dist/registered.js +2 -2
  16. package/components/datepicker/demo/customize.min.js +3 -3
  17. package/components/datepicker/demo/index.min.js +3 -3
  18. package/components/datepicker/dist/index.js +3 -3
  19. package/components/datepicker/dist/registered.js +3 -3
  20. package/components/dropdown/demo/customize.min.js +1 -1
  21. package/components/dropdown/demo/getting-started.min.js +2 -2
  22. package/components/dropdown/demo/index.min.js +1 -1
  23. package/components/dropdown/dist/index.js +1 -1
  24. package/components/dropdown/dist/registered.js +1 -1
  25. package/components/form/demo/customize.min.js +110 -14
  26. package/components/form/demo/getting-started.min.js +110 -14
  27. package/components/form/demo/index.min.js +110 -14
  28. package/components/form/demo/registerDemoDeps.min.js +110 -14
  29. package/components/input/demo/customize.min.js +1 -1
  30. package/components/input/demo/getting-started.min.js +1 -1
  31. package/components/input/demo/index.min.js +1 -1
  32. package/components/input/dist/index.js +1 -1
  33. package/components/input/dist/registered.js +1 -1
  34. package/components/menu/demo/index.min.js +16 -0
  35. package/components/menu/dist/index.js +16 -0
  36. package/components/menu/dist/registered.js +16 -0
  37. package/components/radio/demo/customize.min.js +1 -1
  38. package/components/radio/demo/getting-started.min.js +1 -1
  39. package/components/radio/demo/index.min.js +1 -1
  40. package/components/radio/dist/index.js +1 -1
  41. package/components/radio/dist/registered.js +1 -1
  42. package/components/select/demo/customize.min.js +18 -2
  43. package/components/select/demo/getting-started.min.js +18 -2
  44. package/components/select/demo/index.min.js +18 -2
  45. package/components/select/dist/index.js +2 -2
  46. package/components/select/dist/registered.js +2 -2
  47. package/custom-elements.json +587 -567
  48. package/package.json +1 -1
@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
1284
1284
  }
1285
1285
  }
1286
1286
 
1287
- var formkitVersion = '202609011635';
1287
+ var formkitVersion = '202609011845';
1288
1288
 
1289
1289
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1290
1290
  // See LICENSE in the project root for license information.
@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
1284
1284
  }
1285
1285
  }
1286
1286
 
1287
- var formkitVersion = '202609011635';
1287
+ var formkitVersion = '202609011845';
1288
1288
 
1289
1289
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1290
1290
  // See LICENSE in the project root for license information.
@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
1284
1284
  }
1285
1285
  }
1286
1286
 
1287
- var formkitVersion = '202609011635';
1287
+ var formkitVersion = '202609011845';
1288
1288
 
1289
1289
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1290
1290
  // See LICENSE in the project root for license information.
@@ -1237,7 +1237,7 @@ class AuroHelpText extends LitElement {
1237
1237
  }
1238
1238
  }
1239
1239
 
1240
- var formkitVersion = '202609011635';
1240
+ var formkitVersion = '202609011845';
1241
1241
 
1242
1242
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1243
1243
  // See LICENSE in the project root for license information.
@@ -1237,7 +1237,7 @@ class AuroHelpText extends LitElement {
1237
1237
  }
1238
1238
  }
1239
1239
 
1240
- var formkitVersion = '202609011635';
1240
+ var formkitVersion = '202609011845';
1241
1241
 
1242
1242
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1243
1243
  // See LICENSE in the project root for license information.
@@ -5066,7 +5066,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
5066
5066
  }
5067
5067
  };
5068
5068
 
5069
- var formkitVersion$2 = '202609011635';
5069
+ var formkitVersion$2 = '202609011845';
5070
5070
 
5071
5071
  /**
5072
5072
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -18935,7 +18935,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
18935
18935
  }
18936
18936
  };
18937
18937
 
18938
- var formkitVersion$1 = '202609011635';
18938
+ var formkitVersion$1 = '202609011845';
18939
18939
 
18940
18940
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18941
18941
  // See LICENSE in the project root for license information.
@@ -20127,7 +20127,7 @@ class AuroBibtemplate extends i$3 {
20127
20127
  }
20128
20128
  }
20129
20129
 
20130
- var formkitVersion = '202609011635';
20130
+ var formkitVersion = '202609011845';
20131
20131
 
20132
20132
  var styleCss$3 = i$6`.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}`;
20133
20133
 
@@ -20568,6 +20568,11 @@ class AuroCombobox extends AuroElement {
20568
20568
  this.behavior = "suggestion";
20569
20569
  this.clearBtnFocused = false;
20570
20570
 
20571
+ // One-shot: set when the input's clear button is activated so the
20572
+ // SPA-preselect guard in handleInputValueChange doesn't swallow the
20573
+ // genuine clear (AB#1634257).
20574
+ this._clearBtnActivated = false;
20575
+
20571
20576
  // Defaults that effect the overall layout of the combobox
20572
20577
  this.checkmark = false;
20573
20578
  this.dvInputOnly = false;
@@ -21525,6 +21530,13 @@ class AuroCombobox extends AuroElement {
21525
21530
  this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
21526
21531
  this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
21527
21532
 
21533
+ // Mirror the trigger's clear-button tracking onto the fullscreen bib input
21534
+ // so clearing there also fully resets the combobox (AB#1634257). See
21535
+ // trackClearBtnActivation for why this must run in the capture phase.
21536
+ if (this.inputInBib && this.inputInBib !== this.input) {
21537
+ this.trackClearBtnActivation(this.inputInBib);
21538
+ }
21539
+
21528
21540
  // Pass label text to the dropdown bib for accessible dialog naming
21529
21541
  const labelElement = this.querySelector('[slot="label"]');
21530
21542
  if (labelElement) {
@@ -21910,6 +21922,50 @@ class AuroCombobox extends AuroElement {
21910
21922
  this.clearBtnFocused = false;
21911
21923
  }
21912
21924
  });
21925
+
21926
+ this.trackClearBtnActivation(this.input);
21927
+ }
21928
+
21929
+ /**
21930
+ * Flags genuine clear-button activations on an auro-input so the SPA-preselect
21931
+ * guard in handleInputValueChange doesn't swallow them.
21932
+ *
21933
+ * The auro-input clear button fires an `isProgrammatic` input event (via
21934
+ * notifyValueChanged) that is indistinguishable in shape from the
21935
+ * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
21936
+ * input). Without this one-shot flag, clicking clear would leave
21937
+ * this.value/optionSelected stale (AB#1634257).
21938
+ *
21939
+ * Delegated on the shadow root so it works regardless of when .clearBtn
21940
+ * renders (it only exists after a value is set), and covers both real clicks
21941
+ * and programmatic clearBtn.click() (which no focusin precedes). Registered in
21942
+ * the CAPTURE phase so the flag is set BEFORE the button's own @click
21943
+ * (handleClickClear) fires its synchronous input event — which is when
21944
+ * handleInputValueChange reads the flag.
21945
+ * @private
21946
+ * @param {Element} inputEl - The auro-input whose clear button to track.
21947
+ * @returns {void}
21948
+ */
21949
+ trackClearBtnActivation(inputEl) {
21950
+ if (!inputEl || !inputEl.shadowRoot) {
21951
+ return;
21952
+ }
21953
+ inputEl.shadowRoot.addEventListener('click', (event) => {
21954
+ if (event.target.closest('.clearBtn')) {
21955
+ this._clearBtnActivated = true;
21956
+
21957
+ // Bound the flag's lifetime to this synchronous clear -> input window.
21958
+ // auro-input's handleClickClear fires its input event synchronously
21959
+ // (before any macrotask runs), so handleInputValueChange consumes the
21960
+ // flag first and this reset is a harmless no-op. It only does real work
21961
+ // if that input event never arrives (e.g. auro-input throws mid-clear),
21962
+ // guaranteeing the flag can't survive to be misread as a genuine clear
21963
+ // by a later unrelated event such as an SPA-preselect echo (AB#1634257).
21964
+ setTimeout(() => {
21965
+ this._clearBtnActivated = false;
21966
+ }, 0);
21967
+ }
21968
+ }, true);
21913
21969
  }
21914
21970
 
21915
21971
  /**
@@ -21951,6 +22007,17 @@ class AuroCombobox extends AuroElement {
21951
22007
  * @returns {void}
21952
22008
  */
21953
22009
  handleInputValueChange(event) {
22010
+ // Consume the one-shot clear-button flag on EVERY entry, before any branch
22011
+ // below can early-return. trackClearBtnActivation sets it in the capture
22012
+ // phase right before auro-input's clear button fires its synchronous input
22013
+ // event; reading and immediately clearing it here guarantees the flag never
22014
+ // survives a handleInputValueChange call to leak into a later event (e.g.
22015
+ // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
22016
+ // where it would defeat the guard below. Held in a local so that guard can
22017
+ // still tell a genuine clear from the init-render echo (AB#1634257).
22018
+ const clearBtnActivated = this._clearBtnActivated;
22019
+ this._clearBtnActivated = false;
22020
+
21954
22021
  // When the event comes from the fullscreen bib input, sync the value to
21955
22022
  // the trigger input. Setting trigger.value triggers Lit's updated()
21956
22023
  // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -21998,7 +22065,12 @@ class AuroCombobox extends AuroElement {
21998
22065
  // to the exact shape of that echo (isProgrammatic + non-empty combobox
21999
22066
  // value + empty input.value) so it doesn't affect the swap/typed paths
22000
22067
  // where value/input already track each other through the sync helpers.
22001
- if (event && event.isProgrammatic && this.value && !this.input.value) {
22068
+ // The clear button's echo has the same shape (isProgrammatic + set value +
22069
+ // empty input) but is a genuine user clear that MUST reset this.value and
22070
+ // optionSelected below. clearBtnActivated (consumed at the top of this
22071
+ // method) is true only for that genuine clear, so only the real
22072
+ // SPA-preselect echo bails (AB#1634257).
22073
+ if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
22002
22074
  return;
22003
22075
  }
22004
22076
 
@@ -22241,6 +22313,14 @@ class AuroCombobox extends AuroElement {
22241
22313
  }
22242
22314
  if (this.menu.value || this.menu.optionSelected) {
22243
22315
  this.menu.reset();
22316
+ } else {
22317
+ // The menu's selection properties are already cleared, but option
22318
+ // elements can still carry a stale `selected` attribute (e.g. the menu
22319
+ // options were rebuilt after the value was set, orphaning the DOM from
22320
+ // the now-null optionSelected). reset() is skipped above in that case,
22321
+ // so re-sync the option DOM directly to guarantee no option renders as
22322
+ // selected once the field is cleared (AB#1634259).
22323
+ this.menu.clearSelection();
22244
22324
  }
22245
22325
  } finally {
22246
22326
  this._clearing = false;
@@ -23692,6 +23772,22 @@ class AuroMenu extends AuroElement {
23692
23772
  this.value = undefined;
23693
23773
  this._selectedKey = undefined;
23694
23774
  this._index = -1;
23775
+
23776
+ // Eagerly sync the option DOM to the now-empty selection. Nulling the
23777
+ // reactive properties above normally schedules updated() → updateItemsState,
23778
+ // but that only runs when a property actually changes. If an option still
23779
+ // carries a stale `selected`/`aria-selected` attribute while these
23780
+ // properties are already undefined (e.g. options were rebuilt after a value
23781
+ // was set), no re-render fires and the option keeps rendering as selected.
23782
+ // Strip that state now so no option looks selected after a clear (AB#1634259).
23783
+ // Intentionally leaves `active`/`optionActive` untouched so a highlighted
23784
+ // option remains keyboard-re-selectable after emptying the value (AB#1606433).
23785
+ this.updateItemsState(new Map([
23786
+ [
23787
+ 'optionSelected',
23788
+ true
23789
+ ]
23790
+ ]));
23695
23791
  }
23696
23792
 
23697
23793
  /**
@@ -5066,7 +5066,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
5066
5066
  }
5067
5067
  };
5068
5068
 
5069
- var formkitVersion$2 = '202609011635';
5069
+ var formkitVersion$2 = '202609011845';
5070
5070
 
5071
5071
  /**
5072
5072
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -18935,7 +18935,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
18935
18935
  }
18936
18936
  };
18937
18937
 
18938
- var formkitVersion$1 = '202609011635';
18938
+ var formkitVersion$1 = '202609011845';
18939
18939
 
18940
18940
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18941
18941
  // See LICENSE in the project root for license information.
@@ -20127,7 +20127,7 @@ class AuroBibtemplate extends i$3 {
20127
20127
  }
20128
20128
  }
20129
20129
 
20130
- var formkitVersion = '202609011635';
20130
+ var formkitVersion = '202609011845';
20131
20131
 
20132
20132
  var styleCss$3 = i$6`.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}`;
20133
20133
 
@@ -20568,6 +20568,11 @@ class AuroCombobox extends AuroElement {
20568
20568
  this.behavior = "suggestion";
20569
20569
  this.clearBtnFocused = false;
20570
20570
 
20571
+ // One-shot: set when the input's clear button is activated so the
20572
+ // SPA-preselect guard in handleInputValueChange doesn't swallow the
20573
+ // genuine clear (AB#1634257).
20574
+ this._clearBtnActivated = false;
20575
+
20571
20576
  // Defaults that effect the overall layout of the combobox
20572
20577
  this.checkmark = false;
20573
20578
  this.dvInputOnly = false;
@@ -21525,6 +21530,13 @@ class AuroCombobox extends AuroElement {
21525
21530
  this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
21526
21531
  this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
21527
21532
 
21533
+ // Mirror the trigger's clear-button tracking onto the fullscreen bib input
21534
+ // so clearing there also fully resets the combobox (AB#1634257). See
21535
+ // trackClearBtnActivation for why this must run in the capture phase.
21536
+ if (this.inputInBib && this.inputInBib !== this.input) {
21537
+ this.trackClearBtnActivation(this.inputInBib);
21538
+ }
21539
+
21528
21540
  // Pass label text to the dropdown bib for accessible dialog naming
21529
21541
  const labelElement = this.querySelector('[slot="label"]');
21530
21542
  if (labelElement) {
@@ -21910,6 +21922,50 @@ class AuroCombobox extends AuroElement {
21910
21922
  this.clearBtnFocused = false;
21911
21923
  }
21912
21924
  });
21925
+
21926
+ this.trackClearBtnActivation(this.input);
21927
+ }
21928
+
21929
+ /**
21930
+ * Flags genuine clear-button activations on an auro-input so the SPA-preselect
21931
+ * guard in handleInputValueChange doesn't swallow them.
21932
+ *
21933
+ * The auro-input clear button fires an `isProgrammatic` input event (via
21934
+ * notifyValueChanged) that is indistinguishable in shape from the
21935
+ * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
21936
+ * input). Without this one-shot flag, clicking clear would leave
21937
+ * this.value/optionSelected stale (AB#1634257).
21938
+ *
21939
+ * Delegated on the shadow root so it works regardless of when .clearBtn
21940
+ * renders (it only exists after a value is set), and covers both real clicks
21941
+ * and programmatic clearBtn.click() (which no focusin precedes). Registered in
21942
+ * the CAPTURE phase so the flag is set BEFORE the button's own @click
21943
+ * (handleClickClear) fires its synchronous input event — which is when
21944
+ * handleInputValueChange reads the flag.
21945
+ * @private
21946
+ * @param {Element} inputEl - The auro-input whose clear button to track.
21947
+ * @returns {void}
21948
+ */
21949
+ trackClearBtnActivation(inputEl) {
21950
+ if (!inputEl || !inputEl.shadowRoot) {
21951
+ return;
21952
+ }
21953
+ inputEl.shadowRoot.addEventListener('click', (event) => {
21954
+ if (event.target.closest('.clearBtn')) {
21955
+ this._clearBtnActivated = true;
21956
+
21957
+ // Bound the flag's lifetime to this synchronous clear -> input window.
21958
+ // auro-input's handleClickClear fires its input event synchronously
21959
+ // (before any macrotask runs), so handleInputValueChange consumes the
21960
+ // flag first and this reset is a harmless no-op. It only does real work
21961
+ // if that input event never arrives (e.g. auro-input throws mid-clear),
21962
+ // guaranteeing the flag can't survive to be misread as a genuine clear
21963
+ // by a later unrelated event such as an SPA-preselect echo (AB#1634257).
21964
+ setTimeout(() => {
21965
+ this._clearBtnActivated = false;
21966
+ }, 0);
21967
+ }
21968
+ }, true);
21913
21969
  }
21914
21970
 
21915
21971
  /**
@@ -21951,6 +22007,17 @@ class AuroCombobox extends AuroElement {
21951
22007
  * @returns {void}
21952
22008
  */
21953
22009
  handleInputValueChange(event) {
22010
+ // Consume the one-shot clear-button flag on EVERY entry, before any branch
22011
+ // below can early-return. trackClearBtnActivation sets it in the capture
22012
+ // phase right before auro-input's clear button fires its synchronous input
22013
+ // event; reading and immediately clearing it here guarantees the flag never
22014
+ // survives a handleInputValueChange call to leak into a later event (e.g.
22015
+ // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
22016
+ // where it would defeat the guard below. Held in a local so that guard can
22017
+ // still tell a genuine clear from the init-render echo (AB#1634257).
22018
+ const clearBtnActivated = this._clearBtnActivated;
22019
+ this._clearBtnActivated = false;
22020
+
21954
22021
  // When the event comes from the fullscreen bib input, sync the value to
21955
22022
  // the trigger input. Setting trigger.value triggers Lit's updated()
21956
22023
  // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -21998,7 +22065,12 @@ class AuroCombobox extends AuroElement {
21998
22065
  // to the exact shape of that echo (isProgrammatic + non-empty combobox
21999
22066
  // value + empty input.value) so it doesn't affect the swap/typed paths
22000
22067
  // where value/input already track each other through the sync helpers.
22001
- if (event && event.isProgrammatic && this.value && !this.input.value) {
22068
+ // The clear button's echo has the same shape (isProgrammatic + set value +
22069
+ // empty input) but is a genuine user clear that MUST reset this.value and
22070
+ // optionSelected below. clearBtnActivated (consumed at the top of this
22071
+ // method) is true only for that genuine clear, so only the real
22072
+ // SPA-preselect echo bails (AB#1634257).
22073
+ if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
22002
22074
  return;
22003
22075
  }
22004
22076
 
@@ -22241,6 +22313,14 @@ class AuroCombobox extends AuroElement {
22241
22313
  }
22242
22314
  if (this.menu.value || this.menu.optionSelected) {
22243
22315
  this.menu.reset();
22316
+ } else {
22317
+ // The menu's selection properties are already cleared, but option
22318
+ // elements can still carry a stale `selected` attribute (e.g. the menu
22319
+ // options were rebuilt after the value was set, orphaning the DOM from
22320
+ // the now-null optionSelected). reset() is skipped above in that case,
22321
+ // so re-sync the option DOM directly to guarantee no option renders as
22322
+ // selected once the field is cleared (AB#1634259).
22323
+ this.menu.clearSelection();
22244
22324
  }
22245
22325
  } finally {
22246
22326
  this._clearing = false;
@@ -23692,6 +23772,22 @@ class AuroMenu extends AuroElement {
23692
23772
  this.value = undefined;
23693
23773
  this._selectedKey = undefined;
23694
23774
  this._index = -1;
23775
+
23776
+ // Eagerly sync the option DOM to the now-empty selection. Nulling the
23777
+ // reactive properties above normally schedules updated() → updateItemsState,
23778
+ // but that only runs when a property actually changes. If an option still
23779
+ // carries a stale `selected`/`aria-selected` attribute while these
23780
+ // properties are already undefined (e.g. options were rebuilt after a value
23781
+ // was set), no re-render fires and the option keeps rendering as selected.
23782
+ // Strip that state now so no option looks selected after a clear (AB#1634259).
23783
+ // Intentionally leaves `active`/`optionActive` untouched so a highlighted
23784
+ // option remains keyboard-re-selectable after emptying the value (AB#1606433).
23785
+ this.updateItemsState(new Map([
23786
+ [
23787
+ 'optionSelected',
23788
+ true
23789
+ ]
23790
+ ]));
23695
23791
  }
23696
23792
 
23697
23793
  /**
@@ -5081,7 +5081,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
5081
5081
  }
5082
5082
  };
5083
5083
 
5084
- var formkitVersion$2 = '202609011635';
5084
+ var formkitVersion$2 = '202609011845';
5085
5085
 
5086
5086
  /**
5087
5087
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -18950,7 +18950,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
18950
18950
  }
18951
18951
  };
18952
18952
 
18953
- var formkitVersion$1 = '202609011635';
18953
+ var formkitVersion$1 = '202609011845';
18954
18954
 
18955
18955
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18956
18956
  // See LICENSE in the project root for license information.
@@ -20142,7 +20142,7 @@ class AuroBibtemplate extends i$3 {
20142
20142
  }
20143
20143
  }
20144
20144
 
20145
- var formkitVersion = '202609011635';
20145
+ var formkitVersion = '202609011845';
20146
20146
 
20147
20147
  var styleCss$3 = i$6`.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}`;
20148
20148
 
@@ -20583,6 +20583,11 @@ class AuroCombobox extends AuroElement {
20583
20583
  this.behavior = "suggestion";
20584
20584
  this.clearBtnFocused = false;
20585
20585
 
20586
+ // One-shot: set when the input's clear button is activated so the
20587
+ // SPA-preselect guard in handleInputValueChange doesn't swallow the
20588
+ // genuine clear (AB#1634257).
20589
+ this._clearBtnActivated = false;
20590
+
20586
20591
  // Defaults that effect the overall layout of the combobox
20587
20592
  this.checkmark = false;
20588
20593
  this.dvInputOnly = false;
@@ -21540,6 +21545,13 @@ class AuroCombobox extends AuroElement {
21540
21545
  this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
21541
21546
  this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
21542
21547
 
21548
+ // Mirror the trigger's clear-button tracking onto the fullscreen bib input
21549
+ // so clearing there also fully resets the combobox (AB#1634257). See
21550
+ // trackClearBtnActivation for why this must run in the capture phase.
21551
+ if (this.inputInBib && this.inputInBib !== this.input) {
21552
+ this.trackClearBtnActivation(this.inputInBib);
21553
+ }
21554
+
21543
21555
  // Pass label text to the dropdown bib for accessible dialog naming
21544
21556
  const labelElement = this.querySelector('[slot="label"]');
21545
21557
  if (labelElement) {
@@ -21925,6 +21937,50 @@ class AuroCombobox extends AuroElement {
21925
21937
  this.clearBtnFocused = false;
21926
21938
  }
21927
21939
  });
21940
+
21941
+ this.trackClearBtnActivation(this.input);
21942
+ }
21943
+
21944
+ /**
21945
+ * Flags genuine clear-button activations on an auro-input so the SPA-preselect
21946
+ * guard in handleInputValueChange doesn't swallow them.
21947
+ *
21948
+ * The auro-input clear button fires an `isProgrammatic` input event (via
21949
+ * notifyValueChanged) that is indistinguishable in shape from the
21950
+ * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
21951
+ * input). Without this one-shot flag, clicking clear would leave
21952
+ * this.value/optionSelected stale (AB#1634257).
21953
+ *
21954
+ * Delegated on the shadow root so it works regardless of when .clearBtn
21955
+ * renders (it only exists after a value is set), and covers both real clicks
21956
+ * and programmatic clearBtn.click() (which no focusin precedes). Registered in
21957
+ * the CAPTURE phase so the flag is set BEFORE the button's own @click
21958
+ * (handleClickClear) fires its synchronous input event — which is when
21959
+ * handleInputValueChange reads the flag.
21960
+ * @private
21961
+ * @param {Element} inputEl - The auro-input whose clear button to track.
21962
+ * @returns {void}
21963
+ */
21964
+ trackClearBtnActivation(inputEl) {
21965
+ if (!inputEl || !inputEl.shadowRoot) {
21966
+ return;
21967
+ }
21968
+ inputEl.shadowRoot.addEventListener('click', (event) => {
21969
+ if (event.target.closest('.clearBtn')) {
21970
+ this._clearBtnActivated = true;
21971
+
21972
+ // Bound the flag's lifetime to this synchronous clear -> input window.
21973
+ // auro-input's handleClickClear fires its input event synchronously
21974
+ // (before any macrotask runs), so handleInputValueChange consumes the
21975
+ // flag first and this reset is a harmless no-op. It only does real work
21976
+ // if that input event never arrives (e.g. auro-input throws mid-clear),
21977
+ // guaranteeing the flag can't survive to be misread as a genuine clear
21978
+ // by a later unrelated event such as an SPA-preselect echo (AB#1634257).
21979
+ setTimeout(() => {
21980
+ this._clearBtnActivated = false;
21981
+ }, 0);
21982
+ }
21983
+ }, true);
21928
21984
  }
21929
21985
 
21930
21986
  /**
@@ -21966,6 +22022,17 @@ class AuroCombobox extends AuroElement {
21966
22022
  * @returns {void}
21967
22023
  */
21968
22024
  handleInputValueChange(event) {
22025
+ // Consume the one-shot clear-button flag on EVERY entry, before any branch
22026
+ // below can early-return. trackClearBtnActivation sets it in the capture
22027
+ // phase right before auro-input's clear button fires its synchronous input
22028
+ // event; reading and immediately clearing it here guarantees the flag never
22029
+ // survives a handleInputValueChange call to leak into a later event (e.g.
22030
+ // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
22031
+ // where it would defeat the guard below. Held in a local so that guard can
22032
+ // still tell a genuine clear from the init-render echo (AB#1634257).
22033
+ const clearBtnActivated = this._clearBtnActivated;
22034
+ this._clearBtnActivated = false;
22035
+
21969
22036
  // When the event comes from the fullscreen bib input, sync the value to
21970
22037
  // the trigger input. Setting trigger.value triggers Lit's updated()
21971
22038
  // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -22013,7 +22080,12 @@ class AuroCombobox extends AuroElement {
22013
22080
  // to the exact shape of that echo (isProgrammatic + non-empty combobox
22014
22081
  // value + empty input.value) so it doesn't affect the swap/typed paths
22015
22082
  // where value/input already track each other through the sync helpers.
22016
- if (event && event.isProgrammatic && this.value && !this.input.value) {
22083
+ // The clear button's echo has the same shape (isProgrammatic + set value +
22084
+ // empty input) but is a genuine user clear that MUST reset this.value and
22085
+ // optionSelected below. clearBtnActivated (consumed at the top of this
22086
+ // method) is true only for that genuine clear, so only the real
22087
+ // SPA-preselect echo bails (AB#1634257).
22088
+ if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
22017
22089
  return;
22018
22090
  }
22019
22091
 
@@ -22256,6 +22328,14 @@ class AuroCombobox extends AuroElement {
22256
22328
  }
22257
22329
  if (this.menu.value || this.menu.optionSelected) {
22258
22330
  this.menu.reset();
22331
+ } else {
22332
+ // The menu's selection properties are already cleared, but option
22333
+ // elements can still carry a stale `selected` attribute (e.g. the menu
22334
+ // options were rebuilt after the value was set, orphaning the DOM from
22335
+ // the now-null optionSelected). reset() is skipped above in that case,
22336
+ // so re-sync the option DOM directly to guarantee no option renders as
22337
+ // selected once the field is cleared (AB#1634259).
22338
+ this.menu.clearSelection();
22259
22339
  }
22260
22340
  } finally {
22261
22341
  this._clearing = false;
@@ -23707,6 +23787,22 @@ class AuroMenu extends AuroElement {
23707
23787
  this.value = undefined;
23708
23788
  this._selectedKey = undefined;
23709
23789
  this._index = -1;
23790
+
23791
+ // Eagerly sync the option DOM to the now-empty selection. Nulling the
23792
+ // reactive properties above normally schedules updated() → updateItemsState,
23793
+ // but that only runs when a property actually changes. If an option still
23794
+ // carries a stale `selected`/`aria-selected` attribute while these
23795
+ // properties are already undefined (e.g. options were rebuilt after a value
23796
+ // was set), no re-render fires and the option keeps rendering as selected.
23797
+ // Strip that state now so no option looks selected after a clear (AB#1634259).
23798
+ // Intentionally leaves `active`/`optionActive` untouched so a highlighted
23799
+ // option remains keyboard-re-selectable after emptying the value (AB#1606433).
23800
+ this.updateItemsState(new Map([
23801
+ [
23802
+ 'optionSelected',
23803
+ true
23804
+ ]
23805
+ ]));
23710
23806
  }
23711
23807
 
23712
23808
  /**
@@ -351,6 +351,7 @@ export class AuroCombobox extends AuroElement {
351
351
  /** @type {'filter' | 'suggestion'} */
352
352
  behavior: "filter" | "suggestion" | undefined;
353
353
  clearBtnFocused: boolean | undefined;
354
+ _clearBtnActivated: boolean | undefined;
354
355
  checkmark: boolean | undefined;
355
356
  dvInputOnly: boolean | undefined;
356
357
  /** @type {'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'disabled'} */
@@ -538,6 +539,27 @@ export class AuroCombobox extends AuroElement {
538
539
  * @returns {void}
539
540
  */
540
541
  private configureInput;
542
+ /**
543
+ * Flags genuine clear-button activations on an auro-input so the SPA-preselect
544
+ * guard in handleInputValueChange doesn't swallow them.
545
+ *
546
+ * The auro-input clear button fires an `isProgrammatic` input event (via
547
+ * notifyValueChanged) that is indistinguishable in shape from the
548
+ * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
549
+ * input). Without this one-shot flag, clicking clear would leave
550
+ * this.value/optionSelected stale (AB#1634257).
551
+ *
552
+ * Delegated on the shadow root so it works regardless of when .clearBtn
553
+ * renders (it only exists after a value is set), and covers both real clicks
554
+ * and programmatic clearBtn.click() (which no focusin precedes). Registered in
555
+ * the CAPTURE phase so the flag is set BEFORE the button's own @click
556
+ * (handleClickClear) fires its synchronous input event — which is when
557
+ * handleInputValueChange reads the flag.
558
+ * @private
559
+ * @param {Element} inputEl - The auro-input whose clear button to track.
560
+ * @returns {void}
561
+ */
562
+ private trackClearBtnActivation;
541
563
  /**
542
564
  * Manages the visibility of the dropdown based on loading state changes.
543
565
  *