@shoper/phoenix_design_system 1.11.11-6 → 1.11.11-7

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 (6) hide show
  1. package/build/cjs/packages/phoenix/src/components/form/search/search.js +26 -39
  2. package/build/cjs/packages/phoenix/src/components/form/search/search.js.map +1 -1
  3. package/build/esm/packages/phoenix/src/components/form/search/search.d.ts +3 -0
  4. package/build/esm/packages/phoenix/src/components/form/search/search.js +26 -39
  5. package/build/esm/packages/phoenix/src/components/form/search/search.js.map +1 -1
  6. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/form/search/search.js CHANGED
@@ -117,8 +117,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
117
117
  const searchBar = this.querySelector(`.${search_constants.SEARCH_CLASS_NAMES.searchBar}`);
118
118
  searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(search_constants.SEARCH_CLASS_NAMES.outline);
119
119
  this._resetSearchView();
120
- document.removeEventListener('keydown', this._bindKeys);
121
- document.removeEventListener('keyup', this._handleSearchTabNavigation);
120
+ this._removeSearchKeyboardNavigation();
122
121
  this._focusOnNextElementAfterSearchInput(ev);
123
122
  }
124
123
  };
@@ -127,8 +126,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
127
126
  const searchBar = this.querySelector(`.${search_constants.SEARCH_CLASS_NAMES.searchBar}`);
128
127
  searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(search_constants.SEARCH_CLASS_NAMES.outline);
129
128
  this._resetSearchView();
130
- document.removeEventListener('keydown', this._bindKeys);
131
- document.removeEventListener('keyup', this._handleSearchTabNavigation);
129
+ this._removeSearchKeyboardNavigation();
132
130
  utilities.UiDomUtils.getPreviousFocusableElement(this._inputField).focus();
133
131
  };
134
132
  this._focusOnNextElementAfterSearchInput = async (ev) => {
@@ -146,31 +144,16 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
146
144
  };
147
145
  this._handleForwardListFocus = () => {
148
146
  var _a, _b;
149
- const containers = [
150
- this._searchHistoryRef.value,
151
- this._searchResultsRef.value,
152
- this._searchMessageRef.value
153
- ];
154
- const $searchItemsContainer = containers.find(container => container && !utilities.UiDomUtils.isElementEmpty(container));
147
+ const $searchItemsContainer = this._findSearchItemsContainer();
155
148
  if (!$searchItemsContainer)
156
149
  return;
157
150
  const isActiveElementASearchItem = !!((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.getAttribute('data-search-item-id'));
158
151
  const isActiveElementAGridSearchItem = isActiveElementASearchItem && !!((_b = document.activeElement) === null || _b === void 0 ? void 0 : _b.getAttribute('data-search-grid-item'));
159
- const $listSearchItems = utilities.UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
160
- const searchItemId = $el.getAttribute('data-search-item-id');
161
- const isListSearchItem = !!searchItemId && !$el.getAttribute('data-search-grid-item');
162
- const isGridSearchItem = !!searchItemId && $el.getAttribute('data-search-grid-item');
163
- return isActiveElementAGridSearchItem ? isGridSearchItem : isListSearchItem;
164
- });
152
+ const $listSearchItems = this._findListSearchItems($searchItemsContainer, isActiveElementAGridSearchItem);
165
153
  this._handleForwardFocus($listSearchItems);
166
154
  };
