@shoper/phoenix_design_system 1.18.11-17 → 1.18.11-19
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.
- package/build/cjs/packages/phoenix/src/components/form/select/select.js +31 -12
- package/build/cjs/packages/phoenix/src/components/form/select/select.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form/select/select.d.ts +2 -1
- package/build/esm/packages/phoenix/src/components/form/select/select.js +31 -12
- package/build/esm/packages/phoenix/src/components/form/select/select.js.map +1 -1
- package/package.json +1 -1
|
@@ -44,7 +44,6 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
44
44
|
this.noDeselect = false;
|
|
45
45
|
this.assistiveTitleId = '';
|
|
46
46
|
this.isDevSelectPlaceholderFlagEnabled = false;
|
|
47
|
-
this.refreshOnModalOpen = false;
|
|
48
47
|
this.translations = {};
|
|
49
48
|
this._selectOptionsId = v4['default']();
|
|
50
49
|
this._searchValue = '';
|
|
@@ -55,6 +54,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
55
54
|
this._$dropdownContent = ref_js.createRef();
|
|
56
55
|
this.$dropdownToggler = ref_js.createRef();
|
|
57
56
|
this._selectContext = new context_provider_controller.ContextProviderController(this);
|
|
57
|
+
this._placeholderObserver = null;
|
|
58
58
|
this._updateOptions = () => {
|
|
59
59
|
const $options = this._getOptions();
|
|
60
60
|
this._$options = $options.reduce((acc, $option) => {
|
|
@@ -186,7 +186,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
186
186
|
const $options = Array.from(this.querySelectorAll(select_components_constatns.SELECT_RELATED_COMPONENTS_NAMES.option));
|
|
187
187
|
$options.forEach(($option) => $option.setAttribute('slot', select_constants.SELECT_SLOT_NAMES.content));
|
|
188
188
|
const $placeholderEl = this.querySelector(`[slot="${select_components_constatns.SELECT_INPUT_PLACEHOLDER_SLOT_NAME}"]`);
|
|
189
|
-
this.$placeholder = $placeholderEl && ((_a = $placeholderEl.textContent) === null || _a === void 0 ? void 0 : _a.trim()) ? $placeholderEl : 'Select';
|
|
189
|
+
this.$placeholder = ($placeholderEl && ((_a = $placeholderEl.textContent) === null || _a === void 0 ? void 0 : _a.trim())) ? $placeholderEl : 'Select';
|
|
190
190
|
if (this.multiple)
|
|
191
191
|
this.type = select_constants.SELECT_TYPES.multiple;
|
|
192
192
|
}
|
|
@@ -285,10 +285,9 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
285
285
|
this._updateOptions();
|
|
286
286
|
if (this.isDevSelectPlaceholderFlagEnabled) {
|
|
287
287
|
this._addPlaceholderOptionIfNeeded();
|
|
288
|
+
this._observePlaceholderSlotChanges();
|
|
288
289
|
}
|
|
289
290
|
this._setupEvents();
|
|
290
|
-
if (this.refreshOnModalOpen)
|
|
291
|
-
this.requestUpdate();
|
|
292
291
|
}
|
|
293
292
|
attributeChangedCallback(name, _old, value) {
|
|
294
293
|
super.attributeChangedCallback(name, _old, value);
|
|
@@ -328,7 +327,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
328
327
|
$content.textContent = this.$placeholder;
|
|
329
328
|
}
|
|
330
329
|
else if (this.$placeholder instanceof Node) {
|
|
331
|
-
Array.from(this.$placeholder.childNodes).forEach(
|
|
330
|
+
Array.from(this.$placeholder.childNodes).forEach(node => {
|
|
332
331
|
$content.appendChild(node.cloneNode(true));
|
|
333
332
|
});
|
|
334
333
|
}
|
|
@@ -348,6 +347,27 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
348
347
|
this.addEventListener(select_constants.SELECT_EVENT_NAMES.deselectOption, this._handleOptionDeselect);
|
|
349
348
|
this.addEventListener(select_components_constatns.SELECT_CLOSE_BTN_EVENT_NAMES.close, this._closeSelect);
|
|
350
349
|
}
|
|
350
|
+
_observePlaceholderSlotChanges() {
|
|
351
|
+
if (!(this.$placeholder instanceof Node))
|
|
352
|
+
return;
|
|
353
|
+
this._placeholderObserver = new MutationObserver(() => {
|
|
354
|
+
var _a, _b;
|
|
355
|
+
const $placeholderOptionContent = this.querySelector('h-option[placeholder] h-option-content');
|
|
356
|
+
if (!$placeholderOptionContent)
|
|
357
|
+
return;
|
|
358
|
+
const translatedText = (_a = this.$placeholder.textContent) === null || _a === void 0 ? void 0 : _a.trim();
|
|
359
|
+
const currentText = (_b = $placeholderOptionContent.textContent) === null || _b === void 0 ? void 0 : _b.trim();
|
|
360
|
+
if (translatedText && translatedText !== currentText) {
|
|
361
|
+
$placeholderOptionContent.textContent = translatedText;
|
|
362
|
+
this._updateOptions();
|
|
363
|
+
}
|
|
364
|
+
});
|
|
365
|
+
this._placeholderObserver.observe(this.$placeholder, {
|
|
366
|
+
childList: true,
|
|
367
|
+
characterData: true,
|
|
368
|
+
subtree: true,
|
|
369
|
+
});
|
|
370
|
+
}
|
|
351
371
|
_appendNewHTMLOption(option, position) {
|
|
352
372
|
const $list = this._$optionsList.value;
|
|
353
373
|
if (!$list)
|
|
@@ -408,9 +428,12 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
408
428
|
this._selectController.select(option);
|
|
409
429
|
}
|
|
410
430
|
disconnectedCallback() {
|
|
431
|
+
var _a;
|
|
411
432
|
super.disconnectedCallback();
|
|
412
433
|
this._selectController.options$.unsubscribe(this._optionsObserver);
|
|
413
434
|
this._$options.clear();
|
|
435
|
+
(_a = this._placeholderObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
436
|
+
this._placeholderObserver = null;
|
|
414
437
|
}
|
|
415
438
|
_getClonedPlaceholderElement() {
|
|
416
439
|
return this.$placeholder instanceof HTMLElement ? this.$placeholder.cloneNode(true) : this.$placeholder;
|
|
@@ -462,9 +485,9 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
|
|
|
462
485
|
<h-select-close-btn class="${select_constants.SELECT_CSS_CLASSES.selectCloseMobileButton}" @close=${this._closeSelect}></h-select-close-btn>
|
|
463
486
|
|
|
464
487
|
<div class=${select_constants.SELECT_CSS_CLASSES.selectLabel}>
|
|
465
|
-
${this.isDevSelectPlaceholderFlagEnabled
|
|
466
|
-
|
|
467
|
-
|
|
488
|
+
${this.isDevSelectPlaceholderFlagEnabled ?
|
|
489
|
+
(_b = this.$searchLabel) === null || _b === void 0 ? void 0 : _b.cloneNode(true) :
|
|
490
|
+
lit.html `${this._getClonedPlaceholderElement()}`}
|
|
468
491
|
</div>
|
|
469
492
|
|
|
470
493
|
${isSearchEnabled
|
|
@@ -584,10 +607,6 @@ tslib_es6.__decorate([
|
|
|
584
607
|
decorators_js.property({ type: Boolean, attribute: 'is-dev-select-placeholder-flag-enabled' }),
|
|
585
608
|
tslib_es6.__metadata("design:type", Boolean)
|
|
586
609
|
], exports.HSelect.prototype, "isDevSelectPlaceholderFlagEnabled", void 0);
|
|
587
|
-
tslib_es6.__decorate([
|
|
588
|
-
decorators_js.property({ type: Boolean, attribute: 'refresh-on-modal-open' }),
|
|
589
|
-
tslib_es6.__metadata("design:type", Object)
|
|
590
|
-
], exports.HSelect.prototype, "refreshOnModalOpen", void 0);
|
|
591
610
|
tslib_es6.__decorate([
|
|
592
611
|
decorators_js.property({
|
|
593
612
|
converter: {
|
|
@@ -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;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA,iBAAiB,wDAA4D;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -24,7 +24,6 @@ export declare class HSelect extends PhoenixLightLitElement {
|
|
|
24
24
|
noDeselect: boolean;
|
|
25
25
|
assistiveTitleId: string;
|
|
26
26
|
isDevSelectPlaceholderFlagEnabled: boolean;
|
|
27
|
-
refreshOnModalOpen: boolean;
|
|
28
27
|
translations: Record<string, string>;
|
|
29
28
|
private _selectOptionsId;
|
|
30
29
|
get selectedIndex(): number;
|
|
@@ -48,6 +47,7 @@ export declare class HSelect extends PhoenixLightLitElement {
|
|
|
48
47
|
private _selectedOptionsAriaObserver;
|
|
49
48
|
private $placeholder;
|
|
50
49
|
private $searchLabel;
|
|
50
|
+
private _placeholderObserver;
|
|
51
51
|
constructor();
|
|
52
52
|
updated(changedProperties: PropertyValues): void;
|
|
53
53
|
private _focusElementAfterSelectOpened;
|
|
@@ -63,6 +63,7 @@ export declare class HSelect extends PhoenixLightLitElement {
|
|
|
63
63
|
private _handleOptionDeselect;
|
|
64
64
|
private _updateOptionsView;
|
|
65
65
|
private _updateLabelAria;
|
|
66
|
+
private _observePlaceholderSlotChanges;
|
|
66
67
|
private _appendNewHTMLOption;
|
|
67
68
|
updateOptionAriaAttribute($option: HOption): void;
|
|
68
69
|
private _removeHTMLOptions;
|
|
@@ -40,7 +40,6 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
40
40
|
this.noDeselect = false;
|
|
41
41
|
this.assistiveTitleId = '';
|
|
42
42
|
this.isDevSelectPlaceholderFlagEnabled = false;
|
|
43
|
-
this.refreshOnModalOpen = false;
|
|
44
43
|
this.translations = {};
|
|
45
44
|
this._selectOptionsId = v4();
|
|
46
45
|
this._searchValue = '';
|
|
@@ -51,6 +50,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
51
50
|
this._$dropdownContent = createRef();
|
|
52
51
|
this.$dropdownToggler = createRef();
|
|
53
52
|
this._selectContext = new ContextProviderController(this);
|
|
53
|
+
this._placeholderObserver = null;
|
|
54
54
|
this._updateOptions = () => {
|
|
55
55
|
const $options = this._getOptions();
|
|
56
56
|
this._$options = $options.reduce((acc, $option) => {
|
|
@@ -182,7 +182,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
182
182
|
const $options = Array.from(this.querySelectorAll(SELECT_RELATED_COMPONENTS_NAMES.option));
|
|
183
183
|
$options.forEach(($option) => $option.setAttribute('slot', SELECT_SLOT_NAMES.content));
|
|
184
184
|
const $placeholderEl = this.querySelector(`[slot="${SELECT_INPUT_PLACEHOLDER_SLOT_NAME}"]`);
|
|
185
|
-
this.$placeholder = $placeholderEl && ((_a = $placeholderEl.textContent) === null || _a === void 0 ? void 0 : _a.trim()) ? $placeholderEl : 'Select';
|
|
185
|
+
this.$placeholder = ($placeholderEl && ((_a = $placeholderEl.textContent) === null || _a === void 0 ? void 0 : _a.trim())) ? $placeholderEl : 'Select';
|
|
186
186
|
if (this.multiple)
|
|
187
187
|
this.type = SELECT_TYPES.multiple;
|
|
188
188
|
}
|
|
@@ -281,10 +281,9 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
281
281
|
this._updateOptions();
|
|
282
282
|
if (this.isDevSelectPlaceholderFlagEnabled) {
|
|
283
283
|
this._addPlaceholderOptionIfNeeded();
|
|
284
|
+
this._observePlaceholderSlotChanges();
|
|
284
285
|
}
|
|
285
286
|
this._setupEvents();
|
|
286
|
-
if (this.refreshOnModalOpen)
|
|
287
|
-
this.requestUpdate();
|
|
288
287
|
}
|
|
289
288
|
attributeChangedCallback(name, _old, value) {
|
|
290
289
|
super.attributeChangedCallback(name, _old, value);
|
|
@@ -324,7 +323,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
324
323
|
$content.textContent = this.$placeholder;
|
|
325
324
|
}
|
|
326
325
|
else if (this.$placeholder instanceof Node) {
|
|
327
|
-
Array.from(this.$placeholder.childNodes).forEach(
|
|
326
|
+
Array.from(this.$placeholder.childNodes).forEach(node => {
|
|
328
327
|
$content.appendChild(node.cloneNode(true));
|
|
329
328
|
});
|
|
330
329
|
}
|
|
@@ -344,6 +343,27 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
344
343
|
this.addEventListener(SELECT_EVENT_NAMES.deselectOption, this._handleOptionDeselect);
|
|
345
344
|
this.addEventListener(SELECT_CLOSE_BTN_EVENT_NAMES.close, this._closeSelect);
|
|
346
345
|
}
|
|
346
|
+
_observePlaceholderSlotChanges() {
|
|
347
|
+
if (!(this.$placeholder instanceof Node))
|
|
348
|
+
return;
|
|
349
|
+
this._placeholderObserver = new MutationObserver(() => {
|
|
350
|
+
var _a, _b;
|
|
351
|
+
const $placeholderOptionContent = this.querySelector('h-option[placeholder] h-option-content');
|
|
352
|
+
if (!$placeholderOptionContent)
|
|
353
|
+
return;
|
|
354
|
+
const translatedText = (_a = this.$placeholder.textContent) === null || _a === void 0 ? void 0 : _a.trim();
|
|
355
|
+
const currentText = (_b = $placeholderOptionContent.textContent) === null || _b === void 0 ? void 0 : _b.trim();
|
|
356
|
+
if (translatedText && translatedText !== currentText) {
|
|
357
|
+
$placeholderOptionContent.textContent = translatedText;
|
|
358
|
+
this._updateOptions();
|
|
359
|
+
}
|
|
360
|
+
});
|
|
361
|
+
this._placeholderObserver.observe(this.$placeholder, {
|
|
362
|
+
childList: true,
|
|
363
|
+
characterData: true,
|
|
364
|
+
subtree: true,
|
|
365
|
+
});
|
|
366
|
+
}
|
|
347
367
|
_appendNewHTMLOption(option, position) {
|
|
348
368
|
const $list = this._$optionsList.value;
|
|
349
369
|
if (!$list)
|
|
@@ -404,9 +424,12 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
404
424
|
this._selectController.select(option);
|
|
405
425
|
}
|
|
406
426
|
disconnectedCallback() {
|
|
427
|
+
var _a;
|
|
407
428
|
super.disconnectedCallback();
|
|
408
429
|
this._selectController.options$.unsubscribe(this._optionsObserver);
|
|
409
430
|
this._$options.clear();
|
|
431
|
+
(_a = this._placeholderObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
432
|
+
this._placeholderObserver = null;
|
|
410
433
|
}
|
|
411
434
|
_getClonedPlaceholderElement() {
|
|
412
435
|
return this.$placeholder instanceof HTMLElement ? this.$placeholder.cloneNode(true) : this.$placeholder;
|
|
@@ -458,9 +481,9 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
|
|
|
458
481
|
<h-select-close-btn class="${SELECT_CSS_CLASSES.selectCloseMobileButton}" @close=${this._closeSelect}></h-select-close-btn>
|
|
459
482
|
|
|
460
483
|
<div class=${SELECT_CSS_CLASSES.selectLabel}>
|
|
461
|
-
${this.isDevSelectPlaceholderFlagEnabled
|
|
462
|
-
|
|
463
|
-
|
|
484
|
+
${this.isDevSelectPlaceholderFlagEnabled ?
|
|
485
|
+
(_b = this.$searchLabel) === null || _b === void 0 ? void 0 : _b.cloneNode(true) :
|
|
486
|
+
html `${this._getClonedPlaceholderElement()}`}
|
|
464
487
|
</div>
|
|
465
488
|
|
|
466
489
|
${isSearchEnabled
|
|
@@ -580,10 +603,6 @@ __decorate([
|
|
|
580
603
|
property({ type: Boolean, attribute: 'is-dev-select-placeholder-flag-enabled' }),
|
|
581
604
|
__metadata("design:type", Boolean)
|
|
582
605
|
], HSelect.prototype, "isDevSelectPlaceholderFlagEnabled", void 0);
|
|
583
|
-
__decorate([
|
|
584
|
-
property({ type: Boolean, attribute: 'refresh-on-modal-open' }),
|
|
585
|
-
__metadata("design:type", Object)
|
|
586
|
-
], HSelect.prototype, "refreshOnModalOpen", void 0);
|
|
587
606
|
__decorate([
|
|
588
607
|
property({
|
|
589
608
|
converter: {
|
|
@@ -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;AACA,eAAe,wDAA4D;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA,eAAe,wDAA4D;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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