@aurodesignsystem-dev/auro-formkit 0.0.0-pr1505.0 → 0.0.0-pr1506.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/components/checkbox/demo/customize.min.js +1 -1
  2. package/components/checkbox/demo/getting-started.min.js +1 -1
  3. package/components/checkbox/demo/index.min.js +1 -1
  4. package/components/checkbox/dist/index.js +1 -1
  5. package/components/checkbox/dist/registered.js +1 -1
  6. package/components/combobox/demo/customize.min.js +138 -266
  7. package/components/combobox/demo/getting-started.min.js +138 -266
  8. package/components/combobox/demo/index.min.js +138 -266
  9. package/components/combobox/dist/auro-combobox.d.ts +9 -0
  10. package/components/combobox/dist/index.js +138 -266
  11. package/components/combobox/dist/registered.js +138 -266
  12. package/components/counter/demo/customize.min.js +2 -2
  13. package/components/counter/demo/index.min.js +2 -2
  14. package/components/counter/dist/index.js +2 -2
  15. package/components/counter/dist/registered.js +2 -2
  16. package/components/datepicker/demo/api.md +0 -2
  17. package/components/datepicker/demo/customize.md +33 -195
  18. package/components/datepicker/demo/customize.min.js +41 -164
  19. package/components/datepicker/demo/index.min.js +40 -156
  20. package/components/datepicker/dist/index.js +40 -156
  21. package/components/datepicker/dist/registered.js +40 -156
  22. package/components/datepicker/dist/src/auro-datepicker.d.ts +0 -2
  23. package/components/dropdown/demo/customize.min.js +1 -1
  24. package/components/dropdown/demo/getting-started.min.js +1 -1
  25. package/components/dropdown/demo/index.min.js +1 -1
  26. package/components/dropdown/dist/index.js +1 -1
  27. package/components/dropdown/dist/registered.js +1 -1
  28. package/components/form/demo/customize.min.js +351 -599
  29. package/components/form/demo/getting-started.min.js +351 -599
  30. package/components/form/demo/index.min.js +351 -599
  31. package/components/form/demo/registerDemoDeps.min.js +351 -599
  32. package/components/input/demo/customize.md +55 -56
  33. package/components/input/demo/customize.min.js +36 -147
  34. package/components/input/demo/getting-started.min.js +36 -147
  35. package/components/input/demo/index.md +2 -2
  36. package/components/input/demo/index.min.js +36 -147
  37. package/components/input/dist/base-input.d.ts +0 -48
  38. package/components/input/dist/index.js +36 -147
  39. package/components/input/dist/registered.js +36 -147
  40. package/components/radio/demo/customize.min.js +1 -1
  41. package/components/radio/demo/getting-started.min.js +1 -1
  42. package/components/radio/demo/index.min.js +1 -1
  43. package/components/radio/dist/index.js +1 -1
  44. package/components/radio/dist/registered.js +1 -1
  45. package/components/select/demo/api.md +1 -0
  46. package/components/select/demo/customize.md +71 -0
  47. package/components/select/demo/customize.min.js +133 -26
  48. package/components/select/demo/getting-started.min.js +133 -26
  49. package/components/select/demo/index.min.js +133 -26
  50. package/components/select/demo/keyboard-behavior.md +18 -0
  51. package/components/select/dist/auro-select.d.ts +38 -2
  52. package/components/select/dist/index.js +133 -26
  53. package/components/select/dist/registered.js +133 -26
  54. package/components/select/dist/selectUtils.d.ts +12 -0
  55. package/custom-elements.json +114 -274
  56. package/package.json +1 -1
@@ -924,6 +924,21 @@ function getEnabledOptions(menu) {
924
924
  return (menu?.options || []).filter((option) => !option.disabled);
925
925
  }
926
926
 
927
+ /**
928
+ * Returns the active (selectable + visible) options for type-ahead navigation.
929
+ *
930
+ * Uses auro-menuoption's `isActive` getter, which excludes disabled, hidden,
931
+ * and static options (e.g. `static nomatch` placeholders) so the type-ahead
932
+ * cursor never lands on a non-actionable item. Same empty-safe handling as
933
+ * `getEnabledOptions`.
934
+ *
935
+ * @param {HTMLElement | null | undefined} menu - The auro-menu element.
936
+ * @returns {Array<HTMLElement>} Active options, empty array when none.
937
+ */
938
+ function getActiveOptions(menu) {
939
+ return (menu?.options || []).filter((option) => option.isActive);
940
+ }
941
+
927
942
  /* eslint-disable new-cap */