167
155
  this._handleForwardGridFocus = () => {
168
- const containers = [
169
- this._searchHistoryRef.value,
170
- this._searchResultsRef.value,
171
- this._searchMessageRef.value
172
- ];
173
- const $searchItemsContainer = containers.find(container => container && !utilities.UiDomUtils.isElementEmpty(container));
156
+ const $searchItemsContainer = this._findSearchItemsContainer();
174
157
  if (!$searchItemsContainer)
175
158
  return;
176
159
  const $gridSearchItems = utilities.UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
@@ -200,31 +183,24 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
200
183
  if (isFocusedOnSearchInput || !hasPopup)
201
184
  return;
202
185
  ev.preventDefault();
203
- const containers = [
204
- this._searchHistoryRef.value,
205
- this._searchResultsRef.value,
206
- this._searchMessageRef.value
207
- ];
208
- const $searchItemsContainer = containers.find(container => container && !utilities.UiDomUtils.isElementEmpty(container));
186
+ const $searchItemsContainer = this._findSearchItemsContainer();
209
187
  if (!$searchItemsContainer)
210
188
  return;
211
189
  const isActiveElementASearchItem = !!((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.getAttribute('data-search-item-id'));
212
190
  const isActiveElementAGridSearchItem = isActiveElementASearchItem && !!((_b = document.activeElement) === null || _b === void 0 ? void 0 : _b.getAttribute('data-search-grid-item'));
213
- const $listSearchItems = utilities.UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
191
+ const $listSearchItems = this._findListSearchItems($searchItemsContainer, isActiveElementAGridSearchItem);
192
+ this._handleBackwardFocus($listSearchItems);
193
+ };
194
+ this._findListSearchItems = ($searchItemsContainer, shouldFindGridList) => {
195
+ return utilities.UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
214
196
  const searchItemId = $el.getAttribute('data-search-item-id');
215
197
  const isListSearchItem = !!searchItemId && !$el.getAttribute('data-search-grid-item');
216
198
  const isGridSearchItem = !!searchItemId && $el.getAttribute('data-search-grid-item');
217
- return isActiveElementAGridSearchItem ? isGridSearchItem : isListSearchItem;
199
+ return shouldFindGridList ? isGridSearchItem : isListSearchItem;
218
200
  });
219
- this._handleBackwardFocus($listSearchItems);
220
201
  };
221
202
  this._handleBackwardGridFocus = () => {
222
- const containers = [
223
- this._searchHistoryRef.value,
224
- this._searchResultsRef.value,
225
- this._searchMessageRef.value
226
- ];
227
- const $searchItemsContainer = containers.find(container => container && !utilities.UiDomUtils.isElementEmpty(container));
203
+ const $searchItemsContainer = this._findSearchItemsContainer();
228
204
  if (!$searchItemsContainer)
229
205
  return;
230
206
  const $gridSearchItems = utilities.UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
@@ -232,6 +208,14 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
232
208
  });
233
209
  this._handleBackwardFocus($gridSearchItems);
234
210
  };
211
+ this._findSearchItemsContainer = () => {
212
+ const containers = [
213
+ this._searchHistoryRef.value,
214
+ this._searchResultsRef.value,
215
+ this._searchMessageRef.value
216
+ ];
217
+ return containers.find(container => container && !utilities.UiDomUtils.isElementEmpty(container));
218
+ };
235
219
  this._handleBackwardFocus = ($searchItems) => {
236
220
  var _a;
237
221
  const $activeElement = document.activeElement;
@@ -247,6 +231,10 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
247
231
  this._inputField.setAttribute('aria-activedescendant', this._activeItemId);
248
232
  }
249
233
  };
234
+ this._removeSearchKeyboardNavigation = () => {
235
+ document.removeEventListener('keydown', this._bindKeys);
236
+ document.removeEventListener('keyup', this._handleSearchTabNavigation);
237
+ };
250
238
  this._handleFocusOnInputWithCaretEnd = () => {
251
239
  const isFocusedOnSearchInput = document.activeElement === this._inputField;
252
240
  if (isFocusedOnSearchInput)
@@ -499,8 +487,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
499
487
  const searchBar = this.querySelector(`.${search_constants.SEARCH_CLASS_NAMES.searchBar}`);
500
488
  searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(search_constants.SEARCH_CLASS_NAMES.outline);
501
489
  this._hideHistorySuggestionsAndResults();
502
- document.removeEventListener('keydown', this._bindKeys);
503
- document.removeEventListener('keyup', this._handleSearchTabNavigation);
490
+ this._removeSearchKeyboardNavigation();
504
491
  }
