@vaadin/multi-select-combo-box 23.1.0-rc1 → 23.1.0-rc2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/multi-select-combo-box",
-  "version": "23.1.0-rc1",
+  "version": "23.1.0-rc2",
   "publishConfig": {
     "access": "public"
   },
@@ -33,18 +33,18 @@
   ],
   "dependencies": {
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/combo-box": "23.1.0-rc1",
-    "@vaadin/component-base": "23.1.0-rc1",
-    "@vaadin/field-base": "23.1.0-rc1",
-    "@vaadin/input-container": "23.1.0-rc1",
-    "@vaadin/vaadin-lumo-styles": "23.1.0-rc1",
-    "@vaadin/vaadin-material-styles": "23.1.0-rc1",
-    "@vaadin/vaadin-themable-mixin": "23.1.0-rc1"
+    "@vaadin/combo-box": "23.1.0-rc2",
+    "@vaadin/component-base": "23.1.0-rc2",
+    "@vaadin/field-base": "23.1.0-rc2",
+    "@vaadin/input-container": "23.1.0-rc2",
+    "@vaadin/vaadin-lumo-styles": "23.1.0-rc2",
+    "@vaadin/vaadin-material-styles": "23.1.0-rc2",
+    "@vaadin/vaadin-themable-mixin": "23.1.0-rc2"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
     "@vaadin/testing-helpers": "^0.3.2",
     "sinon": "^13.0.2"
   },
-  "gitHead": "5ecb85e16e938df827fefca4bd2a665a1e29913e"
+  "gitHead": "154c6782c42145fed21e443559fbe2d781ad3ec7"
 }

package/src/vaadin-multi-select-combo-box.js

@@ -239,6 +239,7 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
        */
       itemLabelPath: {
         type: String,
+        value: 'label',
       },
 
       /**
@@ -248,6 +249,7 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
        */
       itemValuePath: {
         type: String,
+        value: 'value',
       },
 
       /**
@@ -602,7 +604,7 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
 
     // Use placeholder for announcing items
     if (this._hasValue) {
-      const tmpPlaceholder = selectedItems.map((item) => this._getItemLabel(item, this.itemLabelPath)).join(', ');
+      const tmpPlaceholder = this._mergeItemLabels(selectedItems);
       this.__tmpA11yPlaceholder = tmpPlaceholder;
       this.placeholder = tmpPlaceholder;
     } else {
@@ -627,8 +629,8 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
   }
 
   /** @private */
-  _getItemLabel(item, itemLabelPath) {
-    return item && Object.prototype.hasOwnProperty.call(item, itemLabelPath) ? item[itemLabelPath] : item;
+  _getItemLabel(item) {
+    return item && Object.prototype.hasOwnProperty.call(item, this.itemLabelPath) ? item[this.itemLabelPath] : item;
   }
 
   /** @private */
@@ -651,7 +653,7 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
 
   /** @private */
   _getOverflowTitle(items) {
-    return items.map((item) => this._getItemLabel(item, this.itemLabelPath)).join(', ');
+    return this._mergeItemLabels(items);
   }
 
   /** @private */
@@ -659,6 +661,11 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
     return length === 0;
   }
 
+  /** @private */
+  _mergeItemLabels(items) {
+    return items.map((item) => this._getItemLabel(item)).join(', ');
+  }
+
   /** @private */
   _findIndex(item, selectedItems, itemIdPath) {
     if (itemIdPath && item) {
@@ -699,7 +706,7 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
     const itemsCopy = [...this.selectedItems];
 
     const index = this._findIndex(item, itemsCopy, this.itemIdPath);
-    const itemLabel = this._getItemLabel(item, this.itemLabelPath);
+    const itemLabel = this._getItemLabel(item);
 
     let isSelected = false;
 
@@ -743,7 +750,7 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
     chip.disabled = this.disabled;
     chip.readonly = this.readonly;
 
-    const label = this._getItemLabel(item, this.itemLabelPath);
+    const label = this._getItemLabel(item);
     chip.label = label;
     chip.setAttribute('title', label);
 
@@ -946,7 +953,7 @@ class MultiSelectComboBox extends ResizeMixin(InputControlMixin(ThemableMixin(El
       // Announce focused chip
       if (focusedIndex > -1) {
         const item = chips[focusedIndex].item;
-        const itemLabel = this._getItemLabel(item, this.itemLabelPath);
+        const itemLabel = this._getItemLabel(item);
         announce(`${itemLabel} ${this.i18n.focused}`);
       }
     }