928
943
 
929
944
  const selectKeyboardStrategy = {
@@ -956,6 +971,14 @@ const selectKeyboardStrategy = {
956
971
  },
957
972
 
958
973
  Escape(component, evt, ctx) {
974
+ // Always clear the type-ahead buffer — Escape is a universal cancel.
975
+ // Safe to call when the buffer is empty.
976
+ // eslint-disable-next-line no-underscore-dangle
977
+ if (typeof component._clearTypeaheadBuffer === 'function') {
978
+ // eslint-disable-next-line no-underscore-dangle
979
+ component._clearTypeaheadBuffer();
980
+ }
981
+
959
982
  if (!ctx.isExpanded) {
960
983
  return;
961
984
  }
@@ -1015,16 +1038,25 @@ const selectKeyboardStrategy = {
1015
1038
  },
1016
1039
 
1017
1040
  default(component, evt, ctx) {
1018
- component.updateActiveOptionBasedOnKey(evt.key);
1041
+ // Space resolves to either typeahead-buffer extension or bib toggle
1042
+ // depending on whether a type-ahead buffer is active. Mirrors native
1043
+ // <select> and the WAI-ARIA APG Listbox guidance: mid-typeahead space
1044
+ // is a search character (e.g. "San Francisco"); otherwise it toggles.
1019
1045
  if (evt.key === ' ') {
1020
1046
  evt.preventDefault();
1021
1047
  evt.stopPropagation();
1048
+ if (component.typeaheadBuffer && component.typeaheadBuffer.length > 0) {
1049
+ component.updateActiveOptionBasedOnKey(evt.key);
1050
+ return;
1051
+ }
1022
1052
  if (ctx.isExpanded) {
1023
1053
  component.dropdown.hide();
1024
- return;
1054
+ } else {
1055
+ component.dropdown.show();
1025
1056
  }
1026
- component.dropdown.show();
1057
+ return;
1027
1058
  }
1059
+ component.updateActiveOptionBasedOnKey(evt.key);
1028
1060
  },
1029
1061
  };
1030
1062
 
@@ -4960,7 +4992,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
4960
4992
  }
4961
4993
  };
4962
4994
 
4963
- var formkitVersion$1 = '202606171946';
4995
+ var formkitVersion$1 = '202606192004';
4964
4996
 
