@shoper/phoenix_design_system 1.4.3-7 → 1.4.3-9

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 (16) hide show
  1. package/build/cjs/packages/phoenix/src/components/form/search/results/search_producer_content.js +9 -7
  2. package/build/cjs/packages/phoenix/src/components/form/search/results/search_producer_content.js.map +1 -1
  3. package/build/cjs/packages/phoenix/src/components/form/search/results/search_product_content.js +14 -11
  4. package/build/cjs/packages/phoenix/src/components/form/search/results/search_product_content.js.map +1 -1
  5. package/build/cjs/packages/phoenix/src/components/form/search/results/search_suggestion_content.js +27 -29
  6. package/build/cjs/packages/phoenix/src/components/form/search/results/search_suggestion_content.js.map +1 -1
  7. package/build/esm/packages/phoenix/src/components/form/search/results/search_producer_content.d.ts +2 -1
  8. package/build/esm/packages/phoenix/src/components/form/search/results/search_producer_content.js +10 -8
  9. package/build/esm/packages/phoenix/src/components/form/search/results/search_producer_content.js.map +1 -1
  10. package/build/esm/packages/phoenix/src/components/form/search/results/search_product_content.d.ts +2 -1
  11. package/build/esm/packages/phoenix/src/components/form/search/results/search_product_content.js +15 -12
  12. package/build/esm/packages/phoenix/src/components/form/search/results/search_product_content.js.map +1 -1
  13. package/build/esm/packages/phoenix/src/components/form/search/results/search_suggestion_content.d.ts +3 -1
  14. package/build/esm/packages/phoenix/src/components/form/search/results/search_suggestion_content.js +28 -30
  15. package/build/esm/packages/phoenix/src/components/form/search/results/search_suggestion_content.js.map +1 -1
  16. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/form/search/results/search_producer_content.js CHANGED
