@aurodesignsystem-dev/auro-formkit 0.0.0-pr1516.0 → 0.0.0-pr1518.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 (54) hide show
  1. package/components/checkbox/demo/customize.min.js +8 -6
  2. package/components/checkbox/demo/getting-started.min.js +8 -6
  3. package/components/checkbox/demo/index.min.js +8 -6
  4. package/components/checkbox/dist/index.js +8 -6
  5. package/components/checkbox/dist/registered.js +8 -6
  6. package/components/combobox/README.md +1 -1
  7. package/components/combobox/demo/customize.md +2 -10
  8. package/components/combobox/demo/customize.min.js +382 -466
  9. package/components/combobox/demo/getting-started.min.js +382 -462
  10. package/components/combobox/demo/index.md +1 -1
  11. package/components/combobox/demo/index.min.js +382 -462
  12. package/components/combobox/demo/keyboard-behavior.md +2 -142
  13. package/components/combobox/demo/readme.md +1 -1
  14. package/components/combobox/demo/why-combobox.md +2 -2
  15. package/components/combobox/dist/auro-combobox.d.ts +30 -14
  16. package/components/combobox/dist/index.js +382 -462
  17. package/components/combobox/dist/registered.js +382 -462
  18. package/components/counter/demo/customize.min.js +9 -7
  19. package/components/counter/demo/index.min.js +9 -7
  20. package/components/counter/dist/index.js +9 -7
  21. package/components/counter/dist/registered.js +9 -7
  22. package/components/datepicker/demo/customize.min.js +78 -169
  23. package/components/datepicker/demo/index.min.js +78 -169
  24. package/components/datepicker/dist/index.js +78 -169
  25. package/components/datepicker/dist/registered.js +78 -169
  26. package/components/dropdown/demo/customize.min.js +1 -1
  27. package/components/dropdown/demo/getting-started.min.js +1 -1
  28. package/components/dropdown/demo/index.min.js +1 -1
  29. package/components/dropdown/dist/index.js +1 -1
  30. package/components/dropdown/dist/registered.js +1 -1
  31. package/components/form/demo/customize.min.js +561 -816
  32. package/components/form/demo/getting-started.min.js +561 -816
  33. package/components/form/demo/index.min.js +561 -816
  34. package/components/form/demo/registerDemoDeps.min.js +561 -816
  35. package/components/input/demo/customize.min.js +67 -159
  36. package/components/input/demo/getting-started.min.js +67 -159
  37. package/components/input/demo/index.min.js +67 -159
  38. package/components/input/dist/auro-input.d.ts +1 -1
  39. package/components/input/dist/base-input.d.ts +3 -51
  40. package/components/input/dist/index.js +67 -159
  41. package/components/input/dist/registered.js +67 -159
  42. package/components/input/dist/utilities.d.ts +1 -1
  43. package/components/radio/demo/customize.min.js +8 -6
  44. package/components/radio/demo/getting-started.min.js +8 -6
  45. package/components/radio/demo/index.min.js +8 -6
  46. package/components/radio/dist/index.js +8 -6
  47. package/components/radio/dist/registered.js +8 -6
  48. package/components/select/demo/customize.min.js +9 -7
  49. package/components/select/demo/getting-started.min.js +9 -7
  50. package/components/select/demo/index.min.js +9 -7
  51. package/components/select/dist/index.js +9 -7
  52. package/components/select/dist/registered.js +9 -7
  53. package/custom-elements.json +1503 -1709
  54. package/package.json +1 -1
@@ -448,15 +448,17 @@ let AuroFormValidation$1 = class AuroFormValidation {
448
448
  );
449
449
  }
450
450
 
451
- // If there is a second input in the elem and that value is undefined or an empty string set hasValue to false;
452
- if (this.auroInputElements?.length === 2) {
453
- if (!this.auroInputElements[1].value || this.auroInputElements[1].length === 0) {
451
+ const isCombobox = this.runtimeUtils.elementMatch(elem, 'auro-combobox');
452
+
453
+ // If there is a second input in the elem and that value is undefined or an empty string set hasValue to false.
454
+ // Skip for combobox: its second auro-input is the fullscreen-bib mirror of the same value, not an independent
455
+ // field (datepicker is the intended consumer — start/end are independently required).
456
+ if (this.auroInputElements?.length === 2 && !isCombobox) {
457
+ if (!this.auroInputElements[1].value || this.auroInputElements[1].value.length === 0) {
454
458
  hasValue = false;
455
459
  }
456
460
  }
457
461
 
458
- const isCombobox = this.runtimeUtils.elementMatch(elem, 'auro-combobox');
459
-
460
462
  if (isCombobox) {
461
463
 
462
464
  if (!elem.persistInput || elem.behavior === "filter") {
@@ -767,6 +769,8 @@ function navigateArrow(component, direction, options = {}) {
767
769
  }
768
770
  }
769
771
 
772
+ /* eslint-disable no-underscore-dangle */
773
+
770
774
  /**
771
775
  * Returns the clear button element from the active input's shadow
772
776
  * DOM, if available.
@@ -802,11 +806,9 @@ function isClearBtnFocused(ctx, clearBtn = getClearBtn(ctx)) {
802
806
  * @param {Object} menu - The menu component.
803
807
  */
804
808
  function reconcileMenuIndex(menu) {
805
- // eslint-disable-next-line no-underscore-dangle
806
809
  if (menu._index < 0 && menu.optionActive && menu.items) {
807
810
  const idx = menu.items.indexOf(menu.optionActive);
808
811
  if (idx >= 0) {
809
- // eslint-disable-next-line no-underscore-dangle
810
812
  menu._index = idx;
811
813
  }
812
814
  }
@@ -825,11 +827,7 @@ const comboboxKeyboardStrategy = {
825
827
 
826
828
  // navigate if bib is open otherwise open it
827
829
  if (component.dropdown.isPopoverVisible) {
828
- if (evt.altKey || evt.ctrlKey || evt.metaKey) {
829
- component.activateLastEnabledAvailableOption();
830
- } else {
831
- navigateArrow(component, 'down');
832
- }
830
+ navigateArrow(component, 'down');
833
831
  } else {
834
832
  component.showBib();
835
833
  }
@@ -848,11 +846,7 @@ const comboboxKeyboardStrategy = {
848
846
 
849
847
  // navigate if bib is open otherwise open it
850
848
  if (component.dropdown.isPopoverVisible) {
851
- if (evt.altKey || evt.ctrlKey || evt.metaKey) {
852
- component.activateFirstEnabledAvailableOption();
853
- } else {
854
- navigateArrow(component, 'up');
855
- }
849
+ navigateArrow(component, 'up');
856
850
  } else {
857
851
  component.showBib();
858
852
  }
@@ -868,13 +862,18 @@ const comboboxKeyboardStrategy = {
868
862
  },
869
863
 
870
864
  Enter(component, evt, ctx) {
865
+ // Forms should not submit on Enter from a combobox, regardless of which
866
+ // child element (input, clear button, menu) is focused.
867
+ evt.stopPropagation();
868
+
871
869
  if (isClearBtnFocused(ctx)) {
872
- // If the clear button has focus, let the browser activate it normally.
873
- // stopPropagation prevents parent containers (e.g., forms) from treating
874
- // Enter as a submit, but we must NOT call preventDefault — that would
875
- // block the browser's built-in "Enter activates focused button" behavior.
876
- evt.stopPropagation();
877
- } else if (ctx.isExpanded && component.menu.optionActive) {
870
+ // Let the browser dispatch Enter to the focused clear button so its
871
+ // built-in activation fires and clears the selection. Do NOT call
872
+ // preventDefault — that would block the activation.
873
+ return;
874
+ }
875
+
876
+ if (ctx.isExpanded && component.menu.optionActive) {
878
877
  reconcileMenuIndex(component.menu);
879
878
  component.menu.makeSelection();
880
879
 
@@ -883,14 +882,8 @@ const comboboxKeyboardStrategy = {
883
882
  }
884
883
 
885
884
  evt.preventDefault();
886
- evt.stopPropagation();
887
885
  } else {
888
- // Prevent the keypress from bubbling to parent containers (e.g., forms)
889
- // which could interpret Enter as a submit or trigger other unintended behavior.
890
- // This is safe because showBib() opens the dialog programmatically,
891
- // not via event propagation.
892
886
  evt.preventDefault();
893
- evt.stopPropagation();
894
887
  component.showBib();
895
888
  }
896
889
  },
@@ -935,7 +928,7 @@ const comboboxKeyboardStrategy = {
935
928
  component.setClearBtnFocus();
936
929
  }
937
930
  }
938
- },
931
+ }
939
932
  };
940
933
 
941
934
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
@@ -4806,7 +4799,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
4806
4799
  }
4807
4800
  };
4808
4801
 
4809
- var formkitVersion$2 = '202606292156';
4802
+ var formkitVersion$2 = '202607011652';
4810
4803
 