4965
4997
  class AuroElement extends i$2 {
4966
4998
  static get properties() {
@@ -6973,7 +7005,7 @@ class AuroHelpText extends i$2 {
6973
7005
  }
6974
7006
  }
6975
7007
 
6976
- var formkitVersion = '202606171946';
7008
+ var formkitVersion = '202606192004';
6977
7009
 
6978
7010
  var styleCss$2 = i$5`.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}[auro-dropdown]{--ds-auro-dropdown-trigger-border-color: var(--ds-auro-select-border-color);--ds-auro-dropdown-trigger-background-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-container-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-outline-color: var(--ds-auro-select-outline-color)}:host{display:inline-block;text-align:left;vertical-align:top}:host([layout*=emphasized]) [auro-dropdown],:host([layout*=snowflake]) [auro-dropdown]{--ds-auro-select-border-color: transparent}:host([layout*=emphasized]) .mainContent,:host([layout*=snowflake]) .mainContent{text-align:center}.mainContent{position:relative;display:flex;overflow:hidden;flex:1;flex-direction:column;align-items:center;justify-content:center}.valueContainer [slot=displayValue]{display:none}.accents{display:flex;flex-direction:row;align-items:center;justify-content:center}::slotted([slot=typeIcon]){margin-right:var(--ds-size-100, 0.5rem)}.displayValue{display:block}.displayValue:not(.force){display:none}.displayValue:not(.force).hasContent:is(.withValue):not(.hasFocus){display:block}.triggerContent{display:flex;width:100%;align-items:center;justify-content:center}:host([layout*=emphasized]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-300, 1.5rem)}:host([layout*=snowflake]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-200, 1rem)}:host([layout*=snowflake]) label{padding-block:var(--ds-size-25, 0.125rem)}:host([layout*=classic]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem)}:host([layout*=classic]) .mainContent{align-items:start}:host([layout*=classic]) label{overflow:hidden;cursor:text;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) .value{height:auto}label{color:var(--ds-auro-select-label-text-color)}:host(:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-select-outline-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]:is([validity]:not([validity=valid]))) [auro-dropdown],:host([appearance=inverse]:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-select-outline-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}#slotHolder{display:none}:host([fluid]){width:100%}:host([disabled]){pointer-events:none;user-select:none}:host([disabled]:not([ondark])) [auro-dropdown],:host([disabled]:not([appearance=inverse])) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([layout*=classic])[disabled][ondark]) [auro-dropdown],:host(:not([layout*=classic])[disabled][appearance=inverse]) [auro-dropdown]{--ds-auro-select-border-color: transparent}`;
6979
7011
 
@@ -7078,6 +7110,16 @@ class AuroSelect extends AuroElement$1 {
7078
7110
  * @private
7079
7111
  */
7080
7112
  this.hasDisplayValueContent = false;
7113
+
7114
+ /**
7115
+ * @private
7116
+ */
7117
+ this.typeaheadBuffer = '';
7118
+
7119
+ /**
7120
+ * @private
7121
+ */
7122
+ this._typeaheadTimeout = null;
7081
7123
  }
7082
7124
 
7083
7125
  /**
@@ -7090,6 +7132,7 @@ class AuroSelect extends AuroElement$1 {
7090
7132
  this.fullscreenBreakpoint = 'sm';
7091
7133
  this.onDark = false;
7092
7134
  this.isPopoverVisible = false;
7135
+ this.typeaheadTimeoutMs = 500;
7093
7136
 
7094
7137
  // Layout Config
7095
7138
  this.layout = 'classic';
@@ -7393,6 +7436,16 @@ class AuroSelect extends AuroElement$1 {
7393
7436
  attribute: false
7394
7437
  },
7395
7438
 
7439
+ /**
7440
+ * Milliseconds of keyboard inactivity before the type-ahead buffer resets.
7441
+ * Increase for users who type slowly.
7442
+ * @default 500
7443
+ */
7444
+ typeaheadTimeoutMs: {
7445
+ type: Number,
7446
+ reflect: true
7447
+ },
7448
+
7396
7449
  /**
7397
7450
  * Specifies the `validityState` this element is in.
7398
7451
  */
@@ -7832,6 +7885,7 @@ class AuroSelect extends AuroElement$1 {
7832
7885
  this.addEventListener('blur', () => {
7833
7886
  this.validate();
7834
7887
  this.hasFocus = false;
7888
+ this._clearTypeaheadBuffer();
7835
7889
  });
7836
7890
  }
7837
7891
 
@@ -7845,41 +7899,89 @@ class AuroSelect extends AuroElement$1 {
7845
7899
  }
7846
7900
  }
7847
7901
 
7902
+ /**
7903
+ * Returns the lowercase, trimmed text content of a menu option.
7904
+ * @private
7905
+ * @param {HTMLElement} option - The menu option element.
7906
+ * @returns {string}
7907
+ */
7908
+ _getOptionDisplayText(option) {
7909
+ return (option.textContent || '').trim().toLowerCase();
7910
+ }
7911
+
7912
+ /**
7913
+ * Empties the type-ahead buffer and cancels any pending reset timeout.
7914
+ * Called when focus leaves the component, when Escape closes the bib, and on disconnect
7915
+ * so a stale buffer never bridges into a fresh interaction.
7916
+ * @private
7917
+ */
7918
+ _clearTypeaheadBuffer() {
7919
+ if (this._typeaheadTimeout) {
7920
+ clearTimeout(this._typeaheadTimeout);
7921
+ this._typeaheadTimeout = null;
7922
+ }
7923
+ this.typeaheadBuffer = '';
7924
+ }
7925
+
7848
7926
  /**
7849
7927
  * Updates the active option in the menu based on keyboard input.
7928
+ *
7929
+ * Implements the WAI-ARIA APG Listbox type-ahead pattern: accumulates printable
7930
+ * keystrokes into a buffer that resets after `typeaheadTimeoutMs` of inactivity.
7931
+ * A multi-character buffer matches the first option whose displayed text starts
7932
+ * with the buffer; repeating a single character cycles through options that start
7933
+ * with that character.
7850
7934
  * @private
7851
7935
  * @param {string} _key - The key pressed by the user.
7852
7936
  * @returns {void}
7853
7937
  */
