@shoper/phoenix_design_system 1.18.24-3 → 1.18.24-4

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.
@@ -40,7 +40,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
40
40
  this._shouldShowResults = false;
41
41
  this._shouldShowMessage = false;
42
42
  this._searchHistory = [];
43
- this.searchPhrase = '';
43
+ this._searchPhrase = '';
44
44
  this._historyLimitedContent = [];
45
45
  this._historyContext = new behavior_subject.BehaviorSubject({
46
46
  showLoadMore: false
@@ -370,8 +370,8 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
370
370
  };
371
371
  this._handleOpenSearch = () => {
372
372
  this.classList.add(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
373
- const shouldShowMessage = this.searchPhrase !== '';
374
- this._updateSearchView(this.searchPhrase, shouldShowMessage, false);
373
+ const shouldShowMessage = this._searchPhrase !== '';
374
+ this._updateSearchView(this._searchPhrase, shouldShowMessage, false);
375
375
  const $searchInput = this.querySelector(`
376
376
  ${search_constants.SEARCH_COMPONENT_NAMES.searchInput} input[type="search"]
377
377
  `);
@@ -406,7 +406,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
406
406
  ...searchData.translations,
407
407
  ...ariaTranslations
408
408
  };
409
- this.searchPhrase = searchData.searchPhrase;
409
+ this._searchPhrase = searchData.searchPhrase;
410
410
  this._historyContext.notify({ showLoadMore: this._searchHistory.length > search_constants.SEARCH_CONFIGURATION.historyContentLimit });
411
411
  this._historyLimitedContent = this._searchHistory.slice(0, search_constants.SEARCH_CONFIGURATION.historyContentLimit);
412
412
  });
@@ -415,7 +415,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
415
415
  catch (_a) {
416
416
  console.error('Search context is not provided');
417
417
  }
418
- this._searchInput = this.querySelector(search_constants.SEARCH_COMPONENT_NAMES.searchInput);
418
+ this.searchInput = this.querySelector(search_constants.SEARCH_COMPONENT_NAMES.searchInput);
419
419
  this._setupInitialSearchPhrase();
420
420
  this._setupListeners();
421
421
  this.isSearchIconFixEnabled ? this._setupToggler() : this._setupAriaAttributes();
@@ -445,7 +445,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
445
445
  this._searchForm = searchForm;
446
446
  if (!((_a = this._inputField) === null || _a === void 0 ? void 0 : _a.value))
447
447
  return;
448
- this.searchPhrase = this._inputField.value;
448
+ this._searchPhrase = this._inputField.value;
449
449
  this._updateSearchPhrase(this._inputField.value);
450
450
  }
451
451
  _updateSearchPhrase(searchPhrase) {
@@ -551,7 +551,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
551
551
  }