4811
4804
  let AuroElement$2 = class AuroElement extends LitElement {
4812
4805
  static get properties() {
@@ -6205,7 +6198,7 @@ class AuroDropdown extends AuroElement$2 {
6205
6198
 
6206
6199
  var shapeSizeCss = css`.shape-classic-xl,.shape-classic-lg,.shape-classic-md,.shape-classic-sm,.shape-classic-xs{min-height:56px;max-height:56px;border-style:solid;border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}.shape-classic-xl.simple,.shape-classic-lg.simple,.shape-classic-md.simple,.shape-classic-sm.simple,.shape-classic-xs.simple{border-width:0px;min-height:58px;max-height:58px;background-color:unset;box-shadow:none}.shape-classic-xl.thin,.shape-classic-lg.thin,.shape-classic-md.thin,.shape-classic-sm.thin,.shape-classic-xs.thin{border-width:1px;min-height:56px;max-height:56px;background-color:unset}.shape-classic-xl.parentBorder,.shape-classic-lg.parentBorder,.shape-classic-md.parentBorder,.shape-classic-sm.parentBorder,.shape-classic-xs.parentBorder{border:0;box-shadow:unset;min-height:54px;max-height:54px}.shape-snowflake-xl,.shape-snowflake-lg,.shape-snowflake-md,.shape-snowflake-sm,.shape-snowflake-xs{min-height:56px;max-height:56px;border-style:solid;border-width:2px;border-color:transparent;border-radius:30px}.shape-snowflake-xl.simple,.shape-snowflake-lg.simple,.shape-snowflake-md.simple,.shape-snowflake-sm.simple,.shape-snowflake-xs.simple{border-width:0px;min-height:60px;max-height:60px;background-color:unset;box-shadow:none}.shape-snowflake-xl.thin,.shape-snowflake-lg.thin,.shape-snowflake-md.thin,.shape-snowflake-sm.thin,.shape-snowflake-xs.thin{border-width:1px;min-height:58px;max-height:58px;background-color:unset}.shape-snowflake-xl.parentBorder,.shape-snowflake-lg.parentBorder,.shape-snowflake-md.parentBorder,.shape-snowflake-sm.parentBorder,.shape-snowflake-xs.parentBorder{border:0;box-shadow:unset;min-height:56px;max-height:56px}.shape-box-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-box-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-box-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-box-lg{min-height:52px;max-height:52px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-box-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-box-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-box-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-box-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-box-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-box-sm{min-height:32px;max-height:32px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-box-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-box-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-box-xs{min-height:20px;max-height:20px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-box-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-box-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-rounded-lg{min-height:56px;max-height:56px;border-style:solid;border-width:2px;border-color:transparent;border-radius:6px}.shape-rounded-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-rounded-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-rounded-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-pill-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px}.shape-pill-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-left-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px 0 0 36px}.shape-pill-left-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-left-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-left-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-right-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 36px 36px 0}.shape-pill-right-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-right-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-right-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px}.shape-pill-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-left-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px 0 0 36px}.shape-pill-left-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-left-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-left-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-right-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 36px 36px 0}.shape-pill-right-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-right-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-right-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}`;
6207
6200
 
6208
- var styleCss$1$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}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);font-weight:var(--wcss-body-default-weight, );line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-default-emphasized{font-size:var(--wcss-body-default-emphasized-font-size, 1rem);font-weight:var(--wcss-body-default-emphasized-weight, );line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);font-weight:var(--wcss-body-lg-weight, );line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg,.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg-emphasized{font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);font-weight:var(--wcss-body-lg-emphasized-weight, );line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);font-weight:var(--wcss-body-sm-weight, );line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-sm-emphasized{font-size:var(--wcss-body-sm-emphasized-font-size, 0.875rem);font-weight:var(--wcss-body-sm-emphasized-weight, );line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);font-weight:var(--wcss-body-xs-weight, );line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs,.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs-emphasized{font-size:var(--wcss-body-xs-emphasized-font-size, 0.75rem);font-weight:var(--wcss-body-xs-emphasized-weight, );line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-2xs-weight, );line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.body-2xs,.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-2xs-emphasized{font-size:var(--wcss-body-2xs-emphasized-font-size, 0.625rem);font-weight:var(--wcss-body-2xs-emphasized-weight, );line-height:var(--wcss-body-2xs-emphasized-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 300);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 300);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{display:block}.wrapper:has(:enabled){cursor:text}.wrapper:has(:enabled) label{cursor:text}.helpTextClasses{cursor:default}input{overflow:clip !important;width:100%;padding:0;border:0;background:unset;outline:none;overflow-clip-margin:0 !important;text-overflow:ellipsis}input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.displayValue{display:none}.displayValue.hasContent:is(.withValue):not(.hasFocus){display:flex;align-items:center}.accents:not(.util_displayHidden){display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px}.wrapper:not(:focus-within):not(:hover) .notificationBtn.passwordBtn,.wrapper:not(:focus-within):not(:hover) .notification.clear{display:none}.notification{display:flex;align-items:center;justify-content:center}`;
6201
+ var styleCss$1$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}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);font-weight:var(--wcss-body-default-weight, );line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-default-emphasized{font-size:var(--wcss-body-default-emphasized-font-size, 1rem);font-weight:var(--wcss-body-default-emphasized-weight, );line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);font-weight:var(--wcss-body-lg-weight, );line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg,.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg-emphasized{font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);font-weight:var(--wcss-body-lg-emphasized-weight, );line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);font-weight:var(--wcss-body-sm-weight, );line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-sm-emphasized{font-size:var(--wcss-body-sm-emphasized-font-size, 0.875rem);font-weight:var(--wcss-body-sm-emphasized-weight, );line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);font-weight:var(--wcss-body-xs-weight, );line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs,.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs-emphasized{font-size:var(--wcss-body-xs-emphasized-font-size, 0.75rem);font-weight:var(--wcss-body-xs-emphasized-weight, );line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-2xs-weight, );line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.body-2xs,.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-2xs-emphasized{font-size:var(--wcss-body-2xs-emphasized-font-size, 0.625rem);font-weight:var(--wcss-body-2xs-emphasized-weight, );line-height:var(--wcss-body-2xs-emphasized-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 300);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 300);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{display:block}.wrapper:has(:enabled){cursor:text}.wrapper:has(:enabled) label{cursor:text}.helpTextClasses{cursor:default}input{overflow:clip !important;width:100%;padding:0;border:0;background:unset;outline:none;overflow-clip-margin:0 !important;text-overflow:ellipsis}input[type=number]{appearance:textfield}input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.displayValue{display:none}.displayValue.hasContent:is(.withValue):not(.hasFocus){display:flex;align-items:center}.accents:not(.util_displayHidden){display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px}.wrapper:not(:focus-within):not(:hover) .notificationBtn.passwordBtn,.wrapper:not(:focus-within):not(:hover) .notification.clear{display:none}.notification{display:flex;align-items:center;justify-content:center}`;
6209
6202
 
6210
6203
  var styleDefaultCss = css`.layoutDefault .typeIcon,:host(:not([layout])) .typeIcon{display:flex;flex-direction:row;align-items:center}.layoutDefault .typeIcon [auro-icon],:host(:not([layout])) .typeIcon [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-100, 0.5rem)}.layoutDefault .notificationIcons,:host(:not([layout])) .notificationIcons{display:flex;flex-direction:row;padding-right:var(--ds-size-100, 0.5rem)}:host([class=layoutDefault][bordered]) .typeIcon,:host(:not([layout])[bordered]) .typeIcon{padding-left:var(--ds-size-100, 0.5rem)}:host([class=layoutDefault][bordered]) .notificationIcons,:host(:not([layout])[bordered]) .notificationIcons{align-items:center}:host([class=layoutDefault][bordered]) .notification:not(:first-of-type),:host(:not([layout])[bordered]) .notification:not(:first-of-type){margin-left:var(--ds-size-100, 0.5rem)}:host([class=layoutDefault][bordered]) .alertNotification,:host(:not([layout])[bordered]) .alertNotification{width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem))}:host([class=layoutDefault][bordered]) .passwordBtn,:host(:not([layout])[bordered]) .passwordBtn{width:calc(var(--ds-size-300, 1.5rem));height:calc(var(--ds-size-300, 1.5rem))}:host([class=layoutDefault][bordered]) .notificationBtn,:host(:not([layout])[bordered]) .notificationBtn{display:block;width:var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);padding:0;border:0;background:unset;cursor:pointer}:host([class=layoutDefault][bordered]) .notificationBtn [auro-icon],:host(:not([layout])[bordered]) .notificationBtn [auro-icon]{display:block;height:var(--ds-size-300, 1.5rem);--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([class=layoutDefault][bordered]) .notificationBtn [auro-icon][hidden],:host(:not([layout])[bordered]) .notificationBtn [auro-icon][hidden]{display:none}:host([class=layoutDefault]:not([bordered])) .typeIcon,:host([class=layoutDefault]:not([bordered])) .notificationIcons,:host(:not([layout]):not([bordered])) .typeIcon,:host(:not([layout]):not([bordered])) .notificationIcons{align-items:flex-end;padding-bottom:var(--ds-size-50, 0.25rem)}:host([class=layoutDefault]:not([bordered])) .clearBtn,:host(:not([layout]):not([bordered])) .clearBtn{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);overflow:hidden;width:0;opacity:0}.layoutDefault .wrapper:hover .clearBtn,.layoutDefault .wrapper:focus-within .clearBtn,:host(:not([layout])) .wrapper:hover .clearBtn,:host(:not([layout])) .wrapper:focus-within .clearBtn{width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));opacity:1}:host([class=layoutDefault]:focus-within[type=password]) .notificationIcons[hasValue] .alertNotification,:host(:not([layout]):focus-within[type=password]) .notificationIcons[hasValue] .alertNotification{overflow:hidden;width:0;height:0;padding:0;margin:0;visibility:hidden}.layoutDefault input,:host(:not([layout])) input{border:unset}.layoutDefault .wrapper,:host(:not([layout])) .wrapper{position:relative;overflow:hidden;border-style:solid}:host([class=layoutDefault]:not([bordered],[borderless])) .wrapper,:host(:not([layout]):not([bordered],[borderless])) .wrapper{border-width:1px 0}:host([class=layoutDefault][bordered]) .wrapper,:host(:not([layout])[bordered]) .wrapper{border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}:host([class=layoutDefault]:not([borderless])) .wrapper:focus-within:before,:host(:not([layout]):not([borderless])) .wrapper:focus-within:before{position:absolute;display:block;border-bottom-width:1px;border-bottom-style:solid;content:"";inset:0;pointer-events:none}:host([class=layoutDefault][validity]:not([validity=valid])) .wrapper:before,:host(:not([layout])[validity]:not([validity=valid])) .wrapper:before{border-bottom:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{text-align:left}.layoutDefault :host,:host(:not([layout])) :host{position:relative;display:block}.layoutDefault .wrapper,:host(:not([layout])) .wrapper{display:flex;flex-direction:row}.layoutDefault .main,:host(:not([layout])) .main{display:flex;flex-direction:row;position:relative;flex:1}`;
6211
6204
 
@@ -10581,15 +10574,17 @@ class AuroFormValidation {
10581
10574
  );
10582
10575
  }
10583
10576
 
