@aurodesignsystem-dev/auro-formkit 0.0.0-pr1478.0 → 0.0.0-pr1478.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.
- package/components/checkbox/demo/customize.html +1 -2
- package/components/checkbox/demo/customize.min.js +1 -1
- package/components/checkbox/demo/getting-started.min.js +1 -1
- package/components/checkbox/demo/index.min.js +1 -1
- package/components/checkbox/dist/index.js +1 -1
- package/components/checkbox/dist/registered.js +1 -1
- package/components/combobox/demo/customize.html +1 -2
- package/components/combobox/demo/customize.md +108 -132
- package/components/combobox/demo/customize.min.js +14 -23
- package/components/combobox/demo/getting-started.min.js +14 -23
- package/components/combobox/demo/index.min.js +14 -23
- package/components/combobox/dist/index.js +12 -21
- package/components/combobox/dist/registered.js +12 -21
- package/components/counter/demo/customize.min.js +10 -2
- package/components/counter/demo/index.min.js +10 -2
- package/components/counter/dist/index.js +10 -2
- package/components/counter/dist/registered.js +10 -2
- package/components/datepicker/demo/api.md +2 -0
- package/components/datepicker/demo/customize.js +0 -2
- package/components/datepicker/demo/customize.md +138 -38
- package/components/datepicker/demo/customize.min.js +17 -23
- package/components/datepicker/demo/index.min.js +17 -5
- package/components/datepicker/dist/index.js +17 -5
- package/components/datepicker/dist/registered.js +17 -5
- package/components/datepicker/dist/src/auro-datepicker.d.ts +2 -0
- package/components/dropdown/demo/customize.min.js +9 -1
- package/components/dropdown/demo/getting-started.min.js +9 -1
- package/components/dropdown/demo/index.min.js +9 -1
- package/components/dropdown/dist/auro-dropdown.d.ts +1 -0
- package/components/dropdown/dist/index.js +9 -1
- package/components/dropdown/dist/registered.js +9 -1
- package/components/form/demo/customize.html +6 -6
- package/components/form/demo/customize.js +19 -0
- package/components/form/demo/customize.md +203 -51
- package/components/form/demo/customize.min.js +620 -96
- package/components/form/demo/getting-started.min.js +548 -96
- package/components/form/demo/index.min.js +548 -96
- package/components/form/demo/registerDemoDeps.min.js +185 -59
- package/components/form/dist/auro-form.d.ts +122 -4
- package/components/form/dist/index.js +363 -37
- package/components/form/dist/registered.js +363 -37
- package/components/input/demo/customize.html +1 -2
- package/components/input/demo/customize.md +54 -53
- package/components/input/demo/customize.min.js +1 -1
- package/components/input/demo/getting-started.min.js +1 -1
- package/components/input/demo/index.min.js +1 -1
- package/components/input/dist/index.js +1 -1
- package/components/input/dist/registered.js +1 -1
- package/components/menu/demo/index.min.js +2 -2
- package/components/menu/dist/index.js +2 -2
- package/components/menu/dist/registered.js +2 -2
- package/components/radio/demo/customize.min.js +1 -1
- package/components/radio/demo/getting-started.min.js +1 -1
- package/components/radio/demo/index.min.js +1 -1
- package/components/radio/dist/index.js +1 -1
- package/components/radio/dist/registered.js +1 -1
- package/components/select/demo/api.md +1 -0
- package/components/select/demo/customize.html +1 -2
- package/components/select/demo/customize.md +71 -0
- package/components/select/demo/customize.min.js +143 -28
- package/components/select/demo/getting-started.min.js +143 -28
- package/components/select/demo/index.min.js +143 -28
- package/components/select/demo/keyboard-behavior.md +18 -0
- package/components/select/dist/auro-select.d.ts +38 -2
- package/components/select/dist/index.js +141 -26
- package/components/select/dist/registered.js +141 -26
- package/components/select/dist/selectUtils.d.ts +12 -0
- package/custom-elements.json +1641 -1420
- package/package.json +1 -1
|
@@ -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
|
-
|
|
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
|
-
|
|
1023
|
+
} else {
|
|
1024
|
+
component.dropdown.show();
|
|
994
1025
|
}
|
|
995
|
-
|
|
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 = '
|
|
4964
|
+
var formkitVersion$1 = '202606231828';
|
|
4933
4965
|
|
|
4934
4966
|
class AuroElement extends i$2 {
|
|
4935
4967
|
static get properties() {
|
|
@@ -5880,6 +5912,14 @@ class AuroDropdown extends AuroElement {
|
|
|
5880
5912
|
};
|
|
5881
5913
|
this.addEventListener('keydown', this._bibTabHandler);
|
|
5882
5914
|
|
|
5915
|
+
// Suppress AuroFloatingUI's auto-hide-on-focus-loss while the
|
|
5916
|
+
// desktopModal trap owns focus management. Without this, the very
|
|
5917
|
+
// first focus move into the bib (from the RAF below) triggers
|
|
5918
|
+
// handleFocusLoss → hideBib, tearing down the trap before the
|
|
5919
|
+
// user can press Tab.
|
|
5920
|
+
this._priorNoHideOnFocusLoss = this.noHideOnThisFocusLoss;
|
|
5921
|
+
this.noHideOnThisFocusLoss = true;
|
|
5922
|
+
|
|
5883
5923
|
// Move initial focus into the bib content, matching FocusTrap behavior
|
|
5884
5924
|
requestAnimationFrame(() => {
|
|
5885
5925
|
const focusables = getFocusableElements(this.bibContent);
|
|
@@ -6942,7 +6982,7 @@ class AuroHelpText extends i$2 {
|
|
|
6942
6982
|
}
|
|
6943
6983
|
}
|
|
6944
6984
|
|
|
6945
|
-
var formkitVersion = '
|
|
6985
|
+
var formkitVersion = '202606231828';
|
|
6946
6986
|
|
|
6947
6987
|
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
6988
|
|
|
@@ -7047,6 +7087,16 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7047
7087
|
* @private
|
|
7048
7088
|
*/
|
|
7049
7089
|
this.hasDisplayValueContent = false;
|
|
7090
|
+
|
|
7091
|
+
/**
|
|
7092
|
+
* @private
|
|
7093
|
+
*/
|
|
7094
|
+
this.typeaheadBuffer = '';
|
|
7095
|
+
|
|
7096
|
+
/**
|
|
7097
|
+
* @private
|
|
7098
|
+
*/
|
|
7099
|
+
this._typeaheadTimeout = null;
|
|
7050
7100
|
}
|
|
7051
7101
|
|
|
7052
7102
|
/**
|
|
@@ -7059,6 +7109,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7059
7109
|
this.fullscreenBreakpoint = 'sm';
|
|
7060
7110
|
this.onDark = false;
|
|
7061
7111
|
this.isPopoverVisible = false;
|
|
7112
|
+
this.typeaheadTimeoutMs = 500;
|
|
7062
7113
|
|
|
7063
7114
|
// Layout Config
|
|
7064
7115
|
this.layout = 'classic';
|
|
@@ -7362,6 +7413,16 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7362
7413
|
attribute: false
|
|
7363
7414
|
},
|
|
7364
7415
|
|
|
7416
|
+
/**
|
|
7417
|
+
* Milliseconds of keyboard inactivity before the type-ahead buffer resets.
|
|
7418
|
+
* Increase for users who type slowly.
|
|
7419
|
+
* @default 500
|
|
7420
|
+
*/
|
|
7421
|
+
typeaheadTimeoutMs: {
|
|
7422
|
+
type: Number,
|
|
7423
|
+
reflect: true
|
|
7424
|
+
},
|
|
7425
|
+
|
|
7365
7426
|
/**
|
|
7366
7427
|
* Specifies the `validityState` this element is in.
|
|
7367
7428
|
*/
|
|
@@ -7801,6 +7862,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7801
7862
|
this.addEventListener('blur', () => {
|
|
7802
7863
|
this.validate();
|
|
7803
7864
|
this.hasFocus = false;
|
|
7865
|
+
this._clearTypeaheadBuffer();
|
|
7804
7866
|
});
|
|
7805
7867
|
}
|
|
7806
7868
|
|
|
@@ -7814,41 +7876,89 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7814
7876
|
}
|
|
7815
7877
|
}
|
|
7816
7878
|
|
|
7879
|
+
/**
|
|
7880
|
+
* Returns the lowercase, trimmed text content of a menu option.
|
|
7881
|
+
* @private
|
|
7882
|
+
* @param {HTMLElement} option - The menu option element.
|
|
7883
|
+
* @returns {string}
|
|
7884
|
+
*/
|
|
7885
|
+
_getOptionDisplayText(option) {
|
|
7886
|
+
return (option.textContent || '').trim().toLowerCase();
|
|
7887
|
+
}
|
|
7888
|
+
|
|
7889
|
+
/**
|
|
7890
|
+
* Empties the type-ahead buffer and cancels any pending reset timeout.
|
|
7891
|
+
* Called when focus leaves the component, when Escape closes the bib, and on disconnect
|
|
7892
|
+
* so a stale buffer never bridges into a fresh interaction.
|
|
7893
|
+
* @private
|
|
7894
|
+
*/
|
|
7895
|
+
_clearTypeaheadBuffer() {
|
|
7896
|
+
if (this._typeaheadTimeout) {
|
|
7897
|
+
clearTimeout(this._typeaheadTimeout);
|
|
7898
|
+
this._typeaheadTimeout = null;
|
|
7899
|
+
}
|
|
7900
|
+
this.typeaheadBuffer = '';
|
|
7901
|
+
}
|
|
7902
|
+
|
|
7817
7903
|
/**
|
|
7818
7904
|
* Updates the active option in the menu based on keyboard input.
|
|
7905
|
+
*
|
|
7906
|
+
* Implements the WAI-ARIA APG Listbox type-ahead pattern: accumulates printable
|
|
7907
|
+
* keystrokes into a buffer that resets after `typeaheadTimeoutMs` of inactivity.
|
|
7908
|
+
* A multi-character buffer matches the first option whose displayed text starts
|
|
7909
|
+
* with the buffer; repeating a single character cycles through options that start
|
|
7910
|
+
* with that character.
|
|
7819
7911
|
* @private
|
|
7820
7912
|
* @param {string} _key - The key pressed by the user.
|
|
7821
7913
|
* @returns {void}
|
|
7822
7914
|
*/
|
|
7823
7915
|
updateActiveOptionBasedOnKey(_key) {
|
|
7916
|
+
// Ignore non-printable keys (Shift, ArrowDown, Tab, etc.)
|
|
7917
|
+
if (typeof _key !== 'string' || _key.length !== 1) {
|
|
7918
|
+
return;
|
|
7919
|
+
}
|
|
7824
7920
|
|
|
7825
|
-
//
|
|
7826
|
-
|
|
7827
|
-
|
|
7828
|
-
//
|
|
7829
|
-
|
|
7921
|
+
// No selectable options to match against — clear any stale buffer/timer so
|
|
7922
|
+
// Space stays a bib toggle and the next keystroke after fresh options load
|
|
7923
|
+
// starts cleanly. `getActiveOptions` excludes disabled, hidden, and static
|
|
7924
|
+
// options (e.g. `static nomatch` placeholders). Checked BEFORE mutating
|
|
7925
|
+
// the buffer.
|
|
7926
|
+
const options = getActiveOptions(this.menu);
|
|
7927
|
+
if (!options.length) {
|
|
7928
|
+
this._clearTypeaheadBuffer();
|
|
7929
|
+
return;
|
|
7930
|
+
}
|
|
7830
7931
|
|
|
7831
|
-
|
|
7832
|
-
this.lastLetter = key;
|
|
7932
|
+
const key = _key.toLowerCase();
|
|
7833
7933
|
|
|
7834
|
-
//
|
|
7835
|
-
|
|
7836
|
-
|
|
7837
|
-
|
|
7838
|
-
|
|
7934
|
+
// Reset the buffer after a period of inactivity
|
|
7935
|
+
if (this._typeaheadTimeout) {
|
|
7936
|
+
clearTimeout(this._typeaheadTimeout);
|
|
7937
|
+
}
|
|
7938
|
+
this._typeaheadTimeout = setTimeout(() => {
|
|
7939
|
+
this._clearTypeaheadBuffer();
|
|
7940
|
+
}, this.typeaheadTimeoutMs);
|
|
7839
7941
|
|
|
7840
|
-
|
|
7841
|
-
if (letterOptions.length) {
|
|
7942
|
+
this.typeaheadBuffer += key;
|
|
7842
7943
|
|
|
7843
|
-
|
|
7844
|
-
this.dropdown.show();
|
|
7944
|
+
const isRepeatedChar = this.typeaheadBuffer.length > 1 && new Set(this.typeaheadBuffer).size === 1;
|
|
7845
7945
|
|
|
7846
|
-
|
|
7847
|
-
|
|
7946
|
+
let match = null;
|
|
7947
|
+
if (isRepeatedChar) {
|
|
7948
|
+
const matches = options.filter((option) => this._getOptionDisplayText(option).startsWith(key));
|
|
7949
|
+
if (matches.length) {
|
|
7950
|
+
const cycleIndex = (this.typeaheadBuffer.length - 1) % matches.length;
|
|
7951
|
+
match = matches[cycleIndex];
|
|
7952
|
+
}
|
|
7953
|
+
} else {
|
|
7954
|
+
match = options.find((option) => this._getOptionDisplayText(option).startsWith(this.typeaheadBuffer));
|
|
7955
|
+
}
|
|
7848
7956
|
|
|
7849
|
-
|
|
7850
|
-
|
|
7851
|
-
|
|
7957
|
+
if (match) {
|
|
7958
|
+
if (!this.dropdown.isPopoverVisible) {
|
|
7959
|
+
this.dropdown.show();
|
|
7960
|
+
}
|
|
7961
|
+
this.menu.updateActiveOption(match);
|
|
7852
7962
|
}
|
|
7853
7963
|
}
|
|
7854
7964
|
|
|
@@ -7962,6 +8072,11 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7962
8072
|
}
|
|
7963
8073
|
}
|
|
7964
8074
|
|
|
8075
|
+
disconnectedCallback() {
|
|
8076
|
+
super.disconnectedCallback();
|
|
8077
|
+
this._clearTypeaheadBuffer();
|
|
8078
|
+
}
|
|
8079
|
+
|
|
7965
8080
|
// lifecycle runs only after the element's DOM has been updated the first time
|
|
7966
8081
|
firstUpdated() {
|
|
7967
8082
|
// Add the tag name as an attribute if it is different than the component name
|
|
@@ -8799,8 +8914,8 @@ class AuroMenu extends AuroElement$1 {
|
|
|
8799
8914
|
// Malformed JSON (e.g. a literal string that happens to start with "[") falls back
|
|
8800
8915
|
// to a single-item array rather than throwing during render.
|
|
8801
8916
|
try {
|
|
8802
|
-
|
|
8803
|
-
return
|
|
8917
|
+
// any valid JSON starting with `[` ALWAYS parses to an array
|
|
8918
|
+
return JSON.parse(this.value);
|
|
8804
8919
|
} catch {
|
|
8805
8920
|
return [this.value];
|
|
8806
8921
|
}
|
|
@@ -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
|
-
|
|
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
|
-
|
|
1054
|
+
} else {
|
|
1055
|
+
component.dropdown.show();
|
|
1025
1056
|
}
|
|
1026
|
-
|
|
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 = '
|
|
4995
|
+
var formkitVersion$1 = '202606231828';
|
|
4964
4996
|
|
|
4965
4997
|
class AuroElement extends i$2 {
|
|
4966
4998
|
static get properties() {
|
|
@@ -5911,6 +5943,14 @@ class AuroDropdown extends AuroElement {
|
|
|
5911
5943
|
};
|
|
5912
5944
|
this.addEventListener('keydown', this._bibTabHandler);
|
|
5913
5945
|
|
|
5946
|
+
// Suppress AuroFloatingUI's auto-hide-on-focus-loss while the
|
|
5947
|
+
// desktopModal trap owns focus management. Without this, the very
|
|
5948
|
+
// first focus move into the bib (from the RAF below) triggers
|
|
5949
|
+
// handleFocusLoss → hideBib, tearing down the trap before the
|
|
5950
|
+
// user can press Tab.
|
|
5951
|
+
this._priorNoHideOnFocusLoss = this.noHideOnThisFocusLoss;
|
|
5952
|
+
this.noHideOnThisFocusLoss = true;
|
|
5953
|
+
|
|
5914
5954
|
// Move initial focus into the bib content, matching FocusTrap behavior
|
|
5915
5955
|
requestAnimationFrame(() => {
|
|
5916
5956
|
const focusables = getFocusableElements(this.bibContent);
|
|
@@ -6973,7 +7013,7 @@ class AuroHelpText extends i$2 {
|
|
|
6973
7013
|
}
|
|
6974
7014
|
}
|
|
6975
7015
|
|
|
6976
|
-
var formkitVersion = '
|
|
7016
|
+
var formkitVersion = '202606231828';
|
|
6977
7017
|
|
|
6978
7018
|
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
7019
|
|
|
@@ -7078,6 +7118,16 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7078
7118
|
* @private
|
|
7079
7119
|
*/
|
|
7080
7120
|
this.hasDisplayValueContent = false;
|
|
7121
|
+
|
|
7122
|
+
/**
|
|
7123
|
+
* @private
|
|
7124
|
+
*/
|
|
7125
|
+
this.typeaheadBuffer = '';
|
|
7126
|
+
|
|
7127
|
+
/**
|
|
7128
|
+
* @private
|
|
7129
|
+
*/
|
|
7130
|
+
this._typeaheadTimeout = null;
|
|
7081
7131
|
}
|
|
7082
7132
|
|
|
7083
7133
|
/**
|
|
@@ -7090,6 +7140,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7090
7140
|
this.fullscreenBreakpoint = 'sm';
|
|
7091
7141
|
this.onDark = false;
|
|
7092
7142
|
this.isPopoverVisible = false;
|
|
7143
|
+
this.typeaheadTimeoutMs = 500;
|
|
7093
7144
|
|
|
7094
7145
|
// Layout Config
|
|
7095
7146
|
this.layout = 'classic';
|
|
@@ -7393,6 +7444,16 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7393
7444
|
attribute: false
|
|
7394
7445
|
},
|
|
7395
7446
|
|
|
7447
|
+
/**
|
|
7448
|
+
* Milliseconds of keyboard inactivity before the type-ahead buffer resets.
|
|
7449
|
+
* Increase for users who type slowly.
|
|
7450
|
+
* @default 500
|
|
7451
|
+
*/
|
|
7452
|
+
typeaheadTimeoutMs: {
|
|
7453
|
+
type: Number,
|
|
7454
|
+
reflect: true
|
|
7455
|
+
},
|
|
7456
|
+
|
|
7396
7457
|
/**
|
|
7397
7458
|
* Specifies the `validityState` this element is in.
|
|
7398
7459
|
*/
|
|
@@ -7832,6 +7893,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7832
7893
|
this.addEventListener('blur', () => {
|
|
7833
7894
|
this.validate();
|
|
7834
7895
|
this.hasFocus = false;
|
|
7896
|
+
this._clearTypeaheadBuffer();
|
|
7835
7897
|
});
|
|
7836
7898
|
}
|
|
7837
7899
|
|
|
@@ -7845,41 +7907,89 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7845
7907
|
}
|
|
7846
7908
|
}
|
|
7847
7909
|
|
|
7910
|
+
/**
|
|
7911
|
+
* Returns the lowercase, trimmed text content of a menu option.
|
|
7912
|
+
* @private
|
|
7913
|
+
* @param {HTMLElement} option - The menu option element.
|
|
7914
|
+
* @returns {string}
|
|
7915
|
+
*/
|
|
7916
|
+
_getOptionDisplayText(option) {
|
|
7917
|
+
return (option.textContent || '').trim().toLowerCase();
|
|
7918
|
+
}
|
|
7919
|
+
|
|
7920
|
+
/**
|
|
7921
|
+
* Empties the type-ahead buffer and cancels any pending reset timeout.
|
|
7922
|
+
* Called when focus leaves the component, when Escape closes the bib, and on disconnect
|
|
7923
|
+
* so a stale buffer never bridges into a fresh interaction.
|
|
7924
|
+
* @private
|
|
7925
|
+
*/
|
|
7926
|
+
_clearTypeaheadBuffer() {
|
|
7927
|
+
if (this._typeaheadTimeout) {
|
|
7928
|
+
clearTimeout(this._typeaheadTimeout);
|
|
7929
|
+
this._typeaheadTimeout = null;
|
|
7930
|
+
}
|
|
7931
|
+
this.typeaheadBuffer = '';
|
|
7932
|
+
}
|
|
7933
|
+
|
|
7848
7934
|
/**
|
|
7849
7935
|
* Updates the active option in the menu based on keyboard input.
|
|
7936
|
+
*
|
|
7937
|
+
* Implements the WAI-ARIA APG Listbox type-ahead pattern: accumulates printable
|
|
7938
|
+
* keystrokes into a buffer that resets after `typeaheadTimeoutMs` of inactivity.
|
|
7939
|
+
* A multi-character buffer matches the first option whose displayed text starts
|
|
7940
|
+
* with the buffer; repeating a single character cycles through options that start
|
|
7941
|
+
* with that character.
|
|
7850
7942
|
* @private
|
|
7851
7943
|
* @param {string} _key - The key pressed by the user.
|
|
7852
7944
|
* @returns {void}
|
|
7853
7945
|
*/
|
|
7854
7946
|
updateActiveOptionBasedOnKey(_key) {
|
|
7947
|
+
// Ignore non-printable keys (Shift, ArrowDown, Tab, etc.)
|
|
7948
|
+
if (typeof _key !== 'string' || _key.length !== 1) {
|
|
7949
|
+
return;
|
|
7950
|
+
}
|
|
7855
7951
|
|
|
7856
|
-
//
|
|
7857
|
-
|
|
7858
|
-
|
|
7859
|
-
//
|
|
7860
|
-
|
|
7952
|
+
// No selectable options to match against — clear any stale buffer/timer so
|
|
7953
|
+
// Space stays a bib toggle and the next keystroke after fresh options load
|
|
7954
|
+
// starts cleanly. `getActiveOptions` excludes disabled, hidden, and static
|
|
7955
|
+
// options (e.g. `static nomatch` placeholders). Checked BEFORE mutating
|
|
7956
|
+
// the buffer.
|
|
7957
|
+
const options = getActiveOptions(this.menu);
|
|
7958
|
+
if (!options.length) {
|
|
7959
|
+
this._clearTypeaheadBuffer();
|
|
7960
|
+
return;
|
|
7961
|
+
}
|
|
7861
7962
|
|
|
7862
|
-
|
|
7863
|
-
this.lastLetter = key;
|
|
7963
|
+
const key = _key.toLowerCase();
|
|
7864
7964
|
|
|
7865
|
-
//
|
|
7866
|
-
|
|
7867
|
-
|
|
7868
|
-
|
|
7869
|
-
|
|
7965
|
+
// Reset the buffer after a period of inactivity
|
|
7966
|
+
if (this._typeaheadTimeout) {
|
|
7967
|
+
clearTimeout(this._typeaheadTimeout);
|
|
7968
|
+
}
|
|
7969
|
+
this._typeaheadTimeout = setTimeout(() => {
|
|
7970
|
+
this._clearTypeaheadBuffer();
|
|
7971
|
+
}, this.typeaheadTimeoutMs);
|
|
7870
7972
|
|
|
7871
|
-
|
|
7872
|
-
if (letterOptions.length) {
|
|
7973
|
+
this.typeaheadBuffer += key;
|
|
7873
7974
|
|
|
7874
|
-
|
|
7875
|
-
this.dropdown.show();
|
|
7975
|
+
const isRepeatedChar = this.typeaheadBuffer.length > 1 && new Set(this.typeaheadBuffer).size === 1;
|
|
7876
7976
|
|
|
7877
|
-
|
|
7878
|
-
|
|
7977
|
+
let match = null;
|
|
7978
|
+
if (isRepeatedChar) {
|
|
7979
|
+
const matches = options.filter((option) => this._getOptionDisplayText(option).startsWith(key));
|
|
7980
|
+
if (matches.length) {
|
|
7981
|
+
const cycleIndex = (this.typeaheadBuffer.length - 1) % matches.length;
|
|
7982
|
+
match = matches[cycleIndex];
|
|
7983
|
+
}
|
|
7984
|
+
} else {
|
|
7985
|
+
match = options.find((option) => this._getOptionDisplayText(option).startsWith(this.typeaheadBuffer));
|
|
7986
|
+
}
|
|
7879
7987
|
|
|
7880
|
-
|
|
7881
|
-
|
|
7882
|
-
|
|
7988
|
+
if (match) {
|
|
7989
|
+
if (!this.dropdown.isPopoverVisible) {
|
|
7990
|
+
this.dropdown.show();
|
|
7991
|
+
}
|
|
7992
|
+
this.menu.updateActiveOption(match);
|
|
7883
7993
|
}
|
|
7884
7994
|
}
|
|
7885
7995
|
|
|
@@ -7993,6 +8103,11 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7993
8103
|
}
|
|
7994
8104
|
}
|
|
7995
8105
|
|
|
8106
|
+
disconnectedCallback() {
|
|
8107
|
+
super.disconnectedCallback();
|
|
8108
|
+
this._clearTypeaheadBuffer();
|
|
8109
|
+
}
|
|
8110
|
+
|
|
7996
8111
|
// lifecycle runs only after the element's DOM has been updated the first time
|
|
7997
8112
|
firstUpdated() {
|
|
7998
8113
|
// Add the tag name as an attribute if it is different than the component name
|
|
@@ -8830,8 +8945,8 @@ class AuroMenu extends AuroElement$1 {
|
|
|
8830
8945
|
// Malformed JSON (e.g. a literal string that happens to start with "[") falls back
|
|
8831
8946
|
// to a single-item array rather than throwing during render.
|
|
8832
8947
|
try {
|
|
8833
|
-
|
|
8834
|
-
return
|
|
8948
|
+
// any valid JSON starting with `[` ALWAYS parses to an array
|
|
8949
|
+
return JSON.parse(this.value);
|
|
8835
8950
|
} catch {
|
|
8836
8951
|
return [this.value];
|
|
8837
8952
|
}
|