@aurodesignsystem-dev/auro-formkit 0.0.0-pr1603.5 → 0.0.0-pr1604.0

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 (63) 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 +4 -110
  7. package/components/combobox/demo/getting-started.md +49 -0
  8. package/components/combobox/demo/getting-started.min.js +23 -110
  9. package/components/combobox/demo/index.min.js +4 -110
  10. package/components/combobox/dist/auro-combobox.d.ts +0 -22
  11. package/components/combobox/dist/index.js +4 -94
  12. package/components/combobox/dist/registered.js +4 -94
  13. package/components/counter/demo/api.md +2 -0
  14. package/components/counter/demo/customize.min.js +26 -2
  15. package/components/counter/demo/getting-started.html +3 -1
  16. package/components/counter/demo/getting-started.md +49 -0
  17. package/components/counter/demo/getting-started.min.js +8492 -0
  18. package/components/counter/demo/index.min.js +26 -2
  19. package/components/counter/dist/auro-counter-group.d.ts +6 -0
  20. package/components/counter/dist/auro-counter.d.ts +6 -0
  21. package/components/counter/dist/index.js +26 -2
  22. package/components/counter/dist/registered.js +26 -2
  23. package/components/datepicker/demo/customize.min.js +3 -3
  24. package/components/datepicker/demo/getting-started.html +3 -1
  25. package/components/datepicker/demo/getting-started.md +39 -0
  26. package/components/datepicker/demo/getting-started.min.js +37626 -0
  27. package/components/datepicker/demo/index.min.js +3 -3
  28. package/components/datepicker/dist/index.js +3 -3
  29. package/components/datepicker/dist/registered.js +3 -3
  30. package/components/dropdown/demo/customize.min.js +1 -1
  31. package/components/dropdown/demo/getting-started.min.js +2 -2
  32. package/components/dropdown/demo/index.min.js +1 -1
  33. package/components/dropdown/dist/index.js +1 -1
  34. package/components/dropdown/dist/registered.js +1 -1
  35. package/components/form/demo/customize.min.js +44 -121
  36. package/components/form/demo/getting-started.min.js +44 -121
  37. package/components/form/demo/index.min.js +44 -121
  38. package/components/form/demo/registerDemoDeps.min.js +38 -120
  39. package/components/form/dist/index.js +6 -1
  40. package/components/form/dist/registered.js +6 -1
  41. package/components/input/demo/customize.md +0 -37
  42. package/components/input/demo/customize.min.js +1 -10
  43. package/components/input/demo/getting-started.md +33 -0
  44. package/components/input/demo/getting-started.min.js +21 -1
  45. package/components/input/demo/index.min.js +1 -1
  46. package/components/input/dist/index.js +1 -1
  47. package/components/input/dist/registered.js +1 -1
  48. package/components/menu/demo/index.min.js +0 -16
  49. package/components/menu/dist/index.js +0 -16
  50. package/components/menu/dist/registered.js +0 -16
  51. package/components/radio/demo/customize.min.js +1 -1
  52. package/components/radio/demo/getting-started.min.js +1 -1
  53. package/components/radio/demo/index.min.js +1 -1
  54. package/components/radio/dist/index.js +1 -1
  55. package/components/radio/dist/registered.js +1 -1
  56. package/components/select/demo/customize.min.js +2 -18
  57. package/components/select/demo/getting-started.md +49 -0
  58. package/components/select/demo/getting-started.min.js +24 -19
  59. package/components/select/demo/index.min.js +2 -18
  60. package/components/select/dist/index.js +2 -2
  61. package/components/select/dist/registered.js +2 -2
  62. package/custom-elements.json +1492 -1492
  63. package/package.json +1 -1
@@ -5081,7 +5081,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
5081
5081
  }
5082
5082
  };
5083
5083
 