7854
7938
  updateActiveOptionBasedOnKey(_key) {
7939
+ // Ignore non-printable keys (Shift, ArrowDown, Tab, etc.)
7940
+ if (typeof _key !== 'string' || _key.length !== 1) {
7941
+ return;
7942
+ }
7855
7943
 
7856
- // Get a lowercase version of the key pressed
7857
- const key = _key.toLowerCase();
7858
-
7859
- // Calculate how many times the same letter has been pressed
7860
- this.sameLetterTimes = key === this.lastLetter ? this.sameLetterTimes + 1 : 0;
7944
+ // No selectable options to match against clear any stale buffer/timer so
7945
+ // Space stays a bib toggle and the next keystroke after fresh options load
7946
+ // starts cleanly. `getActiveOptions` excludes disabled, hidden, and static
7947
+ // options (e.g. `static nomatch` placeholders). Checked BEFORE mutating
7948
+ // the buffer.
7949
+ const options = getActiveOptions(this.menu);
7950
+ if (!options.length) {
7951
+ this._clearTypeaheadBuffer();
7952
+ return;
7953
+ }
7861
7954
 
7862
- // Set last letter for tracking
7863
- this.lastLetter = key;
7955
+ const key = _key.toLowerCase();
7864
7956
 
7865
- // Get all the options that start with the last letter pressed
7866
- const letterOptions = this.menu.options.filter((option) => {
7867
- const optionText = option.value || '';
7868
- return optionText.toLowerCase().startsWith(this.lastLetter);
7869
- });
7957
+ // Reset the buffer after a period of inactivity
7958
+ if (this._typeaheadTimeout) {
7959
+ clearTimeout(this._typeaheadTimeout);
7960
+ }
7961
+ this._typeaheadTimeout = setTimeout(() => {
7962
+ this._clearTypeaheadBuffer();
7963
+ }, this.typeaheadTimeoutMs);
7870
7964
 
7871
- // If we have options that match the letter pressed
7872
- if (letterOptions.length) {
7965
+ this.typeaheadBuffer += key;
7873
7966
 
7874
- // Show the dropdown if it is not already visible
7875
- this.dropdown.show();
7967
+ const isRepeatedChar = this.typeaheadBuffer.length > 1 && new Set(this.typeaheadBuffer).size === 1;
7876
7968
 
7877
- // Get the index we're after based on how many times the letter has been pressed and the length of the letterOptions array
7878
- const index = this.sameLetterTimes < letterOptions.length ? this.sameLetterTimes : this.sameLetterTimes % letterOptions.length;
7969
+ let match = null;
7970
+ if (isRepeatedChar) {
7971
+ const matches = options.filter((option) => this._getOptionDisplayText(option).startsWith(key));
7972
+ if (matches.length) {
7973
+ const cycleIndex = (this.typeaheadBuffer.length - 1) % matches.length;
7974
+ match = matches[cycleIndex];
7975
+ }
7976
+ } else {
7977
+ match = options.find((option) => this._getOptionDisplayText(option).startsWith(this.typeaheadBuffer));
7978
+ }
7879
7979
 
7880
- // Select the new option in the menu
7881
- const newOption = letterOptions[index];
7882
- this.menu.updateActiveOption(newOption);
7980
+ if (match) {
7981
+ if (!this.dropdown.isPopoverVisible) {
7982
+ this.dropdown.show();
7983
+ }
7984
+ this.menu.updateActiveOption(match);
7883
7985
  }
7884
7986
  }
7885
7987
 
@@ -7993,6 +8095,11 @@ class AuroSelect extends AuroElement$1 {
7993
8095
  }
7994
8096
  }
7995
8097
 
8098
+ disconnectedCallback() {
8099
+ super.disconnectedCallback();
8100
+ this._clearTypeaheadBuffer();
8101
+ }
8102
+
7996
8103
  // lifecycle runs only after the element's DOM has been updated the first time
