@shoper/phoenix_design_system 1.1.5 → 1.1.6-2

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 (29) hide show
  1. package/build/cjs/packages/phoenix/src/components/form/select/controllers/base_select_controller.js +13 -13
  2. package/build/cjs/packages/phoenix/src/components/form/select/controllers/multi_select_controller.js +6 -6
  3. package/build/cjs/packages/phoenix/src/components/form/select/controllers/select_controller.js +2 -2
  4. package/build/cjs/packages/phoenix/src/components/form/select/select.js +54 -16
  5. package/build/cjs/packages/phoenix/src/components/form/select/select.js.map +1 -1
  6. package/build/cjs/packages/phoenix/src/components/form/select/select_constants.js +5 -0
  7. package/build/cjs/packages/phoenix/src/components/form/select/select_constants.js.map +1 -1
  8. package/build/cjs/packages/phoenix/src/components/form/select/select_utils.js +6 -0
  9. package/build/cjs/packages/phoenix/src/components/form/select/select_utils.js.map +1 -1
  10. package/build/esm/packages/phoenix/src/components/form/select/controllers/base_select_controller.d.ts +10 -10
  11. package/build/esm/packages/phoenix/src/components/form/select/controllers/base_select_controller.js +13 -13
  12. package/build/esm/packages/phoenix/src/components/form/select/controllers/multi_select_controller.d.ts +3 -3
  13. package/build/esm/packages/phoenix/src/components/form/select/controllers/multi_select_controller.js +6 -6
  14. package/build/esm/packages/phoenix/src/components/form/select/controllers/select_controller.d.ts +1 -1
  15. package/build/esm/packages/phoenix/src/components/form/select/controllers/select_controller.js +2 -2
  16. package/build/esm/packages/phoenix/src/components/form/select/controllers/select_controllers_types.d.ts +9 -9
  17. package/build/esm/packages/phoenix/src/components/form/select/select.d.ts +11 -2
  18. package/build/esm/packages/phoenix/src/components/form/select/select.js +55 -17
  19. package/build/esm/packages/phoenix/src/components/form/select/select.js.map +1 -1
  20. package/build/esm/packages/phoenix/src/components/form/select/select_constants.d.ts +4 -0
  21. package/build/esm/packages/phoenix/src/components/form/select/select_constants.js +5 -1
  22. package/build/esm/packages/phoenix/src/components/form/select/select_constants.js.map +1 -1
  23. package/build/esm/packages/phoenix/src/components/form/select/select_types.d.ts +2 -0
  24. package/build/esm/packages/phoenix/src/components/form/select/select_types.js +2 -0
  25. package/build/esm/packages/phoenix/src/components/form/select/select_types.js.map +1 -0
  26. package/build/esm/packages/phoenix/src/components/form/select/select_utils.d.ts +2 -0
  27. package/build/esm/packages/phoenix/src/components/form/select/select_utils.js +6 -0
  28. package/build/esm/packages/phoenix/src/components/form/select/select_utils.js.map +1 -1
  29. package/package.json +1 -1
package/build/cjs/packages/phoenix/src/components/form/select/controllers/base_select_controller.js CHANGED
@@ -29,16 +29,16 @@ class BaseSelectController {
29
29
  this._optionsObserver = new observer.Observer(this._calculateValuesRelatedToOptions);
30
30
  this.options$.subscribe(this._optionsObserver);
31
31
  }
