@aurodesignsystem-dev/auro-formkit 0.0.0-pr1554.0 → 0.0.0-pr1554.10

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 (45) 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 +123 -43
  7. package/components/combobox/demo/getting-started.min.js +123 -43
  8. package/components/combobox/demo/index.min.js +123 -43
  9. package/components/combobox/dist/index.js +123 -43
  10. package/components/combobox/dist/registered.js +123 -43
  11. package/components/counter/demo/customize.min.js +47 -6
  12. package/components/counter/demo/index.min.js +47 -6
  13. package/components/counter/dist/index.js +47 -6
  14. package/components/counter/dist/registered.js +47 -6
  15. package/components/datepicker/demo/customize.min.js +85 -16
  16. package/components/datepicker/demo/index.min.js +85 -16
  17. package/components/datepicker/dist/index.js +85 -16
  18. package/components/datepicker/dist/registered.js +85 -16
  19. package/components/dropdown/demo/customize.min.js +46 -5
  20. package/components/dropdown/demo/getting-started.min.js +46 -5
  21. package/components/dropdown/demo/index.min.js +46 -5
  22. package/components/dropdown/dist/auro-dropdown.d.ts +8 -1
  23. package/components/dropdown/dist/index.js +46 -5
  24. package/components/dropdown/dist/registered.js +46 -5
  25. package/components/form/demo/customize.min.js +342 -83
  26. package/components/form/demo/getting-started.min.js +342 -83
  27. package/components/form/demo/index.min.js +342 -83
  28. package/components/form/demo/registerDemoDeps.min.js +342 -83
  29. package/components/input/demo/customize.min.js +38 -10
  30. package/components/input/demo/getting-started.min.js +38 -10
  31. package/components/input/demo/index.min.js +38 -10
  32. package/components/input/dist/index.js +38 -10
  33. package/components/input/dist/registered.js +38 -10
  34. package/components/radio/demo/customize.min.js +1 -1
  35. package/components/radio/demo/getting-started.min.js +1 -1
  36. package/components/radio/demo/index.min.js +1 -1
  37. package/components/radio/dist/index.js +1 -1
  38. package/components/radio/dist/registered.js +1 -1
  39. package/components/select/demo/customize.min.js +47 -6
  40. package/components/select/demo/getting-started.min.js +47 -6
  41. package/components/select/demo/index.min.js +47 -6
  42. package/components/select/dist/index.js +47 -6
  43. package/components/select/dist/registered.js +47 -6
  44. package/custom-elements.json +1783 -1777
  45. package/package.json +1 -1
@@ -1275,7 +1275,7 @@ class AuroHelpText extends i$2 {
1275
1275
  }
1276
1276
  }
1277
1277
 
1278
- var formkitVersion = '202607152158';
1278
+ var formkitVersion = '202607160655';
1279
1279
 
1280
1280
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1281
1281
  // See LICENSE in the project root for license information.
@@ -1275,7 +1275,7 @@ class AuroHelpText extends i$2 {
1275
1275
  }
1276
1276
  }
1277
1277
 
1278
- var formkitVersion = '202607152158';
1278
+ var formkitVersion = '202607160655';
1279
1279
 
1280
1280
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1281
1281
  // See LICENSE in the project root for license information.
@@ -1275,7 +1275,7 @@ class AuroHelpText extends i$2 {
1275
1275
  }
1276
1276
  }
1277
1277
 
1278
- var formkitVersion = '202607152158';
1278
+ var formkitVersion = '202607160655';
1279
1279
 
1280
1280
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1281
1281
  // See LICENSE in the project root for license information.
@@ -1228,7 +1228,7 @@ class AuroHelpText extends LitElement {
1228
1228
  }
1229
1229
  }
1230
1230
 
1231
- var formkitVersion = '202607152158';
1231
+ var formkitVersion = '202607160655';
1232
1232
 
1233
1233
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1234
1234
  // See LICENSE in the project root for license information.
@@ -1228,7 +1228,7 @@ class AuroHelpText extends LitElement {
1228
1228
  }
1229
1229
  }
1230
1230
 
1231
- var formkitVersion = '202607152158';
1231
+ var formkitVersion = '202607160655';
1232
1232
 
1233
1233
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1234
1234
  // See LICENSE in the project root for license information.
@@ -4971,7 +4971,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
4971
4971
  }
4972
4972
  };
4973
4973
 
