@api-client/ui 0.5.52 → 0.5.54
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/build/src/md/menu/internal/Menu.d.ts.map +1 -1
- package/build/src/md/menu/internal/Menu.js +16 -5
- package/build/src/md/menu/internal/Menu.js.map +1 -1
- package/build/src/md/menu/internal/Menu.styles.d.ts.map +1 -1
- package/build/src/md/menu/internal/Menu.styles.js +5 -1
- package/build/src/md/menu/internal/Menu.styles.js.map +1 -1
- package/build/src/md/menu/internal/SubMenu.styles.d.ts.map +1 -1
- package/build/src/md/menu/internal/SubMenu.styles.js +22 -1
- package/build/src/md/menu/internal/SubMenu.styles.js.map +1 -1
- package/build/src/md/select/internals/Select.d.ts +62 -7
- package/build/src/md/select/internals/Select.d.ts.map +1 -1
- package/build/src/md/select/internals/Select.js +248 -32
- package/build/src/md/select/internals/Select.js.map +1 -1
- package/build/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/md/menu/internal/Menu.styles.ts +5 -1
- package/src/md/menu/internal/Menu.ts +17 -6
- package/src/md/menu/internal/SubMenu.styles.ts +22 -1
- package/src/md/select/internals/Select.ts +283 -26
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
import { __esDecorate, __runInitializers } from "tslib";
|
|
2
|
-
import { html
|
|
2
|
+
import { html } from 'lit';
|
|
3
3
|
import { property, query, state } from 'lit/decorators.js';
|
|
4
4
|
import { classMap } from 'lit/directives/class-map.js';
|
|
5
5
|
import { styleMap } from 'lit/directives/style-map.js';
|
|
6
6
|
import { setDisabled } from '../../../lib/disabled.js';
|
|
7
|
+
import { UiElement } from '../../UiElement.js';
|
|
7
8
|
import { nanoid } from 'nanoid';
|
|
8
9
|
import '../../text-field/ui-outlined-text-field.js';
|
|
9
10
|
import '../../menu/ui-menu.js';
|
|
10
11
|
import '../../icons/ui-icon.js';
|
|
11
12
|
import '../../focus-ring/ui-focus-ring.js';
|
|
12
13
|
let UiSelect = (() => {
|
|
13
|
-
let _classSuper =
|
|
14
|
+
let _classSuper = UiElement;
|
|
14
15
|
let _instanceExtraInitializers = [];
|
|
15
16
|
let _set_value_decorators;
|
|
16
17
|
let _name_decorators;
|
|
@@ -40,9 +41,6 @@ let UiSelect = (() => {
|
|
|
40
41
|
let _selectedOption_decorators;
|
|
41
42
|
let _selectedOption_initializers = [];
|
|
42
43
|
let _selectedOption_extraInitializers = [];
|
|
43
|
-
let _ariaActiveDescendant_decorators;
|
|
44
|
-
let _ariaActiveDescendant_initializers = [];
|
|
45
|
-
let _ariaActiveDescendant_extraInitializers = [];
|
|
46
44
|
let _menu_decorators;
|
|
47
45
|
let _menu_initializers = [];
|
|
48
46
|
let _menu_extraInitializers = [];
|
|
@@ -59,7 +57,6 @@ let UiSelect = (() => {
|
|
|
59
57
|
_disabled_decorators = [property({ type: Boolean, reflect: true })];
|
|
60
58
|
_open_decorators = [property({ type: Boolean, reflect: true })];
|
|
61
59
|
_selectedOption_decorators = [state()];
|
|
62
|
-
_ariaActiveDescendant_decorators = [state()];
|
|
63
60
|
_menu_decorators = [query('.menu')];
|
|
64
61
|
__esDecorate(this, null, _set_value_decorators, { kind: "setter", name: "value", static: false, private: false, access: { has: obj => "value" in obj, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, null, _instanceExtraInitializers);
|
|
65
62
|
__esDecorate(this, null, _name_decorators, { kind: "accessor", name: "name", static: false, private: false, access: { has: obj => "name" in obj, get: obj => obj.name, set: (obj, value) => { obj.name = value; } }, metadata: _metadata }, _name_initializers, _name_extraInitializers);
|
|
@@ -71,7 +68,6 @@ let UiSelect = (() => {
|
|
|
71
68
|
__esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
|
|
72
69
|
__esDecorate(this, null, _open_decorators, { kind: "accessor", name: "open", static: false, private: false, access: { has: obj => "open" in obj, get: obj => obj.open, set: (obj, value) => { obj.open = value; } }, metadata: _metadata }, _open_initializers, _open_extraInitializers);
|
|
73
70
|
__esDecorate(this, null, _selectedOption_decorators, { kind: "accessor", name: "selectedOption", static: false, private: false, access: { has: obj => "selectedOption" in obj, get: obj => obj.selectedOption, set: (obj, value) => { obj.selectedOption = value; } }, metadata: _metadata }, _selectedOption_initializers, _selectedOption_extraInitializers);
|
|
74
|
-
__esDecorate(this, null, _ariaActiveDescendant_decorators, { kind: "accessor", name: "ariaActiveDescendant", static: false, private: false, access: { has: obj => "ariaActiveDescendant" in obj, get: obj => obj.ariaActiveDescendant, set: (obj, value) => { obj.ariaActiveDescendant = value; } }, metadata: _metadata }, _ariaActiveDescendant_initializers, _ariaActiveDescendant_extraInitializers);
|
|
75
71
|
__esDecorate(this, null, _menu_decorators, { kind: "accessor", name: "menu", static: false, private: false, access: { has: obj => "menu" in obj, get: obj => obj.menu, set: (obj, value) => { obj.menu = value; } }, metadata: _metadata }, _menu_initializers, _menu_extraInitializers);
|
|
76
72
|
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
77
73
|
}
|
|
@@ -82,6 +78,18 @@ let UiSelect = (() => {
|
|
|
82
78
|
* the side effects.
|
|
83
79
|
*/
|
|
84
80
|
#value;
|
|
81
|
+
/**
|
|
82
|
+
* Type-ahead search string accumulated from user typing
|
|
83
|
+
*/
|
|
84
|
+
#typeAheadString = '';
|
|
85
|
+
/**
|
|
86
|
+
* Timer for resetting the type-ahead search string
|
|
87
|
+
*/
|
|
88
|
+
#typeAheadTimer = null;
|
|
89
|
+
/**
|
|
90
|
+
* Timeout duration for type-ahead reset (in milliseconds)
|
|
91
|
+
*/
|
|
92
|
+
static TYPE_AHEAD_TIMEOUT = 1000;
|
|
85
93
|
/**
|
|
86
94
|
* The currently selected value. Corresponds to the `value` attribute of the selected `ui-option`.
|
|
87
95
|
* When set programmatically, it will update the selected option if a matching option exists.
|
|
@@ -250,10 +258,7 @@ let UiSelect = (() => {
|
|
|
250
258
|
#selectedOption_accessor_storage = (__runInitializers(this, _open_extraInitializers), __runInitializers(this, _selectedOption_initializers, null));
|
|
251
259
|
get selectedOption() { return this.#selectedOption_accessor_storage; }
|
|
252
260
|
set selectedOption(value) { this.#selectedOption_accessor_storage = value; }
|
|
253
|
-
#
|
|
254
|
-
get ariaActiveDescendant() { return this.#ariaActiveDescendant_accessor_storage; }
|
|
255
|
-
set ariaActiveDescendant(value) { this.#ariaActiveDescendant_accessor_storage = value; }
|
|
256
|
-
#menu_accessor_storage = (__runInitializers(this, _ariaActiveDescendant_extraInitializers), __runInitializers(this, _menu_initializers, void 0));
|
|
261
|
+
#menu_accessor_storage = (__runInitializers(this, _selectedOption_extraInitializers), __runInitializers(this, _menu_initializers, void 0));
|
|
257
262
|
get menu() { return this.#menu_accessor_storage; }
|
|
258
263
|
set menu(value) { this.#menu_accessor_storage = value; }
|
|
259
264
|
/**
|
|
@@ -359,6 +364,14 @@ let UiSelect = (() => {
|
|
|
359
364
|
this.id = `select-${nanoid(6)}`;
|
|
360
365
|
}
|
|
361
366
|
}
|
|
367
|
+
disconnectedCallback() {
|
|
368
|
+
super.disconnectedCallback();
|
|
369
|
+
// Clean up the type-ahead timer
|
|
370
|
+
if (this.#typeAheadTimer) {
|
|
371
|
+
clearTimeout(this.#typeAheadTimer);
|
|
372
|
+
this.#typeAheadTimer = null;
|
|
373
|
+
}
|
|
374
|
+
}
|
|
362
375
|
/**
|
|
363
376
|
* Resets the select to its initial state. Called automatically when the parent
|
|
364
377
|
* form is reset. Part of the form-associated custom element API.
|
|
@@ -458,6 +471,11 @@ let UiSelect = (() => {
|
|
|
458
471
|
handleKeydown(e) {
|
|
459
472
|
if (this.disabled || e.defaultPrevented)
|
|
460
473
|
return;
|
|
474
|
+
// Handle type-ahead for printable characters
|
|
475
|
+
if (e.key.length === 1 && !e.ctrlKey && !e.altKey && !e.metaKey) {
|
|
476
|
+
this.handleTypeAhead(e.key.toLowerCase());
|
|
477
|
+
return;
|
|
478
|
+
}
|
|
461
479
|
if (this.open) {
|
|
462
480
|
switch (e.key) {
|
|
463
481
|
case 'Tab': {
|
|
@@ -477,27 +495,29 @@ let UiSelect = (() => {
|
|
|
477
495
|
}
|
|
478
496
|
case 'ArrowDown':
|
|
479
497
|
e.preventDefault();
|
|
480
|
-
this.
|
|
498
|
+
this.focusNextMenuItem();
|
|
481
499
|
return;
|
|
482
500
|
case 'ArrowUp':
|
|
483
501
|
e.preventDefault();
|
|
484
|
-
this.
|
|
502
|
+
this.focusPreviousMenuItem();
|
|
485
503
|
return;
|
|
486
504
|
case 'Home':
|
|
487
505
|
e.preventDefault();
|
|
488
|
-
this.
|
|
506
|
+
this.focusFirstMenuItem();
|
|
489
507
|
return;
|
|
490
508
|
case 'End':
|
|
491
509
|
e.preventDefault();
|
|
492
|
-
this.
|
|
510
|
+
this.focusLastMenuItem();
|
|
493
511
|
return;
|
|
494
512
|
case 'Enter':
|
|
495
|
-
case ' ':
|
|
496
|
-
|
|
513
|
+
case ' ': {
|
|
514
|
+
const currentItem = this.querySelector(':focus');
|
|
515
|
+
if (currentItem && this.isOptionSelectable(currentItem)) {
|
|
497
516
|
e.preventDefault();
|
|
498
|
-
this.menu.notifySelect(
|
|
517
|
+
this.menu.notifySelect(currentItem);
|
|
499
518
|
}
|
|
500
519
|
return;
|
|
520
|
+
}
|
|
501
521
|
}
|
|
502
522
|
}
|
|
503
523
|
else {
|
|
@@ -555,24 +575,220 @@ let UiSelect = (() => {
|
|
|
555
575
|
this.setAttribute('aria-expanded', String(this.open));
|
|
556
576
|
if (this.open) {
|
|
557
577
|
menu.showPopover();
|
|
558
|
-
// menu
|
|
559
|
-
if (this.selectedOption) {
|
|
560
|
-
this.
|
|
578
|
+
// Focus on the selected option or first selectable option when menu opens
|
|
579
|
+
if (this.selectedOption && this.isOptionSelectable(this.selectedOption)) {
|
|
580
|
+
this.selectedOption.focus();
|
|
581
|
+
this.selectedOption.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'nearest' });
|
|
561
582
|
}
|
|
562
583
|
else {
|
|
563
|
-
this.
|
|
584
|
+
const firstSelectableOption = this.getFirstSelectableOption();
|
|
585
|
+
if (firstSelectableOption) {
|
|
586
|
+
firstSelectableOption.focus();
|
|
587
|
+
firstSelectableOption.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'nearest' });
|
|
588
|
+
}
|
|
564
589
|
}
|
|
565
590
|
this.dispatchEvent(new CustomEvent('open', { bubbles: false, composed: true }));
|
|
566
|
-
this.focus();
|
|
567
591
|
}
|
|
568
592
|
else {
|
|
569
593
|
menu.hidePopover();
|
|
570
594
|
this.dispatchEvent(new CustomEvent('close', { bubbles: false, composed: true }));
|
|
595
|
+
// Return focus to the select element when menu closes
|
|
596
|
+
this.focus();
|
|
597
|
+
}
|
|
598
|
+
}
|
|
599
|
+
/**
|
|
600
|
+
* Focus the next menu item in the dropdown, skipping disabled options
|
|
601
|
+
*/
|
|
602
|
+
focusNextMenuItem() {
|
|
603
|
+
const currentItem = this.querySelector(':focus');
|
|
604
|
+
const nextItem = currentItem ? this.getNextSelectableOption(currentItem) : this.getFirstSelectableOption();
|
|
605
|
+
if (nextItem) {
|
|
606
|
+
nextItem.focus();
|
|
607
|
+
}
|
|
608
|
+
}
|
|
609
|
+
/**
|
|
610
|
+
* Focus the previous menu item in the dropdown, skipping disabled options
|
|
611
|
+
*/
|
|
612
|
+
focusPreviousMenuItem() {
|
|
613
|
+
const currentItem = this.querySelector(':focus');
|
|
614
|
+
const previousItem = currentItem ? this.getPreviousSelectableOption(currentItem) : this.getLastSelectableOption();
|
|
615
|
+
if (previousItem) {
|
|
616
|
+
previousItem.focus();
|
|
617
|
+
}
|
|
618
|
+
}
|
|
619
|
+
/**
|
|
620
|
+
* Focus the first menu item in the dropdown, skipping disabled options
|
|
621
|
+
*/
|
|
622
|
+
focusFirstMenuItem() {
|
|
623
|
+
const firstItem = this.getFirstSelectableOption();
|
|
624
|
+
if (firstItem) {
|
|
625
|
+
firstItem.focus();
|
|
626
|
+
}
|
|
627
|
+
}
|
|
628
|
+
/**
|
|
629
|
+
* Focus the last menu item in the dropdown, skipping disabled options
|
|
630
|
+
*/
|
|
631
|
+
focusLastMenuItem() {
|
|
632
|
+
const lastItem = this.getLastSelectableOption();
|
|
633
|
+
if (lastItem) {
|
|
634
|
+
lastItem.focus();
|
|
635
|
+
}
|
|
636
|
+
}
|
|
637
|
+
/**
|
|
638
|
+
* Gets the first selectable (non-disabled) option
|
|
639
|
+
*/
|
|
640
|
+
getFirstSelectableOption() {
|
|
641
|
+
const options = this.querySelectorAll('ui-option');
|
|
642
|
+
for (const option of options) {
|
|
643
|
+
if (this.isOptionSelectable(option)) {
|
|
644
|
+
return option;
|
|
645
|
+
}
|
|
646
|
+
}
|
|
647
|
+
return null;
|
|
648
|
+
}
|
|
649
|
+
/**
|
|
650
|
+
* Gets the last selectable (non-disabled) option
|
|
651
|
+
*/
|
|
652
|
+
getLastSelectableOption() {
|
|
653
|
+
const options = Array.from(this.querySelectorAll('ui-option')).reverse();
|
|
654
|
+
for (const option of options) {
|
|
655
|
+
if (this.isOptionSelectable(option)) {
|
|
656
|
+
return option;
|
|
657
|
+
}
|
|
658
|
+
}
|
|
659
|
+
return null;
|
|
660
|
+
}
|
|
661
|
+
/**
|
|
662
|
+
* Gets the next selectable option after the current one, wrapping around if needed
|
|
663
|
+
*/
|
|
664
|
+
getNextSelectableOption(currentOption) {
|
|
665
|
+
const options = Array.from(this.querySelectorAll('ui-option'));
|
|
666
|
+
const currentIndex = options.indexOf(currentOption);
|
|
667
|
+
if (currentIndex === -1) {
|
|
668
|
+
return this.getFirstSelectableOption();
|
|
669
|
+
}
|
|
670
|
+
// Start from the next option and wrap around
|
|
671
|
+
for (let i = 1; i < options.length; i++) {
|
|
672
|
+
const nextIndex = (currentIndex + i) % options.length;
|
|
673
|
+
const option = options[nextIndex];
|
|
674
|
+
if (this.isOptionSelectable(option)) {
|
|
675
|
+
return option;
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
return currentOption; // Return current if no other selectable option found
|
|
679
|
+
}
|
|
680
|
+
/**
|
|
681
|
+
* Gets the previous selectable option before the current one, wrapping around if needed
|
|
682
|
+
*/
|
|
683
|
+
getPreviousSelectableOption(currentOption) {
|
|
684
|
+
const options = Array.from(this.querySelectorAll('ui-option'));
|
|
685
|
+
const currentIndex = options.indexOf(currentOption);
|
|
686
|
+
if (currentIndex === -1) {
|
|
687
|
+
return this.getLastSelectableOption();
|
|
688
|
+
}
|
|
689
|
+
// Start from the previous option and wrap around
|
|
690
|
+
for (let i = 1; i < options.length; i++) {
|
|
691
|
+
const prevIndex = (currentIndex - i + options.length) % options.length;
|
|
692
|
+
const option = options[prevIndex];
|
|
693
|
+
if (this.isOptionSelectable(option)) {
|
|
694
|
+
return option;
|
|
695
|
+
}
|
|
696
|
+
}
|
|
697
|
+
return currentOption; // Return current if no other selectable option found
|
|
698
|
+
}
|
|
699
|
+
/**
|
|
700
|
+
* Checks if an option is selectable (not disabled and not hidden)
|
|
701
|
+
*/
|
|
702
|
+
isOptionSelectable(option) {
|
|
703
|
+
if (option.disabled) {
|
|
704
|
+
return false;
|
|
705
|
+
}
|
|
706
|
+
if (option.hasAttribute('disabled')) {
|
|
707
|
+
return false;
|
|
571
708
|
}
|
|
709
|
+
if (option.hidden && option.hasAttribute('hidden')) {
|
|
710
|
+
return false;
|
|
711
|
+
}
|
|
712
|
+
return true;
|
|
713
|
+
}
|
|
714
|
+
/**
|
|
715
|
+
* Handles type-ahead functionality for keyboard navigation
|
|
716
|
+
*/
|
|
717
|
+
handleTypeAhead(char) {
|
|
718
|
+
// Clear the existing timer
|
|
719
|
+
if (this.#typeAheadTimer) {
|
|
720
|
+
clearTimeout(this.#typeAheadTimer);
|
|
721
|
+
}
|
|
722
|
+
// Add the character to the search string
|
|
723
|
+
this.#typeAheadString += char;
|
|
724
|
+
// Find the matching option
|
|
725
|
+
const matchingOption = this.findOptionByTypeAhead(this.#typeAheadString);
|
|
726
|
+
if (matchingOption) {
|
|
727
|
+
if (this.open) {
|
|
728
|
+
// If menu is open, focus the matching option
|
|
729
|
+
matchingOption.focus();
|
|
730
|
+
}
|
|
731
|
+
else {
|
|
732
|
+
// If menu is closed, select the matching option
|
|
733
|
+
this.selectOption(matchingOption);
|
|
734
|
+
}
|
|
735
|
+
}
|
|
736
|
+
// Set a timer to reset the search string
|
|
737
|
+
this.#typeAheadTimer = window.setTimeout(() => {
|
|
738
|
+
this.#typeAheadString = '';
|
|
739
|
+
this.#typeAheadTimer = null;
|
|
740
|
+
}, UiSelect.TYPE_AHEAD_TIMEOUT);
|
|
741
|
+
}
|
|
742
|
+
/**
|
|
743
|
+
* Finds an option that matches the type-ahead search string
|
|
744
|
+
*/
|
|
745
|
+
findOptionByTypeAhead(searchString) {
|
|
746
|
+
const options = this.querySelectorAll('ui-option');
|
|
747
|
+
for (const option of options) {
|
|
748
|
+
if (!this.isOptionSelectable(option)) {
|
|
749
|
+
continue;
|
|
750
|
+
}
|
|
751
|
+
// Get the option's text content for comparison
|
|
752
|
+
const optionText = this.getOptionDisplayText(option).toLowerCase();
|
|
753
|
+
if (optionText.startsWith(searchString)) {
|
|
754
|
+
return option;
|
|
755
|
+
}
|
|
756
|
+
}
|
|
757
|
+
return null;
|
|
758
|
+
}
|
|
759
|
+
/**
|
|
760
|
+
* Gets the display text for an option (either textContent or renderValue)
|
|
761
|
+
*/
|
|
762
|
+
getOptionDisplayText(option) {
|
|
763
|
+
// Use renderValue if available, otherwise fall back to textContent
|
|
764
|
+
return option.renderValue || option.textContent?.trim() || '';
|
|
765
|
+
}
|
|
766
|
+
/**
|
|
767
|
+
* Selects an option and updates the component state
|
|
768
|
+
*/
|
|
769
|
+
selectOption(option) {
|
|
770
|
+
if (this.selectedOption && this.selectedOption !== option) {
|
|
771
|
+
this.selectedOption.selected = false;
|
|
772
|
+
}
|
|
773
|
+
option.selected = true;
|
|
774
|
+
this.selectedOption = option;
|
|
775
|
+
this.#value = option.value;
|
|
776
|
+
this.#internals.setFormValue(this.value ?? null);
|
|
777
|
+
// Dispatch change event
|
|
778
|
+
const changeEvent = new CustomEvent('change', {
|
|
779
|
+
detail: { value: this.value, item: option },
|
|
780
|
+
bubbles: false,
|
|
781
|
+
composed: true,
|
|
782
|
+
});
|
|
783
|
+
this.dispatchEvent(changeEvent);
|
|
572
784
|
}
|
|
573
785
|
handleSelect(e) {
|
|
574
786
|
e.stopPropagation();
|
|
575
787
|
const item = e.detail.item;
|
|
788
|
+
if (this.selectedOption && this.selectedOption !== item) {
|
|
789
|
+
this.selectedOption.selected = false;
|
|
790
|
+
}
|
|
791
|
+
item.selected = true;
|
|
576
792
|
this.selectedOption = item;
|
|
577
793
|
this.#value = item.value;
|
|
578
794
|
this.#internals.setFormValue(this.value ?? null);
|
|
@@ -584,14 +800,16 @@ let UiSelect = (() => {
|
|
|
584
800
|
composed: true,
|
|
585
801
|
});
|
|
586
802
|
this.dispatchEvent(changeEvent);
|
|
587
|
-
|
|
588
|
-
}
|
|
589
|
-
handleHighlightChange(e) {
|
|
590
|
-
this.ariaActiveDescendant = e.detail.item?.id;
|
|
803
|
+
// Focus will be returned to select element by handleOpenChange when open=false
|
|
591
804
|
}
|
|
592
805
|
handleMenuClose() {
|
|
593
806
|
this.open = false;
|
|
594
|
-
|
|
807
|
+
// Focus will be returned to select element by handleOpenChange when open=false
|
|
808
|
+
}
|
|
809
|
+
handleMenuToggle(e) {
|
|
810
|
+
if (e.newState === 'closed') {
|
|
811
|
+
this.open = false;
|
|
812
|
+
}
|
|
595
813
|
}
|
|
596
814
|
renderInput() {
|
|
597
815
|
const styles = {
|
|
@@ -630,7 +848,7 @@ let UiSelect = (() => {
|
|
|
630
848
|
selector="ui-option"
|
|
631
849
|
@select="${this.handleSelect}"
|
|
632
850
|
@close="${this.handleMenuClose}"
|
|
633
|
-
@
|
|
851
|
+
@toggle="${this.handleMenuToggle}"
|
|
634
852
|
>
|
|
635
853
|
<slot @slotchange="${this.handleSlotChange}"></slot>
|
|
636
854
|
</ui-menu>`;
|
|
@@ -653,9 +871,7 @@ let UiSelect = (() => {
|
|
|
653
871
|
'disabled': this.disabled,
|
|
654
872
|
});
|
|
655
873
|
return html `${this.renderFocusRing()}
|
|
656
|
-
<div class="${classes}"
|
|
657
|
-
${this.renderInput()} ${this.renderMenu()}
|
|
658
|
-
</div> `;
|
|
874
|
+
<div class="${classes}">${this.renderInput()} ${this.renderMenu()}</div> `;
|
|
659
875
|
}
|
|
660
876
|
};
|
|
661
877
|
})();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAkC,MAAM,KAAK,CAAA;AACtE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAGtD,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;AAE/B,OAAO,4CAA4C,CAAA;AACnD,OAAO,uBAAuB,CAAA;AAC9B,OAAO,wBAAwB,CAAA;AAC/B,OAAO,mCAAmC,CAAA;;sBAeJ,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAA3B,QAAS,SAAQ,WAAU;;;qCA2B7C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gCAoB1B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iCAc1B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAc1B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mCAc3B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uCAc3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAK1B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAe1B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gCAgB1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CAE1C,KAAK,EAAE;gDACP,KAAK,EAAE;gCACP,KAAK,CAAC,OAAO,CAAC;YAnHf,iLAAI,KAAK,wEAKR;YAc2B,iKAAS,IAAI,6BAAJ,IAAI,mFAAoB;YAcjC,oKAAS,KAAK,6BAAL,KAAK,qFAAoB;YAcjC,6KAAS,QAAQ,6BAAR,QAAQ,2FAAQ;YAczB,0KAAS,OAAO,6BAAP,OAAO,yFAAqB;YActC,sLAAS,WAAW,6BAAX,WAAW,iGAAoB;YAKxC,+LAAS,cAAc,6BAAd,cAAc,uGAAoB;YAe3B,6KAAS,QAAQ,6BAAR,QAAQ,2FAAQ;YAgBzB,iKAAS,IAAI,6BAAJ,IAAI,mFAAQ;YAExD,+LAAS,cAAc,6BAAd,cAAc,uGAAwB;YAC/C,iNAAS,oBAAoB,6BAApB,oBAAoB,mHAAoB;YAC1C,iKAAS,IAAI,6BAAJ,IAAI,mFAAgB;;;QA9I7C,MAAM,CAAU,cAAc,GAAG,IAAI,CAAA;QACrC,UAAU,IAFS,mDAAQ,EAEd,IAAI,CAAC,eAAe,EAAE,EAAA;QAEnC;;;WAGG;QACH,MAAM,CAAoB;QAE1B;;;;;;;;;;;;WAYG;QACH,IAAI,KAAK;YACP,OAAO,IAAI,CAAC,MAAM,CAAA;QACpB,CAAC;QAGD,IAAI,KAAK,CAAC,QAA4B;YACpC,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAA;YAC5B,IAAI,QAAQ,KAAK,QAAQ;gBAAE,OAAM;YACjC,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAA;YACtB,IAAI,CAAC,aAAa,EAAE,CAAA;QACtB,CAAC;QAc2B,6EAAiC;QAZ7D;;;;;;;;;;;WAWG;QACyB,IAAS,IAAI,0CAAoB;QAAjC,IAAS,IAAI,gDAAoB;QAcjC,mIAAkC;QAZ9D;;;;;;;;;;;WAWG;QACyB,IAAS,KAAK,2CAAoB;QAAlC,IAAS,KAAK,iDAAoB;QAcjC,iIAAoB,KAAK;QAEtD;;;;;;;;;;;WAWG;WAbmD;QAZtD;;;;;;;;;;;WAWG;QAC0B,IAAS,QAAQ,8CAAQ;QAAzB,IAAS,QAAQ,oDAAQ;QAczB,2IAAqC;QAZlE;;;;;;;;;;;WAWG;QAC0B,IAAS,OAAO,6CAAqB;QAArC,IAAS,OAAO,mDAAqB;QActC,kJAAwC;QAZpE;;;;;;;;;;;WAWG;QACyB,IAAS,WAAW,iDAAoB;QAAxC,IAAS,WAAW,uDAAoB;QAKxC,4JAA2C;QAHvE;;WAEG;QACyB,IAAS,cAAc,oDAAoB;QAA3C,IAAS,cAAc,0DAAoB;QAe3B,0IAAoB,KAAK;QAErE;;;;;;;;;;;;;WAaG;WAfkE;QAbrE;;;;;;;;;;;;WAYG;QACyC,IAAS,QAAQ,8CAAQ;QAAzB,IAAS,QAAQ,oDAAQ;QAgBzB,4HAAgB,KAAK,GAAA;QAdjE;;;;;;;;;;;;;WAaG;QACyC,IAAS,IAAI,0CAAQ;QAArB,IAAS,IAAI,gDAAQ;QAExD,4IAA2C,IAAI,GAAA;QAA/C,IAAS,cAAc,oDAAwB;QAA/C,IAAS,cAAc,0DAAwB;QAC/C,2KAAiD;QAAjD,IAAS,oBAAoB,0DAAoB;QAAjD,IAAS,oBAAoB,gEAAoB;QAC1C,iJAA6B;QAA7B,IAAS,IAAI,0CAAgB;QAA7B,IAAS,IAAI,gDAAgB;QAE7C;;;;;;;;;;;;;WAaG;QACH,IAAI,YAAY;YACd,OAAO,IAAI,CAAC,cAAc,CAAA;QAC5B,CAAC;QAED;;;;;;;;;;WAUG;QACH,IAAI,WAAW;YACb,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,CAAA;YAChC,OAAO,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAA;QACrC,CAAC;QAED;;;;;WAKG;QACH,IAAI,IAAI;YACN,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,CAAA;QAC7B,CAAC;QAED;;;;;WAKG;QACH,IAAI,QAAQ;YACV,OAAO,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAA;QACjC,CAAC;QAED;;;;;WAKG;QACH,IAAI,iBAAiB;YACnB,OAAO,IAAI,CAAC,UAAU,CAAC,iBAAiB,CAAA;QAC1C,CAAC;QAED;;;;;WAKG;QACH,IAAI,YAAY;YACd,OAAO,IAAI,CAAC,UAAU,CAAC,YAAY,CAAA;QACrC,CAAC;QAED;;;;;;;;;;;;WAYG;QACH,aAAa;YACX,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,CAAA;QACxC,CAAC;QAED;YACE,KAAK,EAAE,CAAA;;YACP,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YAC3D,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACzD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;SAChE;QAEQ,iBAAiB;YACxB,KAAK,CAAC,iBAAiB,EAAE,CAAA;YACzB,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAA;YACrC,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,SAAS,CAAC,CAAA;YAC7C,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,CAAA;YAC1C,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACnB,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;YACpC,CAAC;YACD,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;gBACb,IAAI,CAAC,EAAE,GAAG,UAAU,MAAM,CAAC,CAAC,CAAC,EAAE,CAAA;YACjC,CAAC;QACH,CAAC;QAED;;;;;;;;;WASG;QACH,iBAAiB;YACf,IAAI,CAAC,KAAK,GAAG,SAAS,CAAA;QACxB,CAAC;QAED;;;;;WAKG;QACH,wBAAwB,CAAC,KAAoB;YAC3C,IAAI,CAAC,KAAK,GAAG,KAAK,IAAI,SAAS,CAAA;QACjC,CAAC;QAED;;;;;;;;;;;;WAYG;QACH,QAAQ;YACN,IAAI,OAAO,GAAG,EAAE,CAAA;YAChB,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;gBACjC,OAAO,GAAG,wBAAwB,CAAA;gBAClC,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,EAAE,OAAO,CAAC,CAAA;YAC9D,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,CAAC,CAAA;YACjC,CAAC;YACD,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAA;YAC9C,IAAI,CAAC,WAAW,GAAG,OAAO,CAAA;QAC5B,CAAC;QAEkB,UAAU,CAAC,iBAAuC;YACnE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAA;YACnC,IAAI,iBAAiB,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;gBACtC,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAA;YAClC,CAAC;YACD,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;gBAClC,IAAI,CAAC,gBAAgB,EAAE,CAAA;YACzB,CAAC;YACD,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;gBACnC,IAAI,CAAC,gBAAgB,EAAE,CAAA;gBACvB,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAA;gBAChD,IAAI,CAAC,QAAQ,EAAE,CAAA;YACjB,CAAC;YACD,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;gBACnC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;oBACf,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,CAAA;gBAC7C,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC,CAAA;gBACpC,CAAC;YACH,CAAC;QACH,CAAC;QAEkB,YAAY,CAAC,EAAkB;YAChD,KAAK,CAAC,YAAY,CAAC,EAAE,CAAC,CAAA;YACtB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE;gBAC5B,IAAI,CAAC,gBAAgB,EAAE,CAAA;gBACvB,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAA;gBAChD,oEAAoE;gBACpE,4DAA4D;gBAC5D,yBAAyB;gBACzB,IAAI,CAAC,aAAa,EAAE,CAAA;YACtB,CAAC,CAAC,CAAA;QACJ,CAAC;QAES,gBAAgB;YACxB,MAAM,OAAO,GAAG,IAAI,CAAC,gBAAgB,CAAW,WAAW,CAAC,CAAA;YAC5D,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;gBACf,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAAA;YACjG,CAAC;iBAAM,CAAC;gBACN,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;gBACtE,IAAI,QAAQ,EAAE,CAAC;oBACb,IAAI,CAAC,cAAc,GAAG,QAAQ,CAAA;oBAC9B,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,KAAK,CAAA;gBAC9B,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,cAAc,GAAG,IAAI,CAAA;gBAC5B,CAAC;YACH,CAAC;QACH,CAAC;QAES,aAAa,CAAC,CAAgB;YACtC,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,gBAAgB;gBAAE,OAAM;YAC/C,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gBACd,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;oBACd,KAAK,KAAK,CAAC,CAAC,CAAC;wBACX,+EAA+E;wBAC/E,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;4BACd,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;wBACnB,CAAC;wBACD,MAAK;oBACP,CAAC;oBACD,KAAK,QAAQ,CAAC,CAAC,CAAC;wBACd,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;4BACd,CAAC,CAAC,cAAc,EAAE,CAAA;4BAClB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;4BACjB,IAAI,CAAC,KAAK,EAAE,CAAA,CAAC,qCAAqC;wBACpD,CAAC;wBACD,MAAK;oBACP,CAAC;oBACD,KAAK,WAAW;wBACd,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAA;wBACzB,OAAM;oBACR,KAAK,SAAS;wBACZ,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAA;wBAC7B,OAAM;oBACR,KAAK,MAAM;wBACT,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAA;wBAC1B,OAAM;oBACR,KAAK,KAAK;wBACR,CAAC,CAAC,cAAc,EAAE,CAAA;wBAClB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAA;wBACzB,OAAM;oBACR,KAAK,OAAO,CAAC;oBACb,KAAK,GAAG;wBACN,IAAI,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC;4BAChC,CAAC,CAAC,cAAc,EAAE,CAAA;4BAClB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,iBAA6B,CAAC,CAAA;wBACjE,CAAC;wBACD,OAAM;gBACV,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;oBACd,KAAK,OAAO,CAAC;oBACb,KAAK,GAAG,CAAC,CAAC,CAAC;wBACT,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;4BACf,CAAC,CAAC,cAAc,EAAE,CAAA;4BAClB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;wBAClB,CAAC;wBACD,MAAK;oBACP,CAAC;oBACD,KAAK,WAAW,CAAC;oBACjB,KAAK,SAAS,CAAC,CAAC,CAAC;wBACf,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;4BACf,CAAC,CAAC,cAAc,EAAE,CAAA;4BAClB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;wBAClB,CAAC;wBACD,kDAAkD;wBAClD,MAAK;oBACP,CAAC;gBACH,CAAC;YACH,CAAC;QACH,CAAC;QAES,UAAU,CAAC,CAAa;YAChC,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAM;YAEzB,8DAA8D;YAC9D,MAAM,aAAa,GAAG,CAAC,CAAC,aAA4B,CAAA;YAEpD,IAAI,aAAa,IAAI,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;gBAClD,4CAA4C;gBAC5C,OAAM;YACR,CAAC;YAED,iDAAiD;YACjD,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;QACnB,CAAC;QAES,WAAW,CAAC,CAAQ;YAC5B,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,gBAAgB;gBAAE,OAAM;YAC/C,CAAC,CAAC,cAAc,EAAE,CAAA;YAClB,CAAC,CAAC,eAAe,EAAE,CAAA;YACnB,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,EAAE,CAAC;gBACnC,4DAA4D;gBAC5D,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;gBACjB,OAAM;YACR,CAAC;YACD,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAClB,CAAC;QAES,KAAK,CAAC,gBAAgB;YAC9B,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAA;YACtB,IAAI,CAAC,IAAI,EAAE,CAAC;gBACV,oDAAoD;gBACpD,OAAM;YACR,CAAC;YACD,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;YACrD,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gBACd,IAAI,CAAC,WAAW,EAAE,CAAA;gBAClB,eAAe;gBACf,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;oBACxB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;gBAC9C,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAA;gBAC5B,CAAC;gBACD,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,MAAM,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;gBAC/E,IAAI,CAAC,KAAK,EAAE,CAAA;YACd,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,WAAW,EAAE,CAAA;gBAClB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;YAClF,CAAC;QACH,CAAC;QAED,YAAY,CAAC,CAAkC;YAC7C,CAAC,CAAC,eAAe,EAAE,CAAA;YACnB,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,CAAA;YAC1B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAA;YAC1B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAA;YACxB,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAA;YAChD,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;YAEjB,wBAAwB;YACxB,MAAM,WAAW,GAAG,IAAI,WAAW,CAAsB,QAAQ,EAAE;gBACjE,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE;gBACzC,OAAO,EAAE,KAAK;gBACd,QAAQ,EAAE,IAAI;aACf,CAAC,CAAA;YACF,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,CAAA;YAC/B,IAAI,CAAC,KAAK,EAAE,CAAA;QACd,CAAC;QAED,qBAAqB,CAAC,CAAyC;YAC7D,IAAI,CAAC,oBAAoB,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,CAAA;QAC/C,CAAC;QAED,eAAe;YACb,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;YACjB,IAAI,CAAC,KAAK,EAAE,CAAA;QACd,CAAC;QAES,WAAW;YACnB,MAAM,MAAM,GAAG;gBACb,aAAa,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE;aAC9B,CAAA;YACD,OAAO,IAAI,CAAA;cACD,IAAI,CAAC,IAAI;eACR,IAAI,CAAC,KAAK;eACV,IAAI,CAAC,WAAW;kBACb,IAAI,CAAC,QAAQ;kBACb,IAAI,CAAC,QAAQ;;;eAGhB,IAAI;;iBAEF,IAAI,CAAC,OAAO;qBACR,IAAI,CAAC,WAAW,IAAI,EAAE;wBACnB,IAAI,CAAC,cAAc,IAAI,EAAE;;cAEnC,QAAQ,CAAC,MAAM,CAAC;;;;8BAIA,CAAA;QAC5B,CAAC;QAES,UAAU;YAClB,MAAM,MAAM,GAAG;gBACb,iBAAiB,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE;aAClC,CAAA;YACD,OAAO,IAAI,CAAA;;;;cAID,QAAQ,CAAC,MAAM,CAAC;;;iBAGb,IAAI,CAAC,YAAY;gBAClB,IAAI,CAAC,eAAe;0BACV,IAAI,CAAC,qBAAqB;;2BAEzB,IAAI,CAAC,gBAAgB;eACjC,CAAA;QACb,CAAC;QAES,KAAK,CAAC,gBAAgB;YAC9B,yDAAyD;YACzD,8CAA8C;YAC9C,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;gBAChB,IAAI,CAAC,gBAAgB,EAAE,CAAA;gBACvB,IAAI,CAAC,aAAa,EAAE,CAAA;YACtB,CAAC;QACH,CAAC;QAES,eAAe;YACvB,OAAO,IAAI,CAAA,iEAAiE,IAAmB,oBAAoB,CAAA;QACrH,CAAC;QAEQ,MAAM;YACb,MAAM,OAAO,GAAG,QAAQ,CAAC;gBACvB,WAAW,EAAE,IAAI;gBACjB,MAAM,EAAE,IAAI,CAAC,IAAI;gBACjB,UAAU,EAAE,IAAI,CAAC,QAAQ;aAC1B,CAAC,CAAA;YACF,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,eAAe,EAAE;oBACpB,OAAO,2BAA2B,IAAI,CAAC,oBAAoB,IAAI,EAAE;UAC3E,IAAI,CAAC,WAAW,EAAE,IAAI,IAAI,CAAC,UAAU,EAAE;cACnC,CAAA;QACZ,CAAC;;;AA5jBH;;;;;;;GAOG;AACH","sourcesContent":["import { html, LitElement, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport type UiOption from './Option.js'\nimport type { UiMenuElement } from '../../menu/ui-menu.js'\nimport { nanoid } from 'nanoid'\n\nimport '../../text-field/ui-outlined-text-field.js'\nimport '../../menu/ui-menu.js'\nimport '../../icons/ui-icon.js'\nimport '../../focus-ring/ui-focus-ring.js'\n\nexport interface UiSelectChangeEvent {\n value: string | undefined\n item: UiOption | null\n}\n\n/**\n * Material Design 3 Select component that behaves like an outlined text field with dropdown.\n *\n * @fires change - Dispatched when the selection changes. The event is non-bubbling and non-cancelable.\n * The `event.detail` object contains the `value` and `item` properties.\n * @fires open - Dispatched when the dropdown opens\n * @fires close - Dispatched when the dropdown closes\n */\nexport default class UiSelect extends LitElement {\n static readonly formAssociated = true\n #internals = this.attachInternals()\n\n /**\n * The value has a private member so that we can set the value without triggering\n * the side effects.\n */\n #value: string | undefined\n\n /**\n * The currently selected value. Corresponds to the `value` attribute of the selected `ui-option`.\n * When set programmatically, it will update the selected option if a matching option exists.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select value=\"apple\">\n * <ui-option value=\"apple\">Apple</ui-option>\n * <ui-option value=\"banana\">Banana</ui-option>\n * </ui-select>\n * ```\n */\n get value(): string | undefined {\n return this.#value\n }\n\n @property({ type: String })\n set value(newValue: string | undefined) {\n const oldValue = this.#value\n if (newValue === oldValue) return\n this.#value = newValue\n this.requestUpdate()\n }\n\n /**\n * The name attribute for form submission. This value will be used as the key\n * when the form is submitted.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select name=\"country\" value=\"us\">\n * <ui-option value=\"us\">United States</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: String }) accessor name: string | undefined\n\n /**\n * The label text displayed in the select field. Provides accessible labeling\n * and is shown as the floating label in the outlined text field.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select label=\"Select a country\">\n * <ui-option value=\"us\">United States</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: String }) accessor label: string | undefined\n\n /**\n * Whether the select is required for form validation. When true, the select\n * must have a value selected for the form to be valid.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select required label=\"Required field\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: Boolean }) accessor required = false\n\n /**\n * Whether the select is in an invalid state. This is typically set automatically\n * during validation, but can be set manually to indicate validation errors.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select invalid invalidText=\"Please select a valid option\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: Boolean }) accessor invalid: boolean | undefined\n\n /**\n * The error message to display when the select is invalid. This text is shown\n * below the select field when `invalid` is true.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select invalid invalidText=\"This field is required\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: String }) accessor invalidText: string | undefined\n\n /**\n * @attribute\n */\n @property({ type: String }) accessor supportingText: string | undefined\n\n /**\n * Whether the select is disabled. When disabled, the select cannot be interacted\n * with and will not receive focus or respond to user input.\n *\n * @default false\n * @attribute\n * @example\n * ```html\n * <ui-select disabled label=\"Disabled select\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n /**\n * Whether the dropdown menu is currently open. This property reflects the\n * current state of the dropdown and can be set programmatically to open/close it.\n *\n * @default false\n * @example\n * ```javascript\n * // Open the dropdown programmatically\n * selectElement.open = true;\n *\n * // Close the dropdown\n * selectElement.open = false;\n * ```\n */\n @property({ type: Boolean, reflect: true }) accessor open = false\n\n @state() accessor selectedOption: UiOption | null = null\n @state() accessor ariaActiveDescendant: string | undefined\n @query('.menu') accessor menu!: UiMenuElement\n\n /**\n * Returns the currently selected option element. This provides access to the\n * full `ui-option` element, not just its value.\n *\n * @readonly\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * const selectedItem = select.selectedItem;\n * if (selectedItem) {\n * console.log('Selected option:', selectedItem.textContent);\n * }\n * ```\n */\n get selectedItem(): UiOption | null {\n return this.selectedOption\n }\n\n /**\n * Returns the text content that should be displayed in the select field.\n * This is the rendered value of the currently selected option.\n *\n * @readonly\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * console.log('Display text:', select.renderValue);\n * ```\n */\n get renderValue(): string {\n const item = this.selectedOption\n return item ? item.renderValue : ''\n }\n\n /**\n * Returns the form element that contains this select, if any.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get form(): HTMLFormElement | null {\n return this.#internals.form\n }\n\n /**\n * Returns the validity state of the select element.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get validity(): ValidityState {\n return this.#internals.validity\n }\n\n /**\n * Returns the validation message for the select element.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get validationMessage(): string {\n return this.#internals.validationMessage\n }\n\n /**\n * Returns whether the select element will be validated when the form is submitted.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get willValidate(): boolean {\n return this.#internals.willValidate\n }\n\n /**\n * Checks the validity of the select element and returns true if valid.\n * Part of the form-associated custom element API.\n *\n * @returns {boolean} True if the element is valid, false otherwise\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * if (!select.checkValidity()) {\n * console.log('Select is invalid:', select.validationMessage);\n * }\n * ```\n */\n checkValidity(): boolean {\n return this.#internals.checkValidity()\n }\n\n constructor() {\n super()\n this.addEventListener('click', this.handleClick.bind(this))\n this.addEventListener('blur', this.handleBlur.bind(this))\n this.addEventListener('keydown', this.handleKeydown.bind(this))\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n this.setAttribute('role', 'combobox')\n this.setAttribute('aria-haspopup', 'listbox')\n this.setAttribute('aria-controls', 'menu')\n if (!this.disabled) {\n this.setAttribute('tabindex', '0')\n }\n if (!this.id) {\n this.id = `select-${nanoid(6)}`\n }\n }\n\n /**\n * Resets the select to its initial state. Called automatically when the parent\n * form is reset. Part of the form-associated custom element API.\n *\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * select.formResetCallback(); // Clears the selection\n * ```\n */\n formResetCallback(): void {\n this.value = undefined\n }\n\n /**\n * Restores the select's state from saved form data. Called automatically when\n * the browser restores form state. Part of the form-associated custom element API.\n *\n * @param {string | null} state - The saved state to restore\n */\n formStateRestoreCallback(state: string | null): void {\n this.value = state ?? undefined\n }\n\n /**\n * Validates the select element and updates its validity state. This is called\n * automatically during property changes, but can be called manually to trigger validation.\n *\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * select.validate();\n * if (select.invalid) {\n * console.log('Validation failed:', select.invalidText);\n * }\n * ```\n */\n validate(): void {\n let message = ''\n if (this.required && !this.value) {\n message = 'Please select an item.'\n this.#internals.setValidity({ valueMissing: true }, message)\n } else {\n this.#internals.setValidity({})\n }\n this.invalid = !this.#internals.validity.valid\n this.invalidText = message\n }\n\n protected override willUpdate(changedProperties: PropertyValues<this>): void {\n super.willUpdate(changedProperties)\n if (changedProperties.has('disabled')) {\n setDisabled(this, this.disabled)\n }\n if (changedProperties.has('open')) {\n this.handleOpenChange()\n }\n if (changedProperties.has('value')) {\n this.setCurrentOption()\n this.#internals.setFormValue(this.value ?? null)\n this.validate()\n }\n if (changedProperties.has('label')) {\n if (this.label) {\n this.setAttribute('aria-label', this.label)\n } else {\n this.removeAttribute('aria-label')\n }\n }\n }\n\n protected override firstUpdated(cp: PropertyValues): void {\n super.firstUpdated(cp)\n this.updateComplete.then(() => {\n this.setCurrentOption()\n this.#internals.setFormValue(this.value ?? null)\n // We need to update here as event with `value` and `selectedOption`\n // already set, the `renderValue` might have incorrect value\n // due to the DOM update.\n this.requestUpdate()\n })\n }\n\n protected setCurrentOption(): void {\n const options = this.querySelectorAll<UiOption>('ui-option')\n if (this.value) {\n this.selectedOption = Array.from(options).find((option) => option.value === this.value) || null\n } else {\n const selected = Array.from(options).find((option) => option.selected)\n if (selected) {\n this.selectedOption = selected\n this.#value = selected.value\n } else {\n this.selectedOption = null\n }\n }\n }\n\n protected handleKeydown(e: KeyboardEvent): void {\n if (this.disabled || e.defaultPrevented) return\n if (this.open) {\n switch (e.key) {\n case 'Tab': {\n // If menu is open and Tab is pressed, close it and allow normal tab navigation\n if (this.open) {\n this.open = false\n }\n break\n }\n case 'Escape': {\n if (this.open) {\n e.preventDefault()\n this.open = false\n this.focus() // Return focus to the select element\n }\n break\n }\n case 'ArrowDown':\n e.preventDefault()\n this.menu.highlightNext()\n return\n case 'ArrowUp':\n e.preventDefault()\n this.menu.highlightPrevious()\n return\n case 'Home':\n e.preventDefault()\n this.menu.highlightFirst()\n return\n case 'End':\n e.preventDefault()\n this.menu.highlightLast()\n return\n case 'Enter':\n case ' ':\n if (this.menu.highlightListItem) {\n e.preventDefault()\n this.menu.notifySelect(this.menu.highlightListItem as UiOption)\n }\n return\n }\n } else {\n switch (e.key) {\n case 'Enter':\n case ' ': {\n if (!this.open) {\n e.preventDefault()\n this.open = true\n }\n break\n }\n case 'ArrowDown':\n case 'ArrowUp': {\n if (!this.open) {\n e.preventDefault()\n this.open = true\n }\n // If menu is open, let the menu handle arrow keys\n break\n }\n }\n }\n }\n\n protected handleBlur(e: FocusEvent): void {\n if (this.disabled) return\n\n // Check if focus is moving to the menu or one of its children\n const relatedTarget = e.relatedTarget as HTMLElement\n\n if (relatedTarget && this.contains(relatedTarget)) {\n // Focus is moving to the menu, keep it open\n return\n }\n\n // Close the menu when focus leaves the component\n this.open = false\n }\n\n protected handleClick(e: Event): void {\n if (this.disabled || e.defaultPrevented) return\n e.preventDefault()\n e.stopPropagation()\n if (this.open && e.target === this) {\n // If the select is already open and clicked again, close it\n this.open = false\n return\n }\n this.open = true\n }\n\n protected async handleOpenChange(): Promise<void> {\n const menu = this.menu\n if (!menu) {\n // The status can be set before the menu is rendered\n return\n }\n this.setAttribute('aria-expanded', String(this.open))\n if (this.open) {\n menu.showPopover()\n // menu.focus()\n if (this.selectedOption) {\n this.menu.highlightItem(this.selectedOption)\n } else {\n this.menu.highlightFirst()\n }\n this.dispatchEvent(new CustomEvent('open', { bubbles: false, composed: true }))\n this.focus()\n } else {\n menu.hidePopover()\n this.dispatchEvent(new CustomEvent('close', { bubbles: false, composed: true }))\n }\n }\n\n handleSelect(e: CustomEvent<{ item: UiOption }>): void {\n e.stopPropagation()\n const item = e.detail.item\n this.selectedOption = item\n this.#value = item.value\n this.#internals.setFormValue(this.value ?? null)\n this.open = false\n\n // Dispatch change event\n const changeEvent = new CustomEvent<UiSelectChangeEvent>('change', {\n detail: { value: this.value, item: item },\n bubbles: false,\n composed: true,\n })\n this.dispatchEvent(changeEvent)\n this.focus()\n }\n\n handleHighlightChange(e: CustomEvent<{ item: UiOption | null }>): void {\n this.ariaActiveDescendant = e.detail.item?.id\n }\n\n handleMenuClose(): void {\n this.open = false\n this.focus()\n }\n\n protected renderInput(): TemplateResult {\n const styles = {\n 'anchor-name': `--${this.id}`,\n }\n return html`<ui-outlined-text-field\n .name=${this.name}\n .label=${this.label}\n .value=${this.renderValue}\n .disabled=${this.disabled}\n .required=${this.required}\n readonly\n tabindex=\"-1\"\n .inert=${true}\n aria-hidden=\"true\"\n .invalid=${this.invalid}\n .invalidText=${this.invalidText || ''}\n .supportingText=${this.supportingText || ''}\n class=\"input\"\n style=${styleMap(styles)}\n part=\"input\"\n >\n <ui-icon part=\"icon\" slot=\"suffix\">arrow_drop_down</ui-icon>\n </ui-outlined-text-field>`\n }\n\n protected renderMenu(): TemplateResult {\n const styles = {\n 'position-anchor': `--${this.id}`,\n }\n return html`<ui-menu\n id=\"menu\"\n class=\"menu\"\n part=\"menu\"\n style=${styleMap(styles)}\n popover=\"auto\"\n selector=\"ui-option\"\n @select=\"${this.handleSelect}\"\n @close=\"${this.handleMenuClose}\"\n @highlightchange=\"${this.handleHighlightChange}\"\n >\n <slot @slotchange=\"${this.handleSlotChange}\"></slot>\n </ui-menu>`\n }\n\n protected async handleSlotChange(): Promise<void> {\n // When options change, re-evaluate the current selection\n // only if we don't have an explicit value set\n if (!this.value) {\n this.setCurrentOption()\n this.requestUpdate()\n }\n }\n\n protected renderFocusRing(): TemplateResult {\n return html`<ui-focus-ring part=\"focus-ring\" class=\"focus-ring\" .control=\"${this as HTMLElement}\"></ui-focus-ring>`\n }\n\n override render(): TemplateResult {\n const classes = classMap({\n 'ui-select': true,\n 'open': this.open,\n 'disabled': this.disabled,\n })\n return html`${this.renderFocusRing()}\n <div class=\"${classes}\" aria-activedescendant=${this.ariaActiveDescendant || ''}>\n ${this.renderInput()} ${this.renderMenu()}\n </div> `\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport { UiElement } from '../../UiElement.js'\nimport type UiOption from './Option.js'\nimport type { UiMenuElement } from '../../menu/ui-menu.js'\nimport { nanoid } from 'nanoid'\n\nimport '../../text-field/ui-outlined-text-field.js'\nimport '../../menu/ui-menu.js'\nimport '../../icons/ui-icon.js'\nimport '../../focus-ring/ui-focus-ring.js'\n\nexport interface UiSelectChangeEvent {\n value: string | undefined\n item: UiOption | null\n}\n\n/**\n * Material Design 3 Select component that behaves like an outlined text field with dropdown.\n *\n * @fires change - Dispatched when the selection changes. The event is non-bubbling and non-cancelable.\n * The `event.detail` object contains the `value` and `item` properties.\n * @fires open - Dispatched when the dropdown opens\n * @fires close - Dispatched when the dropdown closes\n */\nexport default class UiSelect extends UiElement {\n static readonly formAssociated = true\n #internals = this.attachInternals()\n\n /**\n * The value has a private member so that we can set the value without triggering\n * the side effects.\n */\n #value: string | undefined\n\n /**\n * Type-ahead search string accumulated from user typing\n */\n #typeAheadString = ''\n\n /**\n * Timer for resetting the type-ahead search string\n */\n #typeAheadTimer: number | null = null\n\n /**\n * Timeout duration for type-ahead reset (in milliseconds)\n */\n static readonly TYPE_AHEAD_TIMEOUT = 1000\n\n /**\n * The currently selected value. Corresponds to the `value` attribute of the selected `ui-option`.\n * When set programmatically, it will update the selected option if a matching option exists.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select value=\"apple\">\n * <ui-option value=\"apple\">Apple</ui-option>\n * <ui-option value=\"banana\">Banana</ui-option>\n * </ui-select>\n * ```\n */\n get value(): string | undefined {\n return this.#value\n }\n\n @property({ type: String })\n set value(newValue: string | undefined) {\n const oldValue = this.#value\n if (newValue === oldValue) return\n this.#value = newValue\n this.requestUpdate()\n }\n\n /**\n * The name attribute for form submission. This value will be used as the key\n * when the form is submitted.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select name=\"country\" value=\"us\">\n * <ui-option value=\"us\">United States</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: String }) accessor name: string | undefined\n\n /**\n * The label text displayed in the select field. Provides accessible labeling\n * and is shown as the floating label in the outlined text field.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select label=\"Select a country\">\n * <ui-option value=\"us\">United States</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: String }) accessor label: string | undefined\n\n /**\n * Whether the select is required for form validation. When true, the select\n * must have a value selected for the form to be valid.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select required label=\"Required field\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: Boolean }) accessor required = false\n\n /**\n * Whether the select is in an invalid state. This is typically set automatically\n * during validation, but can be set manually to indicate validation errors.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select invalid invalidText=\"Please select a valid option\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: Boolean }) accessor invalid: boolean | undefined\n\n /**\n * The error message to display when the select is invalid. This text is shown\n * below the select field when `invalid` is true.\n *\n * @attribute\n * @example\n * ```html\n * <ui-select invalid invalidText=\"This field is required\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: String }) accessor invalidText: string | undefined\n\n /**\n * @attribute\n */\n @property({ type: String }) accessor supportingText: string | undefined\n\n /**\n * Whether the select is disabled. When disabled, the select cannot be interacted\n * with and will not receive focus or respond to user input.\n *\n * @default false\n * @attribute\n * @example\n * ```html\n * <ui-select disabled label=\"Disabled select\">\n * <ui-option value=\"option1\">Option 1</ui-option>\n * </ui-select>\n * ```\n */\n @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n /**\n * Whether the dropdown menu is currently open. This property reflects the\n * current state of the dropdown and can be set programmatically to open/close it.\n *\n * @default false\n * @example\n * ```javascript\n * // Open the dropdown programmatically\n * selectElement.open = true;\n *\n * // Close the dropdown\n * selectElement.open = false;\n * ```\n */\n @property({ type: Boolean, reflect: true }) accessor open = false\n\n @state() accessor selectedOption: UiOption | null = null\n\n @query('.menu') accessor menu!: UiMenuElement\n\n /**\n * Returns the currently selected option element. This provides access to the\n * full `ui-option` element, not just its value.\n *\n * @readonly\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * const selectedItem = select.selectedItem;\n * if (selectedItem) {\n * console.log('Selected option:', selectedItem.textContent);\n * }\n * ```\n */\n get selectedItem(): UiOption | null {\n return this.selectedOption\n }\n\n /**\n * Returns the text content that should be displayed in the select field.\n * This is the rendered value of the currently selected option.\n *\n * @readonly\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * console.log('Display text:', select.renderValue);\n * ```\n */\n get renderValue(): string {\n const item = this.selectedOption\n return item ? item.renderValue : ''\n }\n\n /**\n * Returns the form element that contains this select, if any.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get form(): HTMLFormElement | null {\n return this.#internals.form\n }\n\n /**\n * Returns the validity state of the select element.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get validity(): ValidityState {\n return this.#internals.validity\n }\n\n /**\n * Returns the validation message for the select element.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get validationMessage(): string {\n return this.#internals.validationMessage\n }\n\n /**\n * Returns whether the select element will be validated when the form is submitted.\n * Part of the form-associated custom element API.\n *\n * @readonly\n */\n get willValidate(): boolean {\n return this.#internals.willValidate\n }\n\n /**\n * Checks the validity of the select element and returns true if valid.\n * Part of the form-associated custom element API.\n *\n * @returns {boolean} True if the element is valid, false otherwise\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * if (!select.checkValidity()) {\n * console.log('Select is invalid:', select.validationMessage);\n * }\n * ```\n */\n checkValidity(): boolean {\n return this.#internals.checkValidity()\n }\n\n constructor() {\n super()\n this.addEventListener('click', this.handleClick.bind(this))\n this.addEventListener('blur', this.handleBlur.bind(this))\n this.addEventListener('keydown', this.handleKeydown.bind(this))\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n this.setAttribute('role', 'combobox')\n this.setAttribute('aria-haspopup', 'listbox')\n this.setAttribute('aria-controls', 'menu')\n if (!this.disabled) {\n this.setAttribute('tabindex', '0')\n }\n if (!this.id) {\n this.id = `select-${nanoid(6)}`\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n // Clean up the type-ahead timer\n if (this.#typeAheadTimer) {\n clearTimeout(this.#typeAheadTimer)\n this.#typeAheadTimer = null\n }\n }\n\n /**\n * Resets the select to its initial state. Called automatically when the parent\n * form is reset. Part of the form-associated custom element API.\n *\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * select.formResetCallback(); // Clears the selection\n * ```\n */\n formResetCallback(): void {\n this.value = undefined\n }\n\n /**\n * Restores the select's state from saved form data. Called automatically when\n * the browser restores form state. Part of the form-associated custom element API.\n *\n * @param {string | null} state - The saved state to restore\n */\n formStateRestoreCallback(state: string | null): void {\n this.value = state ?? undefined\n }\n\n /**\n * Validates the select element and updates its validity state. This is called\n * automatically during property changes, but can be called manually to trigger validation.\n *\n * @example\n * ```javascript\n * const select = document.querySelector('ui-select');\n * select.validate();\n * if (select.invalid) {\n * console.log('Validation failed:', select.invalidText);\n * }\n * ```\n */\n validate(): void {\n let message = ''\n if (this.required && !this.value) {\n message = 'Please select an item.'\n this.#internals.setValidity({ valueMissing: true }, message)\n } else {\n this.#internals.setValidity({})\n }\n this.invalid = !this.#internals.validity.valid\n this.invalidText = message\n }\n\n protected override willUpdate(changedProperties: PropertyValues<this>): void {\n super.willUpdate(changedProperties)\n if (changedProperties.has('disabled')) {\n setDisabled(this, this.disabled)\n }\n if (changedProperties.has('open')) {\n this.handleOpenChange()\n }\n if (changedProperties.has('value')) {\n this.setCurrentOption()\n this.#internals.setFormValue(this.value ?? null)\n this.validate()\n }\n if (changedProperties.has('label')) {\n if (this.label) {\n this.setAttribute('aria-label', this.label)\n } else {\n this.removeAttribute('aria-label')\n }\n }\n }\n\n protected override firstUpdated(cp: PropertyValues): void {\n super.firstUpdated(cp)\n this.updateComplete.then(() => {\n this.setCurrentOption()\n this.#internals.setFormValue(this.value ?? null)\n // We need to update here as event with `value` and `selectedOption`\n // already set, the `renderValue` might have incorrect value\n // due to the DOM update.\n this.requestUpdate()\n })\n }\n\n protected setCurrentOption(): void {\n const options = this.querySelectorAll<UiOption>('ui-option')\n if (this.value) {\n this.selectedOption = Array.from(options).find((option) => option.value === this.value) || null\n } else {\n const selected = Array.from(options).find((option) => option.selected)\n if (selected) {\n this.selectedOption = selected\n this.#value = selected.value\n } else {\n this.selectedOption = null\n }\n }\n }\n\n protected handleKeydown(e: KeyboardEvent): void {\n if (this.disabled || e.defaultPrevented) return\n\n // Handle type-ahead for printable characters\n if (e.key.length === 1 && !e.ctrlKey && !e.altKey && !e.metaKey) {\n this.handleTypeAhead(e.key.toLowerCase())\n return\n }\n\n if (this.open) {\n switch (e.key) {\n case 'Tab': {\n // If menu is open and Tab is pressed, close it and allow normal tab navigation\n if (this.open) {\n this.open = false\n }\n break\n }\n case 'Escape': {\n if (this.open) {\n e.preventDefault()\n this.open = false\n this.focus() // Return focus to the select element\n }\n break\n }\n case 'ArrowDown':\n e.preventDefault()\n this.focusNextMenuItem()\n return\n case 'ArrowUp':\n e.preventDefault()\n this.focusPreviousMenuItem()\n return\n case 'Home':\n e.preventDefault()\n this.focusFirstMenuItem()\n return\n case 'End':\n e.preventDefault()\n this.focusLastMenuItem()\n return\n case 'Enter':\n case ' ': {\n const currentItem = this.querySelector<UiOption>(':focus')\n if (currentItem && this.isOptionSelectable(currentItem)) {\n e.preventDefault()\n this.menu.notifySelect(currentItem)\n }\n return\n }\n }\n } else {\n switch (e.key) {\n case 'Enter':\n case ' ': {\n if (!this.open) {\n e.preventDefault()\n this.open = true\n }\n break\n }\n case 'ArrowDown':\n case 'ArrowUp': {\n if (!this.open) {\n e.preventDefault()\n this.open = true\n }\n // If menu is open, let the menu handle arrow keys\n break\n }\n }\n }\n }\n\n protected handleBlur(e: FocusEvent): void {\n if (this.disabled) return\n\n // Check if focus is moving to the menu or one of its children\n const relatedTarget = e.relatedTarget as HTMLElement\n\n if (relatedTarget && this.contains(relatedTarget)) {\n // Focus is moving to the menu, keep it open\n return\n }\n\n // Close the menu when focus leaves the component\n this.open = false\n }\n\n override handleClick(e: Event): void {\n if (this.disabled || e.defaultPrevented) return\n e.preventDefault()\n e.stopPropagation()\n if (this.open && e.target === this) {\n // If the select is already open and clicked again, close it\n this.open = false\n return\n }\n this.open = true\n }\n\n protected async handleOpenChange(): Promise<void> {\n const menu = this.menu\n if (!menu) {\n // The status can be set before the menu is rendered\n return\n }\n this.setAttribute('aria-expanded', String(this.open))\n if (this.open) {\n menu.showPopover()\n // Focus on the selected option or first selectable option when menu opens\n if (this.selectedOption && this.isOptionSelectable(this.selectedOption)) {\n this.selectedOption.focus()\n this.selectedOption.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'nearest' })\n } else {\n const firstSelectableOption = this.getFirstSelectableOption()\n if (firstSelectableOption) {\n firstSelectableOption.focus()\n firstSelectableOption.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'nearest' })\n }\n }\n this.dispatchEvent(new CustomEvent('open', { bubbles: false, composed: true }))\n } else {\n menu.hidePopover()\n this.dispatchEvent(new CustomEvent('close', { bubbles: false, composed: true }))\n // Return focus to the select element when menu closes\n this.focus()\n }\n }\n\n /**\n * Focus the next menu item in the dropdown, skipping disabled options\n */\n focusNextMenuItem(): void {\n const currentItem = this.querySelector<UiOption>(':focus')\n const nextItem = currentItem ? this.getNextSelectableOption(currentItem) : this.getFirstSelectableOption()\n if (nextItem) {\n nextItem.focus()\n }\n }\n\n /**\n * Focus the previous menu item in the dropdown, skipping disabled options\n */\n focusPreviousMenuItem(): void {\n const currentItem = this.querySelector<UiOption>(':focus')\n const previousItem = currentItem ? this.getPreviousSelectableOption(currentItem) : this.getLastSelectableOption()\n if (previousItem) {\n previousItem.focus()\n }\n }\n\n /**\n * Focus the first menu item in the dropdown, skipping disabled options\n */\n focusFirstMenuItem(): void {\n const firstItem = this.getFirstSelectableOption()\n if (firstItem) {\n firstItem.focus()\n }\n }\n\n /**\n * Focus the last menu item in the dropdown, skipping disabled options\n */\n focusLastMenuItem(): void {\n const lastItem = this.getLastSelectableOption()\n if (lastItem) {\n lastItem.focus()\n }\n }\n\n /**\n * Gets the first selectable (non-disabled) option\n */\n getFirstSelectableOption(): UiOption | null {\n const options = this.querySelectorAll<UiOption>('ui-option')\n for (const option of options) {\n if (this.isOptionSelectable(option)) {\n return option\n }\n }\n return null\n }\n\n /**\n * Gets the last selectable (non-disabled) option\n */\n getLastSelectableOption(): UiOption | null {\n const options = Array.from(this.querySelectorAll<UiOption>('ui-option')).reverse()\n for (const option of options) {\n if (this.isOptionSelectable(option)) {\n return option\n }\n }\n return null\n }\n\n /**\n * Gets the next selectable option after the current one, wrapping around if needed\n */\n protected getNextSelectableOption(currentOption: UiOption): UiOption | null {\n const options = Array.from(this.querySelectorAll<UiOption>('ui-option'))\n const currentIndex = options.indexOf(currentOption)\n\n if (currentIndex === -1) {\n return this.getFirstSelectableOption()\n }\n\n // Start from the next option and wrap around\n for (let i = 1; i < options.length; i++) {\n const nextIndex = (currentIndex + i) % options.length\n const option = options[nextIndex]\n if (this.isOptionSelectable(option)) {\n return option\n }\n }\n\n return currentOption // Return current if no other selectable option found\n }\n\n /**\n * Gets the previous selectable option before the current one, wrapping around if needed\n */\n protected getPreviousSelectableOption(currentOption: UiOption): UiOption | null {\n const options = Array.from(this.querySelectorAll<UiOption>('ui-option'))\n const currentIndex = options.indexOf(currentOption)\n\n if (currentIndex === -1) {\n return this.getLastSelectableOption()\n }\n\n // Start from the previous option and wrap around\n for (let i = 1; i < options.length; i++) {\n const prevIndex = (currentIndex - i + options.length) % options.length\n const option = options[prevIndex]\n if (this.isOptionSelectable(option)) {\n return option\n }\n }\n\n return currentOption // Return current if no other selectable option found\n }\n\n /**\n * Checks if an option is selectable (not disabled and not hidden)\n */\n protected isOptionSelectable(option: UiOption): boolean {\n if (option.disabled) {\n return false\n }\n if (option.hasAttribute('disabled')) {\n return false\n }\n if (option.hidden && option.hasAttribute('hidden')) {\n return false\n }\n return true\n }\n\n /**\n * Handles type-ahead functionality for keyboard navigation\n */\n protected handleTypeAhead(char: string): void {\n // Clear the existing timer\n if (this.#typeAheadTimer) {\n clearTimeout(this.#typeAheadTimer)\n }\n\n // Add the character to the search string\n this.#typeAheadString += char\n\n // Find the matching option\n const matchingOption = this.findOptionByTypeAhead(this.#typeAheadString)\n if (matchingOption) {\n if (this.open) {\n // If menu is open, focus the matching option\n matchingOption.focus()\n } else {\n // If menu is closed, select the matching option\n this.selectOption(matchingOption)\n }\n }\n\n // Set a timer to reset the search string\n this.#typeAheadTimer = window.setTimeout(() => {\n this.#typeAheadString = ''\n this.#typeAheadTimer = null\n }, UiSelect.TYPE_AHEAD_TIMEOUT)\n }\n\n /**\n * Finds an option that matches the type-ahead search string\n */\n protected findOptionByTypeAhead(searchString: string): UiOption | null {\n const options = this.querySelectorAll<UiOption>('ui-option')\n\n for (const option of options) {\n if (!this.isOptionSelectable(option)) {\n continue\n }\n\n // Get the option's text content for comparison\n const optionText = this.getOptionDisplayText(option).toLowerCase()\n\n if (optionText.startsWith(searchString)) {\n return option\n }\n }\n\n return null\n }\n\n /**\n * Gets the display text for an option (either textContent or renderValue)\n */\n protected getOptionDisplayText(option: UiOption): string {\n // Use renderValue if available, otherwise fall back to textContent\n return option.renderValue || option.textContent?.trim() || ''\n }\n\n /**\n * Selects an option and updates the component state\n */\n protected selectOption(option: UiOption): void {\n if (this.selectedOption && this.selectedOption !== option) {\n this.selectedOption.selected = false\n }\n\n option.selected = true\n this.selectedOption = option\n this.#value = option.value\n this.#internals.setFormValue(this.value ?? null)\n\n // Dispatch change event\n const changeEvent = new CustomEvent<UiSelectChangeEvent>('change', {\n detail: { value: this.value, item: option },\n bubbles: false,\n composed: true,\n })\n this.dispatchEvent(changeEvent)\n }\n\n handleSelect(e: CustomEvent<{ item: UiOption }>): void {\n e.stopPropagation()\n const item = e.detail.item\n if (this.selectedOption && this.selectedOption !== item) {\n this.selectedOption.selected = false\n }\n item.selected = true\n this.selectedOption = item\n this.#value = item.value\n this.#internals.setFormValue(this.value ?? null)\n this.open = false\n\n // Dispatch change event\n const changeEvent = new CustomEvent<UiSelectChangeEvent>('change', {\n detail: { value: this.value, item: item },\n bubbles: false,\n composed: true,\n })\n this.dispatchEvent(changeEvent)\n // Focus will be returned to select element by handleOpenChange when open=false\n }\n\n handleMenuClose(): void {\n this.open = false\n // Focus will be returned to select element by handleOpenChange when open=false\n }\n\n handleMenuToggle(e: ToggleEvent): void {\n if (e.newState === 'closed') {\n this.open = false\n }\n }\n\n protected renderInput(): TemplateResult {\n const styles = {\n 'anchor-name': `--${this.id}`,\n }\n return html`<ui-outlined-text-field\n .name=${this.name}\n .label=${this.label}\n .value=${this.renderValue}\n .disabled=${this.disabled}\n .required=${this.required}\n readonly\n tabindex=\"-1\"\n .inert=${true}\n aria-hidden=\"true\"\n .invalid=${this.invalid}\n .invalidText=${this.invalidText || ''}\n .supportingText=${this.supportingText || ''}\n class=\"input\"\n style=${styleMap(styles)}\n part=\"input\"\n >\n <ui-icon part=\"icon\" slot=\"suffix\">arrow_drop_down</ui-icon>\n </ui-outlined-text-field>`\n }\n\n protected renderMenu(): TemplateResult {\n const styles = {\n 'position-anchor': `--${this.id}`,\n }\n return html`<ui-menu\n id=\"menu\"\n class=\"menu\"\n part=\"menu\"\n style=${styleMap(styles)}\n popover=\"auto\"\n selector=\"ui-option\"\n @select=\"${this.handleSelect}\"\n @close=\"${this.handleMenuClose}\"\n @toggle=\"${this.handleMenuToggle}\"\n >\n <slot @slotchange=\"${this.handleSlotChange}\"></slot>\n </ui-menu>`\n }\n\n protected async handleSlotChange(): Promise<void> {\n // When options change, re-evaluate the current selection\n // only if we don't have an explicit value set\n if (!this.value) {\n this.setCurrentOption()\n this.requestUpdate()\n }\n }\n\n protected renderFocusRing(): TemplateResult {\n return html`<ui-focus-ring part=\"focus-ring\" class=\"focus-ring\" .control=\"${this as HTMLElement}\"></ui-focus-ring>`\n }\n\n override render(): TemplateResult {\n const classes = classMap({\n 'ui-select': true,\n 'open': this.open,\n 'disabled': this.disabled,\n })\n return html`${this.renderFocusRing()}\n <div class=\"${classes}\">${this.renderInput()} ${this.renderMenu()}</div> `\n }\n}\n"]}
|