@danielgindi/selectbox 2.0.26 → 2.0.27

package/dist/lib.umd.js

@@ -1,5 +1,5 @@
 /*!
- * @danielgindi/selectbox 2.0.26
+ * @danielgindi/selectbox 2.0.27
  * git://github.com/danielgindi/selectbox.git
  */
 (function (global, factory) {
@@ -6367,7 +6367,7 @@
   /** */
 
   /** @type {DropList.Options} */
-  let defaultOptions$1 = {
+  const DefaultOptions$1 = {
     baseClassName: 'droplist',
 
     autoItemBlur: true,
@@ -6426,7 +6426,7 @@
      * @param {DropList.Options} options
      */
     constructor(options) {var _o$positionOptionsPro;
-      const o = _objectSpread2({}, defaultOptions$1);
+      const o = _objectSpread2({}, DefaultOptions$1);
 
       for (let [key, value] of Object.entries(/**@type Object*/options))
       if (value !== undefined)
@@ -9893,6 +9893,7 @@
    * @property {string} [labelProp='label']
    * @property {string} [valueProp='value']
    * @property {string} [multiItemLabelProp='short_label']
+   * @property {'after'|'before'|'none'} [multiItemRemovePosition='after']
    * @property {number} [maxMultiItems] maximum number of multi items. The rest will get a single item to represent.
    * @property {function(count: number, items: DropList.ItemBase[]):string} [multiItemsRestLabelProvider] label for the item representing the rest of the items.
    * @property {DropList.ItemBase[]|null} [items] initial items
@@ -9915,7 +9916,7 @@
    * @property {boolean} [closeListWhenLoading] whether we should close the list automatically when loading
    * @property {string[]} [clearInputWhen=['single_close','multi_select_single']] clear input box when closing the droplist or selecting <code>['single_close', 'multi_close', 'multi_select_single']</code>
    * */
-  const defaultOptions = {
+  const DefaultOptions = {
     el: null,
     baseClassName: 'selectbox',
     disabled: false,
@@ -9942,6 +9943,7 @@
     labelProp: 'label',
     valueProp: 'value',
     multiItemLabelProp: 'short_label',
+    multiItemRemovePosition: 'after',
     maxMultiItems: null,
     multiItemsRestLabelProvider: null,
     items: [],
@@ -10000,7 +10002,7 @@
      * @param {SelectBox.Options} options
      */
     constructor(options) {
-      const o = _objectSpread2({}, defaultOptions);
+      const o = _objectSpread2({}, DefaultOptions);
 
       for (let [key, value] of Object.entries(/**@type Object*/options))
       if (value !== undefined)
@@ -10038,6 +10040,7 @@
         labelProp: o.labelProp,
         valueProp: o.valueProp,
         multiItemLabelProp: o.multiItemLabelProp,
+        multiItemRemovePosition: o.multiItemRemovePosition,
 
         maxMultiItems: o.maxMultiItems,
         multiItemsRestLabelProvider: o.multiItemsRestLabelProvider,
@@ -10950,6 +10953,18 @@
     setMultiItemLabelProp(prop) {
       const p = this._p;
       p.multiItemLabelProp = prop;
+      this._scheduleSync('render_items');
+      return this;
+    }
+
+    /**
+     * @param {'before'|'after'|'none'} position
+     * @returns {SelectBox}
+     */
+    setMultiItemRemovePosition(position) {
+      const p = this._p;
+      p.multiItemRemovePosition = position;
+      this._scheduleSync('render_items');
       return this;
     }
 
@@ -12670,22 +12685,29 @@
       if (label === false)
       return null;
 
+      const elRemove = Dom.createElement('span', {
+        class: "".concat(p.baseClassName, "__item_remove"),
+        role: 'presentation'
+      });
+
       const itemEl = Dom.createElement('li',
       {
         class: "".concat(p.baseClassName, "__item"),
         tabindex: '0',
         title: label
-      },
-      [
-      Dom.createElement('span', {
-        class: "".concat(p.baseClassName, "__item_remove"),
-        role: 'presentation'
-      })]
-
+      }
       );
 
+      if (p.multiItemRemovePosition === 'before') {
+        itemEl.appendChild(elRemove);
+      }
+
       this._renderMultiItemContent(item, itemEl);
 
+      if (p.multiItemRemovePosition === 'after') {
+        itemEl.appendChild(elRemove);
+      }
+
       itemEl[ItemSymbol] = item;
 
       return itemEl;