552
552
  _toggleSearchInputAttributes(shouldShowHistory, shouldShowResults) {
553
553
  var _a;
554
- const $input = (_a = this._searchInput) === null || _a === void 0 ? void 0 : _a.input;
554
+ const $input = (_a = this.searchInput) === null || _a === void 0 ? void 0 : _a.input;
555
555
  if (!$input)
556
556
  return;
557
557
  if (!shouldShowHistory && !shouldShowResults) {
@@ -643,7 +643,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
643
643
  .history="${this._historyLimitedContent}"
644
644
  .results="${this._searchResults}"
645
645
  .translations="${this._translations}"
646
- search-phrase="${this.searchPhrase}"
646
+ search-phrase="${this._searchPhrase}"
647
647
  module-instance-id="${this.moduleInstanceId}"
648
648
  ></h-search-message>`)}
649
649
  ${when.when(this._shouldShowHistory, () => lit.html `<h-search-history
@@ -657,7 +657,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
657
657
  ${when.when(this._shouldShowResults, () => lit.html `<h-search-results
658
658
  ${ref_js.ref(this._searchResultsRef)}
659
659
  .results="${this._searchResults}"
660
- search-phrase="${this.searchPhrase}"
660
+ search-phrase="${this._searchPhrase}"
661
661
  .settings="${this.settings}"
662
662
  locale="${this.locale}"
663
663
  view="${this.view}"
@@ -727,7 +727,7 @@ tslib_es6.__decorate([
727
727
  tslib_es6.__decorate([
728
728
  decorators.state(),
729
729
  tslib_es6.__metadata("design:type", String)
730
- ], exports.HSearch.prototype, "searchPhrase", void 0);
730
+ ], exports.HSearch.prototype, "_searchPhrase", void 0);
731
731
  tslib_es6.__decorate([
732
732
  decorators.state(),
733
733
  tslib_es6.__metadata("design:type", Array)
@@ -34,10 +34,10 @@ exports.HSearchClear = class HSearchClear extends phoenix_light_lit_element.Phoe
34
34
  this._btnController = new btn_controller.BtnController(this, this._dispatchClearEvent);
35
35
  }
36
36
  connectedCallback() {
37
- var _a, _b;
37
+ var _a, _b, _c, _d;
38
38
  super.connectedCallback();
39
39
  this._searchContextSetup();
40
- this._updateClearButtonVisibility((_b = (_a = this.closest('h-search')) === null || _a === void 0 ? void 0 : _a.searchPhrase) !== null && _b !== void 0 ? _b : '');
40
+ this._updateClearButtonVisibility((_d = (_c = (_b = (_a = this.closest(search_constants.SEARCH_COMPONENT_NAMES.search)) === null || _a === void 0 ? void 0 : _a.searchInput) === null || _b === void 0 ? void 0 : _b.input) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : '');
41
41
  this.addEventListener('click', this._dispatchClearEvent);
42
42
  document.addEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.keyup, this._handleClearButtonOnPhraseEnter);
43
43
  }
@@ -1,6 +1,7 @@
1
1
  import { TemplateResult } from 'lit';
2
2
  import { PhoenixLightLitElement } from "../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
3
3
  import type { TSearchDisplayMode, TSearchSettings } from "./search_types";
4
+ import { HSearchInput } from './subcomponents/input/search_input';
4
5
  export declare class HSearch extends PhoenixLightLitElement {
5
6
  settings: TSearchSettings;
6
7
  view: string;
@@ -13,7 +14,7 @@ export declare class HSearch extends PhoenixLightLitElement {
13
14
  private _searchContextConsumer;
14
15
  private _searchContext$;
15
16
  private _searchContextObserver;
16
- private _searchInput;
17
+ searchInput: HSearchInput | null;
17
18
  private _inputField;
18
19
  private _searchForm;
19
20
  private _togglerElement;
@@ -29,7 +30,7 @@ export declare class HSearch extends PhoenixLightLitElement {
29
30
  private _shouldShowMessage;
30
31
  private _searchResults;
31
32
  private _searchHistory;
32
- searchPhrase: string;
33
+ private _searchPhrase;
33
34
  private _historyLimitedContent;
34
35
  private _historyContext;
35
36
  private _activeItemId;
@@ -36,7 +36,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
36
36
  this._shouldShowResults = false;
37
37
  this._shouldShowMessage = false;
38
38
  this._searchHistory = [];
39
- this.searchPhrase = '';
39
+ this._searchPhrase = '';
40
40
  this._historyLimitedContent = [];
41
41
  this._historyContext = new BehaviorSubject({
42
42
  showLoadMore: false
@@ -366,8 +366,8 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
366
366
  };
367
367
  this._handleOpenSearch = () => {
368
368
  this.classList.add(SEARCH_CLASS_NAMES.mobileOpened);
369
- const shouldShowMessage = this.searchPhrase !== '';
370
- this._updateSearchView(this.searchPhrase, shouldShowMessage, false);
369
+ const shouldShowMessage = this._searchPhrase !== '';
370
+ this._updateSearchView(this._searchPhrase, shouldShowMessage, false);
371
371
  const $searchInput = this.querySelector(`
372
372
  ${SEARCH_COMPONENT_NAMES.searchInput} input[type="search"]
373
373
  `);
@@ -402,7 +402,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
402
402
  ...searchData.translations,
403
403
  ...ariaTranslations
404
404
  };
405
- this.searchPhrase = searchData.searchPhrase;
405
+ this._searchPhrase = searchData.searchPhrase;
406
406
  this._historyContext.notify({ showLoadMore: this._searchHistory.length > SEARCH_CONFIGURATION.historyContentLimit });
407
407
  this._historyLimitedContent = this._searchHistory.slice(0, SEARCH_CONFIGURATION.historyContentLimit);
408
408
  });
@@ -411,7 +411,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
411
411
  catch (_a) {
412
412
  console.error('Search context is not provided');
413
413
  }
414
- this._searchInput = this.querySelector(SEARCH_COMPONENT_NAMES.searchInput);
414
+ this.searchInput = this.querySelector(SEARCH_COMPONENT_NAMES.searchInput);
415
415
  this._setupInitialSearchPhrase();
416
416
  this._setupListeners();
417
417
  this.isSearchIconFixEnabled ? this._setupToggler() : this._setupAriaAttributes();
@@ -441,7 +441,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
441
441
  this._searchForm = searchForm;
442
442
  if (!((_a = this._inputField) === null || _a === void 0 ? void 0 : _a.value))
443
443
  return;
444
- this.searchPhrase = this._inputField.value;
444
+ this._searchPhrase = this._inputField.value;
445
445
  this._updateSearchPhrase(this._inputField.value);
446
446
  }
447
447
  _updateSearchPhrase(searchPhrase) {
@@ -547,7 +547,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
547
547
  }
548
548
  _toggleSearchInputAttributes(shouldShowHistory, shouldShowResults) {
549
549
  var _a;
550
- const $input = (_a = this._searchInput) === null || _a === void 0 ? void 0 : _a.input;
550
+ const $input = (_a = this.searchInput) === null || _a === void 0 ? void 0 : _a.input;
551
551
  if (!$input)
552
552
  return;
553
553
  if (!shouldShowHistory && !shouldShowResults) {
@@ -639,7 +639,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
639
639
  .history="${this._historyLimitedContent}"
640
640
  .results="${this._searchResults}"
641
641
  .translations="${this._translations}"
642
- search-phrase="${this.searchPhrase}"
642
+ search-phrase="${this._searchPhrase}"
643
643
  module-instance-id="${this.moduleInstanceId}"
644
644
  ></h-search-message>`)}
645
645
  ${n(this._shouldShowHistory, () => html `<h-search-history
@@ -653,7 +653,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
653
653
  ${n(this._shouldShowResults, () => html `<h-search-results
654
654
  ${ref(this._searchResultsRef)}
655
655
  .results="${this._searchResults}"
656
- search-phrase="${this.searchPhrase}"
656
+ search-phrase="${this._searchPhrase}"
657
657
  .settings="${this.settings}"
658
658
  locale="${this.locale}"
659
659
  view="${this.view}"
@@ -723,7 +723,7 @@ __decorate([
723
723
  __decorate([
724
724
  state(),
725
725
  __metadata("design:type", String)
726
- ], HSearch.prototype, "searchPhrase", void 0);
726
+ ], HSearch.prototype, "_searchPhrase", void 0);
727
727
  __decorate([
728
728
  state(),
729
729
  __metadata("design:type", Array)
@@ -7,7 +7,7 @@ import { BtnController } from '../../../../../controllers/btn_controller/btn_con
7
7
  import { Observer } from '../../../../../core/classes/observer/observer.js';
8
8
  import { ContextConsumerController } from '../../../../../core/context/context_consumer_controller.js';
9
9
  import { when as n } from '../../../../../../../../external/lit-html/directives/when.js';
10
- import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_CLASS_NAMES, SEARCH_SLOT_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
10
+ import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_COMPONENT_NAMES, SEARCH_CLASS_NAMES, SEARCH_SLOT_NAMES } from '../../search_constants.js';
11
11
 
12
12
  let HSearchClear = class HSearchClear extends PhoenixLightLitElement {
13
13
  constructor() {
@@ -30,10 +30,10 @@ let HSearchClear = class HSearchClear extends PhoenixLightLitElement {
30
30
  this._btnController = new BtnController(this, this._dispatchClearEvent);
31
31
  }
32
32
  connectedCallback() {
33
- var _a, _b;
33
+ var _a, _b, _c, _d;
34
34
  super.connectedCallback();
35
35
  this._searchContextSetup();
36
- this._updateClearButtonVisibility((_b = (_a = this.closest('h-search')) === null || _a === void 0 ? void 0 : _a.searchPhrase) !== null && _b !== void 0 ? _b : '');
36
+ this._updateClearButtonVisibility((_d = (_c = (_b = (_a = this.closest(SEARCH_COMPONENT_NAMES.search)) === null || _a === void 0 ? void 0 : _a.searchInput) === null || _b === void 0 ? void 0 : _b.input) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : '');
37
37
  this.addEventListener('click', this._dispatchClearEvent);
38
38
  document.addEventListener(SEARCH_CUSTOM_EVENT_NAMES.keyup, this._handleClearButtonOnPhraseEnter);
39
39
  }
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.24-3",
5
+ "version": "1.18.24-4",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",