@shoper/phoenix_design_system 1.1.0-6 → 1.1.0-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 (18) hide show
  1. package/build/cjs/packages/phoenix/src/components/form/select/components/option/select_option.js +5 -0
  2. package/build/cjs/packages/phoenix/src/components/form/select/components/option/select_option.js.map +1 -1
  3. package/build/cjs/packages/phoenix/src/components/form/select/components/option/select_option_content.js +1 -0
  4. package/build/cjs/packages/phoenix/src/components/form/select/components/option/select_option_content.js.map +1 -1
  5. package/build/cjs/packages/phoenix/src/components/form/select/components/toggler/select_toggler.js +1 -1
  6. package/build/cjs/packages/phoenix/src/components/form/select/select.js +2 -2
  7. package/build/cjs/packages/phoenix/src/components/icon/icon.js +1 -0
  8. package/build/cjs/packages/phoenix/src/components/icon/icon.js.map +1 -1
  9. package/build/esm/packages/phoenix/src/components/form/select/components/option/select_option.d.ts +2 -0
  10. package/build/esm/packages/phoenix/src/components/form/select/components/option/select_option.js +5 -0
  11. package/build/esm/packages/phoenix/src/components/form/select/components/option/select_option.js.map +1 -1
  12. package/build/esm/packages/phoenix/src/components/form/select/components/option/select_option_content.js +1 -0
  13. package/build/esm/packages/phoenix/src/components/form/select/components/option/select_option_content.js.map +1 -1
  14. package/build/esm/packages/phoenix/src/components/form/select/components/toggler/select_toggler.js +1 -1
  15. package/build/esm/packages/phoenix/src/components/form/select/select.js +2 -2
  16. package/build/esm/packages/phoenix/src/components/icon/icon.js +1 -0
  17. package/build/esm/packages/phoenix/src/components/icon/icon.js.map +1 -1
  18. package/package.json +1 -1