5084
- var formkitVersion$2 = '202609012013';
5084
+ var formkitVersion$2 = '202609011830';
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 = '202609012013';
18953
+ var formkitVersion$1 = '202609011830';
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 = '202609012013';
20145
+ var formkitVersion = '202609011830';
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,11 +20583,6 @@ 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
-
20591
20586
  // Defaults that effect the overall layout of the combobox
20592
20587
  this.checkmark = false;
20593
20588
  this.dvInputOnly = false;
@@ -21545,13 +21540,6 @@ class AuroCombobox extends AuroElement {
21545
21540
  this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
21546
21541
  this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
21547
21542
 
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
-
21555
21543
  // Pass label text to the dropdown bib for accessible dialog naming
21556
21544
  const labelElement = this.querySelector('[slot="label"]');
21557
21545
  if (labelElement) {
@@ -21937,52 +21925,6 @@ class AuroCombobox extends AuroElement {
21937
21925
  this.clearBtnFocused = false;
21938
21926
  }
21939
21927
  });
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
- // Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
21980
- // component tears down inside that window.
21981
- this._scheduleTimer(() => {
21982
- this._clearBtnActivated = false;
21983
- }, 0);
21984
- }
21985
- }, true);
21986
21928
  }
21987
21929
 
21988
21930
  /**
@@ -22024,17 +21966,6 @@ class AuroCombobox extends AuroElement {
22024
21966
  * @returns {void}
22025
21967
  */