505
492
  _submitSearchPhrase(searchPhrase) {
506
493
  this._dispatchEventWithSearchPhrase(search_constants.SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, searchPhrase);
package/build/cjs/packages/phoenix/src/components/form/search/search.js.map CHANGED
@@ -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,iBAAiB,wDAA4D;AAC7E,mBAAmB,qEAA6E;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,mBAAmB,qEAA6E;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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
@@ -54,11 +54,14 @@ export declare class HSearch extends PhoenixLightLitElement {
54
54
  private _handleForwardFocus;
55
55
  private _handleMoveToInputField;
56
56
  private _handleBackwardListFocus;
57
+ private _findListSearchItems;
57
58
  private _handleBackwardGridFocus;
59
+ private _findSearchItemsContainer;
58
60
  private _handleBackwardFocus;
59
61
  private _handleChooseSearchItem;
60
62
  private _resetSearchView;
61
63
  private _setActiveItemId;
64
+ private _removeSearchKeyboardNavigation;
62
65
  private _handleFocusOnInputWithCaretEnd;
63
66
  private _handleFocusOnInputWithCaretStart;
64
67
  private _handleWriteableCharacter;
package/build/esm/packages/phoenix/src/components/form/search/search.js CHANGED
@@ -113,8 +113,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
113
113
  const searchBar = this.querySelector(`.${SEARCH_CLASS_NAMES.searchBar}`);
114
114
  searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(SEARCH_CLASS_NAMES.outline);
115
115
  this._resetSearchView();
116
- document.removeEventListener('keydown', this._bindKeys);
117
- document.removeEventListener('keyup', this._handleSearchTabNavigation);
116
+ this._removeSearchKeyboardNavigation();
118
117
  this._focusOnNextElementAfterSearchInput(ev);
119
118
  }
120
119
  };
@@ -123,8 +122,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
123
122
  const searchBar = this.querySelector(`.${SEARCH_CLASS_NAMES.searchBar}`);
124
123
  searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(SEARCH_CLASS_NAMES.outline);
125
124
  this._resetSearchView();
126
- document.removeEventListener('keydown', this._bindKeys);
127
- document.removeEventListener('keyup', this._handleSearchTabNavigation);
125
+ this._removeSearchKeyboardNavigation();
128
126
  UiDomUtils.getPreviousFocusableElement(this._inputField).focus();
129
127
  };
130
128
  this._focusOnNextElementAfterSearchInput = async (ev) => {
@@ -142,31 +140,16 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
142
140
  };
143
141
  this._handleForwardListFocus = () => {
144
142
  var _a, _b;
145
- const containers = [
146
- this._searchHistoryRef.value,
147
- this._searchResultsRef.value,
148
- this._searchMessageRef.value
149
- ];
150
- const $searchItemsContainer = containers.find(container => container && !UiDomUtils.isElementEmpty(container));
143
+ const $searchItemsContainer = this._findSearchItemsContainer();
151
144
  if (!$searchItemsContainer)
152
145
  return;
153
146
  const isActiveElementASearchItem = !!((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.getAttribute('data-search-item-id'));
154
147
  const isActiveElementAGridSearchItem = isActiveElementASearchItem && !!((_b = document.activeElement) === null || _b === void 0 ? void 0 : _b.getAttribute('data-search-grid-item'));
155
- const $listSearchItems = UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
156
- const searchItemId = $el.getAttribute('data-search-item-id');
157
- const isListSearchItem = !!searchItemId && !$el.getAttribute('data-search-grid-item');
158
- const isGridSearchItem = !!searchItemId && $el.getAttribute('data-search-grid-item');
159
- return isActiveElementAGridSearchItem ? isGridSearchItem : isListSearchItem;
160
- });
148
+ const $listSearchItems = this._findListSearchItems($searchItemsContainer, isActiveElementAGridSearchItem);
161
149
  this._handleForwardFocus($listSearchItems);
162
150
  };