@@ -8,16 +8,14 @@ var decorators = require('lit/decorators');
8
8
  var phoenix_light_lit_element = require('../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
9
9
  var phoenix_custom_element = require('../../../../core/decorators/phoenix_custom_element.js');
10
10
  var search_constants = require('../search_constants.js');
11
+ var when = require('../../../../../../../external/lit/external/lit-html/directives/when.js');
11
12
  var repeat = require('../../../../../../../external/lit/external/lit-html/directives/repeat.js');
12
13
 
13
14
  exports.HSearchProducerContent = class HSearchProducerContent extends phoenix_light_lit_element.PhoenixLightLitElement {
14
- render() {
15
- return lit.html `<div
16
- class="search__section"
17
- data-search-section-type="4"
18
- data-search-section-name="producers"
19
- ?hidden="${this.producers.length === 0}"
20
- >
15
+ constructor() {
16
+ super(...arguments);
17
+ this.producerListHtml = () => {
18
+ return lit.html `<div class="search__section" data-search-section-type="4" data-search-section-name="producers">
21
19
  <h3 class="search__section-head search__section-head_sticky search__section-head_line">Producenci</h3>
22
20
  <ul class="search__list">
23
21
  ${repeat.repeat(this.producers, (producer) => lit.html `<li class="search__list-item">
@@ -35,6 +33,10 @@ exports.HSearchProducerContent = class HSearchProducerContent extends phoenix_li
35
33
  </li>`)}
36
34
  </ul>
37
35
  </div>`;
36
+ };
37
+ }
38
+ render() {
39
+ return when.when(this.producers && this.producers.length !== 0, this.producerListHtml, () => lit.nothing);
38
40
  }
39
41
  };
40
42
  tslib_es6.__decorate([
package/build/cjs/packages/phoenix/src/components/form/search/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,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA,qBAAqB,0EAAkF;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;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA,mBAAmB,wEAAgF;AACnG,qBAAqB,0EAAkF;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;"}
package/build/cjs/packages/phoenix/src/components/form/search/results/search_product_content.js CHANGED
@@ -8,20 +8,14 @@ var decorators = require('lit/decorators');
8
8
  var phoenix_light_lit_element = require('../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
9
9
  var phoenix_custom_element = require('../../../../core/decorators/phoenix_custom_element.js');
10
10
  var search_constants = require('../search_constants.js');
11
+ var when = require('../../../../../../../external/lit/external/lit-html/directives/when.js');
11
12
  var repeat = require('../../../../../../../external/lit/external/lit-html/directives/repeat.js');
12
13
 
13
14
  exports.HSearchProductContent = class HSearchProductContent extends phoenix_light_lit_element.PhoenixLightLitElement {
14
- handleGoToProductsFor(ev) {
15
- console.log(ev.target.textContent, `CLICK ON the przejdz do produktów dla: `);
16
- // TODO: Create CustomEvent to handle it in search.ts
17
- }
18
- render() {
19
- return lit.html `<div
20
- class="search__section"
21
- data-search-section-type="3"
22
- data-search-section-name="products"
23
- ?hidden="${this.products.length === 0}"
24
- >
15
+ constructor() {
16
+ super(...arguments);
17
+ this.getProductListHtml = () => {
18
+ return lit.html `<div class="search__section" data-search-section-type="3" data-search-section-name="products">
25
19
  <h3 class="search__section-head search__section-head_sticky search__section-head_line">Wyniki dla: teraz</h3>
26
20
 
27
21
  <ul>
@@ -49,6 +43,15 @@ exports.HSearchProductContent = class HSearchProductContent extends phoenix_ligh
49
43
  </button>
50
44
  </div>
51
45
  </div>`;
46
+ };
47
+ }
48
+ handleGoToProductsFor(ev) {
49
+ console.log(ev.target.textContent, `CLICK ON the przejdz do produktów dla: `);
50
+ // TODO: Create CustomEvent to handle it in search.ts
51
+ }
52
+ render() {
53
+ console.log(this.products, 'this.products {AWEL');
54
+ return when.when(this.products && this.products.length !== 0, this.getProductListHtml, () => lit.nothing);
52
55
  }
53
56
  };
54
57
  tslib_es6.__decorate([
package/build/cjs/packages/phoenix/src/components/form/search/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,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA,qBAAqB,0EAAkF;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;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA,mBAAmB,wEAAgF;AACnG,qBAAqB,0EAAkF;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;"}
package/build/cjs/packages/phoenix/src/components/form/search/results/search_suggestion_content.js CHANGED
@@ -8,12 +8,38 @@ var decorators = require('lit/decorators');
8
8
  var phoenix_light_lit_element = require('../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
9
9
  var phoenix_custom_element = require('../../../../core/decorators/phoenix_custom_element.js');
10
10
  var search_constants = require('../search_constants.js');
11
+ var when = require('../../../../../../../external/lit/external/lit-html/directives/when.js');
11
12
  var repeat = require('../../../../../../../external/lit/external/lit-html/directives/repeat.js');
12
13
 
13
14
  exports.HSearchSuggestionContent = class HSearchSuggestionContent extends phoenix_light_lit_element.PhoenixLightLitElement {
14
15
  constructor() {
15
16
  super(...arguments);
16
17
  this.suggestions = [];
18
+ this.getSuggestionListHtml = () => {
19
+ return lit.html `<div class="search__section none" data-search-section-type="2" data-search-section-name="suggestions">
20
+ <h3 class="search__section-head search__section-head_sticky search__section-head_line">Sugestie</h3>
21
+ <ul class="search__list">
22
+ ${when.when(this.suggestions, () => lit.html `${repeat.repeat(this.suggestions, (suggestion) => lit.html `<li @click=${this.handleSuggestion} class="search__list-item" data-suggested-value="${suggestion}">
23
+ <span class="js__search-suggest-item">${suggestion}</span>
24
+ <span
25
+ role="button"
26
+ aria-label="copy suggestion"
27
+ class="js__search-btn-copy search__list-item-action-btn search__icon_main-color icon icon-arrow-skew"
28
+ >LOOK</span
29
+ >
30
+ </li>`)}`, () => lit.nothing)}
31
+ ${when.when(this.categories, () => lit.html `${repeat.repeat(this.categories, (category) => lit.html `<li class="search__list-item search__result_bold" data-search-suggest-value="${category.name}">
32
+ <a class="js__search-result-link" data-search-result-type="Category" href="${category.url}"
33
+ ><span class="js__search-suggest-item search__result_bold"
34
+ ><span class="search__result_match">${category.name}</span></span
35
+ >
36
+ <span class="search__result-category-title">kategoria</span></a
37
+ >
38
+ </li>`)}`, () => lit.nothing)}
39
+ </ul>
40
+ </div>`;
41
+ };
42
+ this.shouldShowSuggestionContent = () => (this.suggestions && this.suggestions.length !== 0) || (this.categories && this.categories.length !== 0);
17
43
  }
18
44
  handleSuggestion(ev) {
19
45
  const element = ev.target;
@@ -28,35 +54,7 @@ exports.HSearchSuggestionContent = class HSearchSuggestionContent extends phoeni
28
54
  }
29
55
  }
30
56
  render() {
31
- return lit.html `<div
32
- class="search__section none"
33
- data-search-section-type="2"
34
- data-search-section-name="suggestions"
35
- ?hidden="${this.suggestions.length === 0}"
36
- >
37
- <h3 class="search__section-head search__section-head_sticky search__section-head_line">Sugestie</h3>
38
- <ul class="search__list">
39
- ${repeat.repeat(this.suggestions, (suggestion) => lit.html `<li @click=${this.handleSuggestion} class="search__list-item" data-suggested-value="${suggestion}">
40
- <span class="js__search-suggest-item">${suggestion}</span>
41
- <span
42
- role="button"
43
- aria-label="copy suggestion"
44
- class="js__search-btn-copy search__list-item-action-btn search__icon_main-color icon icon-arrow-skew"
45
- >LOOK</span
46
- >
47
- </li>`)}
48
- ${repeat.repeat(this.categories, (category) => lit.html `
49
- <li class="search__list-item search__result_bold" data-search-suggest-value="${category.name}">
50
- <a class="js__search-result-link" data-search-result-type="Category" href="${category.url}"
51
- ><span class="js__search-suggest-item search__result_bold"
52
- ><span class="search__result_match">${category.name}</span></span
53
- >
54
- <span class="search__result-category-title">kategoria</span></a
55
- >
56
- </li>
57
- `)}
58
- </ul>
59
- </div>`;
57
+ return when.when(this.shouldShowSuggestionContent(), this.getSuggestionListHtml, () => lit.nothing);
60
58
  }
61
59
  };
62
60
  tslib_es6.__decorate([
package/build/cjs/packages/phoenix/src/components/form/search/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,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA,qBAAqB,0EAAkF;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;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,kDAAsD;AAC9E;AACA;AACA;AACA;AACA;AACA,mBAAmB,wEAAgF;AACnG,qBAAqB,0EAAkF;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;"}
package/build/esm/packages/phoenix/src/components/form/search/results/search_producer_content.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { PhoenixLightLitElement } from "../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
2
2
  export declare class HSearchProducerContent extends PhoenixLightLitElement {
3
3
  producers: Record<any, any>[];
4
- render(): import("lit-html").TemplateResult<1>;
4
+ producerListHtml: () => import("lit-html").TemplateResult<1>;
5
+ render(): symbol | import("lit-html").TemplateResult<1>;
5
6
  }
package/build/esm/packages/phoenix/src/components/form/search/results/search_producer_content.js CHANGED
@@ -1,19 +1,17 @@
1
1
  import { __decorate, __metadata } from '../../../../../../../external/tslib/tslib.es6.js';
2
- import { html } from 'lit';
2
+ import { html, nothing } from 'lit';
3
3
  import { property } from 'lit/decorators';
4
4
  import { PhoenixLightLitElement } from '../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
5
5
  import { phoenixCustomElement } from '../../../../core/decorators/phoenix_custom_element.js';
6
6
  import { SEARCH_COMPONENT_NAMES } from '../search_constants.js';
7
+ import { when as n } from '../../../../../../../external/lit/external/lit-html/directives/when.js';
7
8
  import { repeat as c } from '../../../../../../../external/lit/external/lit-html/directives/repeat.js';
8
9
 
9
10
  let HSearchProducerContent = class HSearchProducerContent extends PhoenixLightLitElement {
10
- render() {
11
- return html `<div
12
- class="search__section"
13
- data-search-section-type="4"
14
- data-search-section-name="producers"
15
- ?hidden="${this.producers.length === 0}"
16
- >
11
+ constructor() {
12
+ super(...arguments);
13
+ this.producerListHtml = () => {
14
+ return html `<div class="search__section" data-search-section-type="4" data-search-section-name="producers">
17
15
  <h3 class="search__section-head search__section-head_sticky search__section-head_line">Producenci</h3>
18
16
  <ul class="search__list">
19
17
  ${c(this.producers, (producer) => html `<li class="search__list-item">
@@ -31,6 +29,10 @@ let HSearchProducerContent = class HSearchProducerContent extends PhoenixLightLi
31
29
  </li>`)}
32
30
  </ul>
33
31
  </div>`;
32
+ };
33
+ }
34
+ render() {
35
+ return n(this.producers && this.producers.length !== 0, this.producerListHtml, () => nothing);
34
36
  }
35
37
  };
36
38
  __decorate([
package/build/esm/packages/phoenix/src/components/form/search/results/search_producer_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,0BAA0B,wEAAgF;AAC1G,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/results/search_product_content.d.ts CHANGED
@@ -2,5 +2,6 @@ import { PhoenixLightLitElement } from "../../../../core/phoenix_light_lit_eleme
2
2
  export declare class HSearchProductContent extends PhoenixLightLitElement {
3
3
  products: Record<any, any>[];
4
4
  handleGoToProductsFor(ev: Event): void;
5
- render(): import("lit-html").TemplateResult<1>;
5
+ getProductListHtml: () => import("lit-html").TemplateResult<1>;
6
+ render(): symbol | import("lit-html").TemplateResult<1>;
6
7
  }
package/build/esm/packages/phoenix/src/components/form/search/results/search_product_content.js CHANGED
@@ -1,23 +1,17 @@
1
1
  import { __decorate, __metadata } from '../../../../../../../external/tslib/tslib.es6.js';
2
- import { html } from 'lit';
2
+ import { html, nothing } from 'lit';
3
3
  import { property } from 'lit/decorators';
4
4
  import { PhoenixLightLitElement } from '../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
5
5
  import { phoenixCustomElement } from '../../../../core/decorators/phoenix_custom_element.js';
6
6
  import { SEARCH_COMPONENT_NAMES } from '../search_constants.js';
7
+ import { when as n } from '../../../../../../../external/lit/external/lit-html/directives/when.js';
7
8
  import { repeat as c } from '../../../../../../../external/lit/external/lit-html/directives/repeat.js';
8
9
 
9
10
  let HSearchProductContent = class HSearchProductContent extends PhoenixLightLitElement {
10
- handleGoToProductsFor(ev) {
11
- console.log(ev.target.textContent, `CLICK ON the przejdz do produktów dla: `);
12
- // TODO: Create CustomEvent to handle it in search.ts
13
- }
14
- render() {
15
- return html `<div
16
- class="search__section"
17
- data-search-section-type="3"
18
- data-search-section-name="products"
19
- ?hidden="${this.products.length === 0}"
20
- >
11
+ constructor() {
12
+ super(...arguments);
13
+ this.getProductListHtml = () => {
14
+ return html `<div class="search__section" data-search-section-type="3" data-search-section-name="products">
21
15
  <h3 class="search__section-head search__section-head_sticky search__section-head_line">Wyniki dla: teraz</h3>
22
16
 
23
17
  <ul>
@@ -45,6 +39,15 @@ let HSearchProductContent = class HSearchProductContent extends PhoenixLightLitE
45
39
  </button>
46
40
  </div>
47
41
  </div>`;
42
+ };
43
+ }
44
+ handleGoToProductsFor(ev) {
45
+ console.log(ev.target.textContent, `CLICK ON the przejdz do produktów dla: `);
46
+ // TODO: Create CustomEvent to handle it in search.ts
47
+ }
48
+ render() {
49
+ console.log(this.products, 'this.products {AWEL');
50
+ return n(this.products && this.products.length !== 0, this.getProductListHtml, () => nothing);
48
51
  }
49
52
  };
50
53
  __decorate([
package/build/esm/packages/phoenix/src/components/form/search/results/search_product_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,0BAA0B,wEAAgF;AAC1G,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/results/search_suggestion_content.d.ts CHANGED
@@ -3,5 +3,7 @@ export declare class HSearchSuggestionContent extends PhoenixLightLitElement {
3
3
  suggestions: string[];
4
4
  categories: Record<any, any>[];
5
5
  handleSuggestion(ev: Event): void;
6
- render(): import("lit-html").TemplateResult<1>;
6
+ getSuggestionListHtml: () => import("lit-html").TemplateResult<1>;
7
+ private shouldShowSuggestionContent;
8
+ render(): symbol | import("lit-html").TemplateResult<1>;
7
9
  }
package/build/esm/packages/phoenix/src/components/form/search/results/search_suggestion_content.js CHANGED
@@ -1,15 +1,41 @@
1
1
  import { __decorate, __metadata } from '../../../../../../../external/tslib/tslib.es6.js';
2
- import { html } from 'lit';
2
+ import { html, nothing } from 'lit';
3
3
  import { property } from 'lit/decorators';
4
4
  import { PhoenixLightLitElement } from '../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
5
5
  import { phoenixCustomElement } from '../../../../core/decorators/phoenix_custom_element.js';
6
6
  import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../search_constants.js';
7
+ import { when as n } from '../../../../../../../external/lit/external/lit-html/directives/when.js';
7
8
  import { repeat as c } from '../../../../../../../external/lit/external/lit-html/directives/repeat.js';
8
9
 
9
10
  let HSearchSuggestionContent = class HSearchSuggestionContent extends PhoenixLightLitElement {
10
11
  constructor() {
11
12
  super(...arguments);
12
13
  this.suggestions = [];
14
+ this.getSuggestionListHtml = () => {
15
+ return html `<div class="search__section none" data-search-section-type="2" data-search-section-name="suggestions">
16
+ <h3 class="search__section-head search__section-head_sticky search__section-head_line">Sugestie</h3>
17
+ <ul class="search__list">
18
+ ${n(this.suggestions, () => html `${c(this.suggestions, (suggestion) => html `<li @click=${this.handleSuggestion} class="search__list-item" data-suggested-value="${suggestion}">
19
+ <span class="js__search-suggest-item">${suggestion}</span>
20
+ <span
21
+ role="button"
22
+ aria-label="copy suggestion"
23
+ class="js__search-btn-copy search__list-item-action-btn search__icon_main-color icon icon-arrow-skew"
24
+ >LOOK</span
25
+ >
26
+ </li>`)}`, () => nothing)}
27
+ ${n(this.categories, () => html `${c(this.categories, (category) => html `<li class="search__list-item search__result_bold" data-search-suggest-value="${category.name}">
28
+ <a class="js__search-result-link" data-search-result-type="Category" href="${category.url}"
29
+ ><span class="js__search-suggest-item search__result_bold"
30
+ ><span class="search__result_match">${category.name}</span></span
31
+ >
32
+ <span class="search__result-category-title">kategoria</span></a
33
+ >
34
+ </li>`)}`, () => nothing)}
35
+ </ul>
36
+ </div>`;
37
+ };
38
+ this.shouldShowSuggestionContent = () => (this.suggestions && this.suggestions.length !== 0) || (this.categories && this.categories.length !== 0);
13
39
  }
14
40
  handleSuggestion(ev) {
15
41
  const element = ev.target;
@@ -24,35 +50,7 @@ let HSearchSuggestionContent = class HSearchSuggestionContent extends PhoenixLig
24
50
  }
25
51
  }
26
52
  render() {
27
- return html `<div
28
- class="search__section none"
29
- data-search-section-type="2"
30
- data-search-section-name="suggestions"
31
- ?hidden="${this.suggestions.length === 0}"
32
- >
33
- <h3 class="search__section-head search__section-head_sticky search__section-head_line">Sugestie</h3>
34
- <ul class="search__list">
35
- ${c(this.suggestions, (suggestion) => html `<li @click=${this.handleSuggestion} class="search__list-item" data-suggested-value="${suggestion}">
36
- <span class="js__search-suggest-item">${suggestion}</span>
37
- <span
38
- role="button"
39
- aria-label="copy suggestion"
40
- class="js__search-btn-copy search__list-item-action-btn search__icon_main-color icon icon-arrow-skew"
41
- >LOOK</span
42
- >
43
- </li>`)}
44
- ${c(this.categories, (category) => html `
45
- <li class="search__list-item search__result_bold" data-search-suggest-value="${category.name}">
46
- <a class="js__search-result-link" data-search-result-type="Category" href="${category.url}"
47
- ><span class="js__search-suggest-item search__result_bold"
48
- ><span class="search__result_match">${category.name}</span></span
49
- >
50
- <span class="search__result-category-title">kategoria</span></a
51
- >
52
- </li>
53
- `)}
54
- </ul>
55
- </div>`;
53
+ return n(this.shouldShowSuggestionContent(), this.getSuggestionListHtml, () => nothing);
56
54
  }
57
55
  };
58
56
  __decorate([
package/build/esm/packages/phoenix/src/components/form/search/results/search_suggestion_content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,0BAA0B,wEAAgF;AAC1G,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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.4.3-7",
5
+ "version": "1.4.3-9",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",