22026
21968
  handleInputValueChange(event) {
22027
- // Consume the one-shot clear-button flag on EVERY entry, before any branch
22028
- // below can early-return. trackClearBtnActivation sets it in the capture
22029
- // phase right before auro-input's clear button fires its synchronous input
22030
- // event; reading and immediately clearing it here guarantees the flag never
22031
- // survives a handleInputValueChange call to leak into a later event (e.g.
22032
- // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
22033
- // where it would defeat the guard below. Held in a local so that guard can
22034
- // still tell a genuine clear from the init-render echo (AB#1634257).
22035
- const clearBtnActivated = this._clearBtnActivated;
22036
- this._clearBtnActivated = false;
22037
-
22038
21969
  // When the event comes from the fullscreen bib input, sync the value to
22039
21970
  // the trigger input. Setting trigger.value triggers Lit's updated()
22040
21971
  // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -22082,12 +22013,7 @@ class AuroCombobox extends AuroElement {
22082
22013
  // to the exact shape of that echo (isProgrammatic + non-empty combobox
22083
22014
  // value + empty input.value) so it doesn't affect the swap/typed paths
22084
22015
  // where value/input already track each other through the sync helpers.
22085
- // The clear button's echo has the same shape (isProgrammatic + set value +
22086
- // empty input) but is a genuine user clear that MUST reset this.value and
22087
- // optionSelected below. clearBtnActivated (consumed at the top of this
22088
- // method) is true only for that genuine clear, so only the real
22089
- // SPA-preselect echo bails (AB#1634257).
22090
- if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
22016
+ if (event && event.isProgrammatic && this.value && !this.input.value) {
22091
22017
  return;
22092
22018
  }
22093
22019
 
@@ -22232,14 +22158,6 @@ class AuroCombobox extends AuroElement {
22232
22158
  // retry would otherwise keep rescheduling itself indefinitely.
22233
22159
  this._pendingTimers.forEach((id) => clearTimeout(id));
22234
22160
  this._pendingTimers.clear();
22235
-
22236
- // Cancelling the timers above drops the macrotask that would have reset
22237
- // _clearBtnActivated, so reset it here too. Otherwise a disconnect inside
22238
- // the clear-click -> macrotask window strands the flag `true`; instance
22239
- // state survives reconnect, and the first matching input event (including
22240
- // an SPA-preselect echo) would then bypass the guard in
22241
- // handleInputValueChange and silently clear value/optionSelected (AB#1634257).
22242
- this._clearBtnActivated = false;
22243
22161
  }
22244
22162
 
22245
22163
  firstUpdated() {
@@ -22338,14 +22256,6 @@ class AuroCombobox extends AuroElement {
22338
22256
  }
22339
22257
  if (this.menu.value || this.menu.optionSelected) {
22340
22258
  this.menu.reset();
22341
- } else {
22342
- // The menu's selection properties are already cleared, but option
22343
- // elements can still carry a stale `selected` attribute (e.g. the menu
22344
- // options were rebuilt after the value was set, orphaning the DOM from
22345
- // the now-null optionSelected). reset() is skipped above in that case,
22346
- // so re-sync the option DOM directly to guarantee no option renders as
22347
- // selected once the field is cleared (AB#1634259).
22348
- this.menu.clearSelection();
22349
22259
  }
22350
22260
  } finally {
22351
22261
  this._clearing = false;
@@ -23797,22 +23707,6 @@ class AuroMenu extends AuroElement {
23797
23707
  this.value = undefined;
23798
23708
  this._selectedKey = undefined;
23799
23709
  this._index = -1;
23800
-
23801
- // Eagerly sync the option DOM to the now-empty selection. Nulling the
23802
- // reactive properties above normally schedules updated() → updateItemsState,
23803
- // but that only runs when a property actually changes. If an option still
23804
- // carries a stale `selected`/`aria-selected` attribute while these
23805
- // properties are already undefined (e.g. options were rebuilt after a value
23806
- // was set), no re-render fires and the option keeps rendering as selected.
23807
- // Strip that state now so no option looks selected after a clear (AB#1634259).
23808
- // Intentionally leaves `active`/`optionActive` untouched so a highlighted
23809
- // option remains keyboard-re-selectable after emptying the value (AB#1606433).
23810
- this.updateItemsState(new Map([
23811
- [
23812
- 'optionSelected',
23813
- true
23814
- ]
23815
- ]));
23816
23710
  }
23817
23711
 
23818
23712
  /**
@@ -351,7 +351,6 @@ 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;
355
354
  checkmark: boolean | undefined;
356
355
  dvInputOnly: boolean | undefined;
357
356
  /** @type {'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'disabled'} */
@@ -539,27 +538,6 @@ export class AuroCombobox extends AuroElement {
539
538
  * @returns {void}
540
539
  */
541
540
  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;
563
541
  /**
564
542
  * Manages the visibility of the dropdown based on loading state changes.
565
543
  *
@@ -4999,7 +4999,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
4999
4999
  }
5000
5000
  };
5001
5001
 
5002
- var formkitVersion$2 = '202609012013';
5002
+ var formkitVersion$2 = '202609011830';
5003
5003
 
5004
5004
  /**
5005
5005
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -18861,7 +18861,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
18861
18861
  }
18862
18862
  };
18863
18863
 
18864
- var formkitVersion$1 = '202609012013';
18864
+ var formkitVersion$1 = '202609011830';
18865
18865
 
18866
18866
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18867
18867
  // See LICENSE in the project root for license information.
@@ -20053,7 +20053,7 @@ class AuroBibtemplate extends LitElement {
20053
20053
  }
20054
20054
  }
20055
20055
 
20056
- var formkitVersion = '202609012013';
20056
+ var formkitVersion = '202609011830';
20057
20057
 
20058
20058
  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}`;
20059
20059
 
@@ -20494,11 +20494,6 @@ class AuroCombobox extends AuroElement {
20494
20494
  this.behavior = "suggestion";
20495
20495
  this.clearBtnFocused = false;
20496
20496
 
20497
- // One-shot: set when the input's clear button is activated so the
20498
- // SPA-preselect guard in handleInputValueChange doesn't swallow the
20499
- // genuine clear (AB#1634257).
20500
- this._clearBtnActivated = false;
20501
-
20502
20497
  // Defaults that effect the overall layout of the combobox
20503
20498
  this.checkmark = false;
20504
20499
  this.dvInputOnly = false;
@@ -21456,13 +21451,6 @@ class AuroCombobox extends AuroElement {
21456
21451
  this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
21457
21452
  this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
21458
21453
 
21459
- // Mirror the trigger's clear-button tracking onto the fullscreen bib input
21460
- // so clearing there also fully resets the combobox (AB#1634257). See
21461
- // trackClearBtnActivation for why this must run in the capture phase.
21462
- if (this.inputInBib && this.inputInBib !== this.input) {
21463
- this.trackClearBtnActivation(this.inputInBib);
21464
- }
21465
-
21466
21454
  // Pass label text to the dropdown bib for accessible dialog naming
21467
21455
  const labelElement = this.querySelector('[slot="label"]');
21468
21456
  if (labelElement) {
@@ -21848,52 +21836,6 @@ class AuroCombobox extends AuroElement {
21848
21836
  this.clearBtnFocused = false;
21849
21837
  }
21850
21838
  });
21851
-
21852
- this.trackClearBtnActivation(this.input);
21853
- }
21854
-
21855
- /**
21856
- * Flags genuine clear-button activations on an auro-input so the SPA-preselect
21857
- * guard in handleInputValueChange doesn't swallow them.
21858
- *
21859
- * The auro-input clear button fires an `isProgrammatic` input event (via
21860
- * notifyValueChanged) that is indistinguishable in shape from the
21861
- * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
21862
- * input). Without this one-shot flag, clicking clear would leave
21863
- * this.value/optionSelected stale (AB#1634257).
21864
- *
21865
- * Delegated on the shadow root so it works regardless of when .clearBtn
21866
- * renders (it only exists after a value is set), and covers both real clicks
21867
- * and programmatic clearBtn.click() (which no focusin precedes). Registered in
21868
- * the CAPTURE phase so the flag is set BEFORE the button's own @click
21869
- * (handleClickClear) fires its synchronous input event — which is when
21870
- * handleInputValueChange reads the flag.
21871
- * @private
21872
- * @param {Element} inputEl - The auro-input whose clear button to track.
21873
- * @returns {void}
21874
- */
21875
- trackClearBtnActivation(inputEl) {
21876
- if (!inputEl || !inputEl.shadowRoot) {
21877
- return;
21878
- }
21879
- inputEl.shadowRoot.addEventListener('click', (event) => {
21880
- if (event.target.closest('.clearBtn')) {
21881
- this._clearBtnActivated = true;
21882
-
21883
- // Bound the flag's lifetime to this synchronous clear -> input window.
21884
- // auro-input's handleClickClear fires its input event synchronously
21885
- // (before any macrotask runs), so handleInputValueChange consumes the
21886
- // flag first and this reset is a harmless no-op. It only does real work
21887
- // if that input event never arrives (e.g. auro-input throws mid-clear),
21888
- // guaranteeing the flag can't survive to be misread as a genuine clear
21889
- // by a later unrelated event such as an SPA-preselect echo (AB#1634257).
21890
- // Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
21891
- // component tears down inside that window.
21892
- this._scheduleTimer(() => {
21893
- this._clearBtnActivated = false;
21894
- }, 0);
21895
- }
21896
- }, true);
21897
21839
  }
21898
21840
 
21899
21841
  /**
@@ -21935,17 +21877,6 @@ class AuroCombobox extends AuroElement {
21935
21877
  * @returns {void}
21936
21878
  */
21937
21879
  handleInputValueChange(event) {
21938
- // Consume the one-shot clear-button flag on EVERY entry, before any branch
21939
- // below can early-return. trackClearBtnActivation sets it in the capture
21940
- // phase right before auro-input's clear button fires its synchronous input
21941
- // event; reading and immediately clearing it here guarantees the flag never
21942
- // survives a handleInputValueChange call to leak into a later event (e.g.
21943
- // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
21944
- // where it would defeat the guard below. Held in a local so that guard can
21945
- // still tell a genuine clear from the init-render echo (AB#1634257).
21946
- const clearBtnActivated = this._clearBtnActivated;
21947
- this._clearBtnActivated = false;
21948
-
21949
21880
  // When the event comes from the fullscreen bib input, sync the value to
21950
21881
  // the trigger input. Setting trigger.value triggers Lit's updated()
21951
21882
  // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -21993,12 +21924,7 @@ class AuroCombobox extends AuroElement {
21993
21924
  // to the exact shape of that echo (isProgrammatic + non-empty combobox
21994
21925
  // value + empty input.value) so it doesn't affect the swap/typed paths
21995
21926
  // where value/input already track each other through the sync helpers.
21996
- // The clear button's echo has the same shape (isProgrammatic + set value +
21997
- // empty input) but is a genuine user clear that MUST reset this.value and
21998
- // optionSelected below. clearBtnActivated (consumed at the top of this
21999
- // method) is true only for that genuine clear, so only the real
22000
- // SPA-preselect echo bails (AB#1634257).
22001
- if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
21927
+ if (event && event.isProgrammatic && this.value && !this.input.value) {
22002
21928
  return;
22003
21929
  }
22004
21930
 
@@ -22143,14 +22069,6 @@ class AuroCombobox extends AuroElement {
22143
22069
  // retry would otherwise keep rescheduling itself indefinitely.
22144
22070
  this._pendingTimers.forEach((id) => clearTimeout(id));
22145
22071
  this._pendingTimers.clear();
22146
-
22147
- // Cancelling the timers above drops the macrotask that would have reset
22148
- // _clearBtnActivated, so reset it here too. Otherwise a disconnect inside
22149
- // the clear-click -> macrotask window strands the flag `true`; instance
22150
- // state survives reconnect, and the first matching input event (including
22151
- // an SPA-preselect echo) would then bypass the guard in
22152
- // handleInputValueChange and silently clear value/optionSelected (AB#1634257).
22153
- this._clearBtnActivated = false;
22154
22072
  }
22155
22073
 
22156
22074
  firstUpdated() {
@@ -22249,14 +22167,6 @@ class AuroCombobox extends AuroElement {
22249
22167
  }
22250
22168
  if (this.menu.value || this.menu.optionSelected) {
22251
22169
  this.menu.reset();
22252
- } else {
22253
- // The menu's selection properties are already cleared, but option
22254
- // elements can still carry a stale `selected` attribute (e.g. the menu
22255
- // options were rebuilt after the value was set, orphaning the DOM from
22256
- // the now-null optionSelected). reset() is skipped above in that case,
22257
- // so re-sync the option DOM directly to guarantee no option renders as
22258
- // selected once the field is cleared (AB#1634259).
22259
- this.menu.clearSelection();
22260
22170
  }
22261
22171
  } finally {
22262
22172
  this._clearing = false;
@@ -4999,7 +4999,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
4999
4999
  }
5000
5000
  };
5001
5001
 
5002
- var formkitVersion$2 = '202609012013';
5002
+ var formkitVersion$2 = '202609011830';
5003
5003
 
5004
5004
  /**
5005
5005
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -18861,7 +18861,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
18861
18861
  }
18862
18862
  };
18863
18863
 
18864
- var formkitVersion$1 = '202609012013';
18864
+ var formkitVersion$1 = '202609011830';
18865
18865
 
18866
18866
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18867
18867
  // See LICENSE in the project root for license information.
@@ -20053,7 +20053,7 @@ class AuroBibtemplate extends LitElement {
20053
20053
  }
20054
20054
  }
20055
20055
 
20056
- var formkitVersion = '202609012013';
20056
+ var formkitVersion = '202609011830';
20057
20057
 
20058
20058
  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}`;
20059
20059
 
@@ -20494,11 +20494,6 @@ class AuroCombobox extends AuroElement {
20494
20494
  this.behavior = "suggestion";
20495
20495
  this.clearBtnFocused = false;
20496
20496
 
20497
- // One-shot: set when the input's clear button is activated so the
20498
- // SPA-preselect guard in handleInputValueChange doesn't swallow the
20499
- // genuine clear (AB#1634257).
20500
- this._clearBtnActivated = false;
20501
-
20502
20497
  // Defaults that effect the overall layout of the combobox
20503
20498
  this.checkmark = false;
20504
20499
  this.dvInputOnly = false;
@@ -21456,13 +21451,6 @@ class AuroCombobox extends AuroElement {
21456
21451
  this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
21457
21452
  this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
21458
21453
 
21459
- // Mirror the trigger's clear-button tracking onto the fullscreen bib input
21460
- // so clearing there also fully resets the combobox (AB#1634257). See
21461
- // trackClearBtnActivation for why this must run in the capture phase.
21462
- if (this.inputInBib && this.inputInBib !== this.input) {
21463
- this.trackClearBtnActivation(this.inputInBib);
21464
- }
21465
-
21466
21454
  // Pass label text to the dropdown bib for accessible dialog naming
21467
21455
  const labelElement = this.querySelector('[slot="label"]');
21468
21456
  if (labelElement) {
@@ -21848,52 +21836,6 @@ class AuroCombobox extends AuroElement {
21848
21836
  this.clearBtnFocused = false;
21849
21837
  }
21850
21838
  });
21851
-
21852
- this.trackClearBtnActivation(this.input);
21853
- }
21854
-
21855
- /**
21856
- * Flags genuine clear-button activations on an auro-input so the SPA-preselect
21857
- * guard in handleInputValueChange doesn't swallow them.
21858
- *
21859
- * The auro-input clear button fires an `isProgrammatic` input event (via
21860
- * notifyValueChanged) that is indistinguishable in shape from the
21861
- * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
21862
- * input). Without this one-shot flag, clicking clear would leave
21863
- * this.value/optionSelected stale (AB#1634257).
21864
- *
21865
- * Delegated on the shadow root so it works regardless of when .clearBtn
21866
- * renders (it only exists after a value is set), and covers both real clicks
21867
- * and programmatic clearBtn.click() (which no focusin precedes). Registered in
21868
- * the CAPTURE phase so the flag is set BEFORE the button's own @click
21869
- * (handleClickClear) fires its synchronous input event — which is when
21870
- * handleInputValueChange reads the flag.
21871
- * @private
21872
- * @param {Element} inputEl - The auro-input whose clear button to track.
21873
- * @returns {void}
21874
- */
21875
- trackClearBtnActivation(inputEl) {
21876
- if (!inputEl || !inputEl.shadowRoot) {
21877
- return;
21878
- }
21879
- inputEl.shadowRoot.addEventListener('click', (event) => {
21880
- if (event.target.closest('.clearBtn')) {
21881
- this._clearBtnActivated = true;
21882
-
21883
- // Bound the flag's lifetime to this synchronous clear -> input window.
21884
- // auro-input's handleClickClear fires its input event synchronously
21885
- // (before any macrotask runs), so handleInputValueChange consumes the
21886
- // flag first and this reset is a harmless no-op. It only does real work
21887
- // if that input event never arrives (e.g. auro-input throws mid-clear),
21888
- // guaranteeing the flag can't survive to be misread as a genuine clear
21889
- // by a later unrelated event such as an SPA-preselect echo (AB#1634257).
21890
- // Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
21891
- // component tears down inside that window.
21892
- this._scheduleTimer(() => {
21893
- this._clearBtnActivated = false;
21894
- }, 0);
21895
- }
21896
- }, true);
21897
21839
  }
21898
21840
 
21899
21841
  /**
@@ -21935,17 +21877,6 @@ class AuroCombobox extends AuroElement {
21935
21877
  * @returns {void}
21936
21878
  */
21937
21879
  handleInputValueChange(event) {
21938
- // Consume the one-shot clear-button flag on EVERY entry, before any branch
21939
- // below can early-return. trackClearBtnActivation sets it in the capture
21940
- // phase right before auro-input's clear button fires its synchronous input
21941
- // event; reading and immediately clearing it here guarantees the flag never
21942
- // survives a handleInputValueChange call to leak into a later event (e.g.
21943
- // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
21944
- // where it would defeat the guard below. Held in a local so that guard can
21945
- // still tell a genuine clear from the init-render echo (AB#1634257).
21946
- const clearBtnActivated = this._clearBtnActivated;
21947
- this._clearBtnActivated = false;
21948
-
21949
21880
  // When the event comes from the fullscreen bib input, sync the value to
21950
21881
  // the trigger input. Setting trigger.value triggers Lit's updated()
21951
21882
  // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -21993,12 +21924,7 @@ class AuroCombobox extends AuroElement {
21993
21924
  // to the exact shape of that echo (isProgrammatic + non-empty combobox
21994
21925
  // value + empty input.value) so it doesn't affect the swap/typed paths
21995
21926
  // where value/input already track each other through the sync helpers.
21996
- // The clear button's echo has the same shape (isProgrammatic + set value +
21997
- // empty input) but is a genuine user clear that MUST reset this.value and
21998
- // optionSelected below. clearBtnActivated (consumed at the top of this
21999
- // method) is true only for that genuine clear, so only the real
22000
- // SPA-preselect echo bails (AB#1634257).
22001
- if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
21927
+ if (event && event.isProgrammatic && this.value && !this.input.value) {
22002
21928
  return;
22003
21929
  }
22004
21930
 
@@ -22143,14 +22069,6 @@ class AuroCombobox extends AuroElement {
22143
22069
  // retry would otherwise keep rescheduling itself indefinitely.
22144
22070
  this._pendingTimers.forEach((id) => clearTimeout(id));
22145
22071
  this._pendingTimers.clear();
22146
-
22147
- // Cancelling the timers above drops the macrotask that would have reset
22148
- // _clearBtnActivated, so reset it here too. Otherwise a disconnect inside
22149
- // the clear-click -> macrotask window strands the flag `true`; instance
22150
- // state survives reconnect, and the first matching input event (including
22151
- // an SPA-preselect echo) would then bypass the guard in
22152
- // handleInputValueChange and silently clear value/optionSelected (AB#1634257).
22153
- this._clearBtnActivated = false;
22154
22072
  }
22155
22073
 
22156
22074
  firstUpdated() {
@@ -22249,14 +22167,6 @@ class AuroCombobox extends AuroElement {
22249
22167
  }
22250
22168
  if (this.menu.value || this.menu.optionSelected) {
22251
22169
  this.menu.reset();
22252
- } else {
22253
- // The menu's selection properties are already cleared, but option
22254
- // elements can still carry a stale `selected` attribute (e.g. the menu
22255
- // options were rebuilt after the value was set, orphaning the DOM from
22256
- // the now-null optionSelected). reset() is skipped above in that case,
22257
- // so re-sync the option DOM directly to guarantee no option renders as
22258
- // selected once the field is cleared (AB#1634259).
22259
- this.menu.clearSelection();
22260
22170
  }
22261
22171
  } finally {
22262
22172
  this._clearing = false;
@@ -35,6 +35,7 @@ The `auro-counter-group` element provides a flexible interface for grouping mult
35
35
  | Method | Type | Description |
36
36
  |------------|----------------------------------------|--------------------------------------------------|
37
37
  | `hideBib` | `(): void` | Hides the dropdown bib if its open. |
38
+ | `reset` | `(): void` | Resets the counter group to its initial state by resetting each child counter and clearing validity.<br />Each child reset dispatches an `input` event, which triggers `updateValue()` to recompute `value`/`total`. |
38
39
  | `showBib` | `(): void` | Shows the dropdown bib if there are options to show. |
39
40
  | `validate` | `(force?: boolean \| undefined): void` | Validates value.<br /><br />**force**: Whether to force validation. |
40
41
 
@@ -86,6 +87,7 @@ The `auro-counter` element provides a flexible counter interface with increment
86
87
  |-------------|----------------------------------------|--------------------------------------------------|
87
88
  | `decrement` | `(value?: number \| undefined): void` | Decrements the value of the counter by 1. If a value is provided, it decrements by that amount.<br /><br />**value**: The amount to decrement by. |
88
89
  | `increment` | `(value?: number \| undefined): void` | Increments the counter value by 1. If a value is provided, it increments by that amount.<br /><br />**value**: The amount to increment by. |
90
+ | `reset` | `(): void` | Resets the counter to its default state, clearing validity/touched state and returning<br />the value to `min` — matching the clear-on-reset behavior of the other Auro form elements. |
89
91
  | `validate` | `(force?: boolean \| undefined): void` | Validates value.<br /><br />**force**: Whether to force validation. |
90
92
 
91
93
  ## Events
@@ -1127,7 +1127,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
1127
1127
  }
1128
1128
  };
1129
1129
 
1130
- var formkitVersion$1 = '202609012013';
1130
+ var formkitVersion$1 = '202609011830';
1131
1131
 
1132
1132
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1133
1133
  // See LICENSE in the project root for license information.
@@ -1485,6 +1485,17 @@ class AuroCounter extends i$2 {
1485
1485
  this.validation.validate(this, force);
1486
1486
  }
1487
1487
 
1488
+ /**
1489
+ * Resets the counter to its default state, clearing validity/touched state and returning
1490
+ * the value to `min` — matching the clear-on-reset behavior of the other Auro form elements.
1491
+ * @returns {void}
1492
+ */
1493
+ reset() {
1494
+ // validation.reset() clears validity/touched and sets value to undefined; initValue() then restores the min floor.
1495
+ this.validation.reset(this);
1496
+ this.initValue();
1497
+ }
1498
+
1488
1499
  firstUpdated() {
1489
1500
  this.initValue();
1490
1501
  this.setTagAttribute("auro-counter");
@@ -5434,7 +5445,7 @@ class AuroHelpText extends i$2 {
5434
5445
  }
5435
5446
  }
5436
5447
 
5437
- var formkitVersion = '202609012013';
5448
+ var formkitVersion = '202609011830';
5438
5449
 
5439
5450
  /**
5440
5451
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -8162,6 +8173,19 @@ class AuroCounterGroup extends AuroElement {
8162
8173
  this.validation.validate(this, force);
8163
8174
  }
8164
8175
 
8176
+ /**
8177
+ * Resets the counter group to its initial state by resetting each child counter and clearing validity.
8178
+ * Each child reset dispatches an `input` event, which triggers `updateValue()` to recompute `value`/`total`.
8179
+ * @returns {void}
8180
+ */
8181
+ reset() {
8182
+ if (this.counters) {
8183
+ this.counters.forEach((counter) => counter.reset());
8184
+ }
8185
+
8186
+ this.validation.reset(this);
8187
+ }
8188
+
8165
8189
  updated(changedProperties) {
8166
8190
  if (changedProperties.has("value")) {
8167
8191
  this.validate();
@@ -39,6 +39,8 @@
39
39
  <script type="module">
40
40
  import { renderPage } from './demo-support.min.js';
41
41
  await renderPage('./getting-started.md');
42
+ import { initExamples } from './getting-started.min.js';
43
+ initExamples();
42
44
  </script>
43
45
 
44
46
  <!-- If additional elements are needed for the demo, add them here. -->
@@ -49,6 +51,6 @@
49
51
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-button@latest/+esm" type="module"></script>
50
52
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-icon@latest/+esm" type="module"></script>
51
53
 
52
- <script src="./api.min.js" data-demo-script="true" type="module"></script>
54
+ <script src="./getting-started.min.js" data-demo-script="true" type="module"></script>
53
55
  </body>
54
56
  </html>