@shoper/phoenix_design_system 1.15.11-15 → 1.15.11-16

package/build/cjs/packages/phoenix/src/components/form/select/select.js

@@ -42,7 +42,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
         this.searchDisabled = false;
         this.type = select_constants.SELECT_TYPES.select;
         this.noDeselect = false;
-        this.assistiveTitle = '';
+        this.assistiveTitleId = '';
         this._selectOptionsId = v4['default']();
         this._searchValue = '';
         this._$options = new Map();
@@ -254,7 +254,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
         if (!this.searchDisabled) {
             this.classList.add(select_constants.SELECT_CSS_CLASSES.selectWithSearch);
         }
-        this.$searchLabel = document.querySelector(`[id="${this.assistiveTitle}"]`);
+        this.$searchLabel = document.querySelector(`[id="${this.assistiveTitleId}"]`);
         (_a = this.$searchLabel) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'true');
         this._selectController = this.multiple ? new multi_select_controller.MultiSelectController({ host: this }) : new select_controller.SelectController({ host: this });
         this._selectContext.provide(select_constants.SELECT_CONTEXTS.selectedOptions$, this._selectController.selectedOptions$);
@@ -405,7 +405,7 @@ exports.HSelect = class HSelect extends phoenix_light_lit_element.PhoenixLightLi
 
                     <h-options
                         class="${select_constants.SELECT_CSS_CLASSES.selectOptions} ${this._searchNoResult() ? select_constants.SELECT_CSS_CLASSES.selectOptionsEmpty : ''}"
-                        aria-labelledby="${this.assistiveTitle}"
+                        aria-labelledby="${this.assistiveTitleId}"
                         id="${this._selectOptionsId}"
                         ${ref_js.ref(this._$optionsList)}
                         @optionClicked=${this._handleOptionClicked}
@@ -498,9 +498,9 @@ tslib_es6.__decorate([
     tslib_es6.__metadata("design:type", Boolean)
 ], exports.HSelect.prototype, "noDeselect", void 0);
 tslib_es6.__decorate([
-    decorators_js.property({ type: String, attribute: 'assistive-title' }),
+    decorators_js.property({ type: String, attribute: 'assistive-title-id' }),
     tslib_es6.__metadata("design:type", String)
-], exports.HSelect.prototype, "assistiveTitle", void 0);
+], exports.HSelect.prototype, "assistiveTitleId", void 0);
 tslib_es6.__decorate([
     decorators.state(),
     tslib_es6.__metadata("design:type", String)

package/build/esm/packages/phoenix/src/components/form/select/select.d.ts

@@ -22,7 +22,7 @@ export declare class HSelect extends PhoenixLightLitElement {
     required: boolean;
     optionsList?: TSelectOption[];
     noDeselect: boolean;
-    assistiveTitle: string;
+    assistiveTitleId: string;
     private _selectOptionsId;
     get selectedIndex(): number;
     set selectedIndex(index: number);

package/build/esm/packages/phoenix/src/components/form/select/select.js

@@ -38,7 +38,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
         this.searchDisabled = false;
         this.type = SELECT_TYPES.select;
         this.noDeselect = false;
-        this.assistiveTitle = '';
+        this.assistiveTitleId = '';
         this._selectOptionsId = v4();
         this._searchValue = '';
         this._$options = new Map();
@@ -250,7 +250,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
         if (!this.searchDisabled) {
             this.classList.add(SELECT_CSS_CLASSES.selectWithSearch);
         }
-        this.$searchLabel = document.querySelector(`[id="${this.assistiveTitle}"]`);
+        this.$searchLabel = document.querySelector(`[id="${this.assistiveTitleId}"]`);
         (_a = this.$searchLabel) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-hidden', 'true');
         this._selectController = this.multiple ? new MultiSelectController({ host: this }) : new SelectController({ host: this });
         this._selectContext.provide(SELECT_CONTEXTS.selectedOptions$, this._selectController.selectedOptions$);
@@ -401,7 +401,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
 
                     <h-options
                         class="${SELECT_CSS_CLASSES.selectOptions} ${this._searchNoResult() ? SELECT_CSS_CLASSES.selectOptionsEmpty : ''}"
-                        aria-labelledby="${this.assistiveTitle}"
+                        aria-labelledby="${this.assistiveTitleId}"
                         id="${this._selectOptionsId}"
                         ${ref(this._$optionsList)}
                         @optionClicked=${this._handleOptionClicked}
@@ -494,9 +494,9 @@ __decorate([
     __metadata("design:type", Boolean)
 ], HSelect.prototype, "noDeselect", void 0);
 __decorate([
-    property({ type: String, attribute: 'assistive-title' }),
+    property({ type: String, attribute: 'assistive-title-id' }),
     __metadata("design:type", String)
-], HSelect.prototype, "assistiveTitle", void 0);
+], HSelect.prototype, "assistiveTitleId", void 0);
 __decorate([
     state(),
     __metadata("design:type", String)

package/package.json

@@ -2,7 +2,7 @@
   "name": "@shoper/phoenix_design_system",
   "packageManager": "yarn@3.2.0",
   "sideEffects": false,
-  "version": "1.15.11-15",
+  "version": "1.15.11-16",
   "description": "phoenix design system",
   "author": "zefirek",
   "license": "MIT",