4974
- var formkitVersion$2 = '202607152158';
4974
+ var formkitVersion$2 = '202607160655';
4975
4975
 
4976
4976
  let AuroElement$2 = class AuroElement extends i$3 {
4977
4977
  static get properties() {
@@ -5100,7 +5100,6 @@ class AuroDropdown extends AuroElement$2 {
5100
5100
  static get shadowRootOptions() {
5101
5101
  return {
5102
5102
  ...AuroElement$2.shadowRootOptions,
5103
- delegatesFocus: true,
5104
5103
  };
5105
5104
  }
5106
5105
 
@@ -5267,7 +5266,47 @@ class AuroDropdown extends AuroElement$2 {
5267
5266
  focusables[0].focus();
5268
5267
  }
5269
5268
  } else {
5269
+ this.focusTrigger();
5270
+ }
5271
+ }
5272
+
5273
+ /**
5274
+ * Focus the trigger content. When the trigger wrapper itself is focusable
5275
+ * (has tabindex), focus it directly. Otherwise, focus the first focusable
5276
+ * element slotted into the trigger slot (e.g. the auro-input).
5277
+ * @private
5278
+ */
5279
+ focusTrigger() {
5280
+ if (this.trigger.hasAttribute('tabindex')) {
5270
5281
  this.trigger.focus();
5282
+ } else {
5283
+ // Slotted content isn't a DOM child of the trigger div, so
5284
+ // getFocusableElements can't find it. Query assigned nodes directly.
5285
+ const slot = this.trigger.querySelector('slot[name="trigger"]');
5286
+ if (slot) {
5287
+ const assigned = slot.assignedElements();
5288
+ for (const el of assigned) {
5289
+ if (el.hasAttribute('disabled')) {
5290
+ continue;
5291
+ }
5292
+ // Try finding a focusable descendant first (handles non-focusable
5293
+ // wrappers like <div> containing a <button>). If none found, try
5294
+ // focusing the element directly (works for custom elements like
5295
+ // auro-input that have delegatesFocus or a custom focus() method).
5296
+ const descendants = getFocusableElements(el);
5297
+ if (descendants.length > 0) {
5298
+ descendants[0].focus();
5299
+ return;
5300
+ }
5301
+ el.focus();
5302
+ return;
5303
+ }
5304
+ }
5305
+ // Fallback: try DOM children (non-slotted content)
5306
+ const focusables = getFocusableElements(this.trigger);
5307
+ if (focusables.length > 0) {
5308
+ focusables[0].focus();
5309
+ }
5271
5310
  }
5272
5311
  }
5273
5312
 
@@ -5721,14 +5760,16 @@ class AuroDropdown extends AuroElement$2 {
5721
5760
 
5722
5761
  const eventType = event.detail.eventType || "unknown";
5723
5762
  if (!this.isPopoverVisible && this.hasFocus && eventType === "keydown") {
5724
- this.trigger.focus();
5763
+ this.focusTrigger();
5725
5764
  }
5726
5765
 
5727
5766
 
5728
5767
  // On Tab-driven close (eventType "focusloss"), let focus advance naturally
5729
5768
  // — restoring to the trigger would trap the user on this dropdown, forcing
5730
5769
  // an extra Tab to move on. Escape and outside-click still restore.
5731
- if (!this.isPopoverVisible && eventType !== "focusloss") {
5770
+ // When noHideOnThisFocusLoss is true, the consumer (e.g. combobox) manages
5771
+ // its own focus restoration — skip the generic trigger focus to avoid races.
5772
+ if (!this.isPopoverVisible && eventType !== "focusloss" && !this.noHideOnThisFocusLoss) {
5732
5773
  // wait til the bib gets fully closed and rendered
5733
5774
  setTimeout(() => {
5734
5775
  // Skip if the bib re-opened, or if focus moved intentionally outside the dropdown (not to body).
@@ -5740,7 +5781,7 @@ class AuroDropdown extends AuroElement$2 {
5740
5781
  return;
5741
5782
  }
5742
5783
  // Restore focus to the trigger.
5743
- this.trigger.focus();
5784
+ this.focusTrigger();
5744
5785
  });
5745
5786
  }
5746
5787
  }
@@ -16921,9 +16962,10 @@ class DomHandler {
16921
16962
  class BaseInput extends AuroElement$1 {
16922
16963
 
16923
16964
  // Delegate focus to the native <input> inside the shadow root so that
16924
- // showModal()'s dialog focusing steps reach the input element.
16925
- // This keeps the mobile virtual keyboard open when the fullscreen dialog
16926
- // opens, because the browser sees an input-to-input focus transfer.
16965
+ // clicking anywhere on the input wrapper focuses the native input, and
16966
+ // programmatic .focus() calls on elements in the shadow DOM work correctly.
16967
+ // The initial-load focus theft was caused by the static `autofocus`
16968
+ // attribute on the bib input (now conditional), not by delegatesFocus.
16927
16969
  static get shadowRootOptions() {
16928
16970
  return {
16929
16971
  ...AuroElement$1.shadowRootOptions,
@@ -18600,7 +18642,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
18600
18642
  }
18601
18643
  };
18602
18644
 
18603
- var formkitVersion$1 = '202607152158';
18645
+ var formkitVersion$1 = '202607160655';
18604
18646
 
18605
18647
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18606
18648
  // See LICENSE in the project root for license information.
@@ -18886,18 +18928,45 @@ class AuroInput extends BaseInput {
18886
18928
  * @returns {void}
18887
18929
  */
18888
18930
  checkDisplayValueSlotChange() {
18889
- // flatten:true resolves through auro-combobox's forwarding slot
18890
- // (<slot name="displayValue" slot="displayValue">) so a clone appended
18891
- // directly to auro-input's light DOM alongside the forwarder still
18892
- // counts as content. The prior nodes[0].tagName === 'SLOT' recursion
18893
- // discarded any siblings past the forwarder.
18894
18931
  const slot = this.shadowRoot?.querySelector('slot[name="displayValue"]');
18895
18932
  if (!slot) {
18933
+ // Shadow slot not yet rendered — fall back to checking light-DOM
18934
+ // children so hasDisplayValueContent isn't stuck false when called
18935
+ // before firstUpdated (e.g. from auro-combobox during mount).
18936
+ // Check for any element (including custom elements like <auro-icon>
18937
+ // that render via shadow DOM with no text content).
18938
+ const lightDomContent = this.querySelector('[slot="displayValue"]:not(slot)');
18939
+ this.hasDisplayValueContent = Boolean(lightDomContent && (
18940
+ lightDomContent.textContent.trim().length > 0 ||
18941
+ lightDomContent.children.length > 0 ||
18942
+ lightDomContent.shadowRoot !== null
18943
+ ));
18944
+ this.requestUpdate();
18896
18945
  return;
18897
18946
  }
18898
18947
  const nodes = slot.assignedNodes({ flatten: true });
18899
18948
 
18900
- this.hasDisplayValueContent = nodes.length > 0;
18949
+ // Check for actual visible content, not just node existence.
18950
+ // An empty <span slot="displayValue"></span> forwarded from the
18951
+ // consumer should not be treated as "has content" — it causes the
18952
+ // displayValue wrapper to render (with hasContent class) but show
18953
+ // nothing, blocking the combobox's synthetic displayValue from
18954
+ // being visible on preset/deeplink load.
18955
+ // Custom elements (e.g. <auro-icon>) that render via shadow DOM are
18956
+ // treated as content even when they have no text or light-DOM children.
18957
+ this.hasDisplayValueContent = nodes.some((node) => {
18958
+ if (node.nodeType === Node.TEXT_NODE) {
18959
+ return node.textContent.trim().length > 0;
18960
+ }
18961
+ if (node.nodeType === Node.ELEMENT_NODE) {
18962
+ return node.textContent.trim().length > 0 ||
18963
+ node.children.length > 0 ||
18964
+ node.shadowRoot !== null;
18965
+ }
18966
+ return false;
18967
+ });
18968
+
18969
+ this.requestUpdate();
18901
18970
  }
18902
18971
 
18903
18972
  firstUpdated() {
@@ -19724,7 +19793,7 @@ class AuroBibtemplate extends i$3 {
19724
19793
  }
19725
19794
  }
19726
19795
 
19727
- var formkitVersion = '202607152158';
19796
+ var formkitVersion = '202607160655';
19728
19797
 
19729
19798
  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}`;
19730
19799
 
@@ -20776,6 +20845,14 @@ class AuroCombobox extends AuroElement {
20776
20845
  // auroMenu-selectedOption event hasn't fired yet, or we're on remount
20777
20846
  // with no options loaded). Synthesize a displayValue from the value so
20778
20847
  // the overlay isn't blank.
20848
+ //
20849
+ // NOTE: This renders the raw machine value (e.g. "SEA"), not the
20850
+ // human-readable label (e.g. "Seattle, WA"). For consumers where
20851
+ // value ≠ label, this produces a brief flash of the raw value until
20852
+ // the option elements load and updateTriggerTextDisplay re-runs with
20853
+ // the correct label. This is intentionally preferred over a blank
20854
+ // state — the displayValueInTrigger.remove() cleanup above ensures
20855
+ // this placeholder is replaced once the real option is available.
20779
20856
  const syntheticDV = document.createElement('span');
20780
20857
  syntheticDV.setAttribute('slot', 'displayValue');
20781
20858
  syntheticDV.textContent = this.value;
@@ -21028,7 +21105,11 @@ class AuroCombobox extends AuroElement {
21028
21105
  // after the dropdown layout settles.
21029
21106
 
21030
21107
  doubleRaf(() => {
21031
- this.setInputFocus();
21108
+ // Guard: skip if the dropdown closed before this rAF fired
21109
+ // (e.g. user selected an option immediately after the bib opened).
21110
+ if (this.dropdownOpen) {
21111
+ this.setInputFocus();
21112
+ }
21032
21113
  if (this._inFullscreenTransition) {
21033
21114
  this._inFullscreenTransition = false;
21034
21115
  }
@@ -21075,7 +21156,9 @@ class AuroCombobox extends AuroElement {
21075
21156
  }
21076
21157
 
21077
21158
  this._scheduleTimer(() => {
21078
- this.setInputFocus();
21159
+ if (this.dropdown.isPopoverVisible) {
21160
+ this.setInputFocus();
21161
+ }
21079
21162
  }, 0);
21080
21163
  });
21081
21164
  }
@@ -21084,14 +21167,19 @@ class AuroCombobox extends AuroElement {
21084
21167
  * @private
21085
21168
  */
21086
21169
  setClearBtnFocus() {
21087
- const clearBtn = this.input.shadowRoot.querySelector('.clearBtn');
21088
- if (clearBtn) {
21089
- // Wait for the element to fully render across
21090
- // multiple Lit update cycles before moving focus
21091
- doubleRaf(() => {
21170
+ doubleRaf(() => {
21171
+ // First establish focus inside the input's shadow root.
21172
+ // Without this, clearBtn.focus() silently fails when focus is on
21173
+ // document.body (e.g. after a click selection closes the bib dialog).
21174
+ // delegatesFocus on BaseInput routes this to the native <input>.
21175
+ this.input.focus();
21176
+
21177
+ // Now move focus to the clear button within the same shadow root.
21178
+ const clearBtn = this.input.shadowRoot.querySelector('.clearBtn');
21179
+ if (clearBtn) {
21092
21180
  clearBtn.focus();
21093
- });
21094
- }
21181
+ }
21182
+ });
21095
21183
  }
21096
21184
 
21097
21185
  /**
@@ -21302,6 +21390,9 @@ class AuroCombobox extends AuroElement {
21302
21390
  // only — fresh user selections take the existing hideBib path.
21303
21391
  if (isEcho && this.menu.optionSelected) {
21304
21392
  this._programmaticFilterRefresh = true;
21393
+ this.updateComplete.then(() => {
21394
+ this._programmaticFilterRefresh = false;
21395
+ });
21305
21396
  }
21306
21397
  });
21307
21398
 
@@ -21532,15 +21623,6 @@ class AuroCombobox extends AuroElement {
21532
21623
  * @returns {void}
21533
21624
  */
21534
21625
  handleTriggerInputValueChange(event) {
21535
- // Clear a stale _programmaticFilterRefresh when the user is genuinely
21536
- // interacting. On mount, updated('value') sets the flag, but the early
21537
- // return at `this.value === this.input.value` exits before clearing it.
21538
- // Without this, the first keystroke after mount fails to set _userTyped
21539
- // and the bib doesn't open.
21540
- if (this._programmaticFilterRefresh && this.componentHasFocus) {
21541
- this._programmaticFilterRefresh = false;
21542
- }
21543
-
21544
21626
  // 'input' fires for every user-initiated value change — typing, paste,
21545
21627
  // IME composition end, dead-key composition, drag-drop. Flip _userTyped
21546
21628
  // here so updated('availableOptions') auto-opens the bib for sources
@@ -21563,10 +21645,6 @@ class AuroCombobox extends AuroElement {
21563
21645
  if (this.dropdown.isBibFullscreen && this.input.value && this.input.value.length > 0 && this.dropdown.isPopoverVisible) {
21564
21646
  this.setInputFocus();
21565
21647
  }
21566
-
21567
- if (this._programmaticFilterRefresh) {
21568
- this._programmaticFilterRefresh = false;
21569
- }
21570
21648
  }
21571
21649
 
21572
21650
  /**
@@ -21765,6 +21843,12 @@ class AuroCombobox extends AuroElement {
21765
21843
  // setting the flag unconditionally here masks the user-typed open path.
21766
21844
  if (!this._userTyped) {
21767
21845
  this._programmaticFilterRefresh = true;
21846
+ // Self-clear after this update cycle completes. This collapses
21847
+ // the previous scattered clear-points into one and prevents the
21848
+ // flag from surviving into the next user interaction.
21849
+ this.updateComplete.then(() => {
21850
+ this._programmaticFilterRefresh = false;
21851
+ });
21768
21852
  }
21769
21853
 
21770
21854
  if (this.input.value !== this.value) {
@@ -21854,10 +21938,6 @@ class AuroCombobox extends AuroElement {
21854
21938
  } else if (!this.dropdown.isBibFullscreen) {
21855
21939
  this.hideBib();
21856
21940
  }
21857
-
21858
- if (this._programmaticFilterRefresh) {
21859
- this._programmaticFilterRefresh = false;
21860
- }
21861
21941
  }
21862
21942
 
21863
21943
  if (changedProperties.has('error')) {
@@ -22039,7 +22119,7 @@ class AuroCombobox extends AuroElement {
22039
22119
  <slot @slotchange="${this.handleSlotChange}"></slot>
22040
22120
  <${this.inputTag}
22041
22121
  id="inputInBib"
22042
- autofocus
22122
+ ?autofocus="${this.dropdownOpen && this.dropdown?.isBibFullscreen}"
22043
22123
  @input="${this.handleInputValueChange}"
22044
22124
  .a11yActivedescendant="${this.dropdownOpen && this.optionActive ? this.optionActive.id : undefined}"
22045
22125
  .a11yControls=${`${this.dropdownId}-floater-bib`}
@@ -4971,7 +4971,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
4971
4971
  }
4972
4972
  };
4973
4973
 
4974
- var formkitVersion$2 = '202607152158';
4974
+ var formkitVersion$2 = '202607160655';
4975
4975
 
4976
4976
  let AuroElement$2 = class AuroElement extends i$3 {
4977
4977
  static get properties() {
@@ -5100,7 +5100,6 @@ class AuroDropdown extends AuroElement$2 {
5100
5100
  static get shadowRootOptions() {
5101
5101
  return {
5102
5102
  ...AuroElement$2.shadowRootOptions,
5103
- delegatesFocus: true,
5104
5103
  };
5105
5104
  }
5106
5105
 
@@ -5267,7 +5266,47 @@ class AuroDropdown extends AuroElement$2 {
5267
5266
  focusables[0].focus();
5268
5267
  }
5269
5268
  } else {
5269
+ this.focusTrigger();
5270
+ }
5271
+ }
5272
+
5273
+ /**
5274
+ * Focus the trigger content. When the trigger wrapper itself is focusable
5275
+ * (has tabindex), focus it directly. Otherwise, focus the first focusable
5276
+ * element slotted into the trigger slot (e.g. the auro-input).
5277
+ * @private
5278
+ */
5279
+ focusTrigger() {
5280
+ if (this.trigger.hasAttribute('tabindex')) {
5270
5281
  this.trigger.focus();
5282
+ } else {
5283
+ // Slotted content isn't a DOM child of the trigger div, so
5284
+ // getFocusableElements can't find it. Query assigned nodes directly.
5285
+ const slot = this.trigger.querySelector('slot[name="trigger"]');
5286
+ if (slot) {
5287
+ const assigned = slot.assignedElements();
5288
+ for (const el of assigned) {
5289
+ if (el.hasAttribute('disabled')) {
5290
+ continue;
5291
+ }
5292
+ // Try finding a focusable descendant first (handles non-focusable
5293
+ // wrappers like <div> containing a <button>). If none found, try
5294
+ // focusing the element directly (works for custom elements like
5295
+ // auro-input that have delegatesFocus or a custom focus() method).
5296
+ const descendants = getFocusableElements(el);
5297
+ if (descendants.length > 0) {
5298
+ descendants[0].focus();
5299
+ return;
5300
+ }
5301
+ el.focus();
5302
+ return;
5303
+ }
5304
+ }
5305
+ // Fallback: try DOM children (non-slotted content)
5306
+ const focusables = getFocusableElements(this.trigger);
5307
+ if (focusables.length > 0) {
5308
+ focusables[0].focus();
5309
+ }
5271
5310
  }
5272
5311
  }
5273
5312
 
@@ -5721,14 +5760,16 @@ class AuroDropdown extends AuroElement$2 {
5721
5760
 
5722
5761
  const eventType = event.detail.eventType || "unknown";
5723
5762
  if (!this.isPopoverVisible && this.hasFocus && eventType === "keydown") {
5724
- this.trigger.focus();
5763
+ this.focusTrigger();
5725
5764
  }
5726
5765
 
5727
5766
 
5728
5767
  // On Tab-driven close (eventType "focusloss"), let focus advance naturally
5729
5768
  // — restoring to the trigger would trap the user on this dropdown, forcing
5730
5769
  // an extra Tab to move on. Escape and outside-click still restore.
5731
- if (!this.isPopoverVisible && eventType !== "focusloss") {
5770
+ // When noHideOnThisFocusLoss is true, the consumer (e.g. combobox) manages
5771
+ // its own focus restoration — skip the generic trigger focus to avoid races.
5772
+ if (!this.isPopoverVisible && eventType !== "focusloss" && !this.noHideOnThisFocusLoss) {
5732
5773
  // wait til the bib gets fully closed and rendered
5733
5774
  setTimeout(() => {
5734
5775
  // Skip if the bib re-opened, or if focus moved intentionally outside the dropdown (not to body).
@@ -5740,7 +5781,7 @@ class AuroDropdown extends AuroElement$2 {
5740
5781
  return;
5741
5782
  }
5742
5783
  // Restore focus to the trigger.
5743
- this.trigger.focus();
5784
+ this.focusTrigger();
5744
5785
  });
5745
5786
  }
5746
5787
  }
@@ -16921,9 +16962,10 @@ class DomHandler {
16921
16962
  class BaseInput extends AuroElement$1 {
16922
16963
 
16923
16964
  // Delegate focus to the native <input> inside the shadow root so that
16924
- // showModal()'s dialog focusing steps reach the input element.
16925
- // This keeps the mobile virtual keyboard open when the fullscreen dialog
16926
- // opens, because the browser sees an input-to-input focus transfer.
16965
+ // clicking anywhere on the input wrapper focuses the native input, and
16966
+ // programmatic .focus() calls on elements in the shadow DOM work correctly.
16967
+ // The initial-load focus theft was caused by the static `autofocus`
16968
+ // attribute on the bib input (now conditional), not by delegatesFocus.
16927
16969
  static get shadowRootOptions() {
16928
16970
  return {
16929
16971
  ...AuroElement$1.shadowRootOptions,
@@ -18600,7 +18642,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
18600
18642
  }
18601
18643
  };
18602
18644
 
18603
- var formkitVersion$1 = '202607152158';
18645
+ var formkitVersion$1 = '202607160655';
18604
18646
 
18605
18647
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18606
18648
  // See LICENSE in the project root for license information.
@@ -18886,18 +18928,45 @@ class AuroInput extends BaseInput {
18886
18928
  * @returns {void}
18887
18929
  */
18888
18930
  checkDisplayValueSlotChange() {
18889
- // flatten:true resolves through auro-combobox's forwarding slot
18890
- // (<slot name="displayValue" slot="displayValue">) so a clone appended
18891
- // directly to auro-input's light DOM alongside the forwarder still
18892
- // counts as content. The prior nodes[0].tagName === 'SLOT' recursion
18893
- // discarded any siblings past the forwarder.
18894
18931
  const slot = this.shadowRoot?.querySelector('slot[name="displayValue"]');
18895
18932
  if (!slot) {
18933
+ // Shadow slot not yet rendered — fall back to checking light-DOM
18934
+ // children so hasDisplayValueContent isn't stuck false when called
18935
+ // before firstUpdated (e.g. from auro-combobox during mount).
18936
+ // Check for any element (including custom elements like <auro-icon>
18937
+ // that render via shadow DOM with no text content).
18938
+ const lightDomContent = this.querySelector('[slot="displayValue"]:not(slot)');
18939
+ this.hasDisplayValueContent = Boolean(lightDomContent && (
18940
+ lightDomContent.textContent.trim().length > 0 ||
18941
+ lightDomContent.children.length > 0 ||
18942
+ lightDomContent.shadowRoot !== null
18943
+ ));
18944
+ this.requestUpdate();
18896
18945
  return;
18897
18946
  }
18898
18947
  const nodes = slot.assignedNodes({ flatten: true });
18899
18948
 
18900
- this.hasDisplayValueContent = nodes.length > 0;
18949
+ // Check for actual visible content, not just node existence.
18950
+ // An empty <span slot="displayValue"></span> forwarded from the
18951
+ // consumer should not be treated as "has content" — it causes the
18952
+ // displayValue wrapper to render (with hasContent class) but show
18953
+ // nothing, blocking the combobox's synthetic displayValue from
18954
+ // being visible on preset/deeplink load.
18955
+ // Custom elements (e.g. <auro-icon>) that render via shadow DOM are
18956
+ // treated as content even when they have no text or light-DOM children.
18957
+ this.hasDisplayValueContent = nodes.some((node) => {
18958
+ if (node.nodeType === Node.TEXT_NODE) {
18959
+ return node.textContent.trim().length > 0;
18960
+ }
18961
+ if (node.nodeType === Node.ELEMENT_NODE) {
18962
+ return node.textContent.trim().length > 0 ||
18963
+ node.children.length > 0 ||
18964
+ node.shadowRoot !== null;
18965
+ }
18966
+ return false;
18967
+ });
18968
+
18969
+ this.requestUpdate();
18901
18970
  }
18902
18971
 
18903
18972
  firstUpdated() {
@@ -19724,7 +19793,7 @@ class AuroBibtemplate extends i$3 {
19724
19793
  }
19725
19794
  }
19726
19795
 
19727
- var formkitVersion = '202607152158';
19796
+ var formkitVersion = '202607160655';
19728
19797
 
19729
19798
  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}`;
19730
19799
 
@@ -20776,6 +20845,14 @@ class AuroCombobox extends AuroElement {
20776
20845
  // auroMenu-selectedOption event hasn't fired yet, or we're on remount
20777
20846
  // with no options loaded). Synthesize a displayValue from the value so
20778
20847
  // the overlay isn't blank.
20848
+ //
20849
+ // NOTE: This renders the raw machine value (e.g. "SEA"), not the
20850
+ // human-readable label (e.g. "Seattle, WA"). For consumers where
20851
+ // value ≠ label, this produces a brief flash of the raw value until
20852
+ // the option elements load and updateTriggerTextDisplay re-runs with
20853
+ // the correct label. This is intentionally preferred over a blank
20854
+ // state — the displayValueInTrigger.remove() cleanup above ensures
20855
+ // this placeholder is replaced once the real option is available.
20779
20856
  const syntheticDV = document.createElement('span');
20780
20857
  syntheticDV.setAttribute('slot', 'displayValue');
20781
20858
  syntheticDV.textContent = this.value;
@@ -21028,7 +21105,11 @@ class AuroCombobox extends AuroElement {
21028
21105
  // after the dropdown layout settles.
21029
21106
 
21030
21107
  doubleRaf(() => {
21031
- this.setInputFocus();
21108
+ // Guard: skip if the dropdown closed before this rAF fired
21109
+ // (e.g. user selected an option immediately after the bib opened).
21110
+ if (this.dropdownOpen) {
21111
+ this.setInputFocus();
21112
+ }
21032
21113
  if (this._inFullscreenTransition) {
21033
21114
  this._inFullscreenTransition = false;
21034
21115
  }
@@ -21075,7 +21156,9 @@ class AuroCombobox extends AuroElement {
21075
21156
  }
21076
21157
 
21077
21158
  this._scheduleTimer(() => {
21078
- this.setInputFocus();
21159
+ if (this.dropdown.isPopoverVisible) {
21160
+ this.setInputFocus();
21161
+ }
21079
21162
  }, 0);
21080
21163
  });
21081
21164
  }
@@ -21084,14 +21167,19 @@ class AuroCombobox extends AuroElement {
21084
21167
  * @private
21085
21168
  */
21086
21169
  setClearBtnFocus() {
21087
- const clearBtn = this.input.shadowRoot.querySelector('.clearBtn');
21088
- if (clearBtn) {
21089
- // Wait for the element to fully render across
21090
- // multiple Lit update cycles before moving focus
21091
- doubleRaf(() => {
21170
+ doubleRaf(() => {
21171
+ // First establish focus inside the input's shadow root.
21172
+ // Without this, clearBtn.focus() silently fails when focus is on
21173
+ // document.body (e.g. after a click selection closes the bib dialog).
21174
+ // delegatesFocus on BaseInput routes this to the native <input>.
21175
+ this.input.focus();
21176
+
21177
+ // Now move focus to the clear button within the same shadow root.
21178
+ const clearBtn = this.input.shadowRoot.querySelector('.clearBtn');
21179
+ if (clearBtn) {
21092
21180
  clearBtn.focus();
21093
- });
21094
- }
21181
+ }
21182
+ });
21095
21183
  }
21096
21184
 
21097
21185
  /**
@@ -21302,6 +21390,9 @@ class AuroCombobox extends AuroElement {
21302
21390
  // only — fresh user selections take the existing hideBib path.
21303
21391
  if (isEcho && this.menu.optionSelected) {
21304
21392
  this._programmaticFilterRefresh = true;
21393
+ this.updateComplete.then(() => {
21394
+ this._programmaticFilterRefresh = false;
21395
+ });
21305
21396
  }
21306
21397
  });
21307
21398
 
@@ -21532,15 +21623,6 @@ class AuroCombobox extends AuroElement {
21532
21623
  * @returns {void}
21533
21624
  */
21534
21625
  handleTriggerInputValueChange(event) {
21535
- // Clear a stale _programmaticFilterRefresh when the user is genuinely
21536
- // interacting. On mount, updated('value') sets the flag, but the early
21537
- // return at `this.value === this.input.value` exits before clearing it.
21538
- // Without this, the first keystroke after mount fails to set _userTyped
21539
- // and the bib doesn't open.
21540
- if (this._programmaticFilterRefresh && this.componentHasFocus) {
21541
- this._programmaticFilterRefresh = false;
21542
- }
21543
-
21544
21626
  // 'input' fires for every user-initiated value change — typing, paste,
21545
21627
  // IME composition end, dead-key composition, drag-drop. Flip _userTyped
21546
21628
  // here so updated('availableOptions') auto-opens the bib for sources
@@ -21563,10 +21645,6 @@ class AuroCombobox extends AuroElement {
21563
21645
  if (this.dropdown.isBibFullscreen && this.input.value && this.input.value.length > 0 && this.dropdown.isPopoverVisible) {
21564
21646
  this.setInputFocus();
21565
21647
  }
21566
-
21567
- if (this._programmaticFilterRefresh) {
21568
- this._programmaticFilterRefresh = false;
21569
- }
21570
21648
  }
21571
21649
 
21572
21650
  /**
@@ -21765,6 +21843,12 @@ class AuroCombobox extends AuroElement {
21765
21843
  // setting the flag unconditionally here masks the user-typed open path.
21766
21844
  if (!this._userTyped) {
21767
21845
  this._programmaticFilterRefresh = true;
21846
+ // Self-clear after this update cycle completes. This collapses
21847
+ // the previous scattered clear-points into one and prevents the
21848
+ // flag from surviving into the next user interaction.
21849
+ this.updateComplete.then(() => {
21850
+ this._programmaticFilterRefresh = false;
21851
+ });
21768
21852
  }
21769
21853
 
21770
21854
  if (this.input.value !== this.value) {
@@ -21854,10 +21938,6 @@ class AuroCombobox extends AuroElement {
21854
21938
  } else if (!this.dropdown.isBibFullscreen) {
21855
21939
  this.hideBib();
21856
21940
  }
21857
-
21858
- if (this._programmaticFilterRefresh) {
21859
- this._programmaticFilterRefresh = false;
21860
- }
21861
21941
  }
21862
21942
 
21863
21943
  if (changedProperties.has('error')) {
@@ -22039,7 +22119,7 @@ class AuroCombobox extends AuroElement {
22039
22119
  <slot @slotchange="${this.handleSlotChange}"></slot>
22040
22120
  <${this.inputTag}
22041
22121
  id="inputInBib"
22042
- autofocus
22122
+ ?autofocus="${this.dropdownOpen && this.dropdown?.isBibFullscreen}"
22043
22123
  @input="${this.handleInputValueChange}"
22044
22124
  .a11yActivedescendant="${this.dropdownOpen && this.optionActive ? this.optionActive.id : undefined}"
22045
22125
  .a11yControls=${`${this.dropdownId}-floater-bib`}