32
- toggleOption(option) {
33
- option.selected ? this.deselectOption(option) : this.selectOption(option);
32
+ toggle(option) {
33
+ option.selected ? this.deselect(option) : this.select(option);
34
34
  }
35
- removeOption(optionValue) {
35
+ remove(optionValue) {
36
36
  const options = this.options$.getValue();
37
37
  if (!options)
38
38
  return;
39
39
  this.options$.notify(options.filter((option) => option.value !== optionValue));
40
40
  }
41
- addOption(option, position) {
41
+ add(option, position) {
42
42
  var _a;
43
43
  const options = (_a = this.options$.getValue()) !== null && _a !== void 0 ? _a : [];
44
44
  if (position === undefined) {
@@ -48,22 +48,22 @@ class BaseSelectController {
48
48
  }
49
49
  this.options$.notify([...options.slice(0, position - 1), option, ...options.slice(position - 1)]);
50
50
  }
51
- replaceOptions(options) {
51
+ replace(options) {
52
52
  this.options$.notify(options);
53
53
  }
54
- deselectOptions() {
54
+ deselectAll() {
55
55
  var _a;
56
56
  (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.forEach((option) => (option.selected = false));
57
57
  this.selectedOptions$.notify([]);
58
- this.requestOptionsUpdate();
58
+ this.requestUpdate();
59
59
  }
60
- deselectOption(option) {
60
+ deselect(option) {
61
61
  var _a;
62
62
  (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.forEach((option) => (option.selected = false));
63
63
  this.selectedOptions$.notify([]);
64
- this.requestOptionsUpdate();
64
+ this.requestUpdate();
65
65
  }
66
- filterOptions(value) {
66
+ filter(value) {
67
67
  const selectOptions = this.options$.getValue();
68
68
  if (!selectOptions)
69
69
  return;
@@ -72,16 +72,16 @@ class BaseSelectController {
72
72
  filtered.forEach((option) => {
73
73
  option.hidden = false;
74
74
  });
75
- this.requestOptionsUpdate();
75
+ this.requestUpdate();
76
76
  }
77
- requestOptionsUpdate() {
77
+ requestUpdate() {
78
78
  const selectOptions = this.options$.getValue();
79
79
  if (!selectOptions)
80
80
  return;
81
81
  this.options$.notify([...selectOptions]);
82
82
  this.host.requestUpdate();
83
83
  }
84
- getSelectOption(selectValue) {
84
+ getOption(selectValue) {
85
85
  var _a;
86
86
  return (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.find((option) => option.value === selectValue);
87
87
  }
package/build/cjs/packages/phoenix/src/components/form/select/controllers/multi_select_controller.js CHANGED
@@ -5,18 +5,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var base_select_controller = require('./base_select_controller.js');
6
6
 
7
7
  class MultiSelectController extends base_select_controller.BaseSelectController {
8
- toggleOption(option) {
9
- option.selected ? this.deselectOption(option) : this.selectOption(option);
8
+ toggle(option) {
9
+ option.selected ? this.deselect(option) : this.select(option);
10
10
  }
11
- selectOption(option) {
11
+ select(option) {
12
12
  option.selected = true;
13
13
  this.selectedOptions$.notify((selectedOptions) => [...selectedOptions, option]);
14
- this.requestOptionsUpdate();
14
+ this.requestUpdate();
15
15
  }
16
- deselectOption(option) {
16
+ deselect(option) {
17
17
  option.selected = false;
18
18
  this.selectedOptions$.notify((selectedOptions) => selectedOptions.filter((currOption) => currOption.value !== option.value));
19
- this.requestOptionsUpdate();
19
+ this.requestUpdate();
20
20
  }
21
21
  }
22
22
 
package/build/cjs/packages/phoenix/src/components/form/select/controllers/select_controller.js CHANGED
@@ -5,13 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var base_select_controller = require('./base_select_controller.js');
6
6
 
7
7
  class SelectController extends base_select_controller.BaseSelectController {
8
- selectOption(option) {
8
+ select(option) {
9
9
  var _a;
10
10
  const selectedOptions = (_a = this.options$.getValue()) !== null && _a !== void 0 ? _a : [];
11
11
  selectedOptions.forEach((option) => (option.selected = false));
12
12
  option.selected = true;
13
13
  this.selectedOptions$.notify([option]);
14
- this.requestOptionsUpdate();
14
+ this.requestUpdate();
15
15
  }
16
16
  }
17
17
 
package/build/cjs/packages/phoenix/src/components/form/select/select.js CHANGED
@@ -33,6 +33,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
33
33
  this.multiselect = false;
34
34
  this.opened = false;
35
35
  this.offset = 2;
36
+ this.type = select_constants.SELECT_TYPES.select;
36
37
  this._searchValue = '';
37
38
  this._$options = {};
38
39
  this._$dropdown = ref_js.createRef();
@@ -45,10 +46,10 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
45
46
  this._$dropdownContent.value.style.width = `${width !== null && width !== void 0 ? width : ''}px`;
46
47
  };
47
48
  this._handleOptionDeselect = (event) => {
48
- const selectedOption = this._selectController.getSelectOption(event.detail);
49
+ const selectedOption = this._selectController.getOption(event.detail);
49
50
  if (!selectedOption)
50
51
  return;
51
- this._selectController.deselectOption(selectedOption);
52
+ this._selectController.deselect(selectedOption);
52
53
  };
53
54
  this._updateOptionsView = (options) => {
54
55
  if (options.length < Object.keys(this._$options).length)
@@ -67,12 +68,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
67
68
  });
68
69
  };
69
70
  this._handleOptionClicked = (event) => {
70
- const selectedOption = this._selectController.getSelectOption(event.detail.$option.value);
71
- if (!selectedOption)
72
- return;
73
- this._selectController.toggleOption(selectedOption);
74
- if (!this.multiselect)
75
- this._closeSelect();
71
+ this._selectOption(event.detail.$option.value);
76
72
  };
77
73
  this._handleDropdownHidden = () => {
78
74
  this._searchValue = '';
@@ -85,7 +81,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
85
81
  (_a = this._$dropdown.value) === null || _a === void 0 ? void 0 : _a.hide();
86
82
  };
87
83
  this._clearOptions = () => {
88
- this._selectController.deselectOptions();
84
+ this._selectController.deselectAll();
89
85
  };
90
86
  this._handleResize = debounce['default'](() => {
91
87
  this._closeSelect();
@@ -94,6 +90,28 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
94
90
  const $options = Array.from(this.querySelectorAll(select_components_constatns.SELECT_RELATED_COMPONENTS_NAMES.option));
95
91
  $options.forEach(($option) => $option.setAttribute('slot', select_constants.SELECT_SLOT_NAMES.content));
96
92
  this.$placeholder = (_a = this.querySelector(`[slot="${select_components_constatns.SELECT_INPUT_PLACEHOLDER_SLOT_NAME}"]`)) !== null && _a !== void 0 ? _a : 'Select';
93
+ if (this.multiselect)
94
+ this.type = select_constants.SELECT_TYPES.multiselect;
95
+ }
96
+ get selectedIndex() {
97
+ const selectedOptions = this._selectController.selectedOptions$.getValue();
98
+ if (!selectedOptions || selectedOptions.length === 0)
99
+ return -1;
100
+ const htmlOptions = Object.values(this._$options);
101
+ return this.multiselect
102
+ ? select_utils.SelectControlUtils.getFirstIndexSelectedOption(htmlOptions)
103
+ : select_utils.SelectControlUtils.getLastIndexOfSelectedOption(htmlOptions);
104
+ }
105
+ set selectedIndex(index) {
106
+ const option = Object.values(this._$options)[index];
107
+ if (!option) {
108
+ this._selectController.deselectAll();
109
+ return;
110
+ }
111
+ this._selectOption(option.value);
112
+ }
113
+ get selectedOptions() {
114
+ return Object.values(this._$options).filter((option) => option.selected);
97
115
  }
98
116
  updated(changedProperties) {
99
117
  super.updated(changedProperties);
@@ -173,22 +191,30 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
173
191
  _removeHTMLOptions(optionsValues) {
174
192
  this._$options = select_utils.SelectControlUtils.removeHTMLOptions(Object.values(this._$options), optionsValues);
175
193
  }
194
+ _selectOption(value) {
195
+ const option = this._selectController.getOption(value);
196
+ if (!option)
197
+ return;
198
+ this._selectController.toggle(option);
199
+ if (!this.multiselect)
200
+ this._closeSelect();
201
+ }
176
202
  _handleSearch({ detail }) {
177
203
  this._searchValue = detail;
178
204
  }
179
205
  update(changedProperties) {
180
206
  super.update(changedProperties);
181
207
  if (changedProperties.has('_searchValue'))
182
- this._selectController.filterOptions(this._searchValue);
208
+ this._selectController.filter(this._searchValue);
183
209
  }
184
- addOption(option, position) {
185
- this._selectController.addOption(option, position);
210
+ add(option, position) {
211
+ this._selectController.add(option, position);
186
212
  }
187
213
  removeOption(optionValue) {
188
- this._selectController.removeOption(optionValue);
214
+ this._selectController.remove(optionValue);
189
215
  }
190
- replaceOptions(options) {
191
- this._selectController.replaceOptions(options);
216
+ replace(options) {
217
+ this._selectController.replace(options);
192
218
  }
193
219
  disconnectedCallback() {
194
220
  super.disconnectedCallback();
@@ -281,9 +307,13 @@ exports.HSelect._components = {
281
307
  toggler: select_toggler.HSelectToggler
282
308
  };
283
309
  tslib_es6.__decorate([
284
- decorators_js.property({ type: String }),
310
+ decorators_js.property({ type: String, attribute: 'control-name' }),
285
311
  tslib_es6.__metadata("design:type", String)
286
312
  ], exports.HSelect.prototype, "controlName", void 0);
313
+ tslib_es6.__decorate([
314
+ decorators_js.property({ type: String, attribute: 'control-id' }),
315
+ tslib_es6.__metadata("design:type", String)
316
+ ], exports.HSelect.prototype, "controlId", void 0);
287
317
  tslib_es6.__decorate([
288
318
  decorators_js.property({ type: Boolean }),
289
319
  tslib_es6.__metadata("design:type", Boolean)
@@ -304,6 +334,14 @@ tslib_es6.__decorate([
304
334
  decorators_js.property({ type: Boolean }),
305
335
  tslib_es6.__metadata("design:type", Boolean)
306
336
  ], exports.HSelect.prototype, "disabled", void 0);
337
+ tslib_es6.__decorate([
338
+ decorators_js.property({ type: String }),
339
+ tslib_es6.__metadata("design:type", String)
340
+ ], exports.HSelect.prototype, "type", void 0);
341
+ tslib_es6.__decorate([
342
+ decorators_js.property({ type: Boolean }),
343
+ tslib_es6.__metadata("design:type", Boolean)
344
+ ], exports.HSelect.prototype, "required", void 0);
307
345
  tslib_es6.__decorate([
308
346
  decorators.state(),
309
347
  tslib_es6.__metadata("design:type", String)
package/build/cjs/packages/phoenix/src/components/form/select/select.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;AACA;AACA,uBAAuB,+CAAmD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA,uBAAuB,+CAAmD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/select/select_constants.js CHANGED
@@ -10,6 +10,10 @@ const SELECT_SLOT_NAMES = {
10
10
  content: 'content',
11
11
  toggler: 'toggler'
12
12
  };
13
+ const SELECT_TYPES = {
14
+ select: 'select-one',
15
+ multiselect: 'select-multiple'
16
+ };
13
17
  const SELECT_EVENT_NAMES = {
14
18
  selectOption: 'selectOption.select',
15
19
  deselectOption: 'selectOption.deselect'
@@ -42,4 +46,5 @@ exports.SELECT_CSS_CLASSES = SELECT_CSS_CLASSES;
42
46
  exports.SELECT_EVENT_NAMES = SELECT_EVENT_NAMES;
43
47
  exports.SELECT_RESIZE_DEBOUNCE_TIME = SELECT_RESIZE_DEBOUNCE_TIME;
44
48
  exports.SELECT_SLOT_NAMES = SELECT_SLOT_NAMES;
49
+ exports.SELECT_TYPES = SELECT_TYPES;
45
50
  //# sourceMappingURL=select_constants.js.map
package/build/cjs/packages/phoenix/src/components/form/select/select_constants.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/select/select_utils.js CHANGED
@@ -46,6 +46,12 @@ class SelectControlUtils {
46
46
  }
47
47
  $list.append($option);
48
48
  }
49
+ static getFirstIndexSelectedOption(options) {
50
+ return options.findIndex((option) => option.selected);
51
+ }
52
+ static getLastIndexOfSelectedOption(options) {
53
+ return [...options].reverse().findIndex((option) => option.selected);
54
+ }
49
55
  }
50
56
 
51
57
  exports.SelectControlUtils = SelectControlUtils;
package/build/cjs/packages/phoenix/src/components/form/select/select_utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/select/controllers/base_select_controller.d.ts CHANGED
@@ -13,15 +13,15 @@ export declare abstract class BaseSelectController implements ISelectController,
13
13
  constructor({ host }: SelectControllerConstructorOptions);
14
14
  private _setupComputedStateObserver;
15
15
  private _calculateValuesRelatedToOptions;
16
- toggleOption(option: SelectOption): void;
17
- abstract selectOption(option: SelectOption): void;
18
- removeOption(optionValue: string): void;
19
- addOption(option: SelectOption, position?: number): void;
20
- replaceOptions(options: SelectOption[]): void;
21
- deselectOptions(): void;
22
- deselectOption(option: SelectOption): void;
23
- filterOptions(value: string): void;
24
- protected requestOptionsUpdate(): void;
25
- getSelectOption(selectValue: string): SelectOption | undefined;
16
+ toggle(option: SelectOption): void;
17
+ abstract select(option: SelectOption): void;
18
+ remove(optionValue: string): void;
19
+ add(option: SelectOption, position?: number): void;
20
+ replace(options: SelectOption[]): void;
21
+ deselectAll(): void;
22
+ deselect(option: SelectOption): void;
23
+ filter(value: string): void;
24
+ protected requestUpdate(): void;
25
+ getOption(selectValue: string): SelectOption | undefined;
26
26
  hostConnected(): void;
27
27
  }
package/build/esm/packages/phoenix/src/components/form/select/controllers/base_select_controller.js CHANGED
@@ -25,16 +25,16 @@ class BaseSelectController {
25
25
  this._optionsObserver = new Observer(this._calculateValuesRelatedToOptions);
26
26
  this.options$.subscribe(this._optionsObserver);
27
27
  }
28
- toggleOption(option) {
29
- option.selected ? this.deselectOption(option) : this.selectOption(option);
28
+ toggle(option) {
29
+ option.selected ? this.deselect(option) : this.select(option);
30
30
  }
31
- removeOption(optionValue) {
31
+ remove(optionValue) {
32
32
  const options = this.options$.getValue();
33
33
  if (!options)
34
34
  return;
35
35
  this.options$.notify(options.filter((option) => option.value !== optionValue));
36
36
  }
37
- addOption(option, position) {
37
+ add(option, position) {
38
38
  var _a;
39
39
  const options = (_a = this.options$.getValue()) !== null && _a !== void 0 ? _a : [];
40
40
  if (position === undefined) {
@@ -44,22 +44,22 @@ class BaseSelectController {
44
44
  }
45
45
  this.options$.notify([...options.slice(0, position - 1), option, ...options.slice(position - 1)]);
46
46
  }
47
- replaceOptions(options) {
47
+ replace(options) {
48
48
  this.options$.notify(options);
49
49
  }
50
- deselectOptions() {
50
+ deselectAll() {
51
51
  var _a;
52
52
  (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.forEach((option) => (option.selected = false));
53
53
  this.selectedOptions$.notify([]);
54
- this.requestOptionsUpdate();
54
+ this.requestUpdate();
55
55
  }
56
- deselectOption(option) {
56
+ deselect(option) {
57
57
  var _a;
58
58
  (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.forEach((option) => (option.selected = false));
59
59
  this.selectedOptions$.notify([]);
60
- this.requestOptionsUpdate();
60
+ this.requestUpdate();
61
61
  }
62
- filterOptions(value) {
62
+ filter(value) {
63
63
  const selectOptions = this.options$.getValue();
64
64
  if (!selectOptions)
65
65
  return;
@@ -68,16 +68,16 @@ class BaseSelectController {
68
68
  filtered.forEach((option) => {
69
69
  option.hidden = false;
70
70
  });
71
- this.requestOptionsUpdate();
71
+ this.requestUpdate();
72
72
  }
73
- requestOptionsUpdate() {
73
+ requestUpdate() {
74
74
  const selectOptions = this.options$.getValue();
75
75
  if (!selectOptions)
76
76
  return;
77
77
  this.options$.notify([...selectOptions]);
78
78
  this.host.requestUpdate();
79
79
  }
80
- getSelectOption(selectValue) {
80
+ getOption(selectValue) {
81
81
  var _a;
82
82
  return (_a = this.options$.getValue()) === null || _a === void 0 ? void 0 : _a.find((option) => option.value === selectValue);
83
83
  }
package/build/esm/packages/phoenix/src/components/form/select/controllers/multi_select_controller.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { SelectOption } from "../model/select_option";
2
2
  import { BaseSelectController } from "./base_select_controller";
3
3
  export declare class MultiSelectController extends BaseSelectController {
4
- toggleOption(option: SelectOption): void;
5
- selectOption(option: SelectOption): void;
6
- deselectOption(option: SelectOption): void;
4
+ toggle(option: SelectOption): void;
5
+ select(option: SelectOption): void;
6
+ deselect(option: SelectOption): void;
7
7
  }
package/build/esm/packages/phoenix/src/components/form/select/controllers/multi_select_controller.js CHANGED
@@ -1,18 +1,18 @@
1
1
  import { BaseSelectController } from './base_select_controller.js';
2
2
 
3
3
  class MultiSelectController extends BaseSelectController {
4
- toggleOption(option) {
5
- option.selected ? this.deselectOption(option) : this.selectOption(option);
4
+ toggle(option) {
5
+ option.selected ? this.deselect(option) : this.select(option);
6
6
  }
7
- selectOption(option) {
7
+ select(option) {
8
8
  option.selected = true;
9
9
  this.selectedOptions$.notify((selectedOptions) => [...selectedOptions, option]);
10
- this.requestOptionsUpdate();
10
+ this.requestUpdate();
11
11
  }
12
- deselectOption(option) {
12
+ deselect(option) {
13
13
  option.selected = false;
14
14
  this.selectedOptions$.notify((selectedOptions) => selectedOptions.filter((currOption) => currOption.value !== option.value));
15
- this.requestOptionsUpdate();
15
+ this.requestUpdate();
16
16
  }
17
17
  }
18
18
 
package/build/esm/packages/phoenix/src/components/form/select/controllers/select_controller.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { SelectOption } from "../model/select_option";
2
2
  import { BaseSelectController } from "./base_select_controller";
3
3
  export declare class SelectController extends BaseSelectController {
4
- selectOption(option: SelectOption): void;
4
+ select(option: SelectOption): void;
5
5
  }
package/build/esm/packages/phoenix/src/components/form/select/controllers/select_controller.js CHANGED
@@ -1,13 +1,13 @@
1
1
  import { BaseSelectController } from './base_select_controller.js';
2
2
 
3
3
  class SelectController extends BaseSelectController {
4
- selectOption(option) {
4
+ select(option) {
5
5
  var _a;
6
6
  const selectedOptions = (_a = this.options$.getValue()) !== null && _a !== void 0 ? _a : [];
7
7
  selectedOptions.forEach((option) => (option.selected = false));
8
8
  option.selected = true;
9
9
  this.selectedOptions$.notify([option]);
10
- this.requestOptionsUpdate();
10
+ this.requestUpdate();
11
11
  }
12
12
  }
13
13
 
package/build/esm/packages/phoenix/src/components/form/select/controllers/select_controllers_types.d.ts CHANGED
@@ -10,13 +10,13 @@ export interface ISelectController {
10
10
  options$: BehaviorSubject<SelectOption[]>;
11
11
  visibleOptionsCount: number;
12
12
  selectedOptionsCount: number;
13
- deselectOptions(): void;
14
- deselectOption(option: SelectOption): void;
15
- filterOptions(value: string): void;
16
- toggleOption(option: SelectOption): void;
17
- selectOption(option: SelectOption): void;
18
- getSelectOption(selectValue: string): SelectOption | undefined;
19
- removeOption(optionValue: string): void;
20
- addOption(option: SelectOption, position?: number): void;
21
- replaceOptions(options: SelectOption[]): void;
13
+ deselectAll(): void;
14
+ deselect(option: SelectOption): void;
15
+ filter(value: string): void;
16
+ toggle(option: SelectOption): void;
17
+ select(option: SelectOption): void;
18
+ getOption(selectValue: string): SelectOption | undefined;
19
+ remove(optionValue: string): void;
20
+ add(option: SelectOption, position?: number): void;
21
+ replace(options: SelectOption[]): void;
22
22
  }
package/build/esm/packages/phoenix/src/components/form/select/select.d.ts CHANGED
@@ -1,14 +1,22 @@
1
1
  import { PhoenixLightLitElement } from "../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
2
+ import { HOption } from "./components/option/select_option";
2
3
  import { TemplateResult, PropertyValues } from 'lit';
3
4
  import { SelectOption } from "./model/select_option";
5
+ import type { TSelectType } from "./select_types";
4
6
  export declare class HSelect extends PhoenixLightLitElement {
5
7
  private static _components;
6
8
  controlName: string;
9
+ controlId: string;
7
10
  multiselect: boolean;
8
11
  opened: boolean;
9
12
  offset: number;
10
13
  error: boolean;
11
14
  disabled: boolean;
15
+ type: TSelectType;
16
+ required: boolean;
17
+ get selectedIndex(): number;
18
+ set selectedIndex(index: number);
19
+ get selectedOptions(): HOption[];
12
20
  private _searchValue;
13
21
  private _selectController;
14
22
  private _$options;
@@ -33,14 +41,15 @@ export declare class HSelect extends PhoenixLightLitElement {
33
41
  private _appendNewHTMLOption;
34
42
  private _removeHTMLOptions;
35
43
  private _handleOptionClicked;
44
+ private _selectOption;
36
45
  private _handleSearch;
37
46
  private _handleDropdownHidden;
38
47
  private _closeSelect;
39
48
  private _clearOptions;
40
49
  protected update(changedProperties: PropertyValues): void;
41
- addOption(option: SelectOption, position?: number): void;
50
+ add(option: SelectOption, position?: number): void;
42
51
  removeOption(optionValue: string): void;
43
- replaceOptions(options: SelectOption[]): void;
52
+ replace(options: SelectOption[]): void;
44
53
  disconnectedCallback(): void;
45
54
  private _handleResize;
46
55
  private _getDropdownContentWidth;
package/build/esm/packages/phoenix/src/components/form/select/select.js CHANGED
@@ -7,7 +7,7 @@ import { property } from '@lit/reactive-element/decorators.js';
7
7
  import { SELECT_RELATED_COMPONENTS_NAMES, SELECT_INPUT_PLACEHOLDER_SLOT_NAME, SELECT_CLOSE_BTN_EVENT_NAMES, SELECT_CLOSE_BUTTON_CONTENT_SLOT_NAME } from './components/select_components_constatns.js';
8
8
  import { Observer } from '../../../core/classes/observer/observer.js';
9
9
  import { HIcon } from '../../icon/icon.js';
10
- import { SELECT_SLOT_NAMES, SELECT_CSS_CLASSES, SELECT_CONTEXTS, SELECT_EVENT_NAMES, MIN_NUMBER_OF_OPTIONS_TO_SHOW_SEARCH, SELECT_RESIZE_DEBOUNCE_TIME } from './select_constants.js';
10
+ import { SELECT_TYPES, SELECT_SLOT_NAMES, SELECT_CSS_CLASSES, SELECT_CONTEXTS, SELECT_EVENT_NAMES, MIN_NUMBER_OF_OPTIONS_TO_SHOW_SEARCH, SELECT_RESIZE_DEBOUNCE_TIME } from './select_constants.js';
11
11
  import { observe } from '../../../directives/observable_directive.js';
12
12
  import { HSelectToggler } from './components/toggler/select_toggler.js';
13
13
  import { ContextProviderController } from '../../../core/context/context_provider_controller.js';
@@ -29,6 +29,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
29
29
  this.multiselect = false;
30
30
  this.opened = false;
31
31
  this.offset = 2;
32
+ this.type = SELECT_TYPES.select;
32
33
  this._searchValue = '';
33
34
  this._$options = {};
34
35
  this._$dropdown = createRef();
@@ -41,10 +42,10 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
41
42
  this._$dropdownContent.value.style.width = `${width !== null && width !== void 0 ? width : ''}px`;
42
43
  };
43
44
  this._handleOptionDeselect = (event) => {
44
- const selectedOption = this._selectController.getSelectOption(event.detail);
45
+ const selectedOption = this._selectController.getOption(event.detail);
45
46
  if (!selectedOption)
46
47
  return;
47
- this._selectController.deselectOption(selectedOption);
48
+ this._selectController.deselect(selectedOption);
48
49
  };
49
50
  this._updateOptionsView = (options) => {
50
51
  if (options.length < Object.keys(this._$options).length)
@@ -63,12 +64,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
63
64
  });
64
65
  };
65
66
  this._handleOptionClicked = (event) => {
66
- const selectedOption = this._selectController.getSelectOption(event.detail.$option.value);
67
- if (!selectedOption)
68
- return;
69
- this._selectController.toggleOption(selectedOption);
70
- if (!this.multiselect)
71
- this._closeSelect();
67
+ this._selectOption(event.detail.$option.value);
72
68
  };
73
69
  this._handleDropdownHidden = () => {
74
70
  this._searchValue = '';
@@ -81,7 +77,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
81
77
  (_a = this._$dropdown.value) === null || _a === void 0 ? void 0 : _a.hide();
82
78
  };
83
79
  this._clearOptions = () => {
84
- this._selectController.deselectOptions();
80
+ this._selectController.deselectAll();
85
81
  };
86
82
  this._handleResize = debounce_1(() => {
87
83
  this._closeSelect();
@@ -90,6 +86,28 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
90
86
  const $options = Array.from(this.querySelectorAll(SELECT_RELATED_COMPONENTS_NAMES.option));
91
87
  $options.forEach(($option) => $option.setAttribute('slot', SELECT_SLOT_NAMES.content));
92
88
  this.$placeholder = (_a = this.querySelector(`[slot="${SELECT_INPUT_PLACEHOLDER_SLOT_NAME}"]`)) !== null && _a !== void 0 ? _a : 'Select';
89
+ if (this.multiselect)
90
+ this.type = SELECT_TYPES.multiselect;
91
+ }
92
+ get selectedIndex() {
93
+ const selectedOptions = this._selectController.selectedOptions$.getValue();
94
+ if (!selectedOptions || selectedOptions.length === 0)
95
+ return -1;
96
+ const htmlOptions = Object.values(this._$options);
97
+ return this.multiselect
98
+ ? SelectControlUtils.getFirstIndexSelectedOption(htmlOptions)
99
+ : SelectControlUtils.getLastIndexOfSelectedOption(htmlOptions);
100
+ }
101
+ set selectedIndex(index) {
102
+ const option = Object.values(this._$options)[index];
103
+ if (!option) {
104
+ this._selectController.deselectAll();
105
+ return;
106
+ }
107
+ this._selectOption(option.value);
108
+ }
109
+ get selectedOptions() {
110
+ return Object.values(this._$options).filter((option) => option.selected);
93
111
  }
94
112
  updated(changedProperties) {
95
113
  super.updated(changedProperties);
@@ -169,22 +187,30 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
169
187
  _removeHTMLOptions(optionsValues) {
170
188
  this._$options = SelectControlUtils.removeHTMLOptions(Object.values(this._$options), optionsValues);
171
189
  }
190
+ _selectOption(value) {
191
+ const option = this._selectController.getOption(value);
192
+ if (!option)
193
+ return;
194
+ this._selectController.toggle(option);
195
+ if (!this.multiselect)
196
+ this._closeSelect();
197
+ }
172
198
  _handleSearch({ detail }) {
173
199
  this._searchValue = detail;
174
200
  }
175
201
  update(changedProperties) {
176
202
  super.update(changedProperties);
177
203
  if (changedProperties.has('_searchValue'))
178
- this._selectController.filterOptions(this._searchValue);
204
+ this._selectController.filter(this._searchValue);
179
205
  }
180
- addOption(option, position) {
181
- this._selectController.addOption(option, position);
206
+ add(option, position) {
207
+ this._selectController.add(option, position);
182
208
  }
183
209
  removeOption(optionValue) {
184
- this._selectController.removeOption(optionValue);
210
+ this._selectController.remove(optionValue);
185
211
  }
186
- replaceOptions(options) {
187
- this._selectController.replaceOptions(options);
212
+ replace(options) {
213
+ this._selectController.replace(options);
188
214
  }
189
215
  disconnectedCallback() {
190
216
  super.disconnectedCallback();
@@ -277,9 +303,13 @@ HSelect._components = {
277
303
  toggler: HSelectToggler
278
304
  };
279
305
  __decorate([
280
- property({ type: String }),
306
+ property({ type: String, attribute: 'control-name' }),
281
307
  __metadata("design:type", String)
282
308
  ], HSelect.prototype, "controlName", void 0);
309
+ __decorate([
310
+ property({ type: String, attribute: 'control-id' }),
311
+ __metadata("design:type", String)
312
+ ], HSelect.prototype, "controlId", void 0);
283
313
  __decorate([
284
314
  property({ type: Boolean }),
285
315
  __metadata("design:type", Boolean)
@@ -300,6 +330,14 @@ __decorate([
300
330
  property({ type: Boolean }),
301
331
  __metadata("design:type", Boolean)
302
332
  ], HSelect.prototype, "disabled", void 0);
333
+ __decorate([
334
+ property({ type: String }),
335
+ __metadata("design:type", String)
336
+ ], HSelect.prototype, "type", void 0);
337
+ __decorate([
338
+ property({ type: Boolean }),
339
+ __metadata("design:type", Boolean)
340
+ ], HSelect.prototype, "required", void 0);
303
341
  __decorate([
304
342
  state(),
305
343
  __metadata("design:type", String)
package/build/esm/packages/phoenix/src/components/form/select/select.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;AACA;AACA,uBAAuB,+CAAmD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA,uBAAuB,+CAAmD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/select/select_constants.d.ts CHANGED
@@ -6,6 +6,10 @@ export declare const SELECT_SLOT_NAMES: {
6
6
  readonly content: "content";
7
7
  readonly toggler: "toggler";
8
8
  };
9
+ export declare const SELECT_TYPES: {
10
+ readonly select: "select-one";
11
+ readonly multiselect: "select-multiple";
12
+ };
9
13
  export declare const SELECT_EVENT_NAMES: {
10
14
  readonly selectOption: "selectOption.select";
11
15
  readonly deselectOption: "selectOption.deselect";
package/build/esm/packages/phoenix/src/components/form/select/select_constants.js CHANGED
@@ -6,6 +6,10 @@ const SELECT_SLOT_NAMES = {
6
6
  content: 'content',
7
7
  toggler: 'toggler'
8
8
  };
9
+ const SELECT_TYPES = {
10
+ select: 'select-one',
11
+ multiselect: 'select-multiple'
12
+ };
9
13
  const SELECT_EVENT_NAMES = {
10
14
  selectOption: 'selectOption.select',
11
15
  deselectOption: 'selectOption.deselect'
@@ -32,5 +36,5 @@ const SELECT_CSS_CLASSES = {
32
36
  selectLabel: `${baseSelectClass}__label`
33
37
  };
34
38
 
35
- export { MIN_NUMBER_OF_OPTIONS_TO_SHOW_SEARCH, SELECT_CONTEXTS, SELECT_CSS_CLASSES, SELECT_EVENT_NAMES, SELECT_RESIZE_DEBOUNCE_TIME, SELECT_SLOT_NAMES };
39
+ export { MIN_NUMBER_OF_OPTIONS_TO_SHOW_SEARCH, SELECT_CONTEXTS, SELECT_CSS_CLASSES, SELECT_EVENT_NAMES, SELECT_RESIZE_DEBOUNCE_TIME, SELECT_SLOT_NAMES, SELECT_TYPES };
36
40
  //# sourceMappingURL=select_constants.js.map
package/build/esm/packages/phoenix/src/components/form/select/select_constants.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/select/select_types.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import { SELECT_TYPES } from "./select_constants";
2
+ export declare type TSelectType = typeof SELECT_TYPES[keyof typeof SELECT_TYPES];
package/build/esm/packages/phoenix/src/components/form/select/select_types.js ADDED
@@ -0,0 +1,2 @@
1
+ import '@phoenixRoot/components/form/select/select_constants';
2
+ //# sourceMappingURL=select_types.js.map
package/build/esm/packages/phoenix/src/components/form/select/select_types.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"select_types.js","sourceRoot":"","sources":["../../../../../../../../src/components/form/select/select_types.ts"],"names":[],"mappings":"AAAA,OAA6B,sDAAsD,CAAC"}
package/build/esm/packages/phoenix/src/components/form/select/select_utils.d.ts CHANGED
@@ -6,4 +6,6 @@ export declare class SelectControlUtils {
6
6
  static syncHTMLOptionWithModel(option: SelectOption, $option: HOption): void;
7
7
  static removeHTMLOptions($options: HOption[], optionsValuesThatExists: string[]): Record<string, HOption>;
8
8
  static appendHTMLOption($option: HOption, $list: HOptions, position?: number): void;
9
+ static getFirstIndexSelectedOption(options: HOption[]): number;
10
+ static getLastIndexOfSelectedOption(options: HOption[]): number;
9
11
  }
package/build/esm/packages/phoenix/src/components/form/select/select_utils.js CHANGED
@@ -42,6 +42,12 @@ class SelectControlUtils {
42
42
  }
43
43
  $list.append($option);
44
44
  }
45
+ static getFirstIndexSelectedOption(options) {
46
+ return options.findIndex((option) => option.selected);
47
+ }
48
+ static getLastIndexOfSelectedOption(options) {
49
+ return [...options].reverse().findIndex((option) => option.selected);
50
+ }
45
51
  }
46
52
 
47
53
  export { SelectControlUtils };
package/build/esm/packages/phoenix/src/components/form/select/select_utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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.5",
5
+ "version": "1.1.6-2",
6
6
  "description": "phoenix design system",
7
7
  "author": "zefirek",
8
8
  "license": "MIT",