10584
- // If there is a second input in the elem and that value is undefined or an empty string set hasValue to false;
10585
- if (this.auroInputElements?.length === 2) {
10586
- if (!this.auroInputElements[1].value || this.auroInputElements[1].length === 0) {
10577
+ const isCombobox = this.runtimeUtils.elementMatch(elem, 'auro-combobox');
10578
+
10579
+ // If there is a second input in the elem and that value is undefined or an empty string set hasValue to false.
10580
+ // Skip for combobox: its second auro-input is the fullscreen-bib mirror of the same value, not an independent
10581
+ // field (datepicker is the intended consumer — start/end are independently required).
10582
+ if (this.auroInputElements?.length === 2 && !isCombobox) {
10583
+ if (!this.auroInputElements[1].value || this.auroInputElements[1].value.length === 0) {
10587
10584
  hasValue = false;
10588
10585
  }
10589
10586
  }
10590
10587
 
10591
- const isCombobox = this.runtimeUtils.elementMatch(elem, 'auro-combobox');
10592
-
10593
10588
  if (isCombobox) {
10594
10589
 
10595
10590
  if (!elem.persistInput || elem.behavior === "filter") {
@@ -16270,8 +16265,6 @@ function cleanEscapedString(input) {
16270
16265
  return input.match(escapedStringRegExp)[1].replace(doubleQuoteRegExp, "'");
16271
16266
  }
16272
16267
 
16273
- /* eslint-disable max-lines */
16274
-
16275
16268
  class AuroInputUtilities {
16276
16269
 
16277
16270
  /**
@@ -16314,7 +16307,7 @@ class AuroInputUtilities {
16314
16307
  /**
16315
16308
  * Converts an IMask-style date mask to a date-fns compatible format string.
16316
16309
  * @param {string} mask - IMask date mask (e.g. "MM/DD/YYYY").
16317
- * @returns {string} date-fns format string (e.g. "MM/dd/yyyy").
16310
+ * @returns {string} A date-fns format string (e.g. "MM/dd/yyyy").
16318
16311
  */
16319
16312
  toDateFnsMask(mask) {
16320
16313
  return mask
@@ -16536,6 +16529,7 @@ class AuroInputUtilities {
16536
16529
  const maskOptions = this.getMaskOptions('date', normalizedFormat);
16537
16530
 
16538
16531
  if (!(valueObject instanceof Date) || Number.isNaN(valueObject.getTime()) || !maskOptions || typeof maskOptions.format !== 'function') {
16532
+ console.debug('Invalid date object or mask options for formatting', { valueObject, maskOptions }); // eslint-disable-line no-console
16539
16533
  return undefined;
16540
16534
  }
16541
16535
 
@@ -16693,6 +16687,7 @@ class BaseInput extends AuroElement$1 {
16693
16687
  // so a parent (datepicker/combobox) calling `validate()` synchronously
16694
16688
  // during its own update cycle sees a populated util instance.
16695
16689
  this.activeLabel = false;
16690
+
16696
16691
  /** @private */
16697
16692
  this.allowedInputTypes = [
16698
16693
  "text",
@@ -16703,6 +16698,7 @@ class BaseInput extends AuroElement$1 {
16703
16698
  "tel"
16704
16699
  ];
16705
16700
  this.appearance = "default";
16701
+
16706
16702
  /** @private */
16707
16703
  this.dateFormatMap = {
16708
16704
  'mm/dd/yyyy': 'dateMMDDYYYY',
@@ -16721,23 +16717,24 @@ class BaseInput extends AuroElement$1 {
16721
16717
  'mm/dd': 'dateMMDD'
16722
16718
  };
16723
16719
  this.disabled = false;
16720
+
16724
16721
  /** @private */
16725
16722
  this.domHandler = new DomHandler();
16726
16723
  this.dvInputOnly = false;
16727
16724
  this.hasValue = false;
16728
16725
  this.hideLabelVisually = false;
16729
16726
  this.icon = false;
16727
+
16730
16728
  /** @private */
16731
16729
  this.inputIconName = undefined;
16730
+
16732
16731
  /** @private */
16733
16732
  this.label = 'Input label is undefined';
16734
16733
  this.layout = 'classic';
16735
16734
  this.locale = 'en-US';
16736
16735
  this.max = undefined;
16737
- this._maxObject = undefined;
16738
16736
  this.maxLength = undefined;
16739
16737
  this.min = undefined;
16740
- this._minObject = undefined;
16741
16738
  this.minLength = undefined;
16742
16739
  this.noValidate = false;
16743
16740
  this.onDark = false;
@@ -16754,23 +16751,27 @@ class BaseInput extends AuroElement$1 {
16754
16751
  "email"
16755
16752
  ];
16756
16753
  this.shape = 'classic';
16754
+
16757
16755
  /** @private */
16758
16756
  this.showPassword = false;
16759
16757
  this.size = 'lg';
16760
16758
  this.touched = false;
16759
+
16761
16760
  /** @private */
16762
16761
  this.uniqueId = new UniqueId().create();
16762
+
16763
16763
  /** @private */
16764
16764
  this.util = new AuroInputUtilities({
16765
16765
  locale: this.locale,
16766
16766
  format: this.format
16767
16767
  });
16768
+
16768
16769
  /** @private */
16769
16770
  this.validation = new AuroFormValidation();
16771
+
16770
16772
  /** @private */
16771
16773
  this.validationCCLength = undefined;
16772
16774
  this.value = undefined;
16773
- this._valueObject = undefined;
16774
16775
  }
16775
16776
 
16776
16777
  // function to define props used within the scope of this component
@@ -17208,7 +17209,7 @@ class BaseInput extends AuroElement$1 {
17208
17209
  * @returns {Date|undefined}
17209
17210
  */
17210
17211
  get valueObject() {
17211
- return this._valueObject || this._computeDateObjectFallback(this.value);
17212
+ return this.value && dateFormatter.isValidDate(this.value) ? dateFormatter.stringToDateInstance(this.value) : undefined;
17212
17213
  }
17213
17214
 
17214
17215
  /**
@@ -17216,7 +17217,7 @@ class BaseInput extends AuroElement$1 {
17216
17217
  * @returns {Date|undefined}
17217
17218
  */
17218
17219
  get minObject() {
17219
- return this._minObject || this._computeDateObjectFallback(this.min);
17220
+ return this.min && dateFormatter.isValidDate(this.min) ? dateFormatter.stringToDateInstance(this.min) : undefined;
17220
17221
  }
17221
17222
 
17222
17223
  /**
@@ -17224,50 +17225,7 @@ class BaseInput extends AuroElement$1 {
17224
17225
  * @returns {Date|undefined}
17225
17226
  */
17226
17227
  get maxObject() {
17227
- return this._maxObject || this._computeDateObjectFallback(this.max);
17228
- }
17229
-
17230
- /**
17231
- * Parses a date string into a Date object when the corresponding `_*Object`
17232
- * field hasn't been synced yet by `updated()`. Returns undefined when the
17233
- * input type/format isn't a full date or the string is not a valid date.
17234
- *
17235
- * Why this exists: a parent (datepicker) can call `inputN.validate()` from
17236
- * inside its own `updated()` before this input's `updated()` has run
17237
- * `syncDateValues()` — so `_valueObject`/`_maxObject` are still `undefined`
17238
- * and range checks would otherwise silently no-op (flipping the result to
17239
- * `valid` or `patternMismatch`).
17240
- * @private
17241
- * @param {string|undefined} dateStr - ISO date string from `value`/`min`/`max`.
17242
- * @returns {Date|undefined}
17243
- */
17244
- _computeDateObjectFallback(dateStr) {
17245
- if (!dateStr || !this.util || !this.util.isFullDateFormat(this.type, this.format)) {
17246
- return undefined;
17247
- }
17248
- if (!dateFormatter.isValidDate(dateStr)) {
17249
- return undefined;
17250
- }
17251
- return dateFormatter.stringToDateInstance(dateStr);
17252
- }
17253
-
17254
- /**
17255
- * Internal setter for readonly date object properties.
17256
- * @private
17257
- * @param {'valueObject'|'minObject'|'maxObject'} propertyName - Public object property name.
17258
- * @param {Date|undefined} propertyValue - Value to assign.
17259
- * @returns {void}
17260
- */
17261
- setDateObjectProperty(propertyName, propertyValue) {
17262
- const internalPropertyName = `_${propertyName}`;
17263
- const previousValue = this[internalPropertyName];
17264
-
17265
- if (previousValue === propertyValue) {
17266
- return;
17267
- }
17268
-
17269
- this[internalPropertyName] = propertyValue;
17270
- this.requestUpdate(propertyName, previousValue);
17228
+ return this.max && dateFormatter.isValidDate(this.max) ? dateFormatter.stringToDateInstance(this.max) : undefined;
17271
17229
  }
17272
17230
 
17273
17231
  connectedCallback() {
@@ -17296,7 +17254,6 @@ class BaseInput extends AuroElement$1 {
17296
17254
  format: this.format
17297
17255
  });
17298
17256
  this.configureDataForType();
17299
- this.syncDateValues();
17300
17257
  }
17301
17258
 
17302
17259
  disconnectedCallback() {
@@ -17335,7 +17292,6 @@ class BaseInput extends AuroElement$1 {
17335
17292
  this.setCustomHelpTextMessage();
17336
17293
  this.configureAutoFormatting();
17337
17294
  this.configureDataForType();
17338
- this.syncDateValues();
17339
17295
  }
17340
17296
 
17341
17297
  /**
@@ -17393,7 +17349,7 @@ class BaseInput extends AuroElement$1 {
17393
17349
 
17394
17350
  /**
17395
17351
  * @private
17396
- * @deprecated https://dev.azure.com/itsals/E_Retain_Content/_workitems/edit/1557296
17352
+ * @deprecated See https://dev.azure.com/itsals/E_Retain_Content/_workitems/edit/1557296.
17397
17353
  * @returns {void} Sets the default help text for the input.
17398
17354
  */
17399
17355
  setCustomHelpTextMessage() {
@@ -17479,8 +17435,6 @@ class BaseInput extends AuroElement$1 {
17479
17435
  this.configureDataForType();
17480
17436
  }
17481
17437
 
17482
- this.syncDateValues(changedProperties);
17483
-
17484
17438
  if (changedProperties.has('value')) {
17485
17439
  if (this.value && this.value.length > 0) {
17486
17440
  this.hasValue = true;
@@ -17502,14 +17456,14 @@ class BaseInput extends AuroElement$1 {
17502
17456
 
17503
17457
  if (formattedValue !== this.inputElement.value) {
17504
17458
  this.skipNextProgrammaticInputEvent = true;
17505
- if (this.maskInstance && this.type === 'credit-card') {
17459
+ if (this.maskInstance && this.type !== 'date') {
17506
17460
  // Route through the mask so its _value and el.value stay in lock-step
17507
17461
  // (set value calls updateControl which writes el.value = displayValue).
17508
17462
  // Writing el.value directly leaves the mask thinking displayValue is
17509
- // stale; _saveSelection on the next focus/click then warns. Scoped to
17510
- // credit-card so date's own formattedValue (raw ISO when calendar-invalid)
17511
- // isn't re-masked through the mm/dd/yyyy mask, which would truncate it
17512
- // and flip validity from patternMismatch to tooShort.
17463
+ // stale; _saveSelection on the next focus/click then warns. Date is
17464
+ // excluded because its formattedValue can be raw ISO when the calendar
17465
+ // is invalid, and re-masking through mm/dd/yyyy would truncate it and
17466
+ // flip validity from patternMismatch to tooShort.
17513
17467
  this.maskInstance.value = formattedValue || '';
17514
17468
  } else if (formattedValue) {
17515
17469
  this.inputElement.value = formattedValue;
@@ -17551,120 +17505,65 @@ class BaseInput extends AuroElement$1 {
17551
17505
  }));
17552
17506
  }
17553
17507
 
17554
-
17555
- /**
17556
- * Synchronizes the ISO string values and Date object representations for date-related properties.
17557
- * This keeps the model and display values aligned when either side changes.
17558
- *
17559
- * When a full date format is in use, this method updates `value`, `min`, and `max` from their corresponding
17560
- * Date objects or vice versa, based on which properties have changed. It only runs when the current configuration
17561
- * represents a full year/month/day date format.
17562
- *
17563
- * @param {Map<string, unknown>|undefined} [changedProperties=undefined] - Optional map of changed properties used to limit which values are synchronized.
17564
- * @returns {void}
17565
- * @private
17566
- */
17567
- syncDateValues(changedProperties = undefined) {
17568
- if (!this.util.isFullDateFormat(this.type, this.format)) {
17569
- return;
17570
- }
17571
-
17572
- this.syncSingleDateValue(changedProperties, 'valueObject', 'value');
17573
- this.syncSingleDateValue(changedProperties, 'minObject', 'min');
17574
- this.syncSingleDateValue(changedProperties, 'maxObject', 'max');
17575
- }
17576
-
17577
- /**
17578
- * Synchronizes one date object/string property pair.
17579
- * @private
17580
- * @param {Map<string, unknown>|undefined} changedProperties - Map of changed properties from Lit.
17581
- * @param {string} objectProperty - Date object property name.
17582
- * @param {string} valueProperty - ISO string property name.
17583
- * @returns {void}
17584
- */
17585
- syncSingleDateValue(changedProperties, objectProperty, valueProperty) {
17586
- const objectPropertyChanged = !changedProperties || changedProperties.has(objectProperty);
17587
-
17588
- // objectProperty wins over valueProperty when both changed
17589
- if (objectPropertyChanged && this[objectProperty]) {
17590
- this[valueProperty] = dateFormatter.toISOFormatString(this[objectProperty]);
17591
- return;
17592
- }
17593
-
17594
- const valuePropertyChanged = !changedProperties || changedProperties.has(valueProperty);
17595
- if (!valuePropertyChanged) {
17596
- return;
17597
- }
17598
-
17599
- // when value is newly set to the same ISO string that corresponds to the existing Date object, do not clear the Date object (avoid unnecessary updates)
17600
- if (
17601
- changedProperties &&
17602
- valueProperty === 'value' &&
17603
- changedProperties.get('value') === undefined &&
17604
- this[objectProperty] instanceof Date &&
17605
- this[valueProperty] === dateFormatter.toISOFormatString(this[objectProperty])
17606
- ) {
17607
- return;
17608
- }
17609
-
17610
- if (dateFormatter.isValidDate(this[valueProperty])) {
17611
- this.setDateObjectProperty(objectProperty, dateFormatter.stringToDateInstance(this[valueProperty]));
17612
- } else {
17613
- this.setDateObjectProperty(objectProperty, undefined);
17614
- }
17615
- }
17616
-
17617
17508
  /**
17618
17509
  * Sets up IMasks and logic based on auto-formatting requirements.
17619
17510
  * @private
17620
17511
  * @returns {void}
17621
17512
  */
17622
17513
  configureAutoFormatting() {
17623
- // Re-entrancy guard. The patched-setter's synthetic input event (suppressed
17624
- // by _configuringMask above) could otherwise trigger handleInput
17625
- // processCreditCard configureAutoFormatting before the outer call's
17626
- // set value has finished its alignCursor pass.
17514
+ // _configuringMask gates two things: external re-entry into this method
17515
+ // while setup is mid-flight (from property changes that call back here),
17516
+ // and the accept/complete listeners below — both need to ignore the mask
17517
+ // events fired by our own value-restore step.
17627
17518
  if (this._configuringMask) return;
17628
17519
  this._configuringMask = true;
17629
17520
  try {
17521
+ // Destroy any prior mask so IMask can attach fresh under the new format.
17522
+ // Null the reference too — if the new maskOptions.mask is falsy (e.g.
17523
+ // type switched from credit-card to text) the IMask() reassignment
17524
+ // below is skipped, and downstream writes at line ~823 would otherwise
17525
+ // route through the destroyed instance.
17630
17526
  if (this.maskInstance) {
17631
17527
  this.maskInstance.destroy();
17528
+ this.maskInstance = null;
17632
17529
  }
17633
17530
 
17634
- // Pass new format to util
17635
17531
  this.util.updateFormat(this.format);
17636
17532
 
17637
17533
  const maskOptions = this.util.getMaskOptions(this.type, this.format);
17638
17534
 
17639
17535
  if (this.inputElement && maskOptions.mask) {
17640
-
17641
- // Stash and clear any existing value before IMask init.
17642
- // IMask's constructor processes the current input value which requires
17643
- // selection state clearing first avoids that scenario entirely.
17644
- // When the format changes (e.g. locale switch) and we have a valid ISO
17645
- // model value, compute the display string for the NEW format instead of
17646
- // re-using the old display string, which may be invalid in the new mask.
17536
+ // Capture the current display so it can be re-applied after IMask
17537
+ // attaches. The restore at the bottom goes through maskInstance.value
17538
+ // (not inputElement.value directly) so the mask's internal state and
17539
+ // the input's displayed text stay in lock-step.
17647
17540
  let existingValue = this.inputElement.value;
17541
+
17542
+ // Format-change case (e.g. locale switch): existingValue is the OLD
17543
+ // mask's display string and may not parse under the new mask. When
17544
+ // we have a valid date model, rebuild the display from valueObject
17545
+ // (the canonical source) using the new mask's format function.
17648
17546
  if (
17649
17547
  this.util.isFullDateFormat(this.type, this.format) &&
17650
17548
  this.value &&
17651
- dateFormatter.isValidDate(this.value) &&
17652
- this.valueObject instanceof Date &&
17653
- !Number.isNaN(this.valueObject.getTime()) &&
17549
+ this.valueObject &&
17654
17550
  typeof maskOptions.format === 'function'
17655
17551
  ) {
17656
17552
  existingValue = maskOptions.format(this.valueObject);
17657
17553
  }
17658
17554
 
17555
+ // Clear before IMask attaches so the constructor seeds an empty
17556
+ // internal value. Otherwise IMask reads the stale unmasked string
17557
+ // and emits a spurious 'accept' before the restore below runs.
17659
17558
  this.skipNextProgrammaticInputEvent = true;
17660
17559
  this.inputElement.value = '';
17661
17560
 
17662
17561
  this.maskInstance = IMask(this.inputElement, maskOptions);
17663
17562
 
17563
+ // Mask fires 'accept' on every value change, including the restore
17564
+ // step below. Skip events fired during configureAutoFormatting so
17565
+ // we don't overwrite a value the parent just pushed.
17664
17566
  this.maskInstance.on('accept', () => {
17665
- // Suppress propagation during configureAutoFormatting's own value-restoration
17666
- // (line below) — the mask emits 'accept' on every value-set, including ours,
17667
- // and we don't want to overwrite a value the parent just pushed.
17668
17567
  if (this._configuringMask) return;
17669
17568
  this.value = this.util.toModelValue(this.maskInstance.value, this.format);
17670
17569
  if (this.type === "date") {
@@ -17672,6 +17571,8 @@ class BaseInput extends AuroElement$1 {
17672
17571
  }
17673
17572
  });
17674
17573
 
17574
+ // Mask fires 'complete' on the restore step below for any value that
17575
+ // happens to be a complete match. Same setup-suppression as 'accept'.
17675
17576
  this.maskInstance.on('complete', () => {
17676
17577
  if (this._configuringMask) return;
17677
17578
  this.value = this.util.toModelValue(this.maskInstance.value, this.format);
@@ -17680,7 +17581,9 @@ class BaseInput extends AuroElement$1 {
17680
17581
  }
17681
17582
  });
17682
17583
 
17683
- // Restore the stashed value through IMask so it's properly masked
17584
+ // Write existingValue through the mask (not the input directly) so
17585
+ // the mask reformats it under the new rules and keeps its internal
17586
+ // _value aligned with the input's displayed text.
17684
17587
  if (existingValue) {
17685
17588
  this.maskInstance.value = existingValue;
17686
17589
  }
@@ -17774,10 +17677,10 @@ class BaseInput extends AuroElement$1 {
17774
17677
  // the gated types currently support it, since the list is a public
17775
17678
  // property a consumer could mutate.
17776
17679
  if (this.setSelectionInputTypes.includes(this.type)) {
17777
- let selectionStart;
17680
+ let selectionStart = null;
17778
17681
  try {
17779
- selectionStart = this.inputElement.selectionStart;
17780
- } catch (error) { // eslint-disable-line no-unused-vars
17682
+ ({ selectionStart } = this.inputElement);
17683
+ } catch {
17781
17684
  return;
17782
17685
  }
17783
17686
  if (typeof selectionStart !== 'number') {
@@ -17786,7 +17689,7 @@ class BaseInput extends AuroElement$1 {
17786
17689
  this.updateComplete.then(() => {
17787
17690
  try {
17788
17691
  this.inputElement.setSelectionRange(selectionStart, selectionStart);
17789
- } catch (error) { // eslint-disable-line no-unused-vars
17692
+ } catch {
17790
17693
  // Some input types (number/email in certain UAs) throw on
17791
17694
  // setSelectionRange; swallow and let the native cursor stand.
17792
17695
  }
@@ -17880,7 +17783,6 @@ class BaseInput extends AuroElement$1 {
17880
17783
  */
17881
17784
  reset() {
17882
17785
  this.value = undefined;
17883
- this.setDateObjectProperty('valueObject', undefined);
17884
17786
  this.validation.reset(this);
17885
17787
  }
17886
17788
 
@@ -17889,7 +17791,6 @@ class BaseInput extends AuroElement$1 {
17889
17791
  */
17890
17792
  clear() {
17891
17793
  this.value = undefined;
17892
- this.setDateObjectProperty('valueObject', undefined);
17893
17794
  }
17894
17795
 
17895
17796
  /**
@@ -17964,7 +17865,7 @@ class BaseInput extends AuroElement$1 {
17964
17865
  /**
17965
17866
  * Function to support credit-card feature type.
17966
17867
  * @private
17967
- * @deprecated https://dev.azure.com/itsals/E_Retain_Content/_workitems/edit/1557296
17868
+ * @deprecated See https://dev.azure.com/itsals/E_Retain_Content/_workitems/edit/1557296.
17968
17869
  * @returns {object} JSON with data for credit card formatting.
17969
17870
  */
17970
17871
  matchInputValueToCreditCard() {
@@ -18418,7 +18319,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
18418
18319
  }
18419
18320
  };
18420
18321
 
18421
- var formkitVersion$1 = '202606292156';
18322
+ var formkitVersion$1 = '202607011652';
18422
18323
 
18423
18324
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
18424
18325
  // See LICENSE in the project root for license information.
@@ -18741,7 +18642,7 @@ class AuroInput extends BaseInput {
18741
18642
  /**
18742
18643
  * Determines default help text string.
18743
18644
  * @private
18744
- * @deprecated https://dev.azure.com/itsals/E_Retain_Content/_workitems/edit/1557296
18645
+ * @deprecated See https://dev.azure.com/itsals/E_Retain_Content/_workitems/edit/1557296.
18745
18646
  * @returns {string} Evaluates pre-determined help text.
18746
18647
  */
18747
18648
  getHelpText() {
@@ -19544,7 +19445,7 @@ class AuroBibtemplate extends LitElement {
19544
19445
  }
19545
19446
  }
19546
19447
 
19547
- var formkitVersion = '202606292156';
19448
+ var formkitVersion = '202607011652';
19548
19449
 
19549
19450
  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}`;
19550
19451
 
@@ -19912,12 +19813,23 @@ function getOptionLabel(option) {
19912
19813
  if (!option) {
19913
19814
  return '';
19914
19815
  }
19915
- const clone = option.cloneNode(true);
19916
- const displayValueEl = clone.querySelector('[slot="displayValue"]');
19917
- if (displayValueEl) {
19918
- displayValueEl.remove();
19816
+
19817
+ // Consumer-provided override: short-circuit the DOM walk entirely.
19818
+ if (option.dataset && option.dataset.label) {
19819
+ return option.dataset.label;
19919
19820
  }
19920
- return (clone.textContent || '').replace(/\s+/gu, ' ').trim();
19821
+
19822
+ // Walk direct children — the `slot` attribute only applies to direct children
19823
+ // of the slot host, so a shallow filter is sufficient. Avoids the cloneNode +
19824
+ // querySelector allocation that ran on every keystroke via syncValuesAndStates.
19825
+ let text = '';
19826
+ for (const node of option.childNodes) {
19827
+ const isDisplayValueSlot = node.nodeType === Node.ELEMENT_NODE && node.getAttribute('slot') === 'displayValue';
19828
+ if (!isDisplayValueSlot) {
19829
+ text += node.textContent || '';
19830
+ }
19831
+ }
19832
+ return text.replace(/\s+/gu, ' ').trim();
19921
19833
  }
19922
19834
 
19923
19835
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
@@ -19992,8 +19904,6 @@ class AuroCombobox extends AuroElement {
19992
19904
  this.availableOptions = [];
19993
19905
  this.dropdownId = undefined;
19994
19906
  this.dropdownOpen = false;
19995
- this.triggerExpandedState = false;
19996
- this._expandedTimeout = null;
19997
19907
  this._inFullscreenTransition = false;
19998
19908
  this.errorMessage = null;
19999
19909
  this.isHiddenWhileLoading = false;
@@ -20004,6 +19914,30 @@ class AuroCombobox extends AuroElement {
20004
19914
  this.touched = false;
20005
19915
  this.validation = new AuroFormValidation$1();
20006
19916
  this.validity = undefined;
19917
+ this._userTyped = false;
19918
+ // Tracks every setTimeout scheduled via _scheduleTimer so
19919
+ // disconnectedCallback can cancel them. Without this, a detached
19920
+ // combobox's pending timers still fire — most are no-ops, but
19921
+ // configureMenu's racing-condition retry would otherwise loop.
19922
+ this._pendingTimers = new Set();
19923
+ }
19924
+
19925
+ /**
19926
+ * Wraps setTimeout and records the timer id so disconnectedCallback
19927
+ * can cancel any outstanding callbacks. The id is removed from the set
19928
+ * once the callback fires so the set doesn't grow unbounded.
19929
+ * @param {Function} fn - Callback to run.
19930
+ * @param {number} ms - Delay in milliseconds.
19931
+ * @returns {number} The timer id.
19932
+ * @private
19933
+ */
19934
+ _scheduleTimer(fn, ms) {
19935
+ const id = setTimeout(() => {
19936
+ this._pendingTimers.delete(id);
19937
+ fn();
19938
+ }, ms);
19939
+ this._pendingTimers.add(id);
19940
+ return id;
20007
19941
  }
20008
19942
 
20009
19943
  // This function is to define props used within the scope of this component
@@ -20365,17 +20299,6 @@ class AuroCombobox extends AuroElement {
20365
20299
  attribute: false
20366
20300
  },
20367
20301
 
20368
- /**
20369
- * Deferred aria-expanded state for the trigger input.
20370
- * Delays the "true" transition so VoiceOver finishes its character echo
20371
- * before announcing "expanded".
20372
- * @private
20373
- */
20374
- triggerExpandedState: {
20375
- type: Boolean,
20376
- reflect: false,
20377
- attribute: false
20378
- },
20379
20302
  };
20380
20303
  }
20381
20304
 
@@ -20398,13 +20321,6 @@ class AuroCombobox extends AuroElement {
20398
20321
  return this.input.value;
20399
20322
  }
20400
20323
 
20401
- // /**
20402
- // * Sets the value of the input element within the combobox.
20403
- // */
20404
- // set inputValue(value) {
20405
- // this.input.value = value;
20406
- // }
20407
-
20408
20324
  /**
20409
20325
  * Checks if the element is valid.
20410
20326
  * @returns {boolean} - Returns true if the element is valid, false otherwise.
@@ -20531,7 +20447,7 @@ class AuroCombobox extends AuroElement {
20531
20447
  if (this.menu) {
20532
20448
  this.menu.matchWord = normalizeFilterValue(this.input.value);
20533
20449
  }
20534
- const label = getOptionLabel(this.menu.optionSelected) || this.menu.currentLabel;
20450
+ const label = getOptionLabel(this.menu.optionSelected);
20535
20451
  this.updateTriggerTextDisplay(label || this.value);
20536
20452
  }
20537
20453
 
@@ -20545,44 +20461,16 @@ class AuroCombobox extends AuroElement {
20545
20461
  // in suggestion mode, do not override input value if no selection has been made and the input currently has focus
20546
20462
  const isInputFocusedWithNoSelection = !this.menu.value && (this.input.matches(':focus-within') || (this.inputInBib && this.inputInBib.matches(':focus-within')));
20547
20463
 
20548
- if (!this.persistInput && !(this.behavior === 'suggestion' && isInputFocusedWithNoSelection)) {
20549
- const nextValue = label || this.value;
20550
- // Only set the flag when there's an actual write to suppress —
20551
- // syncValuesAndStates re-enters here during typing when both inputs
20552
- // already match, and a no-op flag flip would make the bib branch's
20553
- // bail eat legitimate user-input events.
20554
- const triggerNeedsSync = this.input.value !== nextValue;
20555
- const bibNeedsSync = Boolean(this.inputInBib && this.inputInBib !== this.input && this.inputInBib.value !== nextValue);
20556
- if (triggerNeedsSync || bibNeedsSync) {
20557
- this._syncingDisplayValue = true;
20558
- if (triggerNeedsSync) {
20559
- this.input.value = nextValue;
20560
- }
20561
- if (bibNeedsSync) {
20562
- this.inputInBib.value = nextValue;
20563
- }
20564
- const pending = [];
20565
- if (triggerNeedsSync) {
20566
- pending.push(this.input.updateComplete);
20567
- }
20568
- if (bibNeedsSync) {
20569
- pending.push(this.inputInBib.updateComplete);
20570
- }
20571
- Promise.all(pending).then(() => {
20572
- // imask reasserts otherwise, and handleBlur reverts to its stale value.
20573
- if (triggerNeedsSync && this.input.maskInstance && typeof this.input.maskInstance.updateValue === 'function') {
20574
- this.input.maskInstance.updateValue();
20575
- }
20576
- if (bibNeedsSync && this.inputInBib && this.inputInBib.maskInstance && typeof this.inputInBib.maskInstance.updateValue === 'function') {
20577
- this.inputInBib.maskInstance.updateValue();
20578
- }
20579
- this._syncingDisplayValue = false;
20580
- });
20581
- }
20464
+ const suppressed = this.persistInput || (this.behavior === 'suggestion' && isInputFocusedWithNoSelection);
20465
+ if (!suppressed) {
20466
+ this.syncInputValuesAcrossTriggerAndBib(label || this.value);
20582
20467
  }
20583
20468
 
20584
- // update the displayValue in the trigger if displayValue slot content is present
20585
- const displayValueInTrigger = this.input.querySelector('[slot="displayValue"]');
20469
+ // Replace any previously appended displayValue clone in the trigger.
20470
+ // :not(slot) excludes the template's <slot name="displayValue"
20471
+ // slot="displayValue"> forwarder, which also has slot="displayValue"
20472
+ // and would otherwise be matched first and removed.
20473
+ const displayValueInTrigger = this.input.querySelector('[slot="displayValue"]:not(slot)');
20586
20474
 
20587
20475
  if (displayValueInTrigger) {
20588
20476
  displayValueInTrigger.remove();
@@ -20606,6 +20494,53 @@ class AuroCombobox extends AuroElement {
20606
20494
  this.requestUpdate();
20607
20495
  }
20608
20496
 
20497
+ /**
20498
+ * Writes nextValue to the trigger input and the bib input when their current
20499
+ * value differs, then re-asserts imask after Lit's update flushes.
20500
+ * @param {string} nextValue - The value to write to both inputs.
20501
+ * @returns {Promise<void>} Resolves after both inputs flush and imask
20502
+ * re-asserts; resolves immediately when no sync is needed.
20503
+ * @private
20504
+ */
20505
+ async syncInputValuesAcrossTriggerAndBib(nextValue) {
20506
+ // Only set the flag when there's an actual write to suppress —
20507
+ // syncValuesAndStates re-enters here during typing when both inputs
20508
+ // already match, and a no-op flag flip would make the bib branch's
20509
+ // bail eat legitimate user-input events.
20510
+ const triggerNeedsSync = this.input.value !== nextValue;
20511
+ const bibNeedsSync = Boolean(this.inputInBib) && this.inputInBib.value !== nextValue;
20512
+ if (!triggerNeedsSync && !bibNeedsSync) {
20513
+ return;
20514
+ }
20515
+
20516
+ this._syncingDisplayValue = true;
20517
+
20518
+ const pending = [];
20519
+ if (triggerNeedsSync) {
20520
+ this.input.value = nextValue;
20521
+ pending.push(this.input.updateComplete);
20522
+ }
20523
+ if (bibNeedsSync) {
20524
+ this.inputInBib.value = nextValue;
20525
+ pending.push(this.inputInBib.updateComplete);
20526
+ }
20527
+ // finally — not a bare .then — so that an imask throw (see commit
20528
+ // d1857401c: imask can throw on credit-card format change) doesn't strand
20529
+ // _syncingDisplayValue=true and silently swallow every subsequent input.
20530
+ try {
20531
+ await Promise.all(pending);
20532
+ // imask reasserts otherwise, and handleBlur reverts to its stale value.
20533
+ if (triggerNeedsSync && this.input.maskInstance && typeof this.input.maskInstance.updateValue === 'function') {
20534
+ this.input.maskInstance.updateValue();
20535
+ }
20536
+ if (bibNeedsSync && this.inputInBib.maskInstance && typeof this.inputInBib.maskInstance.updateValue === 'function') {
20537
+ this.inputInBib.maskInstance.updateValue();
20538
+ }
20539
+ } finally {
20540
+ this._syncingDisplayValue = false;
20541
+ }
20542
+ }
20543
+
20609
20544
  /**
20610
20545
  * Processes hidden state of all menu options and determines if there are any available options not hidden.
20611
20546
  * @private
@@ -20614,6 +20549,13 @@ class AuroCombobox extends AuroElement {
20614
20549
  handleMenuOptions() {
20615
20550
  this.generateOptionsArray();
20616
20551
  this.availableOptions = [];
20552
+ // Single source of truth for the menu's filter/highlight token per call.
20553
+ // syncValuesAndStates re-writes the same value on exact-match keystrokes —
20554
+ // Lit's hasChanged makes that a no-op — and the prior duplicate set inside
20555
+ // handleTriggerInputValueChange is gone.
20556
+ if (this.menu) {
20557
+ this.menu.matchWord = normalizeFilterValue(this.input.value);
20558
+ }
20617
20559
  this.updateFilter();
20618
20560
 
20619
20561
  // Set aria-setsize/aria-posinset on each visible option so screen readers
@@ -20625,17 +20567,14 @@ class AuroCombobox extends AuroElement {
20625
20567
  option.setAttribute('aria-posinset', index + 1);
20626
20568
  });
20627
20569
 
20628
- if (this.value && this.input.value && !this.menu.value) {
20629
- if (this.behavior === 'suggestion' && this.menu.options && this.menu.options.some((opt) => opt.value === this.value)) {
20630
- this.setMenuValue(this.value);
20631
- }
20632
-
20570
+ if (this.input.value && this.menu.options && this.menu.options.some((opt) => opt.value === this.input.value)) {
20571
+ this.setMenuValue(this.input.value);
20633
20572
  this.syncValuesAndStates();
20634
20573
  }
20635
20574
 
20636
- // Re-activate when optionActive is no longer visible, or when _index has
20637
- // been reset (e.g. by clearSelection in an async update) so that
20638
- // makeSelection() can find the correct option.
20575
+ // Re-activate when optionActive is not in the current scrollable viewport,
20576
+ // or when _index has been reset (e.g. by clearSelection in an async update)
20577
+ // so that makeSelection() can find the correct option.
20639
20578
  if (!this.availableOptions.includes(this.menu.optionActive) || this.menu._index < 0) {
20640
20579
  this.activateFirstEnabledAvailableOption();
20641
20580
  }
@@ -20708,18 +20647,6 @@ class AuroCombobox extends AuroElement {
20708
20647
  this.dropdownOpen = ev.detail.expanded;
20709
20648
  this.updateMenuShapeSize();
20710
20649
 
20711
- // Defer aria-expanded "true" so VoiceOver finishes character echo
20712
- // before announcing "expanded". Set "false" immediately on close.
20713
- clearTimeout(this._expandedTimeout);
20714
- if (this.dropdownOpen) {
20715
- const expandedDelay = 150;
20716
- this._expandedTimeout = setTimeout(() => {
20717
- this.triggerExpandedState = true;
20718
- }, expandedDelay);
20719
- } else {
20720
- this.triggerExpandedState = false;
20721
- }
20722
-
20723
20650
  // Clear aria-activedescendant when dropdown closes
20724
20651
  if (!this.dropdownOpen && this.input) {
20725
20652
  this.input.setActiveDescendant(null);
@@ -20769,28 +20696,25 @@ class AuroCombobox extends AuroElement {
20769
20696
 
20770
20697
  guardTouchPassthrough(this.menu);
20771
20698
 
20772
- // The dialog's showModal() steals focus from the trigger.
20773
- // A single rAF is enough for the dialog DOM to be painted and
20774
- // focusable, then doubleRaf finalizes the transition.
20699
+ // showModal() takes focus away from the trigger. Early focus once
20700
+ // the dialog has painted; the shared doubleRaf below is the fallback
20701
+ // for when the dialog needs an extra frame and also clears the
20702
+ // validation guard.
20775
20703
  requestAnimationFrame(() => {
20776
20704
  this.setInputFocus();
20777
20705
  });
20778
-
20779
- doubleRaf(() => {
20780
- this.setInputFocus();
20781
- this._inFullscreenTransition = false;
20782
- });
20783
- } else {
20784
- // Desktop popover-open: restore the trigger caret to end-of-text.
20785
- // Clicking the trigger lands on auro-input's floating <label for="…">
20786
- // overlay; Chrome resets the native input's selection to [0, 0] on
20787
- // label-focus before any JS runs. setInputFocus()'s non-fullscreen
20788
- // branch parks the caret at end. doubleRaf lets the dropdown layout
20789
- // settle first, matching the fullscreen branch timing.
20790
- doubleRaf(() => {
20791
- this.setInputFocus();
20792
- });
20793
20706
  }
20707
+ // else (desktop popover-open): Chrome resets the trigger caret to
20708
+ // [0, 0] when its floating <label for="…"> overlay receives focus.
20709
+ // The shared doubleRaf below parks the caret back at end-of-text
20710
+ // after the dropdown layout settles.
20711
+
20712
+ doubleRaf(() => {
20713
+ this.setInputFocus();
20714
+ if (this._inFullscreenTransition) {
20715
+ this._inFullscreenTransition = false;
20716
+ }
20717
+ });
20794
20718
  }
20795
20719
  });
20796
20720
 
@@ -20827,7 +20751,7 @@ class AuroCombobox extends AuroElement {
20827
20751
  this.dropdown.trigger.inert = false;
20828
20752
  }
20829
20753
 
20830
- setTimeout(() => {
20754
+ this._scheduleTimer(() => {
20831
20755
  this.setInputFocus();
20832
20756
  }, 0);
20833
20757
  });
@@ -20971,7 +20895,7 @@ class AuroCombobox extends AuroElement {
20971
20895
 
20972
20896
  // racing condition on custom-combobox with custom-menu
20973
20897
  if (!this.menu) {
20974
- setTimeout(() => {
20898
+ this._scheduleTimer(() => {
20975
20899
  this.configureMenu();
20976
20900
  }, 0);
20977
20901
  return;
@@ -21001,7 +20925,7 @@ class AuroCombobox extends AuroElement {
21001
20925
  if (this.menu.optionSelected) {
21002
20926
  const selected = this.menu.optionSelected;
21003
20927
 
21004
- if (!this.optionSelected || this.optionSelected !== selected) {
20928
+ if (this.optionSelected !== selected) {
21005
20929
  this.optionSelected = selected;
21006
20930
  }
21007
20931
 
@@ -21014,7 +20938,7 @@ class AuroCombobox extends AuroElement {
21014
20938
  }
21015
20939
 
21016
20940
  // Update display
21017
- this.updateTriggerTextDisplay(getOptionLabel(this.optionSelected) || this.menu.value);
20941
+ this.updateTriggerTextDisplay(getOptionLabel(this.optionSelected));
21018
20942
 
21019
20943
  // Update match word for filtering
21020
20944
  const trimmedInput = normalizeFilterValue(this.input.value);
@@ -21026,17 +20950,24 @@ class AuroCombobox extends AuroElement {
21026
20950
  // Hide dropdown on selection (except during slot changes)
21027
20951
  if (evt.detail && evt.detail.source !== 'slotchange') {
21028
20952
  // do not close while typing in suggestion mode with no value selected, to allow freeform input
21029
- if (this.menu.value || this.behavior !== 'suggestion') {
21030
- this.hideBib();
20953
+ this.hideBib();
20954
+
20955
+ // Move focus to the clear button when the user makes a selection.
20956
+ if (!isEcho && this.menu.value !== undefined) {
20957
+ this.setClearBtnFocus();
21031
20958
  }
21032
20959
 
21033
20960
  // Announce the selection after the dropdown closes so it isn't
21034
20961
  // overridden by VoiceOver's "collapsed" announcement from aria-expanded.
20962
+ // Skip when there's no selected value (e.g. menu.clearSelection() from
20963
+ // the unmatched-value path), otherwise VoiceOver reads "undefined".
21035
20964
  const selectedValue = this.menu.value;
21036
- const announcementDelay = 300;
21037
- setTimeout(() => {
21038
- announceToScreenReader(this._getAnnouncementRoot(), `${selectedValue}, selected`);
21039
- }, announcementDelay);
20965
+ if (selectedValue) {
20966
+ const announcementDelay = 300;
20967
+ this._scheduleTimer(() => {
20968
+ announceToScreenReader(this._getAnnouncementRoot(), `${selectedValue}, selected`);
20969
+ }, announcementDelay);
20970
+ }
21040
20971
  }
21041
20972
 
21042
20973
  // Programmatic value syncs leave availableOptions stale because
@@ -21045,22 +20976,6 @@ class AuroCombobox extends AuroElement {
21045
20976
  // only — fresh user selections take the existing hideBib path.
21046
20977
  if (isEcho && this.menu.optionSelected) {
21047
20978
  this._programmaticFilterRefresh = true;
21048
- this.handleMenuOptions();
21049
- setTimeout(() => {
21050
- this._programmaticFilterRefresh = false;
21051
- }, 0);
21052
- }
21053
-
21054
- // base-input skips auto-validate when focus is inside its own shadow,
21055
- // which it is after setTriggerInputFocus — re-run so prior tooShort
21056
- // clears. processCreditCard reasserts errorMessage on every render.
21057
- if (!isEcho && this.menu.optionSelected && this.input.validate) {
21058
- this.input.updateComplete.then(() => {
21059
- this.input.validate(true);
21060
- if (this.input.validity === 'valid') {
21061
- this.input.errorMessage = '';
21062
- }
21063
- });
21064
20979
  }
21065
20980
  });
21066
20981
 
@@ -21073,6 +20988,14 @@ class AuroCombobox extends AuroElement {
21073
20988
  // stale option. Safe from re-entrancy because any resulting
21074
20989
  // input.value changes dispatch isProgrammatic events.
21075
20990
  this.menu.addEventListener('auroMenu-selectValueFailure', () => {
20991
+ // Announce the rejection BEFORE we clear `this.value` so the live
20992
+ // region carries the attempted value — without this the bib closes
20993
+ // silently and screen-reader users get no signal that their request
20994
+ // (e.g. a direct setMenuValue() call) was dropped.
20995
+ const attemptedValue = this.value;
20996
+ if (attemptedValue) {
20997
+ announceToScreenReader(this._getAnnouncementRoot(), `No matching option for ${attemptedValue}`);
20998
+ }
21076
20999
  this.value = undefined;
21077
21000
  this.optionSelected = undefined;
21078
21001
  });
@@ -21084,10 +21007,13 @@ class AuroCombobox extends AuroElement {
21084
21007
  this.input.setActiveDescendant(this.optionActive);
21085
21008
  }
21086
21009
 
21087
- // Announce the active option for screen readers including position,
21088
- // since shadow DOM boundaries prevent native reading of
21089
- // aria-setsize/aria-posinset via aria-activedescendant.
21090
- if (this.optionActive) {
21010
+ // In fullscreen mode the menu sits inside a nested <dialog> shadow root,
21011
+ // and aria-activedescendant references across that boundary are lost —
21012
+ // VoiceOver/NVDA don't read the active option natively, so we mirror it
21013
+ // into the polite live region. In popover mode aria-activedescendant on
21014
+ // the trigger input is read natively; double-announcing would flood the
21015
+ // queue on arrow-key repeat.
21016
+ if (this.optionActive && this.dropdown.isBibFullscreen) {
21091
21017
  const optionText = this.optionActive.textContent.trim();
21092
21018
  const selectedState = this.optionActive.hasAttribute('selected') ? ', selected' : ', not selected';
21093
21019
  const optionIndex = this.availableOptions.indexOf(this.optionActive) + 1;
@@ -21120,7 +21046,12 @@ class AuroCombobox extends AuroElement {
21120
21046
  * Validate every time we remove focus from the combo box.
21121
21047
  */
21122
21048
  this.addEventListener('focusout', () => {
21123
- if (!this.componentHasFocus && !this._inFullscreenTransition) {
21049
+ // Skip while the dropdown is open — focus transits out briefly on
21050
+ // mousedown of a menu option (popover top-layer breaks :focus-within),
21051
+ // and validating against the pre-selection value flashes a stale error
21052
+ // between mousedown and mouseup. The next focusout fires after the
21053
+ // dropdown closes and validates against the post-selection value.
21054
+ if (!this.componentHasFocus && !this._inFullscreenTransition && !this.dropdownOpen) {
21124
21055
  this.validate();
21125
21056
  }
21126
21057
  });
@@ -21183,49 +21114,40 @@ class AuroCombobox extends AuroElement {
21183
21114
  if (this._syncingDisplayValue) {
21184
21115
  return;
21185
21116
  }
21186
- this._syncingBibValue = true;
21187
- this.input.value = this.inputInBib.value;
21188
- this.input.updateComplete.then(() => {
21189
- this._syncingBibValue = false;
21190
- });
21191
-
21192
- // Run filtering inline — the re-entrant event won't reach this code.
21193
- this.menu.matchWord = normalizeFilterValue(this.inputInBib.value);
21194
- this.optionActive = null;
21195
21117
 
21196
- // In suggestion mode, keep the combobox value in sync with the typed
21197
- // text so that freeform values are captured (mirroring the non-fullscreen
21198
- // path). Clear the selection when the input is emptied.
21199
- if (this.behavior === 'suggestion') {
21200
- this.value = this.inputInBib.value || undefined;
21118
+ // Filtering runs via re-entrance: writing this.input.value below
21119
+ // dispatches an 'input' event that the trigger's listener routes to
21120
+ // handleTriggerInputValueChange, which refreshes the menu filter.
21121
+ if (this.input.value !== this.inputInBib.value) {
21122
+ this._syncingBibValue = true;
21123
+ this.input.value = this.inputInBib.value;
21124
+ this.input.updateComplete.then(() => {
21125
+ this._syncingBibValue = false;
21126
+ });
21201
21127
  }
21202
21128
 
21203
- this.handleMenuOptions();
21204
21129
  this.dispatchEvent(new CustomEvent('inputValue', { detail: { value: this.inputValue } }));
21205
- return;
21130
+ } else if (event.target === this.input) {
21131
+
21132
+ // Also sync the native input immediately so keystrokes arriving
21133
+ // before Lit's async update cycle (e.g. rapid Backspaces during a
21134
+ // fullscreen transition) operate on the correct content.
21135
+ // Skip the next programmatic input event to prevent the patched setter
21136
+ // from re-entering handleInputValueChange via the bib path.
21137
+ const bibNativeInput = this.inputInBib.inputElement;
21138
+ if (bibNativeInput && bibNativeInput.value !== this.input.value) {
21139
+ this.inputInBib.skipNextProgrammaticInputEvent = true;
21140
+ bibNativeInput.value = this.input.value || '';
21141
+ }
21206
21142
  }
21207
21143
 
21144
+ this.value = this.input.value;
21145
+
21208
21146
  // Ignore re-entrant input events caused by programmatic value sets.
21209
21147
  if (this._syncingBibValue || this._syncingDisplayValue) {
21210
21148
  return;
21211
21149
  }
21212
21150
 
21213
- this.inputInBib.value = this.input.value;
21214
-
21215
- // Also sync the native input immediately so keystrokes arriving
21216
- // before Lit's async update cycle (e.g. rapid Backspaces during a
21217
- // fullscreen transition) operate on the correct content.
21218
- // Skip the next programmatic input event to prevent the patched setter
21219
- // from re-entering handleInputValueChange via the bib path.
21220
- const bibNativeInput = this.inputInBib.inputElement;
21221
- if (bibNativeInput && bibNativeInput.value !== this.input.value) {
21222
- this.inputInBib.skipNextProgrammaticInputEvent = true;
21223
- bibNativeInput.value = this.input.value || '';
21224
- }
21225
-
21226
- this.menu.matchWord = normalizeFilterValue(this.input.value);
21227
- this.optionActive = null;
21228
-
21229
21151
  if (this.behavior === 'suggestion') {
21230
21152
  this.value = this.input.value;
21231
21153
  }
@@ -21233,7 +21155,6 @@ class AuroCombobox extends AuroElement {
21233
21155
  if (!this.input.value && !this._clearing) {
21234
21156
  this.clear();
21235
21157
  }
21236
- this.handleMenuOptions();
21237
21158
 
21238
21159
  // Validate only if the value was set programmatically (not during user
21239
21160
  // interaction). In fullscreen dialog mode, componentHasFocus returns false
@@ -21243,34 +21164,44 @@ class AuroCombobox extends AuroElement {
21243
21164
  this.validate();
21244
21165
  }
21245
21166
 
21246
- if (this.input.value && this.input.value.length === 0) {
21247
- // Hide menu if value is empty, otherwise show if there are available suggestions
21248
- this.hideBib();
21249
- } else if (this.menu.loading) {
21250
- // if input has value but menu is loading, show bib immediately
21251
- this.showBib();
21252
- } else if (this.availableOptions.length === 0 && !this.dropdown.isBibFullscreen) {
21253
- // Force dropdown bib to hide if input value has no matching suggestions
21254
- this.hideBib();
21167
+ this.dispatchEvent(new CustomEvent('inputValue', { detail: { value: this.inputValue } }));
21168
+ }
21169
+
21170
+ /**
21171
+ * Handles input value changes originating from the trigger input.
21172
+ * Refreshes menu options and filtering, delegates to handleInputValueChange
21173
+ * for value synchronization, and manages fullscreen bib focus.
21174
+ * @private
21175
+ * @param {Event} event - The input event from the trigger input element.
21176
+ * @returns {void}
21177
+ */
21178
+ handleTriggerInputValueChange(event) {
21179
+ // 'input' fires for every user-initiated value change — typing, paste,
21180
+ // IME composition end, dead-key composition, drag-drop. Flip _userTyped
21181
+ // here so updated('availableOptions') auto-opens the bib for sources
21182
+ // that keydown alone misses: paste fires no keydown, IME uses
21183
+ // key='Process', and dead keys produce multi-char keys (all bypass the
21184
+ // prior keydown.key.length===1 gate). Skip programmatic syncs.
21185
+ if (!this._syncingDisplayValue && !this._syncingBibValue && !this._programmaticFilterRefresh) {
21186
+ this._userTyped = true;
21255
21187
  }
21256
21188
 
21257
- // iOS virtual keyboard retention: when in fullscreen mode, ensure the
21258
- // dialog opens and the bib input is focused synchronously within the
21259
- // input event (user gesture) chain. Without this, Lit's async update
21260
- // cycle delays showModal() past the user activation window, causing
21261
- // iOS Safari to dismiss the virtual keyboard when the fullscreen
21262
- // dialog opens — the user then has to tap the input again to resume
21263
- // typing.
21264
- if (this.dropdown.isBibFullscreen && this.input.value && this.input.value.length > 0) {
21265
- if (!this.dropdown.isPopoverVisible) {
21266
- this.showBib();
21267
- }
21268
- if (this.dropdown.isPopoverVisible) {
21269
- this.setInputFocus();
21270
- }
21189
+ this.handleMenuOptions();
21190
+ this.optionActive = null;
21191
+
21192
+ if (this.value === this.input.value) {
21193
+ return;
21271
21194
  }
21272
21195
 
21273
- this.dispatchEvent(new CustomEvent('inputValue', { detail: { value: this.inputValue } }));
21196
+ this.handleInputValueChange(event);
21197
+
21198
+ if (this.dropdown.isBibFullscreen && this.input.value && this.input.value.length > 0 && this.dropdown.isPopoverVisible) {
21199
+ this.setInputFocus();
21200
+ }
21201
+
21202
+ if (this._programmaticFilterRefresh) {
21203
+ this._programmaticFilterRefresh = false;
21204
+ }
21274
21205
  }
21275
21206
 
21276
21207
  /**
@@ -21338,6 +21269,11 @@ class AuroCombobox extends AuroElement {
21338
21269
  disconnectedCallback() {
21339
21270
  super.disconnectedCallback();
21340
21271
  this._inFullscreenTransition = false;
21272
+ // Cancel any outstanding timers so detached callbacks don't fire on
21273
+ // disposed DOM — most are no-ops, but configureMenu's racing-condition
21274
+ // retry would otherwise keep rescheduling itself indefinitely.
21275
+ this._pendingTimers.forEach((id) => clearTimeout(id));
21276
+ this._pendingTimers.clear();
21341
21277
  }
21342
21278
 
21343
21279
  firstUpdated() {
@@ -21379,7 +21315,7 @@ class AuroCombobox extends AuroElement {
21379
21315
  this.menu.value = value;
21380
21316
  // Backup clear: if menu.value === menu.optionSelected.value already, the
21381
21317
  // listener won't fire and the flag would swallow the next user click.
21382
- setTimeout(() => {
21318
+ this._scheduleTimer(() => {
21383
21319
  this._pendingMenuValueSync = false;
21384
21320
  }, 0);
21385
21321
  }
@@ -21396,15 +21332,7 @@ class AuroCombobox extends AuroElement {
21396
21332
  this.menu.value = undefined;
21397
21333
  this.validation.reset(this);
21398
21334
  this.touched = false;
21399
- // Force validity back to the cleared state. validation.reset() calls
21400
- // validate() at the end, and (post-credit-card-fix) the trigger input's
21401
- // residual validity may still be copied into the combobox by the
21402
- // auroInputElements loop. Explicitly clear here so reset() actually
21403
- // leaves the component in a "no validity" state.
21404
21335
  this.validity = undefined;
21405
- this.errorMessage = '';
21406
- this.input.validity = undefined;
21407
- this.input.errorMessage = '';
21408
21336
  }
21409
21337
 
21410
21338
  /**
@@ -21422,6 +21350,17 @@ class AuroCombobox extends AuroElement {
21422
21350
  this.optionSelected = undefined;
21423
21351
  this.value = undefined;
21424
21352
 
21353
+ // Clear the appended displayValue clone in the trigger if present.
21354
+ // :not(slot) excludes the template's <slot name="displayValue"
21355
+ // slot="displayValue"> forwarder (line 1816), which also has
21356
+ // slot="displayValue" and would otherwise be matched first and removed,
21357
+ // permanently breaking the consumer-provided displayValue slot.
21358
+ const displayValueInTrigger = this.input.querySelector('[slot="displayValue"]:not(slot)');
21359
+
21360
+ if (displayValueInTrigger) {
21361
+ displayValueInTrigger.remove();
21362
+ }
21363
+
21425
21364
  if (this.input.value) {
21426
21365
  this.input.clear();
21427
21366
  }
@@ -21445,81 +21384,50 @@ class AuroCombobox extends AuroElement {
21445
21384
  }
21446
21385
 
21447
21386
  updated(changedProperties) {
21448
- // After the component is ready, send direct value changes to auro-menu.
21387
+ // After the component is ready, propagate direct changes down to child components.
21449
21388
  if (changedProperties.has('value')) {
21450
- if (this.value && this.value.length > 0) {
21451
- this.hasValue = true;
21452
- } else {
21453
- this.hasValue = false;
21389
+ // Only flag programmatic refreshes — user-typed value changes must not
21390
+ // suppress the availableOptions branch's showBib(). Firefox batches
21391
+ // 'value' and 'availableOptions' into the same updated() call, so
21392
+ // setting the flag unconditionally here masks the user-typed open path.
21393
+ if (!this._userTyped) {
21394
+ this._programmaticFilterRefresh = true;
21454
21395
  }
21455
21396
 
21456
- if (this.hasValue && !this.input.value && (!this.menu.options || this.menu.options.length === 0)) {
21457
- this.input.value = this.value;
21458
- }
21397
+ if (this.input.value !== this.value) {
21398
+ // Clear menu.value AND menu.optionSelected together. Clearing only
21399
+ // menu.value leaves the previously-selected option element pinned
21400
+ // as menu.optionSelected; a later auroMenu-selectedOption event
21401
+ // would then write its stale .value back into combobox.value
21402
+ // (e.g. Tab-after-Backspace re-selecting the prior option).
21403
+ if (this.menu.value || this.menu.optionSelected) {
21404
+ this.menu.clearSelection();
21405
+ }
21459
21406
 
21460
- // Sync menu.value only when an option actually matches; otherwise clear it.
21461
- if (this.menu.options && this.menu.options.length > 0) {
21462
- if (this.menu.options.some((opt) => opt.value === this.value)) {
21463
- this.setMenuValue(this.value);
21464
- } else if (this.behavior === 'filter') {
21465
- // In filter mode, freeform values aren't allowed. Push the unmatched
21466
- // value through setMenuValue so menu dispatches auroMenu-selectValueFailure
21467
- // and the listener at line 1206 clears combobox.value (mirrors select's
21468
- // pattern). Bypassing setMenuValue here would skip the failure cascade.
21469
- this.setMenuValue(this.value);
21470
- } else {
21471
- if (this.menu.value) {
21472
- this.menu.value = undefined;
21473
- }
21474
- // Sync the display for programmatic freeform value changes (e.g. the
21475
- // swap-values pattern). Guard with _syncingDisplayValue so that the
21476
- // re-entrant input event from base-input.notifyValueChanged() is
21477
- // ignored by handleInputValueChange. Skip the sync when input already
21478
- // matches to avoid spurious events during the normal typing path.
21479
- const nextValue = this.value || '';
21480
- const triggerNeedsSync = this.input.value !== nextValue;
21481
- const bibNeedsSync = Boolean(this.inputInBib && this.inputInBib !== this.input && this.inputInBib.value !== nextValue);
21482
- if (triggerNeedsSync || bibNeedsSync) {
21483
- this._syncingDisplayValue = true;
21484
- if (triggerNeedsSync) {
21485
- this.input.value = nextValue;
21486
- }
21487
- if (bibNeedsSync) {
21488
- this.inputInBib.value = nextValue;
21489
- }
21490
- const pending = [];
21491
- if (triggerNeedsSync) {
21492
- pending.push(this.input.updateComplete);
21493
- }
21494
- if (bibNeedsSync) {
21495
- pending.push(this.inputInBib.updateComplete);
21496
- }
21497
- Promise.all(pending).then(() => {
21498
- if (triggerNeedsSync && this.input.maskInstance && typeof this.input.maskInstance.updateValue === 'function') {
21499
- this.input.maskInstance.updateValue();
21500
- }
21501
- if (bibNeedsSync && this.inputInBib && this.inputInBib.maskInstance && typeof this.inputInBib.maskInstance.updateValue === 'function') {
21502
- this.inputInBib.maskInstance.updateValue();
21503
- }
21504
- this._syncingDisplayValue = false;
21505
- // handleInputValueChange bailed on the flag — refresh the filter.
21506
- this._programmaticFilterRefresh = true;
21507
- this.handleMenuOptions();
21508
- setTimeout(() => {
21509
- this._programmaticFilterRefresh = false;
21510
- }, 0);
21511
- });
21512
- }
21407
+ if (!this.persistInput) {
21408
+ this.syncInputValuesAcrossTriggerAndBib(this.value || '');
21409
+ }
21410
+
21411
+ // Programmatic value with no matching option: updateFilter will close
21412
+ // the bib silently (see line 648 no noMatchOption + 0 results
21413
+ // hides). Announce so screen-reader users hear the request was
21414
+ // dropped. Gated on `input.value !== this.value` so this never fires
21415
+ // for user typing that path always reconciles input.value to
21416
+ // this.value before updated() runs.
21417
+ if (
21418
+ this.value &&
21419
+ this.menu &&
21420
+ this.menu.options &&
21421
+ this.menu.options.length > 0 &&
21422
+ !this.menu.options.some((opt) => opt.value === this.value)
21423
+ ) {
21424
+ announceToScreenReader(this._getAnnouncementRoot(), `No matching option for ${this.value}`);
21513
21425
  }
21514
21426
  }
21427
+
21515
21428
  if (!this.value) {
21516
21429
  this.clear();
21517
21430
  }
21518
- if (this.value && !this.componentHasFocus) {
21519
- // If the value got set programmatically make sure we hide the bib
21520
- // when input is not taking the focus (input can be in dropdown.trigger or in bibtemplate)
21521
- this.hideBib();
21522
- }
21523
21431
 
21524
21432
  // Sync the input and match word, but don't directly set menu.value again
21525
21433
  if (this.menu) {
@@ -21532,7 +21440,7 @@ class AuroCombobox extends AuroElement {
21532
21440
  composed: true,
21533
21441
  detail: {
21534
21442
  optionSelected: this.menu.optionSelected,
21535
- value: this.menu.value
21443
+ value: this.value
21536
21444
  }
21537
21445
  }));
21538
21446
 
@@ -21555,16 +21463,28 @@ class AuroCombobox extends AuroElement {
21555
21463
  // from a programmatic filter refresh after a value swap — the user
21556
21464
  // didn't interact, so we shouldn't auto-open the bib (especially for
21557
21465
  // the no-match path where the existing condition unconditionally fires).
21558
- if (this._programmaticFilterRefresh) {
21559
- this._programmaticFilterRefresh = false;
21560
- } else if ((this.availableOptions.length > 0 && (this.componentHasFocus || this.dropdownOpen)) || (this.menu && this.menu.loading) || (this.availableOptions.length === 0 && this.noMatchOption)) {
21561
- this.showBib();
21466
+ if ((this.menu && !this._programmaticFilterRefresh)) {
21467
+ if (
21468
+ this.availableOptions.length > 0 ||
21469
+ this.menu.loading ||
21470
+ this.noMatchOption
21471
+ ) {
21472
+ if (this._userTyped && !this.dropdownOpen) {
21473
+ this.showBib();
21474
+ }
21475
+ this._userTyped = false;
21476
+ }
21477
+
21562
21478
  if (!this.availableOptions.includes(this.menu.optionActive)) {
21563
21479
  this.activateFirstEnabledAvailableOption();
21564
21480
  }
21565
- } else if (this.dropdown && this.dropdown.isPopoverVisible) {
21481
+ } else if (!this.dropdown.isBibFullscreen) {
21566
21482
  this.hideBib();
21567
21483
  }
21484
+
21485
+ if (this._programmaticFilterRefresh) {
21486
+ this._programmaticFilterRefresh = false;
21487
+ }
21568
21488
  }
21569
21489
 
21570
21490
  if (changedProperties.has('error')) {
@@ -21706,10 +21626,10 @@ class AuroCombobox extends AuroElement {
21706
21626
  shape="${this.shape}"
21707
21627
  size="${this.size}">
21708
21628
  <${this.inputTag}
21709
- @input="${this.handleInputValueChange}"
21629
+ @input="${this.handleTriggerInputValueChange}"
21710
21630
  appearance="${this.onDark ? 'inverse' : this.appearance}"
21711
21631
  .a11yActivedescendant="${this.dropdownOpen && this.optionActive ? this.optionActive.id : undefined}"
21712
- .a11yExpanded="${this.triggerExpandedState}"
21632
+ .a11yExpanded="${this.dropdownOpen}"
21713
21633
  .a11yControls="${this.dropdownId}"
21714
21634
  .autocomplete="${this.autocomplete}"
21715
21635
  .inputmode="${this.inputmode}"