7997
8104
  firstUpdated() {
7998
8105
  // Add the tag name as an attribute if it is different than the component name
@@ -893,6 +893,21 @@ function getEnabledOptions(menu) {
893
893
  return (menu?.options || []).filter((option) => !option.disabled);
894
894
  }
895
895
 
896
+ /**
897
+ * Returns the active (selectable + visible) options for type-ahead navigation.
898
+ *
899
+ * Uses auro-menuoption's `isActive` getter, which excludes disabled, hidden,
900
+ * and static options (e.g. `static nomatch` placeholders) so the type-ahead
901
+ * cursor never lands on a non-actionable item. Same empty-safe handling as
902
+ * `getEnabledOptions`.
903
+ *
904
+ * @param {HTMLElement | null | undefined} menu - The auro-menu element.
905
+ * @returns {Array<HTMLElement>} Active options, empty array when none.
906
+ */
907
+ function getActiveOptions(menu) {
908
+ return (menu?.options || []).filter((option) => option.isActive);
909
+ }
910
+
896
911
  /* eslint-disable new-cap */
897
912
 
898
913
  const selectKeyboardStrategy = {
@@ -925,6 +940,14 @@ const selectKeyboardStrategy = {
925
940
  },
926
941
 
927
942
  Escape(component, evt, ctx) {
943
+ // Always clear the type-ahead buffer — Escape is a universal cancel.
944
+ // Safe to call when the buffer is empty.
945
+ // eslint-disable-next-line no-underscore-dangle
946
+ if (typeof component._clearTypeaheadBuffer === 'function') {
947
+ // eslint-disable-next-line no-underscore-dangle
948
+ component._clearTypeaheadBuffer();
949
+ }
950
+
928
951
  if (!ctx.isExpanded) {
929
952
  return;
930
953
  }
@@ -984,16 +1007,25 @@ const selectKeyboardStrategy = {
984
1007
  },
985
1008
 
986
1009
  default(component, evt, ctx) {
987
- component.updateActiveOptionBasedOnKey(evt.key);
1010
+ // Space resolves to either typeahead-buffer extension or bib toggle
1011
+ // depending on whether a type-ahead buffer is active. Mirrors native
1012
+ // <select> and the WAI-ARIA APG Listbox guidance: mid-typeahead space
1013
+ // is a search character (e.g. "San Francisco"); otherwise it toggles.
988
1014
  if (evt.key === ' ') {
989
1015
  evt.preventDefault();
990
1016
  evt.stopPropagation();
1017
+ if (component.typeaheadBuffer && component.typeaheadBuffer.length > 0) {
1018
+ component.updateActiveOptionBasedOnKey(evt.key);
1019
+ return;
1020
+ }
991
1021
  if (ctx.isExpanded) {
992
1022
  component.dropdown.hide();
993
- return;
1023
+ } else {
1024
+ component.dropdown.show();
994
1025
  }
995
- component.dropdown.show();
1026
+ return;
996
1027
  }
1028
+ component.updateActiveOptionBasedOnKey(evt.key);
997
1029
  },
998
1030
  };
999
1031
 
@@ -4929,7 +4961,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
4929
4961
  }
4930
4962
  };
4931
4963
 
4932
- var formkitVersion$1 = '202606171946';
4964
+ var formkitVersion$1 = '202606192004';
4933
4965
 
