@danielgindi/selectbox 1.0.73 → 1.0.74

package/dist/lib.es6.js

@@ -1,5 +1,5 @@
 /*!
- * @danielgindi/selectbox 1.0.73
+ * @danielgindi/selectbox 1.0.74
  * git://github.com/danielgindi/selectbox.git
  */
 import { createElement, closestUntil, setElementAttrs, next, prev } from '@danielgindi/dom-utils/lib/Dom';
@@ -2585,7 +2585,7 @@ class SelectBox {
             this.setValue(o.value);
         }
 
-        this._scheduleSync();
+        this._scheduleSync('full');
 
         this.silenceEvents = false;
 
@@ -2790,7 +2790,7 @@ class SelectBox {
             return this;
 
         this._p.clearable = !!clearable;
-        this._scheduleSync();
+        this._scheduleSync('render_clear');
         return this;
     }
 
@@ -2812,7 +2812,7 @@ class SelectBox {
             return this;
 
         this._p.hasOpenIndicator = enabled;
-        this._scheduleSync();
+        this._scheduleSync('render_base');
         return this;
     }
 
@@ -2829,7 +2829,7 @@ class SelectBox {
      */
     setPlaceholder(placeholder) {
         this._p.placeholder = placeholder == null ? '' : String(placeholder);
-        this._scheduleSync();
+        this._scheduleSync('render_base');
         return this;
     }
 
@@ -2897,7 +2897,7 @@ class SelectBox {
             return this;
 
         p.sortSelectedItems = sortSelectedItems;
-        this._scheduleSync('full');
+        this._scheduleSync('render_items');
         return this;
     }
 
@@ -2921,7 +2921,7 @@ class SelectBox {
         p.sortListItems = sortListItems;
         p.filteredItems = null;
         p.itemsChanged = true;
-        this._scheduleSync();
+        this._scheduleSync('render_list');
         return this;
     }
 
@@ -2944,7 +2944,7 @@ class SelectBox {
 
         p.sortCheckedFirst = sortListCheckedFirst;
         p.itemsChanged = true;
-        this._scheduleSync();
+        this._scheduleSync('render_list');
         return this;
     }
 
@@ -2964,7 +2964,7 @@ class SelectBox {
 
         p.stickyValues = Array.isArray(values) ? new Set(values) : null;
         p.itemsChanged = true;
-        this._scheduleSync();
+        this._scheduleSync('render_list');
         return this;
     }
 
@@ -2986,7 +2986,7 @@ class SelectBox {
 
         p.sortItemComparator = comparator;
         p.itemsChanged = true;
-        this._scheduleSync();
+        this._scheduleSync('render_list');
         return this;
     }
 
@@ -3009,7 +3009,7 @@ class SelectBox {
 
         p.treatGroupSelectionAsItems = treatGroupSelectionAsItems;
         p.itemsChanged = true;
-        this._scheduleSync();
+        this._scheduleSync('render_list');
         return this;
     }
 
@@ -3032,7 +3032,7 @@ class SelectBox {
 
         p.splitListCheckedGroups = splitListCheckedGroups;
         p.itemsChanged = true;
-        this._scheduleSync();
+        this._scheduleSync('render_list');
         return this;
     }
 
@@ -3054,7 +3054,7 @@ class SelectBox {
             return this;
 
         p.showSelection = showSelection;
-        this._scheduleSync('full');
+        this._scheduleSync('render_items');
         return this;
     }
 
@@ -3076,7 +3076,7 @@ class SelectBox {
             return this;
 
         p.showPlaceholderInTooltip = showPlaceholderInTooltip;
-        this._scheduleSync('full');
+        this._scheduleSync('render_base');
         return this;
     }
 
@@ -3098,7 +3098,7 @@ class SelectBox {
             return this;
 
         p.multiPlaceholderFormatter = formatter;
-        this._scheduleSync('full');
+        this._scheduleSync('render_base');
         return this;
     }
 
@@ -3181,7 +3181,7 @@ class SelectBox {
      */
     setNoResultsText(noResultsText) {
         this._p.noResultsText = noResultsText;
-        this._scheduleSync('full');
+        this._scheduleSync('render_list');
         return this;
     }
 
@@ -4000,7 +4000,7 @@ class SelectBox {
 
                         if (!p.multi) {
                             this._setInputText('');
-                            this._scheduleSync();
+                            this._scheduleSync('render_base');
                         }
 
                         this._trigger('close');
@@ -4062,7 +4062,7 @@ class SelectBox {
                                     }
 
                                     if (!hasGroupSync)
-                                        this._scheduleSync();
+                                        this._scheduleSync('render_base');
                                 }
                             } else {
                                 if (p.maxMultiItems != null &&
@@ -4073,7 +4073,7 @@ class SelectBox {
                                 }
 
                                 if (!hasGroupSync)
-                                    this._scheduleSync();
+                                    this._scheduleSync('render_base');
                             }
                         }
 
@@ -4085,7 +4085,7 @@ class SelectBox {
                         if (!p.multi) return;
 
                         if (event.affectedItems) {
-                            this._scheduleSync(p.sortSelectedItems ? 'full' : null);
+                            this._scheduleSync(p.sortSelectedItems ? 'full' : 'render_base');
                         }
                     }
                         break;
@@ -4611,10 +4611,11 @@ class SelectBox {
         if (!p.syncQueue)
             p.syncQueue = [];
 
-        if (mode === 'full')
+        if (mode === 'full' || ('render_items' === mode && !p.syncQueue.some(x => x.mode === 'full')))
             p.syncQueue.length = 0;
 
-        if (p.syncQueue.length === 0 || p.syncQueue[0].mode !== 'full')
+        if (p.syncQueue.length === 0 ||
+            (!['full', 'render_items'].includes(mode)))
             p.syncQueue.push({ mode: mode, data: data });
 
         if (p.syncTimeout)
@@ -4638,7 +4639,24 @@ class SelectBox {
         for (let op of queue) {
             switch (op.mode) {
                 case 'full':
-                    this._syncFull(true);
+                    this._syncFull(true, true);
+                    break;
+
+                case 'render_base':
+                    this._syncFull(false, false);
+                    break;
+
+                case 'render_items':
+                    this._syncFull(true, false);
+                    break;
+
+                case 'render_list':
+                    this._syncFull(false, true);
+                    break;
+
+                case 'render_clear':
+                    this._syncClearButton();
+                    this._resizeInput();
                     break;
 
                 case 'singleItem':
@@ -4695,10 +4713,6 @@ class SelectBox {
                     this._resizeInput();
                 }
                     break;
-
-                default:
-                    this._syncFull(false);
-                    break;
             }
         }
     }
@@ -4908,9 +4922,10 @@ class SelectBox {
     /**
      * Syncs render state, selected items, and position
      * @param {boolean=false} fullItemsRender Should re-render all items?
+     * @param {boolean=false} updateListItems Should call updateListItems?
      * @returns {SelectBox}
      */
-    _syncFull(fullItemsRender) {
+    _syncFull(fullItemsRender, updateListItems) {
         const p = this._p,
             multiItemLabelProp = p.multiItemLabelProp;
 
@@ -5003,8 +5018,9 @@ class SelectBox {
         // Update input size
         this._resizeInput();
 
-        // Update list items
-        this._updateListItems();
+        if (updateListItems) {
+            this._updateListItems();
+        }
 
         return this;
     }
@@ -5095,6 +5111,7 @@ class SelectBox {
                 }
 
                 if (itemsToRemove.length > 0) {
+                    // remove the "rest" element, we'll add that back later if necessary
                     this._removeMultiItemElementByIndex(p.multiItemEls.length - 1);
 
                     for (let item of itemsToRemove) {
@@ -5111,12 +5128,13 @@ class SelectBox {
                     }
                 }
 
+                // we have not removed the whole "rest", then add the "rest" element back
                 if (items.length > itemsToRemove.length) {
                     this._addMultiItemRestElement();
                 }
 
                 if (itemsToRemove.length > 0) {
-                    this._scheduleSync();
+                    this._scheduleSync('render_list');
                 }
             } else {
                 let removeselEvt = { value: value, item: item, cancel: false };
@@ -5184,7 +5202,7 @@ class SelectBox {
         }
 
         // sync
-        this._scheduleSync();
+        this._scheduleSync('render_list');
     }
 
     /**