@@ -3,12 +3,14 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var tslib_es6 = require('../../../../../../../../external/tslib/tslib.es6.js');
6
+ var lit = require('lit');
6
7
  var phoenix_light_lit_element = require('../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
7
8
  var phoenix_custom_element = require('../../../../../core/decorators/phoenix_custom_element.js');
8
9
  var decorators_js = require('@lit/reactive-element/decorators.js');
9
10
  var select_components_constatns = require('../select_components_constatns.js');
10
11
  var btn_controller = require('../../../../../controllers/btn_controller/btn_controller.js');
11
12
  var select_option_constants = require('./select_option_constants.js');
13
+ var litHtml = require('lit-html');
12
14
 
13
15
  exports.HOption = class HOption extends phoenix_light_lit_element.PhoenixLightLitElement {
14
16
  constructor() {
@@ -34,6 +36,9 @@ exports.HOption = class HOption extends phoenix_light_lit_element.PhoenixLightLi
34
36
  _setupEvents() {
35
37
  this.addEventListener('click', this._dispatchClickedEvent);
36
38
  }
39
+ render() {
40
+ return litHtml.html ` ${this.getSlot('content')} ${this.selected ? litHtml.html `<h-icon icon-name="icon-check"></h-icon>` : lit.nothing} `;
41
+ }
37
42
  };
38
43
  tslib_es6.__decorate([
39
44
  decorators_js.property({ type: String, reflect: true }),
@@ -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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -11,6 +11,7 @@ var select_option_constants = require('./select_option_constants.js');
11
11
  exports.HOptionContent = class HOptionContent extends phoenix_light_lit_element.PhoenixLightLitElement {
12
12
  connectedCallback() {
13
13
  super.connectedCallback();
14
+ this.setAttribute('slot', 'content');
14
15
  this.classList.add(select_option_constants.SELECT_OPTION_CSS_CLASSES.selectOptionContent);
15
16
  }
16
17
  };
@@ -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;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -52,7 +52,7 @@ exports.HSelectToggler = class HSelectToggler extends phoenix_light_lit_element.
52
52
  <h-tag-remove-button></h-tag-remove-button>
53
53
  </h-tag>
54
54
  </li>`)}`
55
- : litHtml.html `<li>selectOptions[0].content</li>`;
55
+ : litHtml.html `<li>${selectOptions[0].content}</li>`;
56
56
  })}
57
57
  </ul>
58
58
 
@@ -185,8 +185,8 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
185
185
  ${this.multiselect && this._selectController.selectedOptionsCount >= 1
186
186
  ? lit.html `
187
187
  <section class=${select_constants.SELECT_CSS_CLASSES.selectFooter}>
188
- <button @click=${this._clearOptions}>clear</button>
189
- <h-select-close-btn @click=${this._closeSelect}>ok</h-select-close-btn>
188
+ <button class="btn btn_secondary" @click=${this._clearOptions}>clear</button>
189
+ <h-select-close-btn class="btn btn_primary" @click=${this._closeSelect}>ok</h-select-close-btn>
190
190
  </section>
191
191
  `
192
192
  : lit.nothing}
@@ -22,6 +22,7 @@ exports.HIcon = HIcon_1 = class HIcon extends phoenix_light_lit_element.PhoenixL
22
22
  connectedCallback() {
23
23
  var _a;
24
24
  super.connectedCallback();
25
+ this.classList.add(icon_constants.ICON_CSS_CLASSES.icon);
25
26
  this._cssClasses = index['default'](icon_constants.ICON_CSS_CLASSES.icon, {
26
27
  [icon_constants.ICON_SIZES_CSS_CLASS_MAP[(_a = this.size) !== null && _a !== void 0 ? _a : '']]: Boolean(this.size),
27
28
  [icon_constants.ICON_CSS_CLASSES.iconFilled]: this.filled,
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA,oBAAoB,6CAAiD;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA,oBAAoB,6CAAiD;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,4 +1,5 @@
1
1
  import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
2
+ import { TemplateResult } from 'lit';
2
3
  export declare class HOption extends PhoenixLightLitElement {
3
4
  value: string;
4
5
  selected: boolean;
@@ -8,4 +9,5 @@ export declare class HOption extends PhoenixLightLitElement {
8
9
  connectedCallback(): void;
9
10
  private _setupEvents;
10
11
  private _dispatchClickedEvent;
12
+ protected render(): TemplateResult;
11
13
  }
@@ -1,10 +1,12 @@
1
1
  import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
2
+ import { nothing } from 'lit';
2
3
  import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
3
4
  import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
4
5
  import { property } from '@lit/reactive-element/decorators.js';
5
6
  import { SELECT_OPTION_EVENT_NAMES, SELECT_RELATED_COMPONENTS_NAMES } from '../select_components_constatns.js';
6
7
  import { BtnController } from '../../../../../controllers/btn_controller/btn_controller.js';
7
8
  import { SELECT_OPTION_CSS_CLASSES } from './select_option_constants.js';
9
+ import { html } from 'lit-html';
8
10
 
9
11
  let HOption = class HOption extends PhoenixLightLitElement {
10
12
  constructor() {
@@ -30,6 +32,9 @@ let HOption = class HOption extends PhoenixLightLitElement {
30
32
  _setupEvents() {
31
33
  this.addEventListener('click', this._dispatchClickedEvent);
32
34
  }
35
+ render() {
36
+ return html ` ${this.getSlot('content')} ${this.selected ? html `<h-icon icon-name="icon-check"></h-icon>` : nothing} `;
37
+ }
33
38
  };
34
39
  __decorate([
35
40
  property({ type: String, reflect: true }),
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;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;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;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;"}
@@ -7,6 +7,7 @@ import { SELECT_OPTION_CSS_CLASSES } from './select_option_constants.js';
7
7
  let HOptionContent = class HOptionContent extends PhoenixLightLitElement {
8
8
  connectedCallback() {
9
9
  super.connectedCallback();
10
+ this.setAttribute('slot', 'content');
10
11
  this.classList.add(SELECT_OPTION_CSS_CLASSES.selectOptionContent);
11
12
  }
12
13
  };
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,2BAA2B,qDAAyD;AACpF;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,2BAA2B,qDAAyD;AACpF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -48,7 +48,7 @@ let HSelectToggler = class HSelectToggler extends PhoenixLightLitElement {
48
48
  <h-tag-remove-button></h-tag-remove-button>
49
49
  </h-tag>
50
50
  </li>`)}`
51
- : html `<li>selectOptions[0].content</li>`;
51
+ : html `<li>${selectOptions[0].content}</li>`;
52
52
  })}
53
53
  </ul>
54
54
 
@@ -181,8 +181,8 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
181
181
  ${this.multiselect && this._selectController.selectedOptionsCount >= 1
182
182
  ? html `
183
183
  <section class=${SELECT_CSS_CLASSES.selectFooter}>
184
- <button @click=${this._clearOptions}>clear</button>
185
- <h-select-close-btn @click=${this._closeSelect}>ok</h-select-close-btn>
184
+ <button class="btn btn_secondary" @click=${this._clearOptions}>clear</button>
185
+ <h-select-close-btn class="btn btn_primary" @click=${this._closeSelect}>ok</h-select-close-btn>
186
186
  </section>
187
187
  `
188
188
  : nothing}
@@ -18,6 +18,7 @@ let HIcon = HIcon_1 = class HIcon extends PhoenixLightLitElement {
18
18
  connectedCallback() {
19
19
  var _a;
20
20
  super.connectedCallback();
21
+ this.classList.add(ICON_CSS_CLASSES.icon);
21
22
  this._cssClasses = classnames(ICON_CSS_CLASSES.icon, {
22
23
  [ICON_SIZES_CSS_CLASS_MAP[(_a = this.size) !== null && _a !== void 0 ? _a : '']]: Boolean(this.size),
23
24
  [ICON_CSS_CLASSES.iconFilled]: this.filled,
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA,uBAAuB,6CAAiD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA,uBAAuB,6CAAiD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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.1.0-6",
5
+ "version": "1.1.0-9",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",