4934
4966
  class AuroElement extends i$2 {
4935
4967
  static get properties() {
@@ -6942,7 +6974,7 @@ class AuroHelpText extends i$2 {
6942
6974
  }
6943
6975
  }
6944
6976
 
6945
- var formkitVersion = '202606171946';
6977
+ var formkitVersion = '202606192004';
6946
6978
 
6947
6979
  var styleCss$2 = i$5`.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}[auro-dropdown]{--ds-auro-dropdown-trigger-border-color: var(--ds-auro-select-border-color);--ds-auro-dropdown-trigger-background-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-container-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-outline-color: var(--ds-auro-select-outline-color)}:host{display:inline-block;text-align:left;vertical-align:top}:host([layout*=emphasized]) [auro-dropdown],:host([layout*=snowflake]) [auro-dropdown]{--ds-auro-select-border-color: transparent}:host([layout*=emphasized]) .mainContent,:host([layout*=snowflake]) .mainContent{text-align:center}.mainContent{position:relative;display:flex;overflow:hidden;flex:1;flex-direction:column;align-items:center;justify-content:center}.valueContainer [slot=displayValue]{display:none}.accents{display:flex;flex-direction:row;align-items:center;justify-content:center}::slotted([slot=typeIcon]){margin-right:var(--ds-size-100, 0.5rem)}.displayValue{display:block}.displayValue:not(.force){display:none}.displayValue:not(.force).hasContent:is(.withValue):not(.hasFocus){display:block}.triggerContent{display:flex;width:100%;align-items:center;justify-content:center}:host([layout*=emphasized]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-300, 1.5rem)}:host([layout*=snowflake]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-200, 1rem)}:host([layout*=snowflake]) label{padding-block:var(--ds-size-25, 0.125rem)}:host([layout*=classic]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem)}:host([layout*=classic]) .mainContent{align-items:start}:host([layout*=classic]) label{overflow:hidden;cursor:text;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) .value{height:auto}label{color:var(--ds-auro-select-label-text-color)}:host(:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-select-outline-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]:is([validity]:not([validity=valid]))) [auro-dropdown],:host([appearance=inverse]:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-select-outline-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}#slotHolder{display:none}:host([fluid]){width:100%}:host([disabled]){pointer-events:none;user-select:none}:host([disabled]:not([ondark])) [auro-dropdown],:host([disabled]:not([appearance=inverse])) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([layout*=classic])[disabled][ondark]) [auro-dropdown],:host(:not([layout*=classic])[disabled][appearance=inverse]) [auro-dropdown]{--ds-auro-select-border-color: transparent}`;
6948
6980
 
@@ -7047,6 +7079,16 @@ class AuroSelect extends AuroElement$1 {
7047
7079
  * @private
7048
7080
  */
7049
7081
  this.hasDisplayValueContent = false;
7082
+
7083
+ /**
7084
+ * @private
7085
+ */
7086
+ this.typeaheadBuffer = '';
7087
+
7088
+ /**
7089
+ * @private
7090
+ */
7091
+ this._typeaheadTimeout = null;
7050
7092
  }
7051
7093
 
7052
7094
  /**
@@ -7059,6 +7101,7 @@ class AuroSelect extends AuroElement$1 {
7059
7101
  this.fullscreenBreakpoint = 'sm';
7060
7102
  this.onDark = false;
7061
7103
  this.isPopoverVisible = false;
7104
+ this.typeaheadTimeoutMs = 500;
7062
7105
 
7063
7106
  // Layout Config
7064
7107
  this.layout = 'classic';
@@ -7362,6 +7405,16 @@ class AuroSelect extends AuroElement$1 {
7362
7405
  attribute: false
7363
7406
  },
7364
7407
 
7408
+ /**
7409
+ * Milliseconds of keyboard inactivity before the type-ahead buffer resets.
7410
+ * Increase for users who type slowly.
7411
+ * @default 500
7412
+ */
7413
+ typeaheadTimeoutMs: {
7414
+ type: Number,
7415
+ reflect: true
7416
+ },
7417
+
7365
7418
  /**
7366
7419
  * Specifies the `validityState` this element is in.
7367
7420
  */
@@ -7801,6 +7854,7 @@ class AuroSelect extends AuroElement$1 {
7801
7854
  this.addEventListener('blur', () => {
7802
7855
  this.validate();
7803
7856
  this.hasFocus = false;
7857
+ this._clearTypeaheadBuffer();
7804
7858
  });
7805
7859
  }
7806
7860
 
@@ -7814,41 +7868,89 @@ class AuroSelect extends AuroElement$1 {
7814
7868
  }
7815
7869
  }
7816
7870
 
7871
+ /**
7872
+ * Returns the lowercase, trimmed text content of a menu option.
7873
+ * @private
7874
+ * @param {HTMLElement} option - The menu option element.
7875
+ * @returns {string}
7876
+ */
7877
+ _getOptionDisplayText(option) {
7878
+ return (option.textContent || '').trim().toLowerCase();
7879
+ }
7880
+
7881
+ /**
7882
+ * Empties the type-ahead buffer and cancels any pending reset timeout.
7883
+ * Called when focus leaves the component, when Escape closes the bib, and on disconnect
7884
+ * so a stale buffer never bridges into a fresh interaction.
7885
+ * @private
7886
+ */
7887
+ _clearTypeaheadBuffer() {
7888
+ if (this._typeaheadTimeout) {
7889
+ clearTimeout(this._typeaheadTimeout);
7890
+ this._typeaheadTimeout = null;
7891
+ }
7892
+ this.typeaheadBuffer = '';
7893
+ }
7894
+
7817
7895
  /**
7818
7896
  * Updates the active option in the menu based on keyboard input.
7897
+ *
7898
+ * Implements the WAI-ARIA APG Listbox type-ahead pattern: accumulates printable
7899
+ * keystrokes into a buffer that resets after `typeaheadTimeoutMs` of inactivity.
7900
+ * A multi-character buffer matches the first option whose displayed text starts
7901
+ * with the buffer; repeating a single character cycles through options that start
7902
+ * with that character.
7819
7903
  * @private
7820
7904
  * @param {string} _key - The key pressed by the user.
7821
7905
  * @returns {void}
7822
7906
  */
