@aurodesignsystem-dev/auro-formkit 0.0.0-pr1511.0 → 0.0.0-pr1512.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 (49) 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 +119 -97
  7. package/components/combobox/demo/getting-started.min.js +119 -97
  8. package/components/combobox/demo/index.min.js +119 -97
  9. package/components/combobox/dist/index.js +118 -96
  10. package/components/combobox/dist/registered.js +118 -96
  11. package/components/counter/demo/customize.min.js +2 -3
  12. package/components/counter/demo/index.min.js +2 -3
  13. package/components/counter/dist/index.js +2 -3
  14. package/components/counter/dist/registered.js +2 -3
  15. package/components/datepicker/demo/customize.min.js +139 -98
  16. package/components/datepicker/demo/index.min.js +139 -98
  17. package/components/datepicker/dist/index.js +139 -98
  18. package/components/datepicker/dist/registered.js +139 -98
  19. package/components/dropdown/demo/customize.min.js +1 -2
  20. package/components/dropdown/demo/getting-started.min.js +1 -2
  21. package/components/dropdown/demo/index.min.js +1 -2
  22. package/components/dropdown/dist/index.js +1 -2
  23. package/components/dropdown/dist/registered.js +1 -2
  24. package/components/form/demo/customize.min.js +434 -426
  25. package/components/form/demo/getting-started.min.js +434 -426
  26. package/components/form/demo/index.min.js +434 -426
  27. package/components/form/demo/registerDemoDeps.min.js +434 -426
  28. package/components/input/demo/api.md +5 -5
  29. package/components/input/demo/customize.md +8 -8
  30. package/components/input/demo/customize.min.js +116 -93
  31. package/components/input/demo/getting-started.min.js +116 -93
  32. package/components/input/demo/index.min.js +116 -93
  33. package/components/input/dist/base-input.d.ts +33 -44
  34. package/components/input/dist/index.js +129 -94
  35. package/components/input/dist/registered.js +116 -93
  36. package/components/radio/demo/customize.min.js +1 -1
  37. package/components/radio/demo/getting-started.min.js +1 -1
  38. package/components/radio/demo/index.min.js +1 -1
  39. package/components/radio/dist/index.js +1 -1
  40. package/components/radio/dist/registered.js +1 -1
  41. package/components/select/demo/customize.min.js +55 -132
  42. package/components/select/demo/getting-started.min.js +55 -132
  43. package/components/select/demo/index.min.js +55 -132
  44. package/components/select/demo/keyboard-behavior.md +4 -18
  45. package/components/select/dist/auro-select.d.ts +8 -20
  46. package/components/select/dist/index.js +55 -132
  47. package/components/select/dist/registered.js +55 -132
  48. package/custom-elements.json +1942 -1728
  49. package/package.json +1 -1
@@ -4806,7 +4806,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
4806
4806
  }
4807
4807
  };
4808
4808
 
4809
- var formkitVersion$2 = '202606252142';
4809
+ var formkitVersion$2 = '202606252337';
4810
4810
 
