@shoper/phoenix_design_system 1.18.2-5 → 1.18.2-6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/build/cjs/packages/phoenix/src/components/form/search/search.js +5 -5
  2. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/input/search_input.js +5 -5
  3. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js +5 -4
  4. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js.map +1 -1
  5. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js +5 -4
  6. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js.map +1 -1
  7. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_results.js +6 -6
  8. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js +13 -10
  9. package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js.map +1 -1
  10. package/build/esm/packages/phoenix/src/components/form/search/search.d.ts +1 -1
  11. package/build/esm/packages/phoenix/src/components/form/search/search.js +5 -5
  12. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/input/search_input.d.ts +1 -1
  13. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/input/search_input.js +5 -5
  14. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.d.ts +1 -1
  15. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js +5 -4
  16. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js.map +1 -1
  17. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.d.ts +1 -1
  18. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js +5 -4
  19. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js.map +1 -1
  20. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_results.d.ts +1 -1
  21. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_results.js +6 -6
  22. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.d.ts +1 -1
  23. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js +13 -10
  24. package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js.map +1 -1
  25. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/form/search/search.js CHANGED
@@ -24,7 +24,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
24
24
  constructor() {
25
25
  super(...arguments);
26
26
  this.view = search_constants.DEFAULT_VIEW;
27
- this.isFlagEnabled = false;
27
+ this.isDevSearchPopupFixesFlagEnabled = false;
28
28
  this._id = v4['default']();
29
29
  this._openSearchButtonAriaLabelId = `${this._id}-open-search-button-aria-label`;
30
30
  this._searchContentContainerId = v4['default']();
@@ -305,7 +305,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
305
305
  this.classList.remove(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
306
306
  if (hasBeenOpened && this.popup) {
307
307
  const $storefrontSearch = document.querySelector(`h-storefront-search[module-instance-id="${this.moduleInstanceId}"]`);
308
- if (this.isFlagEnabled) {
308
+ if (this.isDevSearchPopupFixesFlagEnabled) {
309
309
  const searchOverlayTriggerName = (_a = $storefrontSearch === null || $storefrontSearch === void 0 ? void 0 : $storefrontSearch.querySelector('[aria-haspopup="dialog"]')) === null || _a === void 0 ? void 0 : _a.getAttribute('name');
310
310
  const $overlay = this.querySelector(`[hidden][id="${searchOverlayTriggerName}"]`);
311
311
  if (!searchOverlayTriggerName || !$overlay)
@@ -647,7 +647,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
647
647
  active-item-id="${this._activeItemId}"
648
648
  search-id="${this._id}"
649
649
  module-instance-id="${this.moduleInstanceId}"
650
- is-flag-enabled="${this.isFlagEnabled}"
650
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
651
651
  ></h-search-results>`)}
652
652
  </div>
653
653
  `, () => lit.html `
@@ -673,9 +673,9 @@ tslib_es6.__decorate([
673
673
  tslib_es6.__metadata("design:type", String)
674
674
  ], exports.HSearch.prototype, "locale", void 0);
675
675
  tslib_es6.__decorate([
676
- decorators.property({ type: Boolean, attribute: 'is-flag-enabled' }),
676
+ decorators.property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
677
677
  tslib_es6.__metadata("design:type", Boolean)
678
- ], exports.HSearch.prototype, "isFlagEnabled", void 0);
678
+ ], exports.HSearch.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
679
679
  tslib_es6.__decorate([
680
680
  decorators.property({ type: Boolean, attribute: 'popup' }),
681
681
  tslib_es6.__metadata("design:type", Boolean)
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/input/search_input.js CHANGED
@@ -13,7 +13,7 @@ var search_constants = require('../../search_constants.js');
13
13
  exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.PhoenixLightLitElement {
14
14
  constructor() {
15
15
  super(...arguments);
16
- this.isFlagEnabled = false;
16
+ this.isDevSearchPopupFixesFlagEnabled = false;
17
17
  this._isSearchPhraseCleared = false;
18
18
  this._setupAttributes = () => {
19
19
  var _a, _b, _c, _d;
@@ -34,7 +34,7 @@ exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.Phoe
34
34
  if (!this.input) {
35
35
  throw new Error('Search input not found');
36
36
  }
37
- if (!this.isFlagEnabled) {
37
+ if (!this.isDevSearchPopupFixesFlagEnabled) {
38
38
  this._setupInitialValue();
39
39
  }
40
40
  this._setupListeners();
@@ -42,7 +42,7 @@ exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.Phoe
42
42
  }
43
43
  firstUpdated(props) {
44
44
  super.firstUpdated(props);
45
- if (this.isFlagEnabled) {
45
+ if (this.isDevSearchPopupFixesFlagEnabled) {
46
46
  this._setupInitialValue();
47
47
  }
48
48
  }
@@ -142,9 +142,9 @@ tslib_es6.__decorate([
142
142
  tslib_es6.__metadata("design:type", String)
143
143
  ], exports.HSearchInput.prototype, "moduleInstanceId", void 0);
144
144
  tslib_es6.__decorate([
145
- decorators.property({ type: Boolean, attribute: 'is-flag-enabled' }),
145
+ decorators.property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
146
146
  tslib_es6.__metadata("design:type", Boolean)
147
- ], exports.HSearchInput.prototype, "isFlagEnabled", void 0);
147
+ ], exports.HSearchInput.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
148
148
  tslib_es6.__decorate([
149
149
  decorators.state(),
150
150
  tslib_es6.__metadata("design:type", Boolean)
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js CHANGED
@@ -17,7 +17,7 @@ exports.HSearchProducerContent = class HSearchProducerContent extends phoenix_li
17
17
  this.initialItemIds = {};
18
18
  this.translations = {};
19
19
  this.searchPhrase = '';
20
- this.isFlagEnabled = false;
20
+ this.isDevSearchPopupFixesFlagEnabled = false;
21
21
  }
22
22
  _getMatchedPhrase(phrase) {
23
23
  return phrase.toLowerCase().startsWith(this.searchPhrase)
@@ -31,6 +31,7 @@ exports.HSearchProducerContent = class HSearchProducerContent extends phoenix_li
31
31
  <ul>
32
32
  ${repeat.repeat(this.producers, (producer, index) => {
33
33
  var _a, _b;
34
+ const optionTabIndex = this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined;
34
35
  return lit.html `<li
35
36
  class="${search_constants.SEARCH_CLASS_NAMES.item} ${search_constants.SEARCH_CLASS_NAMES.itemHoverable} ${String(this.initialItemIds.producers + index) ===
36
37
  this.activeItemId
@@ -38,7 +39,7 @@ exports.HSearchProducerContent = class HSearchProducerContent extends phoenix_li
38
39
  : ''}"
39
40
  data-search-item-id="${this.searchId}${this.initialItemIds.producers + index}"
40
41
  aria-label=${this.producerAriaLabel ? `${this.producerAriaLabel} ${producer.name}` : undefined}
41
- tabindex=${this.isFlagEnabled ? (this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined) : 0}
42
+ tabindex=${this.isDevSearchPopupFixesFlagEnabled ? optionTabIndex : 0}
42
43
  role="option"
43
44
  >
44
45
  <a
@@ -84,9 +85,9 @@ tslib_es6.__decorate([
84
85
  tslib_es6.__metadata("design:type", String)
85
86
  ], exports.HSearchProducerContent.prototype, "producerAriaLabel", void 0);
86
87
  tslib_es6.__decorate([
87
- decorators.property({ type: Boolean, attribute: 'is-flag-enabled' }),
88
+ decorators.property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
88
89
  tslib_es6.__metadata("design:type", Boolean)
89
- ], exports.HSearchProducerContent.prototype, "isFlagEnabled", void 0);
90
+ ], exports.HSearchProducerContent.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
90
91
  exports.HSearchProducerContent = tslib_es6.__decorate([
91
92
  phoenix_custom_element.phoenixCustomElement(search_constants.SEARCH_COMPONENT_NAMES.searchProducerContent)
92
93
  ], exports.HSearchProducerContent);
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,8DAAkE;AACrF;AACA,qBAAqB,gEAAoE;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,8DAAkE;AACrF;AACA,qBAAqB,gEAAoE;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js CHANGED
@@ -16,7 +16,7 @@ exports.HSearchProductContent = class HSearchProductContent extends phoenix_ligh
16
16
  super(...arguments);
17
17
  this.initialItemIds = {};
18
18
  this.translations = {};
19
- this.isFlagEnabled = false;
19
+ this.isDevSearchPopupFixesFlagEnabled = false;
20
20
  this.getProductRateHtml = (productRate) => {
21
21
  return lit.html `
22
22
  <div class="${search_constants.SEARCH_CLASS_NAMES.starScore}">
@@ -44,6 +44,7 @@ exports.HSearchProductContent = class HSearchProductContent extends phoenix_ligh
44
44
  <ul>
45
45
  ${repeat.repeat(this.products, (product, index) => {
46
46
  var _a, _b;
47
+ const optionTabIndex = this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined;
47
48
  return lit.html ` <li
48
49
  class="${search_constants.SEARCH_CLASS_NAMES.item} ${search_constants.SEARCH_CLASS_NAMES.itemHoverable} ${String(this.initialItemIds.products + index) ===
49
50
  this.activeItemId
@@ -51,7 +52,7 @@ exports.HSearchProductContent = class HSearchProductContent extends phoenix_ligh
51
52
  : ''}"
52
53
  data-search-item-id="${this.searchId}${this.initialItemIds.products + index}"
53
54
  aria-label=${this.productAriaLabel ? `${this.productAriaLabel} ${product.name}` : undefined}
54
- tabindex=${this.isFlagEnabled ? (this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined) : 0}
55
+ tabindex=${this.isDevSearchPopupFixesFlagEnabled ? optionTabIndex : 0}
55
56
  role="option"
56
57
  >
57
58
  <a
@@ -121,9 +122,9 @@ tslib_es6.__decorate([
121
122
  tslib_es6.__metadata("design:type", String)
122
123
  ], exports.HSearchProductContent.prototype, "productAriaLabel", void 0);
123
124
  tslib_es6.__decorate([
124
- decorators.property({ type: Boolean, attribute: 'is-flag-enabled' }),
125
+ decorators.property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
125
126
  tslib_es6.__metadata("design:type", Boolean)
126
- ], exports.HSearchProductContent.prototype, "isFlagEnabled", void 0);
127
+ ], exports.HSearchProductContent.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
127
128
  exports.HSearchProductContent = tslib_es6.__decorate([
128
129
  phoenix_custom_element.phoenixCustomElement(search_constants.SEARCH_COMPONENT_NAMES.searchProductContent)
129
130
  ], exports.HSearchProductContent);
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,8DAAkE;AACrF;AACA,qBAAqB,gEAAoE;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,8DAAkE;AACrF;AACA,qBAAqB,gEAAoE;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_results.js CHANGED
@@ -19,7 +19,7 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
19
19
  this._goToProductsForButtonId = v4['default']();
20
20
  this.searchPhrase = '';
21
21
  this.translations = {};
22
- this.isFlagEnabled = false;
22
+ this.isDevSearchPopupFixesFlagEnabled = false;
23
23
  this._productPage = 1;
24
24
  this._getInitialItemsIds = () => {
25
25
  const suggestionInCategoryInitialItemId = this.results.suggestions.length;
@@ -78,7 +78,7 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
78
78
  view="${this.view}"
79
79
  module-instance-id="${this.moduleInstanceId}"
80
80
  .suggestionAriaLabel=${this.settings.suggesterItemAriaLabel}
81
- is-flag-enabled="${this.isFlagEnabled}"
81
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
82
82
  >
83
83
  </h-search-suggestion-content>`)}
84
84
  ${when.when((_c = this.results.products) === null || _c === void 0 ? void 0 : _c.length, () => lit.html `
@@ -91,7 +91,7 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
91
91
  .initialItemIds="${this._getInitialItemsIds()}"
92
92
  .translations="${this.translations}"
93
93
  .productAriaLabel=${this.settings.suggesterProductItemAriaLabel}
94
- is-flag-enabled="${this.isFlagEnabled}"
94
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
95
95
  ></h-search-product-content>
96
96
 
97
97
  ${when.when(this.settings.isLoadingMoreSearchResultsEnabled, () => when.when(this._areMoreProductsAvailable(), () => lit.html `<button
@@ -122,7 +122,7 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
122
122
  .translations="${this.translations}"
123
123
  search-phrase="${this.searchPhrase}"
124
124
  .producerAriaLabel=${this.settings.suggesterProducerItemAriaLabel}
125
- is-flag-enabled="${this.isFlagEnabled}"
125
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
126
126
  ></h-search-producer-content>`)}
127
127
  `;
128
128
  });
@@ -165,9 +165,9 @@ tslib_es6.__decorate([
165
165
  tslib_es6.__metadata("design:type", String)
166
166
  ], exports.HSearchResults.prototype, "moduleInstanceId", void 0);
167
167
  tslib_es6.__decorate([
168
- decorators.property({ type: Boolean, attribute: 'is-flag-enabled' }),
168
+ decorators.property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
169
169
  tslib_es6.__metadata("design:type", Boolean)
170
- ], exports.HSearchResults.prototype, "isFlagEnabled", void 0);
170
+ ], exports.HSearchResults.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
171
171
  tslib_es6.__decorate([
172
172
  decorators.state(),
173
173
  tslib_es6.__metadata("design:type", Number)
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js CHANGED
@@ -20,7 +20,7 @@ exports.HSearchSuggestionContent = class HSearchSuggestionContent extends phoeni
20
20
  this.translations = {};
21
21
  this._searchPhrase = '';
22
22
  this._suggestionsData = [];
23
- this.isFlagEnabled = false;
23
+ this.isDevSearchPopupFixesFlagEnabled = false;
24
24
  this._updateSearchPhrase = (ev, suggestion) => {
25
25
  ev.stopPropagation();
26
26
  this._dispatchEventWithSearchPhrase(search_constants.SEARCH_CUSTOM_EVENT_NAMES.updateSearchPhrase, suggestion);
@@ -106,17 +106,19 @@ exports.HSearchSuggestionContent = class HSearchSuggestionContent extends phoeni
106
106
  <h3 class="${search_constants.SEARCH_CLASS_NAMES.headline}">${this.translations.suggestions}</h3>
107
107
 
108
108
  <ul>
109
- ${repeat.repeat(this._suggestionsData, (suggestion, index) => lit.html `<li
109
+ ${repeat.repeat(this._suggestionsData, (suggestion, index) => {
110
+ const optionTabIndex = this.closest('.search_mobile-opened, :not([popup])') || suggestion.type === search_constants.SUGGESTIONS_TYPE.suggestion ? '0' : undefined;
111
+ return lit.html `<li
110
112
  @click=${() => this._handleSuggestion(suggestion.suggestionName, suggestion.type)}
111
113
  class="${search_constants.SEARCH_CLASS_NAMES.item} ${search_constants.SEARCH_CLASS_NAMES.itemHoverable} ${String(index) === this.activeItemId
112
- ? search_constants.SEARCH_CLASS_NAMES.itemActive
113
- : ''}"
114
+ ? search_constants.SEARCH_CLASS_NAMES.itemActive
115
+ : ''}"
114
116
  data-suggested-value="${suggestion.suggestionName}"
115
117
  data-search-item-id="${this.searchId}${index}"
116
118
  aria-label="${this.suggestionAriaLabel ?
117
- `${this.suggestionAriaLabel} ${suggestion.suggestionName || suggestion.categoryName}` :
118
- ''}"
119
- tabindex=${this.isFlagEnabled ? (this.closest('.search_mobile-opened, :not([popup])') || suggestion.type === search_constants.SUGGESTIONS_TYPE.suggestion ? '0' : undefined) : 0}
119
+ `${this.suggestionAriaLabel} ${suggestion.suggestionName || suggestion.categoryName}` :
120
+ ''}"
121
+ tabindex=${this.isDevSearchPopupFixesFlagEnabled ? optionTabIndex : 0}
120
122
  role="option"
121
123
  >
122
124
  ${when.when(suggestion.type === search_constants.SUGGESTIONS_TYPE.suggestion, () => lit.html ` <span> ${this._getMatchedPhrase(suggestion.suggestionName)} </span>
@@ -134,7 +136,8 @@ exports.HSearchSuggestionContent = class HSearchSuggestionContent extends phoeni
134
136
  <span> ${this._getMatchedPhrase(suggestion.categoryName)} </span>
135
137
  <span class="${search_constants.SEARCH_CLASS_NAMES.categoryTitle}"> ${this.translations.category} </span>
136
138
  </a>`)}
137
- </li>`)}
139
+ </li>`;
140
+ })}
138
141
  </ul>
139
142
  `);
140
143
  }
@@ -180,9 +183,9 @@ tslib_es6.__decorate([
180
183
  tslib_es6.__metadata("design:type", Array)
181
184
  ], exports.HSearchSuggestionContent.prototype, "_suggestionsData", void 0);
182
185
  tslib_es6.__decorate([
183
- decorators.property({ type: Boolean, attribute: 'is-flag-enabled' }),
186
+ decorators.property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
184
187
  tslib_es6.__metadata("design:type", Boolean)
185
- ], exports.HSearchSuggestionContent.prototype, "isFlagEnabled", void 0);
188
+ ], exports.HSearchSuggestionContent.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
186
189
  exports.HSearchSuggestionContent = tslib_es6.__decorate([
187
190
  phoenix_custom_element.phoenixCustomElement(search_constants.SEARCH_COMPONENT_NAMES.searchSuggestionContent)
188
191
  ], exports.HSearchSuggestionContent);
package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,8DAAkE;AACrF;AACA,qBAAqB,gEAAoE;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,8DAAkE;AACrF;AACA,qBAAqB,gEAAoE;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/esm/packages/phoenix/src/components/form/search/search.d.ts CHANGED
@@ -5,7 +5,7 @@ export declare class HSearch extends PhoenixLightLitElement {
5
5
  settings: TSearchSettings;
6
6
  view: string;
7
7
  locale: string;
8
- isFlagEnabled: boolean;
8
+ isDevSearchPopupFixesFlagEnabled: boolean;
9
9
  popup: boolean;
10
10
  moduleInstanceId: string;
11
11
  private _historyContextProvider;
package/build/esm/packages/phoenix/src/components/form/search/search.js CHANGED
@@ -20,7 +20,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
20
20
  constructor() {
21
21
  super(...arguments);
22
22
  this.view = DEFAULT_VIEW;
23
- this.isFlagEnabled = false;
23
+ this.isDevSearchPopupFixesFlagEnabled = false;
24
24
  this._id = v4();
25
25
  this._openSearchButtonAriaLabelId = `${this._id}-open-search-button-aria-label`;
26
26
  this._searchContentContainerId = v4();
@@ -301,7 +301,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
301
301
  this.classList.remove(SEARCH_CLASS_NAMES.mobileOpened);
302
302
  if (hasBeenOpened && this.popup) {
303
303
  const $storefrontSearch = document.querySelector(`h-storefront-search[module-instance-id="${this.moduleInstanceId}"]`);
304
- if (this.isFlagEnabled) {
304
+ if (this.isDevSearchPopupFixesFlagEnabled) {
305
305
  const searchOverlayTriggerName = (_a = $storefrontSearch === null || $storefrontSearch === void 0 ? void 0 : $storefrontSearch.querySelector('[aria-haspopup="dialog"]')) === null || _a === void 0 ? void 0 : _a.getAttribute('name');
306
306
  const $overlay = this.querySelector(`[hidden][id="${searchOverlayTriggerName}"]`);
307
307
  if (!searchOverlayTriggerName || !$overlay)
@@ -643,7 +643,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
643
643
  active-item-id="${this._activeItemId}"
644
644
  search-id="${this._id}"
645
645
  module-instance-id="${this.moduleInstanceId}"
646
- is-flag-enabled="${this.isFlagEnabled}"
646
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
647
647
  ></h-search-results>`)}
648
648
  </div>
649
649
  `, () => html `
@@ -669,9 +669,9 @@ __decorate([
669
669
  __metadata("design:type", String)
670
670
  ], HSearch.prototype, "locale", void 0);
671
671
  __decorate([
672
- property({ type: Boolean, attribute: 'is-flag-enabled' }),
672
+ property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
673
673
  __metadata("design:type", Boolean)
674
- ], HSearch.prototype, "isFlagEnabled", void 0);
674
+ ], HSearch.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
675
675
  __decorate([
676
676
  property({ type: Boolean, attribute: 'popup' }),
677
677
  __metadata("design:type", Boolean)
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/input/search_input.d.ts CHANGED
@@ -3,7 +3,7 @@ import { PropertyValues } from 'lit';
3
3
  export declare class HSearchInput extends PhoenixLightLitElement {
4
4
  input: HTMLInputElement | null;
5
5
  moduleInstanceId: string;
6
- isFlagEnabled: boolean;
6
+ isDevSearchPopupFixesFlagEnabled: boolean;
7
7
  private _isSearchPhraseCleared;
8
8
  connectedCallback(): void;
9
9
  firstUpdated(props: PropertyValues): void;
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/input/search_input.js CHANGED
@@ -9,7 +9,7 @@ import { SEARCH_CLASS_NAMES, SEARCH_CUSTOM_EVENT_NAMES, SEARCH_COMPONENT_NAMES }
9
9
  let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
10
10
  constructor() {
11
11
  super(...arguments);
12
- this.isFlagEnabled = false;
12
+ this.isDevSearchPopupFixesFlagEnabled = false;
13
13
  this._isSearchPhraseCleared = false;
14
14
  this._setupAttributes = () => {
15
15
  var _a, _b, _c, _d;
@@ -30,7 +30,7 @@ let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
30
30
  if (!this.input) {
31
31
  throw new Error('Search input not found');
32
32
  }
33
- if (!this.isFlagEnabled) {
33
+ if (!this.isDevSearchPopupFixesFlagEnabled) {
34
34
  this._setupInitialValue();
35
35
  }
36
36
  this._setupListeners();
@@ -38,7 +38,7 @@ let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
38
38
  }
39
39
  firstUpdated(props) {
40
40
  super.firstUpdated(props);
41
- if (this.isFlagEnabled) {
41
+ if (this.isDevSearchPopupFixesFlagEnabled) {
42
42
  this._setupInitialValue();
43
43
  }
44
44
  }
@@ -138,9 +138,9 @@ __decorate([
138
138
  __metadata("design:type", String)
139
139
  ], HSearchInput.prototype, "moduleInstanceId", void 0);
140
140
  __decorate([
141
- property({ type: Boolean, attribute: 'is-flag-enabled' }),
141
+ property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
142
142
  __metadata("design:type", Boolean)
143
- ], HSearchInput.prototype, "isFlagEnabled", void 0);
143
+ ], HSearchInput.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
144
144
  __decorate([
145
145
  state(),
146
146
  __metadata("design:type", Boolean)
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.d.ts CHANGED
@@ -9,7 +9,7 @@ export declare class HSearchProducerContent extends PhoenixLightLitElement {
9
9
  translations: Record<string, string>;
10
10
  searchPhrase: string;
11
11
  producerAriaLabel?: string;
12
- isFlagEnabled: boolean;
12
+ isDevSearchPopupFixesFlagEnabled: boolean;
13
13
  private _getMatchedPhrase;
14
14
  protected render(): TemplateResult;
15
15
  }
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js CHANGED
@@ -13,7 +13,7 @@ let HSearchProducerContent = class HSearchProducerContent extends PhoenixLightLi
13
13
  this.initialItemIds = {};
14
14
  this.translations = {};
15
15
  this.searchPhrase = '';
16
- this.isFlagEnabled = false;
16
+ this.isDevSearchPopupFixesFlagEnabled = false;
17
17
  }
18
18
  _getMatchedPhrase(phrase) {
19
19
  return phrase.toLowerCase().startsWith(this.searchPhrase)
@@ -27,6 +27,7 @@ let HSearchProducerContent = class HSearchProducerContent extends PhoenixLightLi
27
27
  <ul>
28
28
  ${c(this.producers, (producer, index) => {
29
29
  var _a, _b;
30
+ const optionTabIndex = this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined;
30
31
  return html `<li
31
32
  class="${SEARCH_CLASS_NAMES.item} ${SEARCH_CLASS_NAMES.itemHoverable} ${String(this.initialItemIds.producers + index) ===
32
33
  this.activeItemId
@@ -34,7 +35,7 @@ let HSearchProducerContent = class HSearchProducerContent extends PhoenixLightLi
34
35
  : ''}"
35
36
  data-search-item-id="${this.searchId}${this.initialItemIds.producers + index}"
36
37
  aria-label=${this.producerAriaLabel ? `${this.producerAriaLabel} ${producer.name}` : undefined}
37
- tabindex=${this.isFlagEnabled ? (this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined) : 0}
38
+ tabindex=${this.isDevSearchPopupFixesFlagEnabled ? optionTabIndex : 0}
38
39
  role="option"
39
40
  >
40
41
  <a
@@ -80,9 +81,9 @@ __decorate([
80
81
  __metadata("design:type", String)
81
82
  ], HSearchProducerContent.prototype, "producerAriaLabel", void 0);
82
83
  __decorate([
83
- property({ type: Boolean, attribute: 'is-flag-enabled' }),
84
+ property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
84
85
  __metadata("design:type", Boolean)
85
- ], HSearchProducerContent.prototype, "isFlagEnabled", void 0);
86
+ ], HSearchProducerContent.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
86
87
  HSearchProducerContent = __decorate([
87
88
  phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchProducerContent)
88
89
  ], HSearchProducerContent);
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA,0BAA0B,8DAAkE;AAC5F;AACA,4BAA4B,gEAAoE;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AAChG;AACA;AACA;AACA;AACA,0BAA0B,8DAAkE;AAC5F;AACA,4BAA4B,gEAAoE;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.d.ts CHANGED
@@ -9,7 +9,7 @@ export declare class HSearchProductContent extends PhoenixLightLitElement {
9
9
  initialItemIds: Record<string, number>;
10
10
  translations: Record<string, string>;
11
11
  productAriaLabel?: string;
12
- isFlagEnabled: boolean;
12
+ isDevSearchPopupFixesFlagEnabled: boolean;
13
13
  getProductRateHtml: (productRate: number) => TemplateResult;
14
14
  private _getShortenProductName;
15
15
  private _getPercentPromotion;
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js CHANGED
@@ -12,7 +12,7 @@ let HSearchProductContent = class HSearchProductContent extends PhoenixLightLitE
12
12
  super(...arguments);
13
13
  this.initialItemIds = {};
14
14
  this.translations = {};
15
- this.isFlagEnabled = false;
15
+ this.isDevSearchPopupFixesFlagEnabled = false;
16
16
  this.getProductRateHtml = (productRate) => {
17
17
  return html `
18
18
  <div class="${SEARCH_CLASS_NAMES.starScore}">
@@ -40,6 +40,7 @@ let HSearchProductContent = class HSearchProductContent extends PhoenixLightLitE
40
40
  <ul>
41
41
  ${c(this.products, (product, index) => {
42
42
  var _a, _b;
43
+ const optionTabIndex = this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined;
43
44
  return html ` <li
44
45
  class="${SEARCH_CLASS_NAMES.item} ${SEARCH_CLASS_NAMES.itemHoverable} ${String(this.initialItemIds.products + index) ===
45
46
  this.activeItemId
@@ -47,7 +48,7 @@ let HSearchProductContent = class HSearchProductContent extends PhoenixLightLitE
47
48
  : ''}"
48
49
  data-search-item-id="${this.searchId}${this.initialItemIds.products + index}"
49
50
  aria-label=${this.productAriaLabel ? `${this.productAriaLabel} ${product.name}` : undefined}
50
- tabindex=${this.isFlagEnabled ? (this.closest('.search_mobile-opened, :not([popup])') ? '0' : undefined) : 0}
51
+ tabindex=${this.isDevSearchPopupFixesFlagEnabled ? optionTabIndex : 0}
51
52
  role="option"
52
53
  >
53
54
  <a
@@ -117,9 +118,9 @@ __decorate([
117
118
  __metadata("design:type", String)
118
119
  ], HSearchProductContent.prototype, "productAriaLabel", void 0);
119
120
  __decorate([
120
- property({ type: Boolean, attribute: 'is-flag-enabled' }),
121
+ property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
121
122
  __metadata("design:type", Boolean)
122
- ], HSearchProductContent.prototype, "isFlagEnabled", void 0);
123
+ ], HSearchProductContent.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
123
124
  HSearchProductContent = __decorate([
124
125
  phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchProductContent)
125
126
  ], HSearchProductContent);
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA,0BAA0B,8DAAkE;AAC5F;AACA,4BAA4B,gEAAoE;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AAChG;AACA;AACA;AACA;AACA,0BAA0B,8DAAkE;AAC5F;AACA,4BAA4B,gEAAoE;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_results.d.ts CHANGED
@@ -13,7 +13,7 @@ export declare class HSearchResults extends PhoenixLightLitElement {
13
13
  searchId: string;
14
14
  translations: Record<string, string>;
15
15
  moduleInstanceId: string;
16
- isFlagEnabled: boolean;
16
+ isDevSearchPopupFixesFlagEnabled: boolean;
17
17
  private _productPage;
18
18
  private _getInitialItemsIds;
19
19
  private _isProductInTheCategory;
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_results.js CHANGED
@@ -15,7 +15,7 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
15
15
  this._goToProductsForButtonId = v4();
16
16
  this.searchPhrase = '';
17
17
  this.translations = {};
18
- this.isFlagEnabled = false;
18
+ this.isDevSearchPopupFixesFlagEnabled = false;
19
19
  this._productPage = 1;
20
20
  this._getInitialItemsIds = () => {
21
21
  const suggestionInCategoryInitialItemId = this.results.suggestions.length;
@@ -74,7 +74,7 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
74
74
  view="${this.view}"
75
75
  module-instance-id="${this.moduleInstanceId}"
76
76
  .suggestionAriaLabel=${this.settings.suggesterItemAriaLabel}
77
- is-flag-enabled="${this.isFlagEnabled}"
77
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
78
78
  >
79
79
  </h-search-suggestion-content>`)}
80
80
  ${n((_c = this.results.products) === null || _c === void 0 ? void 0 : _c.length, () => html `
@@ -87,7 +87,7 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
87
87
  .initialItemIds="${this._getInitialItemsIds()}"
88
88
  .translations="${this.translations}"
89
89
  .productAriaLabel=${this.settings.suggesterProductItemAriaLabel}
90
- is-flag-enabled="${this.isFlagEnabled}"
90
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
91
91
  ></h-search-product-content>
92
92
 
93
93
  ${n(this.settings.isLoadingMoreSearchResultsEnabled, () => n(this._areMoreProductsAvailable(), () => html `<button
@@ -118,7 +118,7 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
118
118
  .translations="${this.translations}"
119
119
  search-phrase="${this.searchPhrase}"
120
120
  .producerAriaLabel=${this.settings.suggesterProducerItemAriaLabel}
121
- is-flag-enabled="${this.isFlagEnabled}"
121
+ is-dev-search-popup-fixes-flag-enabled="${this.isDevSearchPopupFixesFlagEnabled}"
122
122
  ></h-search-producer-content>`)}
123
123
  `;
124
124
  });
@@ -161,9 +161,9 @@ __decorate([
161
161
  __metadata("design:type", String)
162
162
  ], HSearchResults.prototype, "moduleInstanceId", void 0);
163
163
  __decorate([
164
- property({ type: Boolean, attribute: 'is-flag-enabled' }),
164
+ property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
165
165
  __metadata("design:type", Boolean)
166
- ], HSearchResults.prototype, "isFlagEnabled", void 0);
166
+ ], HSearchResults.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
167
167
  __decorate([
168
168
  state(),
169
169
  __metadata("design:type", Number)
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.d.ts CHANGED
@@ -14,7 +14,7 @@ export declare class HSearchSuggestionContent extends PhoenixLightLitElement {
14
14
  suggestionAriaLabel?: string;
15
15
  private _searchPhrase;
16
16
  private _suggestionsData;
17
- isFlagEnabled: boolean;
17
+ isDevSearchPopupFixesFlagEnabled: boolean;
18
18
  connectedCallback(): Promise<void>;
19
19
  private _setupSuggestionData;
20
20
  private _handleSuggestion;
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js CHANGED
@@ -16,7 +16,7 @@ let HSearchSuggestionContent = class HSearchSuggestionContent extends PhoenixLig
16
16
  this.translations = {};
17
17
  this._searchPhrase = '';
18
18
  this._suggestionsData = [];
19
- this.isFlagEnabled = false;
19
+ this.isDevSearchPopupFixesFlagEnabled = false;
20
20
  this._updateSearchPhrase = (ev, suggestion) => {
21
21
  ev.stopPropagation();
22
22
  this._dispatchEventWithSearchPhrase(SEARCH_CUSTOM_EVENT_NAMES.updateSearchPhrase, suggestion);
@@ -102,17 +102,19 @@ let HSearchSuggestionContent = class HSearchSuggestionContent extends PhoenixLig
102
102
  <h3 class="${SEARCH_CLASS_NAMES.headline}">${this.translations.suggestions}</h3>
103
103
 
104
104
  <ul>
105
- ${c(this._suggestionsData, (suggestion, index) => html `<li
105
+ ${c(this._suggestionsData, (suggestion, index) => {
106
+ const optionTabIndex = this.closest('.search_mobile-opened, :not([popup])') || suggestion.type === SUGGESTIONS_TYPE.suggestion ? '0' : undefined;
107
+ return html `<li
106
108
  @click=${() => this._handleSuggestion(suggestion.suggestionName, suggestion.type)}
107
109
  class="${SEARCH_CLASS_NAMES.item} ${SEARCH_CLASS_NAMES.itemHoverable} ${String(index) === this.activeItemId
108
- ? SEARCH_CLASS_NAMES.itemActive
109
- : ''}"
110
+ ? SEARCH_CLASS_NAMES.itemActive
111
+ : ''}"
110
112
  data-suggested-value="${suggestion.suggestionName}"
111
113
  data-search-item-id="${this.searchId}${index}"
112
114
  aria-label="${this.suggestionAriaLabel ?
113
- `${this.suggestionAriaLabel} ${suggestion.suggestionName || suggestion.categoryName}` :
114
- ''}"
115
- tabindex=${this.isFlagEnabled ? (this.closest('.search_mobile-opened, :not([popup])') || suggestion.type === SUGGESTIONS_TYPE.suggestion ? '0' : undefined) : 0}
115
+ `${this.suggestionAriaLabel} ${suggestion.suggestionName || suggestion.categoryName}` :
116
+ ''}"
117
+ tabindex=${this.isDevSearchPopupFixesFlagEnabled ? optionTabIndex : 0}
116
118
  role="option"
117
119
  >
118
120
  ${n(suggestion.type === SUGGESTIONS_TYPE.suggestion, () => html ` <span> ${this._getMatchedPhrase(suggestion.suggestionName)} </span>
@@ -130,7 +132,8 @@ let HSearchSuggestionContent = class HSearchSuggestionContent extends PhoenixLig
130
132
  <span> ${this._getMatchedPhrase(suggestion.categoryName)} </span>
131
133
  <span class="${SEARCH_CLASS_NAMES.categoryTitle}"> ${this.translations.category} </span>
132
134
  </a>`)}
133
- </li>`)}
135
+ </li>`;
136
+ })}
134
137
  </ul>
135
138
  `);
136
139
  }
@@ -176,9 +179,9 @@ __decorate([
176
179
  __metadata("design:type", Array)
177
180
  ], HSearchSuggestionContent.prototype, "_suggestionsData", void 0);
178
181
  __decorate([
179
- property({ type: Boolean, attribute: 'is-flag-enabled' }),
182
+ property({ type: Boolean, attribute: 'is-dev-search-popup-fixes-flag-enabled' }),
180
183
  __metadata("design:type", Boolean)
181
- ], HSearchSuggestionContent.prototype, "isFlagEnabled", void 0);
184
+ ], HSearchSuggestionContent.prototype, "isDevSearchPopupFixesFlagEnabled", void 0);
182
185
  HSearchSuggestionContent = __decorate([
183
186
  phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchSuggestionContent)
184
187
  ], HSearchSuggestionContent);
package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0B,8DAAkE;AAC5F;AACA,4BAA4B,gEAAoE;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0B,8DAAkE;AAC5F;AACA,4BAA4B,gEAAoE;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@shoper/phoenix_design_system",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "1.18.2-5",
5
+ "version": "1.18.2-6",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",