7823
7907
  updateActiveOptionBasedOnKey(_key) {
7908
+ // Ignore non-printable keys (Shift, ArrowDown, Tab, etc.)
7909
+ if (typeof _key !== 'string' || _key.length !== 1) {
7910
+ return;
7911
+ }
7824
7912
 
7825
- // Get a lowercase version of the key pressed
7826
- const key = _key.toLowerCase();
7827
-
7828
- // Calculate how many times the same letter has been pressed
7829
- this.sameLetterTimes = key === this.lastLetter ? this.sameLetterTimes + 1 : 0;
7913
+ // No selectable options to match against clear any stale buffer/timer so
7914
+ // Space stays a bib toggle and the next keystroke after fresh options load
7915
+ // starts cleanly. `getActiveOptions` excludes disabled, hidden, and static
7916
+ // options (e.g. `static nomatch` placeholders). Checked BEFORE mutating
7917
+ // the buffer.
7918
+ const options = getActiveOptions(this.menu);
7919
+ if (!options.length) {
7920
+ this._clearTypeaheadBuffer();
7921
+ return;
7922
+ }
7830
7923
 
7831
- // Set last letter for tracking
7832
- this.lastLetter = key;
7924
+ const key = _key.toLowerCase();
7833
7925
 
7834
- // Get all the options that start with the last letter pressed
7835
- const letterOptions = this.menu.options.filter((option) => {
7836
- const optionText = option.value || '';
7837
- return optionText.toLowerCase().startsWith(this.lastLetter);
7838
- });
7926
+ // Reset the buffer after a period of inactivity
7927
+ if (this._typeaheadTimeout) {
7928
+ clearTimeout(this._typeaheadTimeout);
7929
+ }
7930
+ this._typeaheadTimeout = setTimeout(() => {
7931
+ this._clearTypeaheadBuffer();
7932
+ }, this.typeaheadTimeoutMs);
7839
7933
 
7840
- // If we have options that match the letter pressed
7841
- if (letterOptions.length) {
7934
+ this.typeaheadBuffer += key;
7842
7935
 
7843
- // Show the dropdown if it is not already visible
7844
- this.dropdown.show();
7936
+ const isRepeatedChar = this.typeaheadBuffer.length > 1 && new Set(this.typeaheadBuffer).size === 1;
7845
7937
 
7846
- // Get the index we're after based on how many times the letter has been pressed and the length of the letterOptions array
7847
- const index = this.sameLetterTimes < letterOptions.length ? this.sameLetterTimes : this.sameLetterTimes % letterOptions.length;
7938
+ let match = null;
7939
+ if (isRepeatedChar) {
7940
+ const matches = options.filter((option) => this._getOptionDisplayText(option).startsWith(key));
7941
+ if (matches.length) {
7942
+ const cycleIndex = (this.typeaheadBuffer.length - 1) % matches.length;
7943
+ match = matches[cycleIndex];
7944
+ }
7945
+ } else {
7946
+ match = options.find((option) => this._getOptionDisplayText(option).startsWith(this.typeaheadBuffer));
7947
+ }
7848
7948
 
7849
- // Select the new option in the menu
7850
- const newOption = letterOptions[index];
7851
- this.menu.updateActiveOption(newOption);
7949
+ if (match) {
7950
+ if (!this.dropdown.isPopoverVisible) {
7951
+ this.dropdown.show();
7952
+ }
7953
+ this.menu.updateActiveOption(match);
7852
7954
  }
7853
7955
  }
7854
7956
 
@@ -7962,6 +8064,11 @@ class AuroSelect extends AuroElement$1 {
7962
8064
  }
7963
8065
  }
7964
8066
 
8067
+ disconnectedCallback() {
8068
+ super.disconnectedCallback();
8069
+ this._clearTypeaheadBuffer();
8070
+ }
8071
+
7965
8072
  // lifecycle runs only after the element's DOM has been updated the first time