163
151
  this._handleForwardGridFocus = () => {
164
- const containers = [
165
- this._searchHistoryRef.value,
166
- this._searchResultsRef.value,
167
- this._searchMessageRef.value
168
- ];
169
- const $searchItemsContainer = containers.find(container => container && !UiDomUtils.isElementEmpty(container));
152
+ const $searchItemsContainer = this._findSearchItemsContainer();
170
153
  if (!$searchItemsContainer)
171
154
  return;
172
155
  const $gridSearchItems = UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
@@ -196,31 +179,24 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
196
179
  if (isFocusedOnSearchInput || !hasPopup)
197
180
  return;
198
181
  ev.preventDefault();
199
- const containers = [
200
- this._searchHistoryRef.value,
201
- this._searchResultsRef.value,
202
- this._searchMessageRef.value
203
- ];
204
- const $searchItemsContainer = containers.find(container => container && !UiDomUtils.isElementEmpty(container));
182
+ const $searchItemsContainer = this._findSearchItemsContainer();
205
183
  if (!$searchItemsContainer)
206
184
  return;
207
185
  const isActiveElementASearchItem = !!((_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.getAttribute('data-search-item-id'));
208
186
  const isActiveElementAGridSearchItem = isActiveElementASearchItem && !!((_b = document.activeElement) === null || _b === void 0 ? void 0 : _b.getAttribute('data-search-grid-item'));
209
- const $listSearchItems = UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
187
+ const $listSearchItems = this._findListSearchItems($searchItemsContainer, isActiveElementAGridSearchItem);
188
+ this._handleBackwardFocus($listSearchItems);
189
+ };
190
+ this._findListSearchItems = ($searchItemsContainer, shouldFindGridList) => {
191
+ return UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
210
192
  const searchItemId = $el.getAttribute('data-search-item-id');
211
193
  const isListSearchItem = !!searchItemId && !$el.getAttribute('data-search-grid-item');
212
194
  const isGridSearchItem = !!searchItemId && $el.getAttribute('data-search-grid-item');
213
- return isActiveElementAGridSearchItem ? isGridSearchItem : isListSearchItem;
195
+ return shouldFindGridList ? isGridSearchItem : isListSearchItem;
214
196
  });
215
- this._handleBackwardFocus($listSearchItems);
216
197
  };
217
198
  this._handleBackwardGridFocus = () => {
218
- const containers = [
219
- this._searchHistoryRef.value,
220
- this._searchResultsRef.value,
221
- this._searchMessageRef.value
222
- ];
223
- const $searchItemsContainer = containers.find(container => container && !UiDomUtils.isElementEmpty(container));
199
+ const $searchItemsContainer = this._findSearchItemsContainer();
224
200
  if (!$searchItemsContainer)
225
201
  return;
226
202
  const $gridSearchItems = UiDomUtils.getFocusableElements($searchItemsContainer).filter(($el) => {
@@ -228,6 +204,14 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
228
204
  });
229
205
  this._handleBackwardFocus($gridSearchItems);
230
206
  };
207
+ this._findSearchItemsContainer = () => {
208
+ const containers = [
209
+ this._searchHistoryRef.value,
210
+ this._searchResultsRef.value,
211
+ this._searchMessageRef.value
212
+ ];
213
+ return containers.find(container => container && !UiDomUtils.isElementEmpty(container));
214
+ };
231
215
  this._handleBackwardFocus = ($searchItems) => {
232
216
  var _a;
233
217
  const $activeElement = document.activeElement;
@@ -243,6 +227,10 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
243
227
  this._inputField.setAttribute('aria-activedescendant', this._activeItemId);
244
228
  }
245
229
  };
230
+ this._removeSearchKeyboardNavigation = () => {
231
+ document.removeEventListener('keydown', this._bindKeys);
232
+ document.removeEventListener('keyup', this._handleSearchTabNavigation);
233
+ };
246
234
  this._handleFocusOnInputWithCaretEnd = () => {
247
235
  const isFocusedOnSearchInput = document.activeElement === this._inputField;
248
236
  if (isFocusedOnSearchInput)
@@ -495,8 +483,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
495
483
  const searchBar = this.querySelector(`.${SEARCH_CLASS_NAMES.searchBar}`);
496
484
  searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(SEARCH_CLASS_NAMES.outline);
497
485
  this._hideHistorySuggestionsAndResults();
498
- document.removeEventListener('keydown', this._bindKeys);
499
- document.removeEventListener('keyup', this._handleSearchTabNavigation);
486
+ this._removeSearchKeyboardNavigation();
500
487
  }
501
488
  _submitSearchPhrase(searchPhrase) {
502
489
  this._dispatchEventWithSearchPhrase(SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, searchPhrase);
package/build/esm/packages/phoenix/src/components/form/search/search.js.map CHANGED
@@ -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,eAAe,wDAA4D;AAC3E,0BAA0B,qEAA6E;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,0BAA0B,qEAA6E;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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.11.11-6",
5
+ "version": "1.11.11-7",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",