4811
4811
  let AuroElement$2 = class AuroElement extends LitElement {
4812
4812
  static get properties() {
@@ -6078,7 +6078,6 @@ class AuroDropdown extends AuroElement$2 {
6078
6078
  role="${ifDefined(this.triggerContentFocusable ? undefined : this.a11yRole)}"
6079
6079
  aria-expanded="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
6080
6080
  aria-controls="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.dropdownId)}"
6081
- aria-haspopup="${ifDefined(this.a11yRole === 'combobox' ? 'listbox' : undefined)}"
6082
6081
  aria-labelledby="${ifDefined(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
6083
6082
  aria-disabled="${ifDefined(this.disabled ? 'true' : undefined)}"
6084
6083
  @focusin="${this.handleFocusin}"
@@ -16525,6 +16524,13 @@ class AuroInputUtilities {
16525
16524
  * @returns {string | undefined}
16526
16525
  */
16527
16526
  toFormattedValue(valueObject, format) {
16527
+ // Exposed publicly via `AuroInputUtil.toFormattedValue`, so a missing
16528
+ // `format` argument has to fail gracefully rather than throw on
16529
+ // `format.toLowerCase()`. Treat any falsy value (undefined, null, '')
16530
+ // as "no format → no display value".
16531
+ if (!format) {
16532
+ return undefined;
16533
+ }
16528
16534
  const normalizedFormat = format.toLowerCase();
16529
16535
  const maskOptions = this.getMaskOptions('date', normalizedFormat);
16530
16536
 
@@ -16675,79 +16681,18 @@ class BaseInput extends AuroElement$1 {
16675
16681
  constructor() {
16676
16682
  super();
16677
16683
 
16678
- this.appearance = "default";
16679
- this.disabled = false;
16680
- this.layout = 'classic';
16681
- this.locale = 'en-US';
16682
- this.max = undefined;
16683
- this._maxObject = undefined;
16684
- this.maxLength = undefined;
16685
- this.min = undefined;
16686
- this._minObject = undefined;
16687
- this.minLength = undefined;
16688
- this.required = false;
16689
- this.onDark = false;
16690
- this.setCustomValidityForType = undefined;
16691
- this.size = 'lg';
16692
- this.shape = 'classic';
16693
- this.value = undefined;
16694
- this._valueObject = undefined;
16695
-
16696
- this._initializePrivateDefaults();
16697
- }
16698
-
16699
- /**
16700
- * Internal Defaults.
16701
- * @private
16702
- * @returns {void}
16703
- */
16704
- _initializePrivateDefaults() {
16684
+ // Single-source initialization. Alphabetized so duplicate or stale
16685
+ // defaults are immediately obvious on a diff. Every field is assigned
16686
+ // exactly once here (previously the constructor + the old
16687
+ // `_initializePrivateDefaults` overlapped — both wrote ~14 of the same
16688
+ // fields and double-allocated `util` and `validation`, discarding the
16689
+ // first instance). `validation` is now allocated exactly once; `util`
16690
+ // is seeded here with an en-US default and then rebuilt in
16691
+ // `connectedCallback` once the consumer-resolved locale is available,
16692
+ // so a parent (datepicker/combobox) calling `validate()` synchronously
16693
+ // during its own update cycle sees a populated util instance.
16705
16694
  this.activeLabel = false;
16706
- this.appearance = "default";
16707
- this.icon = false;
16708
- this.disabled = false;
16709
- this.dvInputOnly = false;
16710
- this.hideLabelVisually = false;
16711
- this.max = undefined;
16712
- this.maxLength = undefined;
16713
- this.min = undefined;
16714
- this.minLength = undefined;
16715
- this.noValidate = false;
16716
- this.onDark = false;
16717
- this.required = false;
16718
- this.setCustomValidityForType = undefined;
16719
-
16720
- // Used for storing raw values returned from input mask.
16721
- this._rawMaskValue = undefined;
16722
-
16723
- /**
16724
- * @private
16725
- */
16726
- this.layout = 'classic';
16727
-
16728
- /**
16729
- * @private
16730
- */
16731
- this.shape = 'classic';
16732
-
16733
- /**
16734
- * @private
16735
- */
16736
- this.size = 'lg';
16737
-
16738
- this.touched = false;
16739
- this.util = new AuroInputUtilities({
16740
- locale: "en-US",
16741
- format: this.format
16742
- });
16743
- this.validation = new AuroFormValidation();
16744
- this.inputIconName = undefined;
16745
- this.showPassword = false;
16746
- this.validationCCLength = undefined;
16747
- this.hasValue = false;
16748
- this.label = 'Input label is undefined';
16749
-
16750
-
16695
+ /** @private */
16751
16696
  this.allowedInputTypes = [
16752
16697
  "text",
16753
16698
  "number",
@@ -16756,7 +16701,8 @@ class BaseInput extends AuroElement$1 {
16756
16701
  "credit-card",
16757
16702
  "tel"
16758
16703
  ];
16759
- this.icon = false;
16704
+ this.appearance = "default";
16705
+ /** @private */
16760
16706
  this.dateFormatMap = {
16761
16707
  'mm/dd/yyyy': 'dateMMDDYYYY',
16762
16708
  'dd/mm/yyyy': 'dateDDMMYYYY',
@@ -16773,27 +16719,57 @@ class BaseInput extends AuroElement$1 {
16773
16719
  'dd/mm': 'dateDDMM',
16774
16720
  'mm/dd': 'dateMMDD'
16775
16721
  };
16722
+ this.disabled = false;
16723
+ /** @private */
16776
16724
  this.domHandler = new DomHandler();
16777
16725
  this.dvInputOnly = false;
16778
16726
  this.hasValue = false;
16727
+ this.hideLabelVisually = false;
16728
+ this.icon = false;
16729
+ /** @private */
16779
16730
  this.inputIconName = undefined;
16731
+ /** @private */
16780
16732
  this.label = 'Input label is undefined';
16733
+ this.layout = 'classic';
16734
+ this.locale = 'en-US';
16735
+ this.max = undefined;
16736
+ this._maxObject = undefined;
16737
+ this.maxLength = undefined;
16738
+ this.min = undefined;
16739
+ this._minObject = undefined;
16740
+ this.minLength = undefined;
16781
16741
  this.noValidate = false;
16782
- this._rawMaskValue = undefined; // Used for storing raw values returned from input mask.
16742
+ this.onDark = false;
16743
+ // Raw values returned from the input mask before model normalization.
16744
+ this._rawMaskValue = undefined;
16745
+ this.required = false;
16746
+ this.setCustomValidityForType = undefined;
16747
+ // Credit Card is intentionally excluded — its mask manages the cursor
16748
+ // itself, and listing it here caused cursor placement issues in Safari.
16749
+ /** @private */
16783
16750
  this.setSelectionInputTypes = [
16784
16751
  "text",
16785
16752
  "password",
16786
16753
  "email"
16787
- ]; // Credit Card is not included as this caused cursor placement issues in Safari.
16754
+ ];
16755
+ this.shape = 'classic';
16756
+ /** @private */
16788
16757
  this.showPassword = false;
16758
+ this.size = 'lg';
16789
16759
  this.touched = false;
16760
+ /** @private */
16790
16761
  this.uniqueId = new UniqueId().create();
16762
+ /** @private */
16791
16763
  this.util = new AuroInputUtilities({
16792
16764
  locale: this.locale,
16793
16765
  format: this.format
16794
16766
  });
16767
+ /** @private */
16795
16768
  this.validation = new AuroFormValidation();
16769
+ /** @private */
16796
16770
  this.validationCCLength = undefined;
16771
+ this.value = undefined;
16772
+ this._valueObject = undefined;
16797
16773
  }
16798
16774
 
16799
16775
  // function to define props used within the scope of this component
@@ -17341,6 +17317,15 @@ class BaseInput extends AuroElement$1 {
17341
17317
 
17342
17318
  this.inputId = this.id ? `${this.id}-input` : window.crypto.randomUUID();
17343
17319
 
17320
+ // Normalize the format token to lowercase so case-mixed values supplied
17321
+ // via attribute (e.g. `format="MM/DD/YYYY"`) hit the `dateFormatMap`
17322
+ // lookup inside `setCustomHelpTextMessage`. Without this, an uppercase
17323
+ // format silently misses the map and leaves `setCustomValidityForType`
17324
+ // unset.
17325
+ if (this.format) {
17326
+ this.format = this.format.toLowerCase();
17327
+ }
17328
+
17344
17329
  // use validity message override if declared when initializing the component
17345
17330
  if (this.hasAttribute('setCustomValidity')) {
17346
17331
  this.ValidityMessageOverride = this.setCustomValidity;
@@ -17774,6 +17759,38 @@ class BaseInput extends AuroElement$1 {
17774
17759
  this.touched = true;
17775
17760
  this.validation.validate(this);
17776
17761
  }
17762
+
17763
+ // Prevents cursor jumping in Safari. Setting `this.value` triggers a Lit
17764
+ // update that can re-render the input and reset the native cursor; we
17765
+ // capture the caret position before that update commits and restore it
17766
+ // via `setSelectionRange` once the update has flushed. Gated on
17767
+ // `setSelectionInputTypes` so credit-card (and other masked types whose
17768
+ // formatter manages the cursor itself) doesn't get a competing write.
17769
+ // Capture the caret position INSIDE the gate — reading `selectionStart`
17770
+ // on input types that don't support text selection (number, email in
17771
+ // some browsers) throws InvalidStateError, which would crash all input
17772
+ // handling. Wrap the read in try/catch belt-and-suspenders even though
17773
+ // the gated types currently support it, since the list is a public
17774
+ // property a consumer could mutate.
17775
+ if (this.setSelectionInputTypes.includes(this.type)) {
17776
+ let selectionStart;
17777
+ try {
17778
+ selectionStart = this.inputElement.selectionStart;
17779
+ } catch (error) { // eslint-disable-line no-unused-vars
17780
+ return;
17781
+ }
17782
+ if (typeof selectionStart !== 'number') {
17783
+ return;
17784
+ }
17785
+ this.updateComplete.then(() => {
17786
+ try {
17787
+ this.inputElement.setSelectionRange(selectionStart, selectionStart);
17788
+ } catch (error) { // eslint-disable-line no-unused-vars
17789
+ // Some input types (number/email in certain UAs) throw on
17790
+ // setSelectionRange; swallow and let the native cursor stand.
17791
+ }
17792
+ });
17793
+ }
17777
17794
  }
17778
17795
 
17779
17796
  /**
@@ -18400,7 +18417,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
18400
18417
  }
18401
18418
  };
18402
18419
 
18403
- var formkitVersion$1 = '202606252142';
18420
+ var formkitVersion$1 = '202606252337';
18404
18421
 
18405
18422
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18406
18423
  // See LICENSE in the project root for license information.
@@ -18903,6 +18920,7 @@ class AuroInput extends BaseInput {
18903
18920
  <${this.buttonTag}
18904
18921
  @click="${this.handleClickShowPassword}"
18905
18922
  appearance="${this.onDark ? 'inverse' : this.appearance}"
18923
+ aria-pressed="${this.showPassword ? 'true' : 'false'}"
18906
18924
  class="notificationBtn passwordBtn"
18907
18925
  shape="circle"
18908
18926
  size="sm"
@@ -18976,25 +18994,29 @@ class AuroInput extends BaseInput {
18976
18994
  * @returns {html} - Returns HTML for the help text and error message.
18977
18995
  */
18978
18996
  renderHtmlHelpText() {
18997
+ // Single `<p>` with stable identity across validity transitions —
18998
+ // previously two distinct templates (valid vs invalid) caused Lit to
18999
+ // replace the node entirely on a flip, and VoiceOver wouldn't
19000
+ // re-announce because the live-region element it was watching had been
19001
+ // removed and a new one inserted. Keeping one node means the `role`,
19002
+ // `aria-live`, and text content all change in-place, which AT does
19003
+ // observe and announce.
19004
+ const isError = this.validity && this.validity !== 'valid';
18979
19005
  return html`
18980
- ${!this.validity || this.validity === undefined || this.validity === 'valid'
18981
- ? html`
18982
- <${this.helpTextTag}
18983
- appearance="${this.onDark ? 'inverse' : this.appearance}">
18984
- <p id="${this.uniqueId}" part="helpText">
18985
- <slot name="helpText">${this.getHelpText()}</slot>
18986
- </p>
18987
- </${this.helpTextTag}>
18988
- `
18989
- : html`
18990
- <${this.helpTextTag} error
18991
- appearance="${this.onDark ? 'inverse' : this.appearance}">
18992
- <p id="${this.uniqueId}" role="alert" aria-live="assertive" part="helpText">
18993
- ${this.errorMessage}
18994
- </p>
18995
- </${this.helpTextTag}>
18996
- `
19006
+ <${this.helpTextTag}
19007
+ appearance="${this.onDark ? 'inverse' : this.appearance}"
19008
+ ?error=${isError}>
19009
+ <p
19010
+ id="${this.uniqueId}"
19011
+ part="helpText"
19012
+ role="${ifDefined(isError ? 'alert' : undefined)}"
19013
+ aria-live="${ifDefined(isError ? 'assertive' : undefined)}">
19014
+ ${isError
19015
+ ? this.errorMessage
19016
+ : html`<slot name="helpText">${this.getHelpText()}</slot>`
18997
19017
  }
19018
+ </p>
19019
+ </${this.helpTextTag}>
18998
19020
  `;
18999
19021
  }
19000
19022
 
@@ -19521,7 +19543,7 @@ class AuroBibtemplate extends LitElement {
19521
19543
  }
19522
19544
  }
19523
19545
 
19524
- var formkitVersion = '202606252142';
19546
+ var formkitVersion = '202606252337';
19525
19547
 
19526
19548
  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}`;
19527
19549
 
@@ -4806,7 +4806,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
4806
4806
  }
4807
4807
  };
4808
4808
 
4809
- var formkitVersion$2 = '202606252142';
4809
+ var formkitVersion$2 = '202606252337';
4810
4810
 
4811
4811
  let AuroElement$2 = class AuroElement extends LitElement {
4812
4812
  static get properties() {
@@ -6078,7 +6078,6 @@ class AuroDropdown extends AuroElement$2 {
6078
6078
  role="${ifDefined(this.triggerContentFocusable ? undefined : this.a11yRole)}"
6079
6079
  aria-expanded="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
6080
6080
  aria-controls="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.dropdownId)}"
6081
- aria-haspopup="${ifDefined(this.a11yRole === 'combobox' ? 'listbox' : undefined)}"
6082
6081
  aria-labelledby="${ifDefined(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
6083
6082
  aria-disabled="${ifDefined(this.disabled ? 'true' : undefined)}"
6084
6083
  @focusin="${this.handleFocusin}"
@@ -16525,6 +16524,13 @@ class AuroInputUtilities {
16525
16524
  * @returns {string | undefined}
16526
16525
  */
16527
16526
  toFormattedValue(valueObject, format) {
16527
+ // Exposed publicly via `AuroInputUtil.toFormattedValue`, so a missing
16528
+ // `format` argument has to fail gracefully rather than throw on
16529
+ // `format.toLowerCase()`. Treat any falsy value (undefined, null, '')
16530
+ // as "no format → no display value".
16531
+ if (!format) {
16532
+ return undefined;
16533
+ }
16528
16534
  const normalizedFormat = format.toLowerCase();
16529
16535
  const maskOptions = this.getMaskOptions('date', normalizedFormat);
16530
16536
 
@@ -16675,79 +16681,18 @@ class BaseInput extends AuroElement$1 {
16675
16681
  constructor() {
16676
16682
  super();
16677
16683
 
16678
- this.appearance = "default";
16679
- this.disabled = false;
16680
- this.layout = 'classic';
16681
- this.locale = 'en-US';
16682
- this.max = undefined;
16683
- this._maxObject = undefined;
16684
- this.maxLength = undefined;
16685
- this.min = undefined;
16686
- this._minObject = undefined;
16687
- this.minLength = undefined;
16688
- this.required = false;
16689
- this.onDark = false;
16690
- this.setCustomValidityForType = undefined;
16691
- this.size = 'lg';
16692
- this.shape = 'classic';
16693
- this.value = undefined;
16694
- this._valueObject = undefined;
16695
-
16696
- this._initializePrivateDefaults();
16697
- }
16698
-
16699
- /**
16700
- * Internal Defaults.
16701
- * @private
16702
- * @returns {void}
16703
- */
16704
- _initializePrivateDefaults() {
16684
+ // Single-source initialization. Alphabetized so duplicate or stale
16685
+ // defaults are immediately obvious on a diff. Every field is assigned
16686
+ // exactly once here (previously the constructor + the old
16687
+ // `_initializePrivateDefaults` overlapped — both wrote ~14 of the same
16688
+ // fields and double-allocated `util` and `validation`, discarding the
16689
+ // first instance). `validation` is now allocated exactly once; `util`
16690
+ // is seeded here with an en-US default and then rebuilt in
16691
+ // `connectedCallback` once the consumer-resolved locale is available,
16692
+ // so a parent (datepicker/combobox) calling `validate()` synchronously
16693
+ // during its own update cycle sees a populated util instance.
16705
16694
  this.activeLabel = false;
16706
- this.appearance = "default";
16707
- this.icon = false;
16708
- this.disabled = false;
16709
- this.dvInputOnly = false;
16710
- this.hideLabelVisually = false;
16711
- this.max = undefined;
16712
- this.maxLength = undefined;
16713
- this.min = undefined;
16714
- this.minLength = undefined;
16715
- this.noValidate = false;
16716
- this.onDark = false;
16717
- this.required = false;
16718
- this.setCustomValidityForType = undefined;
16719
-
16720
- // Used for storing raw values returned from input mask.
16721
- this._rawMaskValue = undefined;
16722
-
16723
- /**
16724
- * @private
16725
- */
16726
- this.layout = 'classic';
16727
-
16728
- /**
16729
- * @private
16730
- */
16731
- this.shape = 'classic';
16732
-
16733
- /**
16734
- * @private
16735
- */
16736
- this.size = 'lg';
16737
-
16738
- this.touched = false;
16739
- this.util = new AuroInputUtilities({
16740
- locale: "en-US",
16741
- format: this.format
16742
- });
16743
- this.validation = new AuroFormValidation();
16744
- this.inputIconName = undefined;
16745
- this.showPassword = false;
16746
- this.validationCCLength = undefined;
16747
- this.hasValue = false;
16748
- this.label = 'Input label is undefined';
16749
-
16750
-
16695
+ /** @private */
16751
16696
  this.allowedInputTypes = [
16752
16697
  "text",
16753
16698
  "number",
@@ -16756,7 +16701,8 @@ class BaseInput extends AuroElement$1 {
16756
16701
  "credit-card",
16757
16702
  "tel"
16758
16703
  ];
16759
- this.icon = false;
16704
+ this.appearance = "default";
16705
+ /** @private */
16760
16706
  this.dateFormatMap = {
16761
16707
  'mm/dd/yyyy': 'dateMMDDYYYY',
16762
16708
  'dd/mm/yyyy': 'dateDDMMYYYY',
@@ -16773,27 +16719,57 @@ class BaseInput extends AuroElement$1 {
16773
16719
  'dd/mm': 'dateDDMM',
16774
16720
  'mm/dd': 'dateMMDD'
16775
16721
  };
16722
+ this.disabled = false;
16723
+ /** @private */
16776
16724
  this.domHandler = new DomHandler();
16777
16725
  this.dvInputOnly = false;
16778
16726
  this.hasValue = false;
16727
+ this.hideLabelVisually = false;
16728
+ this.icon = false;
16729
+ /** @private */
16779
16730
  this.inputIconName = undefined;
16731
+ /** @private */
16780
16732
  this.label = 'Input label is undefined';
16733
+ this.layout = 'classic';
16734
+ this.locale = 'en-US';
16735
+ this.max = undefined;
16736
+ this._maxObject = undefined;
16737
+ this.maxLength = undefined;
16738
+ this.min = undefined;
16739
+ this._minObject = undefined;
16740
+ this.minLength = undefined;
16781
16741
  this.noValidate = false;
16782
- this._rawMaskValue = undefined; // Used for storing raw values returned from input mask.
16742
+ this.onDark = false;
16743
+ // Raw values returned from the input mask before model normalization.
16744
+ this._rawMaskValue = undefined;
16745
+ this.required = false;
16746
+ this.setCustomValidityForType = undefined;
16747
+ // Credit Card is intentionally excluded — its mask manages the cursor
16748
+ // itself, and listing it here caused cursor placement issues in Safari.
16749
+ /** @private */
16783
16750
  this.setSelectionInputTypes = [
16784
16751
  "text",
16785
16752
  "password",
16786
16753
  "email"
16787
- ]; // Credit Card is not included as this caused cursor placement issues in Safari.
16754
+ ];
16755
+ this.shape = 'classic';
16756
+ /** @private */
16788
16757
  this.showPassword = false;
16758
+ this.size = 'lg';
16789
16759
  this.touched = false;
16760
+ /** @private */
16790
16761
  this.uniqueId = new UniqueId().create();
16762
+ /** @private */
16791
16763
  this.util = new AuroInputUtilities({
16792
16764
  locale: this.locale,
16793
16765
  format: this.format
16794
16766
  });
16767
+ /** @private */
16795
16768
  this.validation = new AuroFormValidation();
16769
+ /** @private */
16796
16770
  this.validationCCLength = undefined;
16771
+ this.value = undefined;
16772
+ this._valueObject = undefined;
16797
16773
  }
16798
16774
 
16799
16775
  // function to define props used within the scope of this component
@@ -17341,6 +17317,15 @@ class BaseInput extends AuroElement$1 {
17341
17317
 
17342
17318
  this.inputId = this.id ? `${this.id}-input` : window.crypto.randomUUID();
17343
17319
 
17320
+ // Normalize the format token to lowercase so case-mixed values supplied
17321
+ // via attribute (e.g. `format="MM/DD/YYYY"`) hit the `dateFormatMap`
17322
+ // lookup inside `setCustomHelpTextMessage`. Without this, an uppercase
17323
+ // format silently misses the map and leaves `setCustomValidityForType`
17324
+ // unset.
17325
+ if (this.format) {
17326
+ this.format = this.format.toLowerCase();
17327
+ }
17328
+
17344
17329
  // use validity message override if declared when initializing the component
17345
17330
  if (this.hasAttribute('setCustomValidity')) {
17346
17331
  this.ValidityMessageOverride = this.setCustomValidity;
@@ -17774,6 +17759,38 @@ class BaseInput extends AuroElement$1 {
17774
17759
  this.touched = true;
17775
17760
  this.validation.validate(this);
17776
17761
  }
17762
+
17763
+ // Prevents cursor jumping in Safari. Setting `this.value` triggers a Lit
17764
+ // update that can re-render the input and reset the native cursor; we
17765
+ // capture the caret position before that update commits and restore it
17766
+ // via `setSelectionRange` once the update has flushed. Gated on
17767
+ // `setSelectionInputTypes` so credit-card (and other masked types whose
17768
+ // formatter manages the cursor itself) doesn't get a competing write.
17769
+ // Capture the caret position INSIDE the gate — reading `selectionStart`
17770
+ // on input types that don't support text selection (number, email in
17771
+ // some browsers) throws InvalidStateError, which would crash all input
17772
+ // handling. Wrap the read in try/catch belt-and-suspenders even though
17773
+ // the gated types currently support it, since the list is a public
17774
+ // property a consumer could mutate.
17775
+ if (this.setSelectionInputTypes.includes(this.type)) {
17776
+ let selectionStart;
17777
+ try {
17778
+ selectionStart = this.inputElement.selectionStart;
17779
+ } catch (error) { // eslint-disable-line no-unused-vars
17780
+ return;
17781
+ }
17782
+ if (typeof selectionStart !== 'number') {
17783
+ return;
17784
+ }
17785
+ this.updateComplete.then(() => {
17786
+ try {
17787
+ this.inputElement.setSelectionRange(selectionStart, selectionStart);
17788
+ } catch (error) { // eslint-disable-line no-unused-vars
17789
+ // Some input types (number/email in certain UAs) throw on
17790
+ // setSelectionRange; swallow and let the native cursor stand.
17791
+ }
17792
+ });
17793
+ }
17777
17794
  }
17778
17795
 
17779
17796
  /**
@@ -18400,7 +18417,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
18400
18417
  }
18401
18418
  };
18402
18419
 
18403
- var formkitVersion$1 = '202606252142';
18420
+ var formkitVersion$1 = '202606252337';
18404
18421
 
18405
18422
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18406
18423
  // See LICENSE in the project root for license information.
@@ -18903,6 +18920,7 @@ class AuroInput extends BaseInput {
18903
18920
  <${this.buttonTag}
18904
18921
  @click="${this.handleClickShowPassword}"
18905
18922
  appearance="${this.onDark ? 'inverse' : this.appearance}"
18923
+ aria-pressed="${this.showPassword ? 'true' : 'false'}"
18906
18924
  class="notificationBtn passwordBtn"
18907
18925
  shape="circle"
18908
18926
  size="sm"
@@ -18976,25 +18994,29 @@ class AuroInput extends BaseInput {
18976
18994
  * @returns {html} - Returns HTML for the help text and error message.
18977
18995
  */
18978
18996
  renderHtmlHelpText() {
18997
+ // Single `<p>` with stable identity across validity transitions —
18998
+ // previously two distinct templates (valid vs invalid) caused Lit to
18999
+ // replace the node entirely on a flip, and VoiceOver wouldn't
19000
+ // re-announce because the live-region element it was watching had been
19001
+ // removed and a new one inserted. Keeping one node means the `role`,
19002
+ // `aria-live`, and text content all change in-place, which AT does
19003
+ // observe and announce.
19004
+ const isError = this.validity && this.validity !== 'valid';
18979
19005
  return html`
18980
- ${!this.validity || this.validity === undefined || this.validity === 'valid'
18981
- ? html`
18982
- <${this.helpTextTag}
18983
- appearance="${this.onDark ? 'inverse' : this.appearance}">
18984
- <p id="${this.uniqueId}" part="helpText">
18985
- <slot name="helpText">${this.getHelpText()}</slot>
18986
- </p>
18987
- </${this.helpTextTag}>
18988
- `
18989
- : html`
18990
- <${this.helpTextTag} error
18991
- appearance="${this.onDark ? 'inverse' : this.appearance}">
18992
- <p id="${this.uniqueId}" role="alert" aria-live="assertive" part="helpText">
18993
- ${this.errorMessage}
18994
- </p>
18995
- </${this.helpTextTag}>
18996
- `
19006
+ <${this.helpTextTag}
19007
+ appearance="${this.onDark ? 'inverse' : this.appearance}"
19008
+ ?error=${isError}>
19009
+ <p
19010
+ id="${this.uniqueId}"
19011
+ part="helpText"
19012
+ role="${ifDefined(isError ? 'alert' : undefined)}"
19013
+ aria-live="${ifDefined(isError ? 'assertive' : undefined)}">
19014
+ ${isError
19015
+ ? this.errorMessage
19016
+ : html`<slot name="helpText">${this.getHelpText()}</slot>`
18997
19017
  }
19018
+ </p>
19019
+ </${this.helpTextTag}>
18998
19020
  `;
18999
19021
  }
19000
19022
 
@@ -19521,7 +19543,7 @@ class AuroBibtemplate extends LitElement {
19521
19543
  }
19522
19544
  }
19523
19545
 
19524
- var formkitVersion = '202606252142';
19546
+ var formkitVersion = '202606252337';
19525
19547
 
19526
19548
  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}`;
19527
19549
 
@@ -1099,7 +1099,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
1099
1099
  }
1100
1100
  };
1101
1101
 
1102
- var formkitVersion$1 = '202606252142';
1102
+ var formkitVersion$1 = '202606252337';
1103
1103
 
1104
1104
  // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
1105
1105
  // See LICENSE in the project root for license information.
@@ -5445,7 +5445,7 @@ class AuroHelpText extends i$2 {
5445
5445
  }
5446
5446
  }
5447
5447
 
5448
- var formkitVersion = '202606252142';
5448
+ var formkitVersion = '202606252337';
5449
5449
 
5450
5450
  let AuroElement$1 = class AuroElement extends i$2 {
5451
5451
  static get properties() {
@@ -6717,7 +6717,6 @@ class AuroDropdown extends AuroElement$1 {
6717
6717
  role="${o$2(this.triggerContentFocusable ? undefined : this.a11yRole)}"
6718
6718
  aria-expanded="${o$2(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
6719
6719
  aria-controls="${o$2(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.dropdownId)}"
6720
- aria-haspopup="${o$2(this.a11yRole === 'combobox' ? 'listbox' : undefined)}"
6721
6720
  aria-labelledby="${o$2(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
6722
6721
  aria-disabled="${o$2(this.disabled ? 'true' : undefined)}"
6723
6722
  @focusin="${this.handleFocusin}"