@shoper/phoenix_design_system 1.18.11-0 → 1.18.11-1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/packages/phoenix/src/components/form/search/search.js +56 -36
- package/build/cjs/packages/phoenix/src/components/form/search/search.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/form/select/select.js +37 -3
- package/build/cjs/packages/phoenix/src/components/form/select/select.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form/search/search.d.ts +3 -3
- package/build/esm/packages/phoenix/src/components/form/search/search.js +56 -36
- package/build/esm/packages/phoenix/src/components/form/search/search.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form/select/select.d.ts +3 -0
- package/build/esm/packages/phoenix/src/components/form/select/select.js +37 -3
- package/build/esm/packages/phoenix/src/components/form/select/select.js.map +1 -1
- package/package.json +1 -1
|
@@ -8,6 +8,7 @@ var decorators = require('lit/decorators');
|
|
|
8
8
|
var utilities = require('@dreamcommerce/utilities');
|
|
9
9
|
var phoenix_light_lit_element = require('../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
|
|
10
10
|
var phoenix_custom_element = require('../../../core/decorators/phoenix_custom_element.js');
|
|
11
|
+
var icon_constants = require('../../icon/icon_constants.js');
|
|
11
12
|
var observer = require('../../../core/classes/observer/observer.js');
|
|
12
13
|
var context_consumer_controller = require('../../../core/context/context_consumer_controller.js');
|
|
13
14
|
var behavior_subject = require('../../../core/classes/behavior_subject/behavior_subject.js');
|
|
@@ -26,12 +27,13 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
26
27
|
this.view = search_constants.DEFAULT_VIEW;
|
|
27
28
|
this.isDevSearchPopupFixesFlagEnabled = false;
|
|
28
29
|
this.displayMode = 'dropdown';
|
|
29
|
-
this._togglerElement = null;
|
|
30
30
|
this._id = v4['default']();
|
|
31
|
+
this._openSearchButtonAriaLabelId = `${this._id}-open-search-button-aria-label`;
|
|
31
32
|
this._searchContentContainerId = v4['default']();
|
|
32
33
|
this._searchResultsRef = ref_js.createRef();
|
|
33
34
|
this._searchHistoryRef = ref_js.createRef();
|
|
34
35
|
this._searchMessageRef = ref_js.createRef();
|
|
36
|
+
this._openSearchButtonLabelRef = ref_js.createRef();
|
|
35
37
|
this._shouldShowHistory = false;
|
|
36
38
|
this._shouldShowResults = false;
|
|
37
39
|
this._shouldShowMessage = false;
|
|
@@ -169,8 +171,8 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
169
171
|
};
|
|
170
172
|
this._preventScrollingOnSearchContentBrowsing = (ev) => {
|
|
171
173
|
var _a;
|
|
172
|
-
const hasArrowBeenPressed = ev.key ===
|
|
173
|
-
const hasHomeOrEndBeenPressed = ev.key ===
|
|
174
|
+
const hasArrowBeenPressed = ev.key === "ArrowUp" || ev.key === "ArrowDown";
|
|
175
|
+
const hasHomeOrEndBeenPressed = ev.key === "Home" || ev.key === "End";
|
|
174
176
|
const hasSearchContainerParent = !!((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.closest('.search__container'));
|
|
175
177
|
if ((hasArrowBeenPressed || hasHomeOrEndBeenPressed) && hasSearchContainerParent) {
|
|
176
178
|
ev.preventDefault();
|
|
@@ -243,8 +245,12 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
243
245
|
this._handleBackwardFocus($gridSearchItems);
|
|
244
246
|
};
|
|
245
247
|
this._findSearchItemsContainer = () => {
|
|
246
|
-
const containers = [
|
|
247
|
-
|
|
248
|
+
const containers = [
|
|
249
|
+
this._searchHistoryRef.value,
|
|
250
|
+
this._searchResultsRef.value,
|
|
251
|
+
this._searchMessageRef.value
|
|
252
|
+
];
|
|
253
|
+
return containers.find(container => container && !utilities.UiDomUtils.isElementEmpty(container));
|
|
248
254
|
};
|
|
249
255
|
this._handleBackwardFocus = ($searchItems) => {
|
|
250
256
|
var _a;
|
|
@@ -341,20 +347,11 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
341
347
|
document.removeEventListener('focusin', this._resetSearchOnFocusOutside);
|
|
342
348
|
}
|
|
343
349
|
};
|
|
344
|
-
this.
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
${search_constants.SEARCH_COMPONENT_NAMES.searchInput} input[type="search"]
|
|
350
|
-
`);
|
|
351
|
-
$searchInput === null || $searchInput === void 0 ? void 0 : $searchInput.focus();
|
|
352
|
-
};
|
|
353
|
-
this._handleOpenSearchWithKeyboard = (ev) => {
|
|
354
|
-
if (ev.code !== 'Enter')
|
|
355
|
-
return;
|
|
356
|
-
ev.preventDefault();
|
|
357
|
-
this._handleOpenSearch();
|
|
350
|
+
this._setupAriaAttributes = () => {
|
|
351
|
+
var _a;
|
|
352
|
+
if (this._translations.openSearchButtonAriaLabel) {
|
|
353
|
+
(_a = this._openSearchButtonLabelRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-labelledby', this._openSearchButtonAriaLabelId);
|
|
354
|
+
}
|
|
358
355
|
};
|
|
359
356
|
}
|
|
360
357
|
async connectedCallback() {
|
|
@@ -391,7 +388,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
391
388
|
this._searchInput = this.querySelector(search_constants.SEARCH_COMPONENT_NAMES.searchInput);
|
|
392
389
|
this._setupInitialSearchPhrase();
|
|
393
390
|
this._setupListeners();
|
|
394
|
-
this.
|
|
391
|
+
this._setupAriaAttributes();
|
|
395
392
|
}
|
|
396
393
|
disconnectedCallback() {
|
|
397
394
|
var _a;
|
|
@@ -401,7 +398,6 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
401
398
|
document.removeEventListener('focusin', this._resetSearchOnFocusOutside);
|
|
402
399
|
window.removeEventListener('resize', this._switchTypeOfSearchView);
|
|
403
400
|
(_a = this._searchForm) === null || _a === void 0 ? void 0 : _a.removeEventListener('keydown', this._preventSubmitOnSearchClear);
|
|
404
|
-
this._teardownToggler();
|
|
405
401
|
}
|
|
406
402
|
_setupContext() {
|
|
407
403
|
this._historyContextProvider = new context_provider_controller.ContextProviderController(this);
|
|
@@ -559,9 +555,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
559
555
|
}
|
|
560
556
|
}
|
|
561
557
|
_handleChooseSearchItem($el) {
|
|
562
|
-
const $activeSearchItem = this.displayMode === 'dropdown'
|
|
563
|
-
? this.querySelector(`[data-search-item-id="${this._activeItemId}"]`)
|
|
564
|
-
: document.activeElement;
|
|
558
|
+
const $activeSearchItem = this.displayMode === 'dropdown' ? this.querySelector(`[data-search-item-id="${this._activeItemId}"]`) : document.activeElement;
|
|
565
559
|
if (!$activeSearchItem)
|
|
566
560
|
return;
|
|
567
561
|
const $linkElement = $activeSearchItem.querySelector('a');
|
|
@@ -586,24 +580,49 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
586
580
|
_submitSearchPhrase(searchPhrase) {
|
|
587
581
|
this._dispatchEventWithSearchPhrase(search_constants.SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, searchPhrase);
|
|
588
582
|
}
|
|
589
|
-
|
|
590
|
-
this.
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
this.
|
|
594
|
-
|
|
583
|
+
_handleOpenSearch() {
|
|
584
|
+
this.classList.add(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
|
|
585
|
+
const shouldShowMessage = this._searchPhrase !== '';
|
|
586
|
+
this._updateSearchView(this._searchPhrase, shouldShowMessage, false);
|
|
587
|
+
const $searchInput = this.querySelector(`
|
|
588
|
+
${search_constants.SEARCH_COMPONENT_NAMES.searchInput} input[type="search"]
|
|
589
|
+
`);
|
|
590
|
+
$searchInput === null || $searchInput === void 0 ? void 0 : $searchInput.focus();
|
|
595
591
|
}
|
|
596
|
-
|
|
597
|
-
if (
|
|
592
|
+
_handleOpenSearchWithKeyboard(ev) {
|
|
593
|
+
if (ev.code !== 'Enter')
|
|
598
594
|
return;
|
|
599
|
-
|
|
600
|
-
this.
|
|
595
|
+
ev.preventDefault();
|
|
596
|
+
this._handleOpenSearch();
|
|
601
597
|
}
|
|
602
598
|
render() {
|
|
603
599
|
super.render();
|
|
604
600
|
return lit.html `
|
|
601
|
+
<div
|
|
602
|
+
class="${search_constants.SEARCH_CLASS_NAMES.icon} labeled-icon hidden-md-only hidden-lg-only hidden-xl-only hidden-xxl-only hidden-xxxl-only"
|
|
603
|
+
tabindex="0"
|
|
604
|
+
aria-haspopup="dialog"
|
|
605
|
+
@click=${this._handleOpenSearch}
|
|
606
|
+
@keyup=${this._handleOpenSearchWithKeyboard}
|
|
607
|
+
>
|
|
608
|
+
${when.when(this._translations.openSearchButtonAriaLabel, () => lit.html `
|
|
609
|
+
<span id="${this._openSearchButtonAriaLabelId}" class="sr-only">
|
|
610
|
+
${this._translations.openSearchButtonAriaLabel}
|
|
611
|
+
</span>
|
|
612
|
+
`)}
|
|
613
|
+
<h-icon icon-name="icon-search" size=${icon_constants.ICONS_SIZES.l}></h-icon>
|
|
614
|
+
<div ${ref_js.ref(this._openSearchButtonLabelRef)} class="labeled-icon__signature">
|
|
615
|
+
${this._translations.search}
|
|
616
|
+
</div>
|
|
617
|
+
</div>
|
|
618
|
+
|
|
619
|
+
|
|
605
620
|
${when.when(this._isSuggesterLayerVisible(), () => lit.html `
|
|
606
|
-
<div
|
|
621
|
+
<div
|
|
622
|
+
class="${search_constants.SEARCH_CLASS_NAMES.container}"
|
|
623
|
+
id="${this._searchContentContainerId}"
|
|
624
|
+
role="${this._containerRole}"
|
|
625
|
+
>
|
|
607
626
|
${when.when(this._shouldShowMessage, () => lit.html `<h-search-message
|
|
608
627
|
${ref_js.ref(this._searchMessageRef)}
|
|
609
628
|
.history="${this._historyLimitedContent}"
|
|
@@ -634,7 +653,8 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
634
653
|
?is-dev-search-popup-fixes-flag-enabled=${this.isDevSearchPopupFixesFlagEnabled}
|
|
635
654
|
></h-search-results>`)}
|
|
636
655
|
</div>
|
|
637
|
-
`, () => lit.html `
|
|
656
|
+
`, () => lit.html `
|
|
657
|
+
<div
|
|
638
658
|
class="${search_constants.SEARCH_CLASS_NAMES.container}"
|
|
639
659
|
id="${this._searchContentContainerId}"
|
|
640
660
|
role="${this._containerRole}"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA,mBAAmB,wDAA4D;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA,mBAAmB,wDAA4D;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -45,6 +45,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
45
45
|
this.assistiveTitleId = '';
|
|
46
46
|
this.isDevSelectPlaceholderFlagEnabled = false;
|
|
47
47
|
this.translations = {};
|
|
48
|
+
this.isSelectedIndexReactive = false;
|
|
48
49
|
this._selectOptionsId = v4['default']();
|
|
49
50
|
this._searchValue = '';
|
|
50
51
|
this._$options = new Map();
|
|
@@ -199,9 +200,13 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
199
200
|
: select_utils.SelectControlUtils.getLastIndexOfSelectedOption(htmlOptions);
|
|
200
201
|
}
|
|
201
202
|
set selectedIndex(index) {
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
203
|
+
if (index === undefined)
|
|
204
|
+
return;
|
|
205
|
+
if (this.isSelectedIndexReactive) {
|
|
206
|
+
this._reactiveSelectedIndexValue = index;
|
|
207
|
+
return;
|
|
208
|
+
}
|
|
209
|
+
this._applySelectedIndex(index);
|
|
205
210
|
}
|
|
206
211
|
get selectedOptions() {
|
|
207
212
|
var _a;
|
|
@@ -217,6 +222,13 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
217
222
|
get options() {
|
|
218
223
|
return Array.from(this._$options.values());
|
|
219
224
|
}
|
|
225
|
+
_applySelectedIndex(index) {
|
|
226
|
+
if (!this._selectController)
|
|
227
|
+
return;
|
|
228
|
+
const option = Array.from(this._$options.values()).filter(($option) => !$option.hidden)[index];
|
|
229
|
+
option ? this._selectOption(option.value) : this._selectController.deselectAll();
|
|
230
|
+
Array.from(this._$options.values()).forEach(($option) => this.updateOptionAriaAttribute($option));
|
|
231
|
+
}
|
|
220
232
|
updated(changedProperties) {
|
|
221
233
|
var _a, _b;
|
|
222
234
|
super.updated(changedProperties);
|
|
@@ -234,6 +246,12 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
234
246
|
if (this.isDevSelectPlaceholderFlagEnabled) {
|
|
235
247
|
this._addPlaceholderOptionIfNeeded();
|
|
236
248
|
}
|
|
249
|
+
if (this.isSelectedIndexReactive && this._reactiveSelectedIndexValue !== undefined) {
|
|
250
|
+
const actualIndex = this.selectedIndex;
|
|
251
|
+
if (this._reactiveSelectedIndexValue !== actualIndex) {
|
|
252
|
+
this._reactiveSelectedIndexValue = actualIndex === -1 ? undefined : actualIndex;
|
|
253
|
+
}
|
|
254
|
+
}
|
|
237
255
|
}
|
|
238
256
|
if (this._$optionsList.value) {
|
|
239
257
|
(_a = this.listBoxController) === null || _a === void 0 ? void 0 : _a.hostDisconnected();
|
|
@@ -253,6 +271,14 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
253
271
|
$list: this._$optionsList.value
|
|
254
272
|
});
|
|
255
273
|
}
|
|
274
|
+
if (this.isSelectedIndexReactive &&
|
|
275
|
+
changedProperties.has('_reactiveSelectedIndexValue') &&
|
|
276
|
+
this._reactiveSelectedIndexValue !== undefined) {
|
|
277
|
+
const currentIndex = this.selectedIndex;
|
|
278
|
+
if (this._reactiveSelectedIndexValue !== currentIndex) {
|
|
279
|
+
this._applySelectedIndex(this._reactiveSelectedIndexValue);
|
|
280
|
+
}
|
|
281
|
+
}
|
|
256
282
|
}
|
|
257
283
|
_focusElementAfterSelectOpened() {
|
|
258
284
|
var _a;
|
|
@@ -602,6 +628,14 @@ tslib_es6.__decorate([
|
|
|
602
628
|
}),
|
|
603
629
|
tslib_es6.__metadata("design:type", Object)
|
|
604
630
|
], exports.HSelect.prototype, "translations", void 0);
|
|
631
|
+
tslib_es6.__decorate([
|
|
632
|
+
decorators_js.property({ type: Boolean, attribute: 'is-selected-index-reactive' }),
|
|
633
|
+
tslib_es6.__metadata("design:type", Boolean)
|
|
634
|
+
], exports.HSelect.prototype, "isSelectedIndexReactive", void 0);
|
|
635
|
+
tslib_es6.__decorate([
|
|
636
|
+
decorators_js.property({ type: Number, attribute: false }),
|
|
637
|
+
tslib_es6.__metadata("design:type", Number)
|
|
638
|
+
], exports.HSelect.prototype, "_reactiveSelectedIndexValue", void 0);
|
|
605
639
|
tslib_es6.__decorate([
|
|
606
640
|
decorators.state(),
|
|
607
641
|
tslib_es6.__metadata("design:type", String)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -15,12 +15,13 @@ export declare class HSearch extends PhoenixLightLitElement {
|
|
|
15
15
|
private _searchInput;
|
|
16
16
|
private _inputField;
|
|
17
17
|
private _searchForm;
|
|
18
|
-
private _togglerElement;
|
|
19
18
|
private _id;
|
|
19
|
+
private _openSearchButtonAriaLabelId;
|
|
20
20
|
private _searchContentContainerId;
|
|
21
21
|
private _searchResultsRef;
|
|
22
22
|
private _searchHistoryRef;
|
|
23
23
|
private _searchMessageRef;
|
|
24
|
+
private _openSearchButtonLabelRef;
|
|
24
25
|
private _shouldShowHistory;
|
|
25
26
|
private _shouldShowResults;
|
|
26
27
|
private _shouldShowMessage;
|
|
@@ -77,9 +78,8 @@ export declare class HSearch extends PhoenixLightLitElement {
|
|
|
77
78
|
private _isSuggesterLayerVisible;
|
|
78
79
|
private _preventSubmitOnSearchClear;
|
|
79
80
|
private _resetSearchOnFocusOutside;
|
|
81
|
+
private _setupAriaAttributes;
|
|
80
82
|
private _handleOpenSearch;
|
|
81
83
|
private _handleOpenSearchWithKeyboard;
|
|
82
|
-
private _setupToggler;
|
|
83
|
-
private _teardownToggler;
|
|
84
84
|
protected render(): TemplateResult;
|
|
85
85
|
}
|
|
@@ -4,6 +4,7 @@ import { property, state } from 'lit/decorators';
|
|
|
4
4
|
import { UiDomUtils } from '@dreamcommerce/utilities';
|
|
5
5
|
import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
|
|
6
6
|
import { phoenixCustomElement } from '../../../core/decorators/phoenix_custom_element.js';
|
|
7
|
+
import { ICONS_SIZES } from '../../icon/icon_constants.js';
|
|
7
8
|
import { Observer } from '../../../core/classes/observer/observer.js';
|
|
8
9
|
import { ContextConsumerController } from '../../../core/context/context_consumer_controller.js';
|
|
9
10
|
import { BehaviorSubject } from '../../../core/classes/behavior_subject/behavior_subject.js';
|
|
@@ -22,12 +23,13 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
22
23
|
this.view = DEFAULT_VIEW;
|
|
23
24
|
this.isDevSearchPopupFixesFlagEnabled = false;
|
|
24
25
|
this.displayMode = 'dropdown';
|
|
25
|
-
this._togglerElement = null;
|
|
26
26
|
this._id = v4();
|
|
27
|
+
this._openSearchButtonAriaLabelId = `${this._id}-open-search-button-aria-label`;
|
|
27
28
|
this._searchContentContainerId = v4();
|
|
28
29
|
this._searchResultsRef = createRef();
|
|
29
30
|
this._searchHistoryRef = createRef();
|
|
30
31
|
this._searchMessageRef = createRef();
|
|
32
|
+
this._openSearchButtonLabelRef = createRef();
|
|
31
33
|
this._shouldShowHistory = false;
|
|
32
34
|
this._shouldShowResults = false;
|
|
33
35
|
this._shouldShowMessage = false;
|
|
@@ -165,8 +167,8 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
165
167
|
};
|
|
166
168
|
this._preventScrollingOnSearchContentBrowsing = (ev) => {
|
|
167
169
|
var _a;
|
|
168
|
-
const hasArrowBeenPressed = ev.key ===
|
|
169
|
-
const hasHomeOrEndBeenPressed = ev.key ===
|
|
170
|
+
const hasArrowBeenPressed = ev.key === "ArrowUp" || ev.key === "ArrowDown";
|
|
171
|
+
const hasHomeOrEndBeenPressed = ev.key === "Home" || ev.key === "End";
|
|
170
172
|
const hasSearchContainerParent = !!((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.closest('.search__container'));
|
|
171
173
|
if ((hasArrowBeenPressed || hasHomeOrEndBeenPressed) && hasSearchContainerParent) {
|
|
172
174
|
ev.preventDefault();
|
|
@@ -239,8 +241,12 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
239
241
|
this._handleBackwardFocus($gridSearchItems);
|
|
240
242
|
};
|
|
241
243
|
this._findSearchItemsContainer = () => {
|
|
242
|
-
const containers = [
|
|
243
|
-
|
|
244
|
+
const containers = [
|
|
245
|
+
this._searchHistoryRef.value,
|
|
246
|
+
this._searchResultsRef.value,
|
|
247
|
+
this._searchMessageRef.value
|
|
248
|
+
];
|
|
249
|
+
return containers.find(container => container && !UiDomUtils.isElementEmpty(container));
|
|
244
250
|
};
|
|
245
251
|
this._handleBackwardFocus = ($searchItems) => {
|
|
246
252
|
var _a;
|
|
@@ -337,20 +343,11 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
337
343
|
document.removeEventListener('focusin', this._resetSearchOnFocusOutside);
|
|
338
344
|
}
|
|
339
345
|
};
|
|
340
|
-
this.
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
${SEARCH_COMPONENT_NAMES.searchInput} input[type="search"]
|
|
346
|
-
`);
|
|
347
|
-
$searchInput === null || $searchInput === void 0 ? void 0 : $searchInput.focus();
|
|
348
|
-
};
|
|
349
|
-
this._handleOpenSearchWithKeyboard = (ev) => {
|
|
350
|
-
if (ev.code !== 'Enter')
|
|
351
|
-
return;
|
|
352
|
-
ev.preventDefault();
|
|
353
|
-
this._handleOpenSearch();
|
|
346
|
+
this._setupAriaAttributes = () => {
|
|
347
|
+
var _a;
|
|
348
|
+
if (this._translations.openSearchButtonAriaLabel) {
|
|
349
|
+
(_a = this._openSearchButtonLabelRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-labelledby', this._openSearchButtonAriaLabelId);
|
|
350
|
+
}
|
|
354
351
|
};
|
|
355
352
|
}
|
|
356
353
|
async connectedCallback() {
|
|
@@ -387,7 +384,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
387
384
|
this._searchInput = this.querySelector(SEARCH_COMPONENT_NAMES.searchInput);
|
|
388
385
|
this._setupInitialSearchPhrase();
|
|
389
386
|
this._setupListeners();
|
|
390
|
-
this.
|
|
387
|
+
this._setupAriaAttributes();
|
|
391
388
|
}
|
|
392
389
|
disconnectedCallback() {
|
|
393
390
|
var _a;
|
|
@@ -397,7 +394,6 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
397
394
|
document.removeEventListener('focusin', this._resetSearchOnFocusOutside);
|
|
398
395
|
window.removeEventListener('resize', this._switchTypeOfSearchView);
|
|
399
396
|
(_a = this._searchForm) === null || _a === void 0 ? void 0 : _a.removeEventListener('keydown', this._preventSubmitOnSearchClear);
|
|
400
|
-
this._teardownToggler();
|
|
401
397
|
}
|
|
402
398
|
_setupContext() {
|
|
403
399
|
this._historyContextProvider = new ContextProviderController(this);
|
|
@@ -555,9 +551,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
555
551
|
}
|
|
556
552
|
}
|
|
557
553
|
_handleChooseSearchItem($el) {
|
|
558
|
-
const $activeSearchItem = this.displayMode === 'dropdown'
|
|
559
|
-
? this.querySelector(`[data-search-item-id="${this._activeItemId}"]`)
|
|
560
|
-
: document.activeElement;
|
|
554
|
+
const $activeSearchItem = this.displayMode === 'dropdown' ? this.querySelector(`[data-search-item-id="${this._activeItemId}"]`) : document.activeElement;
|
|
561
555
|
if (!$activeSearchItem)
|
|
562
556
|
return;
|
|
563
557
|
const $linkElement = $activeSearchItem.querySelector('a');
|
|
@@ -582,24 +576,49 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
582
576
|
_submitSearchPhrase(searchPhrase) {
|
|
583
577
|
this._dispatchEventWithSearchPhrase(SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, searchPhrase);
|
|
584
578
|
}
|
|
585
|
-
|
|
586
|
-
this.
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
this.
|
|
590
|
-
|
|
579
|
+
_handleOpenSearch() {
|
|
580
|
+
this.classList.add(SEARCH_CLASS_NAMES.mobileOpened);
|
|
581
|
+
const shouldShowMessage = this._searchPhrase !== '';
|
|
582
|
+
this._updateSearchView(this._searchPhrase, shouldShowMessage, false);
|
|
583
|
+
const $searchInput = this.querySelector(`
|
|
584
|
+
${SEARCH_COMPONENT_NAMES.searchInput} input[type="search"]
|
|
585
|
+
`);
|
|
586
|
+
$searchInput === null || $searchInput === void 0 ? void 0 : $searchInput.focus();
|
|
591
587
|
}
|
|
592
|
-
|
|
593
|
-
if (
|
|
588
|
+
_handleOpenSearchWithKeyboard(ev) {
|
|
589
|
+
if (ev.code !== 'Enter')
|
|
594
590
|
return;
|
|
595
|
-
|
|
596
|
-
this.
|
|
591
|
+
ev.preventDefault();
|
|
592
|
+
this._handleOpenSearch();
|
|
597
593
|
}
|
|
598
594
|
render() {
|
|
599
595
|
super.render();
|
|
600
596
|
return html `
|
|
597
|
+
<div
|
|
598
|
+
class="${SEARCH_CLASS_NAMES.icon} labeled-icon hidden-md-only hidden-lg-only hidden-xl-only hidden-xxl-only hidden-xxxl-only"
|
|
599
|
+
tabindex="0"
|
|
600
|
+
aria-haspopup="dialog"
|
|
601
|
+
@click=${this._handleOpenSearch}
|
|
602
|
+
@keyup=${this._handleOpenSearchWithKeyboard}
|
|
603
|
+
>
|
|
604
|
+
${n(this._translations.openSearchButtonAriaLabel, () => html `
|
|
605
|
+
<span id="${this._openSearchButtonAriaLabelId}" class="sr-only">
|
|
606
|
+
${this._translations.openSearchButtonAriaLabel}
|
|
607
|
+
</span>
|
|
608
|
+
`)}
|
|
609
|
+
<h-icon icon-name="icon-search" size=${ICONS_SIZES.l}></h-icon>
|
|
610
|
+
<div ${ref(this._openSearchButtonLabelRef)} class="labeled-icon__signature">
|
|
611
|
+
${this._translations.search}
|
|
612
|
+
</div>
|
|
613
|
+
</div>
|
|
614
|
+
|
|
615
|
+
|
|
601
616
|
${n(this._isSuggesterLayerVisible(), () => html `
|
|
602
|
-
<div
|
|
617
|
+
<div
|
|
618
|
+
class="${SEARCH_CLASS_NAMES.container}"
|
|
619
|
+
id="${this._searchContentContainerId}"
|
|
620
|
+
role="${this._containerRole}"
|
|
621
|
+
>
|
|
603
622
|
${n(this._shouldShowMessage, () => html `<h-search-message
|
|
604
623
|
${ref(this._searchMessageRef)}
|
|
605
624
|
.history="${this._historyLimitedContent}"
|
|
@@ -630,7 +649,8 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
|
|
|
630
649
|
?is-dev-search-popup-fixes-flag-enabled=${this.isDevSearchPopupFixesFlagEnabled}
|
|
631
650
|
></h-search-results>`)}
|
|
632
651
|
</div>
|
|
633
|
-
`, () => html `
|
|
652
|
+
`, () => html `
|
|
653
|
+
<div
|
|
634
654
|
class="${SEARCH_CLASS_NAMES.container}"
|
|
635
655
|
id="${this._searchContentContainerId}"
|
|
636
656
|
role="${this._containerRole}"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,wDAA4D;AAC3E;AACA;AACA,0BAA0B,wDAA4D;AACtF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,wDAA4D;AAC3E;AACA;AACA,0BAA0B,wDAA4D;AACtF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -25,6 +25,8 @@ export declare class HSelect extends PhoenixLightLitElement {
|
|
|
25
25
|
assistiveTitleId: string;
|
|
26
26
|
isDevSelectPlaceholderFlagEnabled: boolean;
|
|
27
27
|
translations: Record<string, string>;
|
|
28
|
+
isSelectedIndexReactive: boolean;
|
|
29
|
+
_reactiveSelectedIndexValue?: number;
|
|
28
30
|
private _selectOptionsId;
|
|
29
31
|
get selectedIndex(): number;
|
|
30
32
|
set selectedIndex(index: number);
|
|
@@ -48,6 +50,7 @@ export declare class HSelect extends PhoenixLightLitElement {
|
|
|
48
50
|
private $placeholder;
|
|
49
51
|
private $searchLabel;
|
|
50
52
|
constructor();
|
|
53
|
+
private _applySelectedIndex;
|
|
51
54
|
updated(changedProperties: PropertyValues): void;
|
|
52
55
|
private _focusElementAfterSelectOpened;
|
|
53
56
|
connectedCallback(): void;
|
|
@@ -41,6 +41,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
41
41
|
this.assistiveTitleId = '';
|
|
42
42
|
this.isDevSelectPlaceholderFlagEnabled = false;
|
|
43
43
|
this.translations = {};
|
|
44
|
+
this.isSelectedIndexReactive = false;
|
|
44
45
|
this._selectOptionsId = v4();
|
|
45
46
|
this._searchValue = '';
|
|
46
47
|
this._$options = new Map();
|
|
@@ -195,9 +196,13 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
195
196
|
: SelectControlUtils.getLastIndexOfSelectedOption(htmlOptions);
|
|
196
197
|
}
|
|
197
198
|
set selectedIndex(index) {
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
199
|
+
if (index === undefined)
|
|
200
|
+
return;
|
|
201
|
+
if (this.isSelectedIndexReactive) {
|
|
202
|
+
this._reactiveSelectedIndexValue = index;
|
|
203
|
+
return;
|
|
204
|
+
}
|
|
205
|
+
this._applySelectedIndex(index);
|
|
201
206
|
}
|
|
202
207
|
get selectedOptions() {
|
|
203
208
|
var _a;
|
|
@@ -213,6 +218,13 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
213
218
|
get options() {
|
|
214
219
|
return Array.from(this._$options.values());
|
|
215
220
|
}
|
|
221
|
+
_applySelectedIndex(index) {
|
|
222
|
+
if (!this._selectController)
|
|
223
|
+
return;
|
|
224
|
+
const option = Array.from(this._$options.values()).filter(($option) => !$option.hidden)[index];
|
|
225
|
+
option ? this._selectOption(option.value) : this._selectController.deselectAll();
|
|
226
|
+
Array.from(this._$options.values()).forEach(($option) => this.updateOptionAriaAttribute($option));
|
|
227
|
+
}
|
|
216
228
|
updated(changedProperties) {
|
|
217
229
|
var _a, _b;
|
|
218
230
|
super.updated(changedProperties);
|
|
@@ -230,6 +242,12 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
230
242
|
if (this.isDevSelectPlaceholderFlagEnabled) {
|
|
231
243
|
this._addPlaceholderOptionIfNeeded();
|
|
232
244
|
}
|
|
245
|
+
if (this.isSelectedIndexReactive && this._reactiveSelectedIndexValue !== undefined) {
|
|
246
|
+
const actualIndex = this.selectedIndex;
|
|
247
|
+
if (this._reactiveSelectedIndexValue !== actualIndex) {
|
|
248
|
+
this._reactiveSelectedIndexValue = actualIndex === -1 ? undefined : actualIndex;
|
|
249
|
+
}
|
|
250
|
+
}
|
|
233
251
|
}
|
|
234
252
|
if (this._$optionsList.value) {
|
|
235
253
|
(_a = this.listBoxController) === null || _a === void 0 ? void 0 : _a.hostDisconnected();
|
|
@@ -249,6 +267,14 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
249
267
|
$list: this._$optionsList.value
|
|
250
268
|
});
|
|
251
269
|
}
|
|
270
|
+
if (this.isSelectedIndexReactive &&
|
|
271
|
+
changedProperties.has('_reactiveSelectedIndexValue') &&
|
|
272
|
+
this._reactiveSelectedIndexValue !== undefined) {
|
|
273
|
+
const currentIndex = this.selectedIndex;
|
|
274
|
+
if (this._reactiveSelectedIndexValue !== currentIndex) {
|
|
275
|
+
this._applySelectedIndex(this._reactiveSelectedIndexValue);
|
|
276
|
+
}
|
|
277
|
+
}
|
|
252
278
|
}
|
|
253
279
|
_focusElementAfterSelectOpened() {
|
|
254
280
|
var _a;
|
|
@@ -598,6 +624,14 @@ __decorate([
|
|
|
598
624
|
}),
|
|
599
625
|
__metadata("design:type", Object)
|
|
600
626
|
], HSelect.prototype, "translations", void 0);
|
|
627
|
+
__decorate([
|
|
628
|
+
property({ type: Boolean, attribute: 'is-selected-index-reactive' }),
|
|
629
|
+
__metadata("design:type", Boolean)
|
|
630
|
+
], HSelect.prototype, "isSelectedIndexReactive", void 0);
|
|
631
|
+
__decorate([
|
|
632
|
+
property({ type: Number, attribute: false }),
|
|
633
|
+
__metadata("design:type", Number)
|
|
634
|
+
], HSelect.prototype, "_reactiveSelectedIndexValue", void 0);
|
|
601
635
|
__decorate([
|
|
602
636
|
state(),
|
|
603
637
|
__metadata("design:type", String)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,wDAA4D;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,wDAA4D;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|