@aurodesignsystem-dev/auro-formkit 0.0.0-pr1505.0 → 0.0.0-pr1505.2
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 +6 -6
- package/components/combobox/demo/getting-started.min.js +6 -6
- package/components/combobox/demo/index.min.js +6 -6
- package/components/combobox/dist/index.js +4 -4
- package/components/combobox/dist/registered.js +4 -4
- package/components/counter/demo/customize.min.js +2 -2
- package/components/counter/demo/index.min.js +2 -2
- package/components/counter/dist/index.js +2 -2
- package/components/counter/dist/registered.js +2 -2
- package/components/datepicker/demo/api.md +2 -2
- package/components/datepicker/demo/customize.js +2 -2
- package/components/datepicker/demo/customize.md +29 -74
- package/components/datepicker/demo/customize.min.js +10 -10
- package/components/datepicker/demo/index.min.js +8 -8
- package/components/datepicker/dist/index.js +8 -8
- package/components/datepicker/dist/registered.js +8 -8
- package/components/datepicker/dist/src/auro-datepicker.d.ts +2 -2
- package/components/dropdown/demo/customize.min.js +1 -1
- package/components/dropdown/demo/getting-started.min.js +1 -1
- package/components/dropdown/demo/index.min.js +1 -1
- package/components/dropdown/dist/index.js +1 -1
- package/components/dropdown/dist/registered.js +1 -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 +588 -83
- package/components/form/demo/getting-started.min.js +516 -83
- package/components/form/demo/index.min.js +516 -83
- package/components/form/demo/registerDemoDeps.min.js +153 -46
- 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/api.md +1 -1
- package/components/input/demo/customize.html +1 -2
- package/components/input/demo/customize.md +2 -2
- package/components/input/demo/customize.min.js +2 -2
- package/components/input/demo/getting-started.min.js +2 -2
- package/components/input/demo/index.md +2 -2
- package/components/input/demo/index.min.js +2 -2
- package/components/input/dist/auro-input.d.ts +1 -1
- package/components/input/dist/index.js +2 -2
- package/components/input/dist/registered.js +2 -2
- 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 +135 -28
- package/components/select/demo/getting-started.min.js +135 -28
- package/components/select/demo/index.min.js +135 -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 +133 -26
- package/components/select/dist/registered.js +133 -26
- package/components/select/dist/selectUtils.d.ts +12 -0
- package/custom-elements.json +1654 -1441
- package/package.json +1 -1
|
@@ -12199,7 +12199,7 @@ class AuroHelpText extends LitElement {
|
|
|
12199
12199
|
}
|
|
12200
12200
|
}
|
|
12201
12201
|
|
|
12202
|
-
var formkitVersion = '
|
|
12202
|
+
var formkitVersion = '202606222118';
|
|
12203
12203
|
|
|
12204
12204
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
12205
12205
|
// See LICENSE in the project root for license information.
|
|
@@ -12214,7 +12214,7 @@ var formkitVersion = '202606171946';
|
|
|
12214
12214
|
* @slot ariaLabel.password.hide - Sets aria-label on password button to toggle off showing password
|
|
12215
12215
|
* @slot helpText - Sets the help text displayed below the input.
|
|
12216
12216
|
* @slot label - Sets the label text for the input.
|
|
12217
|
-
* @slot optionalLabel - Allows overriding the optional display text "(optional)", which appears next to the label.
|
|
12217
|
+
* @slot optionalLabel - Allows overriding the optional display text " (optional)", which appears next to the label.
|
|
12218
12218
|
* @slot displayValue - Allows custom HTML content to display in place of the value when the input is not focused.
|
|
12219
12219
|
* @csspart wrapper - Use for customizing the style of the root element
|
|
12220
12220
|
* @csspart label - Use for customizing the style of the label element
|
|
@@ -542,8 +542,8 @@ class AuroMenu extends AuroElement {
|
|
|
542
542
|
// Malformed JSON (e.g. a literal string that happens to start with "[") falls back
|
|
543
543
|
// to a single-item array rather than throwing during render.
|
|
544
544
|
try {
|
|
545
|
-
|
|
546
|
-
return
|
|
545
|
+
// any valid JSON starting with `[` ALWAYS parses to an array
|
|
546
|
+
return JSON.parse(this.value);
|
|
547
547
|
} catch {
|
|
548
548
|
return [this.value];
|
|
549
549
|
}
|
|
@@ -549,8 +549,8 @@ class AuroMenu extends AuroElement {
|
|
|
549
549
|
// Malformed JSON (e.g. a literal string that happens to start with "[") falls back
|
|
550
550
|
// to a single-item array rather than throwing during render.
|
|
551
551
|
try {
|
|
552
|
-
|
|
553
|
-
return
|
|
552
|
+
// any valid JSON starting with `[` ALWAYS parses to an array
|
|
553
|
+
return JSON.parse(this.value);
|
|
554
554
|
} catch {
|
|
555
555
|
return [this.value];
|
|
556
556
|
}
|
|
@@ -508,8 +508,8 @@ class AuroMenu extends AuroElement {
|
|
|
508
508
|
// Malformed JSON (e.g. a literal string that happens to start with "[") falls back
|
|
509
509
|
// to a single-item array rather than throwing during render.
|
|
510
510
|
try {
|
|
511
|
-
|
|
512
|
-
return
|
|
511
|
+
// any valid JSON starting with `[` ALWAYS parses to an array
|
|
512
|
+
return JSON.parse(this.value);
|
|
513
513
|
} catch {
|
|
514
514
|
return [this.value];
|
|
515
515
|
}
|
|
@@ -1212,7 +1212,7 @@ class AuroHelpText extends i$2 {
|
|
|
1212
1212
|
}
|
|
1213
1213
|
}
|
|
1214
1214
|
|
|
1215
|
-
var formkitVersion = '
|
|
1215
|
+
var formkitVersion = '202606222118';
|
|
1216
1216
|
|
|
1217
1217
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
1218
1218
|
// See LICENSE in the project root for license information.
|
|
@@ -1212,7 +1212,7 @@ class AuroHelpText extends i$2 {
|
|
|
1212
1212
|
}
|
|
1213
1213
|
}
|
|
1214
1214
|
|
|
1215
|
-
var formkitVersion = '
|
|
1215
|
+
var formkitVersion = '202606222118';
|
|
1216
1216
|
|
|
1217
1217
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
1218
1218
|
// See LICENSE in the project root for license information.
|
|
@@ -1212,7 +1212,7 @@ class AuroHelpText extends i$2 {
|
|
|
1212
1212
|
}
|
|
1213
1213
|
}
|
|
1214
1214
|
|
|
1215
|
-
var formkitVersion = '
|
|
1215
|
+
var formkitVersion = '202606222118';
|
|
1216
1216
|
|
|
1217
1217
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
1218
1218
|
// See LICENSE in the project root for license information.
|
|
@@ -1151,7 +1151,7 @@ class AuroHelpText extends LitElement {
|
|
|
1151
1151
|
}
|
|
1152
1152
|
}
|
|
1153
1153
|
|
|
1154
|
-
var formkitVersion = '
|
|
1154
|
+
var formkitVersion = '202606222118';
|
|
1155
1155
|
|
|
1156
1156
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
1157
1157
|
// See LICENSE in the project root for license information.
|
|
@@ -1151,7 +1151,7 @@ class AuroHelpText extends LitElement {
|
|
|
1151
1151
|
}
|
|
1152
1152
|
}
|
|
1153
1153
|
|
|
1154
|
-
var formkitVersion = '
|
|
1154
|
+
var formkitVersion = '202606222118';
|
|
1155
1155
|
|
|
1156
1156
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
1157
1157
|
// See LICENSE in the project root for license information.
|
|
@@ -38,6 +38,7 @@ The `auro-select` element is a wrapper for auro-dropdown and auro-menu to create
|
|
|
38
38
|
| `shape` | `shape` | `'classic' \| 'pill' \| 'pill-left' \| 'pill-right' \| 'snowflake'` | | Determines the shape of the dropdown bib. |
|
|
39
39
|
| `shift` | `shift` | `boolean` | false | If set, the dropdown will shift its position to avoid being cut off by the viewport. |
|
|
40
40
|
| `size` | `size` | `'lg' \| 'xl'` | | Determines the size of the dropdown bib. Only the `emphasized` layout supports size=`xl`, while all other layouts support size=`lg`. |
|
|
41
|
+
| `typeaheadTimeoutMs` | `typeaheadTimeoutMs` | `number` | "500" | Milliseconds of keyboard inactivity before the type-ahead buffer resets.<br />Increase for users who type slowly. |
|
|
41
42
|
| `validity` | `validity` | `string` | | Specifies the `validityState` this element is in. |
|
|
42
43
|
| `value` | `value` | `string` | | Value selected for the component. |
|
|
43
44
|
|
|
@@ -41,12 +41,11 @@
|
|
|
41
41
|
<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-hyperlink@latest/+esm" type="module"></script>
|
|
42
42
|
<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-icon@latest/+esm" type="module"></script>
|
|
43
43
|
<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-button@latest/+esm" type="module"></script>
|
|
44
|
-
<script type="module">
|
|
44
|
+
<script type="module" data-demo-script="true">
|
|
45
45
|
import { renderPage } from './demo-support.min.js';
|
|
46
46
|
await renderPage('./customize.md');
|
|
47
47
|
import { initExamples } from "./customize.min.js";
|
|
48
48
|
initExamples();
|
|
49
49
|
</script>
|
|
50
|
-
<script src="./customize.min.js" data-demo-script="true" type="module"></script>
|
|
51
50
|
</body>
|
|
52
51
|
</html>
|
|
@@ -22,6 +22,7 @@
|
|
|
22
22
|
<auro-anchorlink fluid href="#cssParts" class="level2 body-xs">CSS Shadow Parts</auro-anchorlink>
|
|
23
23
|
<auro-anchorlink fluid href="#customBehavior">Behavior</auro-anchorlink>
|
|
24
24
|
<auro-anchorlink fluid href="#autoComplete" class="level2 body-xs">Autocomplete</auro-anchorlink>
|
|
25
|
+
<auro-anchorlink fluid href="#typeAhead" class="level2 body-xs">Type-Ahead</auro-anchorlink>
|
|
25
26
|
<auro-anchorlink fluid href="#disableComponent" class="level2 body-xs">Disable Component</auro-anchorlink>
|
|
26
27
|
<auro-anchorlink fluid href="#disableOptions" class="level2 body-xs">Disable Option(s)</auro-anchorlink>
|
|
27
28
|
<auro-anchorlink fluid href="#requireSelection" class="level2 body-xs">Require Selection</auro-anchorlink>
|
|
@@ -749,6 +750,76 @@
|
|
|
749
750
|
</form></code></pre>
|
|
750
751
|
<!-- AURO-GENERATED-CONTENT:END -->
|
|
751
752
|
</auro-accordion>
|
|
753
|
+
<auro-header level="3" id="typeAhead">Type-Ahead</auro-header>
|
|
754
|
+
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/customize/typeahead.md) -->
|
|
755
|
+
<!-- The below content is automatically added from ./../docs/partials/customize/typeahead.md -->
|
|
756
|
+
<p>Type-ahead lets a guest jump to an option by typing. As keys are pressed, the active option advances to the first enabled option whose <strong>displayed text</strong> starts with the buffered keystrokes — following the <auro-hyperlink href="https://www.w3.org/WAI/ARIA/apg/patterns/listbox/">WAI-ARIA Listbox pattern</auro-hyperlink>, and mirroring native HTML <code><select></code> behavior. Matching uses the rendered text rather than the <code>value</code> attribute.</p>
|
|
757
|
+
<p>The <code>typeaheadTimeoutMs</code> attribute (default <code>500</code>) controls how long the buffer persists between keystrokes. Repeating the same character cycles through every enabled option starting with it; disabled options are skipped.</p>
|
|
758
|
+
<div class="note">
|
|
759
|
+
<strong>Note:</strong> The <kbd>Space</kbd> key is context-sensitive. When the type-ahead buffer is empty it toggles the bib open or closed, matching the rest of <code><auro-select></code>. When the buffer is active it extends the buffer instead, so multi-word options such as "San Francisco" can be matched by typing <kbd>s</kbd>, <kbd>a</kbd>, <kbd>n</kbd>, <kbd>Space</kbd>, <kbd>f</kbd>.
|
|
760
|
+
</div>
|
|
761
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
762
|
+
<div class="exampleWrapper">
|
|
763
|
+
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/typeahead.html) -->
|
|
764
|
+
<!-- The below content is automatically added from ./../apiExamples/typeahead.html -->
|
|
765
|
+
<auro-select>
|
|
766
|
+
<span slot="ariaLabel.bib.close">Close Popup</span>
|
|
767
|
+
<span slot="bib.fullscreen.headline">Airport</span>
|
|
768
|
+
<span slot="label">Destination airport</span>
|
|
769
|
+
<auro-menu>
|
|
770
|
+
<auro-menuoption value="ANC">Anchorage</auro-menuoption>
|
|
771
|
+
<auro-menuoption value="ATL">Atlanta</auro-menuoption>
|
|
772
|
+
<auro-menuoption value="AUS">Austin</auro-menuoption>
|
|
773
|
+
<auro-menuoption value="BOS">Boston</auro-menuoption>
|
|
774
|
+
<auro-menuoption value="DEN">Denver</auro-menuoption>
|
|
775
|
+
<auro-menuoption value="DFW" disabled>Dallas/Fort Worth</auro-menuoption>
|
|
776
|
+
<auro-menuoption value="DTW">Detroit</auro-menuoption>
|
|
777
|
+
<auro-menuoption value="HNL">Honolulu</auro-menuoption>
|
|
778
|
+
<auro-menuoption value="LAX">Los Angeles</auro-menuoption>
|
|
779
|
+
<auro-menuoption value="MIA">Miami</auro-menuoption>
|
|
780
|
+
<auro-menuoption value="ORD">Chicago</auro-menuoption>
|
|
781
|
+
<auro-menuoption value="PDX">Portland</auro-menuoption>
|
|
782
|
+
<auro-menuoption value="PHX">Phoenix</auro-menuoption>
|
|
783
|
+
<auro-menuoption value="SAN">San Diego</auro-menuoption>
|
|
784
|
+
<auro-menuoption value="SEA">Seattle</auro-menuoption>
|
|
785
|
+
<auro-menuoption value="SFO">San Francisco</auro-menuoption>
|
|
786
|
+
<auro-menuoption value="SJC" disabled>San Jose</auro-menuoption>
|
|
787
|
+
<auro-menuoption value="SLC">Salt Lake City</auro-menuoption>
|
|
788
|
+
</auro-menu>
|
|
789
|
+
</auro-select>
|
|
790
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
791
|
+
</div>
|
|
792
|
+
<auro-accordion alignRight>
|
|
793
|
+
<span slot="trigger">See code</span>
|
|
794
|
+
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/typeahead.html) -->
|
|
795
|
+
<!-- The below code snippet is automatically added from ./../apiExamples/typeahead.html -->
|
|
796
|
+
<pre class="language-html"><code class="language-html"><auro-select>
|
|
797
|
+
<span slot="ariaLabel.bib.close">Close Popup</span>
|
|
798
|
+
<span slot="bib.fullscreen.headline">Airport</span>
|
|
799
|
+
<span slot="label">Destination airport</span>
|
|
800
|
+
<auro-menu>
|
|
801
|
+
<auro-menuoption value="ANC">Anchorage</auro-menuoption>
|
|
802
|
+
<auro-menuoption value="ATL">Atlanta</auro-menuoption>
|
|
803
|
+
<auro-menuoption value="AUS">Austin</auro-menuoption>
|
|
804
|
+
<auro-menuoption value="BOS">Boston</auro-menuoption>
|
|
805
|
+
<auro-menuoption value="DEN">Denver</auro-menuoption>
|
|
806
|
+
<auro-menuoption value="DFW" disabled>Dallas/Fort Worth</auro-menuoption>
|
|
807
|
+
<auro-menuoption value="DTW">Detroit</auro-menuoption>
|
|
808
|
+
<auro-menuoption value="HNL">Honolulu</auro-menuoption>
|
|
809
|
+
<auro-menuoption value="LAX">Los Angeles</auro-menuoption>
|
|
810
|
+
<auro-menuoption value="MIA">Miami</auro-menuoption>
|
|
811
|
+
<auro-menuoption value="ORD">Chicago</auro-menuoption>
|
|
812
|
+
<auro-menuoption value="PDX">Portland</auro-menuoption>
|
|
813
|
+
<auro-menuoption value="PHX">Phoenix</auro-menuoption>
|
|
814
|
+
<auro-menuoption value="SAN">San Diego</auro-menuoption>
|
|
815
|
+
<auro-menuoption value="SEA">Seattle</auro-menuoption>
|
|
816
|
+
<auro-menuoption value="SFO">San Francisco</auro-menuoption>
|
|
817
|
+
<auro-menuoption value="SJC" disabled>San Jose</auro-menuoption>
|
|
818
|
+
<auro-menuoption value="SLC">Salt Lake City</auro-menuoption>
|
|
819
|
+
</auro-menu>
|
|
820
|
+
</auro-select></code></pre>
|
|
821
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
822
|
+
</auro-accordion>
|
|
752
823
|
<auro-header level="3" id="disableComponent">Disable Component</auro-header>
|
|
753
824
|
<p>The entire component may be disabled. When disabled, the component will render to reflect the state, may not receive focus nor react to any key or pointer events.</p>
|
|
754
825
|
<p>When the component is disabled and part of a form, the components value is still included in the form submission.</p>
|
|
@@ -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 = '202606222118';
|
|
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 = '
|
|
6977
|
+
var formkitVersion = '202606222118';
|
|
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
|
-
//
|
|
7826
|
-
|
|
7827
|
-
|
|
7828
|
-
//
|
|
7829
|
-
|
|
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
|
-
|
|
7832
|
-
this.lastLetter = key;
|
|
7924
|
+
const key = _key.toLowerCase();
|
|
7833
7925
|
|
|
7834
|
-
//
|
|
7835
|
-
|
|
7836
|
-
|
|
7837
|
-
|
|
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
|
-
|
|
7841
|
-
if (letterOptions.length) {
|
|
7934
|
+
this.typeaheadBuffer += key;
|
|
7842
7935
|
|
|
7843
|
-
|
|
7844
|
-
this.dropdown.show();
|
|
7936
|
+
const isRepeatedChar = this.typeaheadBuffer.length > 1 && new Set(this.typeaheadBuffer).size === 1;
|
|
7845
7937
|
|
|
7846
|
-
|
|
7847
|
-
|
|
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
|
-
|
|
7850
|
-
|
|
7851
|
-
|
|
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
|
|
@@ -8799,8 +8906,8 @@ class AuroMenu extends AuroElement$1 {
|
|
|
8799
8906
|
// Malformed JSON (e.g. a literal string that happens to start with "[") falls back
|
|
8800
8907
|
// to a single-item array rather than throwing during render.
|
|
8801
8908
|
try {
|
|
8802
|
-
|
|
8803
|
-
return
|
|
8909
|
+
// any valid JSON starting with `[` ALWAYS parses to an array
|
|
8910
|
+
return JSON.parse(this.value);
|
|
8804
8911
|
} catch {
|
|
8805
8912
|
return [this.value];
|
|
8806
8913
|
}
|