7966
8073
  firstUpdated() {
7967
8074
  // Add the tag name as an attribute if it is different than the component name
@@ -229,6 +229,24 @@
229
229
  </div>
230
230
  </td>
231
231
  </tr>
232
+ <tr>
233
+ <td>Space</td>
234
+ <td>-</td>
235
+ <td>Collapsed or Expanded</td>
236
+ <td>Trigger element</td>
237
+ <td>
238
+ When the type-ahead buffer is empty, Space behaves as documented in the inherited Space row below. While the buffer is active, Space extends the buffer instead — the <code>focused</code> option advances if the buffer matches an enabled option, and the bib state is unchanged. See the <a href="customize.html#typeAhead">Type-Ahead</a> section on the Customize page.
239
+ </td>
240
+ </tr>
241
+ <tr>
242
+ <td>Any printable character (other than Space)</td>
243
+ <td>-</td>
244
+ <td>Collapsed or Expanded</td>
245
+ <td>Trigger element</td>
246
+ <td>
247
+ Extends the type-ahead buffer. When the buffer matches an enabled option's displayed text, the <code>focused</code> option advances to that option and the bib opens if it was collapsed. A keystroke that does not match any option leaves the bib state unchanged. Repeated keystrokes within <code>typeaheadTimeoutMs</code> extend the buffer; pressing the same character repeatedly cycles through matching options. See the <a href="customize.html#typeAhead">Type-Ahead</a> section on the Customize page.
248
+ </td>
249
+ </tr>
232
250
  </tbody>
233
251
  </table>
234
252
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -256,6 +256,15 @@ export class AuroSelect extends AuroElement {
256
256
  reflect: boolean;
257
257
  attribute: boolean;
258
258
  };
259
+ /**
260
+ * Milliseconds of keyboard inactivity before the type-ahead buffer resets.
261
+ * Increase for users who type slowly.
262
+ * @default 500
263
+ */
264
+ typeaheadTimeoutMs: {
265
+ type: NumberConstructor;
266
+ reflect: boolean;
267
+ };
259
268
  /**
260
269
  * Specifies the `validityState` this element is in.
261
270
  */
@@ -325,6 +334,14 @@ export class AuroSelect extends AuroElement {
325
334
  * @private
326
335
  */
327
336
  private hasDisplayValueContent;
337
+ /**
338
+ * @private
339
+ */
340
+ private typeaheadBuffer;
341
+ /**
342
+ * @private
343
+ */
344
+ private _typeaheadTimeout;
328
345
  /**
329
346
  * @private
330
347
  * @returns {void} Internal defaults.
@@ -335,6 +352,7 @@ export class AuroSelect extends AuroElement {
335
352
  fullscreenBreakpoint: string | undefined;
336
353
  onDark: boolean | undefined;
337
354
  isPopoverVisible: any;
355
+ typeaheadTimeoutMs: number | undefined;
338
356
  shape: string | undefined;
339
357
  size: string | undefined;
340
358
  /**
@@ -421,15 +439,33 @@ export class AuroSelect extends AuroElement {
421
439
  * @param {number} index - Index of the option to make active.
422
440
  */
423
441
  updateActiveOption(index: number): void;
442
+ /**
443
+ * Returns the lowercase, trimmed text content of a menu option.
444
+ * @private
445
+ * @param {HTMLElement} option - The menu option element.
446
+ * @returns {string}
447
+ */
448
+ private _getOptionDisplayText;
449
+ /**
450
+ * Empties the type-ahead buffer and cancels any pending reset timeout.
451
+ * Called when focus leaves the component, when Escape closes the bib, and on disconnect
452
+ * so a stale buffer never bridges into a fresh interaction.
453
+ * @private
454
+ */
455
+ private _clearTypeaheadBuffer;
424
456
  /**
425
457
  * Updates the active option in the menu based on keyboard input.
458
+ *
459
+ * Implements the WAI-ARIA APG Listbox type-ahead pattern: accumulates printable
460
+ * keystrokes into a buffer that resets after `typeaheadTimeoutMs` of inactivity.
461
+ * A multi-character buffer matches the first option whose displayed text starts
462
+ * with the buffer; repeating a single character cycles through options that start
463
+ * with that character.
426
464
  * @private
427
465
  * @param {string} _key - The key pressed by the user.
428
466
  * @returns {void}
429
467
  */
430
468
  private updateActiveOptionBasedOnKey;
431
- sameLetterTimes: any;
432
- lastLetter: string | undefined;
433
469
  /**
434
470
  * Manages the visibility of the dropdown based on loading state changes.
435
471
  *