selective-ui 1.2.2 → 1.2.3

package/dist/selective-ui.esm.js

@@ -1,4 +1,4 @@
-/*! Selective UI v1.2.2 | MIT License */
+/*! Selective UI v1.2.3 | MIT License */
 /**
  * @class
  */
@@ -143,11 +143,14 @@ class CallbackScheduler {
      */
     run(key, ...params) {
         const executes = this.executeStored.get(key);
-        if (!executes)
-            return;
-        if (!this.timerRunner.has(key))
+        if (!executes || executes.length === 0) {
+            return Promise.resolve();
+        }
+        if (!this.timerRunner.has(key)) {
             this.timerRunner.set(key, new Map());
+        }
         const runner = this.timerRunner.get(key);
+        const tasks = [];
         for (let i = 0; i < executes.length; i++) {
             const entry = executes[i];
             if (!entry)
@@ -155,20 +158,31 @@ class CallbackScheduler {
             const prev = runner.get(i);
             if (prev)
                 clearTimeout(prev);
-            const timer = setTimeout(() => {
-                entry.callback(params.length > 0 ? params : null);
-                if (entry.once) {
-                    // Preserve index stability by leaving an empty slot.
-                    executes[i] = undefined;
-                    // Cleanup the timer handle for this index.
-                    const current = runner.get(i);
-                    if (current)
-                        clearTimeout(current);
-                    runner.delete(i);
-                }
-            }, entry.timeout);
-            runner.set(i, timer);
+            const task = new Promise((resolve) => {
+                const timer = setTimeout(async () => {
+                    try {
+                        const resp = entry.callback(params.length > 0 ? params : null);
+                        if (resp instanceof Promise) {
+                            await resp;
+                        }
+                    }
+                    catch { }
+                    finally {
+                        if (entry.once) {
+                            executes[i] = undefined;
+                            const current = runner.get(i);
+                            if (current)
+                                clearTimeout(current);
+                            runner.delete(i);
+                        }
+                        resolve();
+                    }
+                }, entry.timeout);
+                runner.set(i, timer);
+            });
+            tasks.push(task);
         }
+        return Promise.all(tasks).then(() => void 0);
     }
     /**
      * Clears callbacks and timers.
@@ -1383,7 +1397,7 @@ class Popup {
             const stats = this.optionAdapter?.getVisibilityStats();
             this.updateEmptyState(stats ?? undefined);
             this.triggerResize();
-        }, 200);
+        }, this.options.animationtime);
     }
     /**
      * Subscribes to adapter visibility and item changes to keep the empty state in sync.
@@ -2099,7 +2113,7 @@ class EffectorImpl {
         if (isPositionChanged) {
             this.element.style.transition = `top ${duration}ms ease-out, height ${duration}ms ease-out, max-height ${duration}ms ease-out;`;
         }
-        setTimeout(() => {
+        requestAnimationFrame(() => {
             const styles = {
                 width: `${width}px`,
                 left: `${left}px`,
@@ -2133,7 +2147,7 @@ class EffectorImpl {
                     delete this.element.style.transition;
                 onComplete?.();
             }
-        }, 20);
+        });
         return this;
     }
     /**
@@ -2561,6 +2575,7 @@ class ModelManager {
         this.privRecyclerViewHandle = null;
         this.lastFingerprint = null;
         this.options = null;
+        this.oldPosition = 0;
         this.options = options;
     }
     /**
@@ -2660,12 +2675,12 @@ class ModelManager {
      *
      * @param {Array<HTMLOptGroupElement|HTMLOptionElement>} modelData - New source elements to rebuild models from.
      */
-    replace(modelData) {
+    async replace(modelData) {
         this.lastFingerprint = null;
         this.createModelResources(modelData);
         if (this.privAdapterHandle) {
             // Adapter expects TModel[], but this manager's list is GroupModel|OptionModel.
-            this.privAdapterHandle.syncFromSource(this.privModelList);
+            await this.privAdapterHandle.syncFromSource(this.privModelList);
         }
         this.refresh(false);
     }
@@ -2769,6 +2784,10 @@ class ModelManager {
             }
         });
         let isUpdate = true;
+        if (this.oldPosition == 0) {
+            isUpdate = false;
+        }
+        this.oldPosition = position;
         oldGroupMap.forEach((removedGroup) => {
             isUpdate = false;
             removedGroup.remove();
@@ -2781,7 +2800,7 @@ class ModelManager {
         if (this.privAdapterHandle) {
             this.privAdapterHandle.updateData(this.privModelList);
         }
-        this.onUpdated();
+        // this.onUpdated();
         this.refresh(isUpdate);
     }
     /**
@@ -2826,14 +2845,14 @@ class ModelManager {
      * enabling observers to react before a change is applied.
      */
     triggerChanging(event_name) {
-        this.privAdapterHandle?.changingProp(event_name);
+        return this.privAdapterHandle?.changingProp(event_name);
     }
     /**
      * Triggers the adapter's post-change pipeline for a named event,
      * notifying observers after a change has been applied.
      */
     triggerChanged(event_name) {
-        this.privAdapterHandle?.changeProp(event_name);
+        return this.privAdapterHandle?.changeProp(event_name);
     }
 }
 
@@ -3005,12 +3024,10 @@ class AccessoryBox {
                                     role: "button",
                                     ariaLabel: `${this.options.textAccessoryDeselect}${modelData.textContent}`,
                                     title: `${this.options.textAccessoryDeselect}${modelData.textContent}`,
-                                    onclick: (evt) => {
+                                    onclick: async (evt) => {
                                         evt.preventDefault();
-                                        this.modelManager?.triggerChanging?.("select");
-                                        setTimeout(() => {
-                                            modelData.selected = false;
-                                        }, 10);
+                                        await this.modelManager?.triggerChanging?.("select");
+                                        modelData.selected = false;
                                     },
                                 },
                             },
@@ -3459,7 +3476,6 @@ class SearchController {
                 select.appendChild(option);
             }
         });
-        select.dispatchEvent(new CustomEvent("options:changed"));
     }
 }
 
@@ -3469,7 +3485,7 @@ class SearchController {
 class SelectObserver {
     /**
      * Initializes the SelectObserver for a given <select> element.
-     * Captures the initial snapshot, sets up a MutationObserver, and listens for custom "options:changed" events.
+     * Captures the initial snapshot, sets up a MutationObserver.
      * Changes are debounced to prevent excessive calls.
      *
      * @param {HTMLSelectElement} select - The <select> element to observe.
@@ -3487,13 +3503,6 @@ class SelectObserver {
                 this.handleChange();
             }, this._DEBOUNCE_DELAY);
         });
-        select.addEventListener("options:changed", () => {
-            if (this.debounceTimer)
-                clearTimeout(this.debounceTimer);
-            this.debounceTimer = setTimeout(() => {
-                this.handleChange();
-            }, this._DEBOUNCE_DELAY);
-        });
     }
     /**
      * Creates a snapshot of the current state of the <select> element's options.
@@ -3679,7 +3688,7 @@ class Adapter {
      * @param {Function} callback - Function to execute before the property changes.
      */
     onPropChanging(propName, callback) {
-        Libs.callbackScheduler.on(`${propName}ing_${this.adapterKey}`, callback, { debounce: 1 });
+        Libs.callbackScheduler.on(`${propName}ing_${this.adapterKey}`, callback, { debounce: 0 });
     }
     /**
      * Registers a post-change callback for a property change pipeline.
@@ -3689,7 +3698,7 @@ class Adapter {
      * @param {Function} callback - Function to execute after the property changes.
      */
     onPropChanged(propName, callback) {
-        Libs.callbackScheduler.on(`${propName}_${this.adapterKey}`, callback);
+        Libs.callbackScheduler.on(`${propName}_${this.adapterKey}`, callback, { debounce: 0 });
     }
     /**
      * Triggers the post-change pipeline for a given property, passing optional parameters
@@ -3699,7 +3708,7 @@ class Adapter {
      * @param {...any} params - Parameters forwarded to the callbacks.
      */
     changeProp(propName, ...params) {
-        Libs.callbackScheduler.run(`${propName}_${this.adapterKey}`, ...params);
+        return Libs.callbackScheduler.run(`${propName}_${this.adapterKey}`, ...params);
     }
     /**
      * Triggers the pre-change pipeline for a given property, passing optional parameters
@@ -3709,7 +3718,7 @@ class Adapter {
      * @param {...any} params - Parameters forwarded to the callbacks.
      */
     changingProp(propName, ...params) {
-        Libs.callbackScheduler.run(`${propName}ing_${this.adapterKey}`, ...params);
+        return Libs.callbackScheduler.run(`${propName}ing_${this.adapterKey}`, ...params);
     }
     /**
      * Creates and returns a viewer instance for the given item within the specified parent container.
@@ -3736,10 +3745,10 @@ class Adapter {
      *
      * @param {TItem[]} items - The new list of items to set.
      */
-    setItems(items) {
-        this.changingProp("items", items);
+    async setItems(items) {
+        await this.changingProp("items", items);
         this.items = items;
-        this.changeProp("items", items);
+        await this.changeProp("items", items);
     }
     /**
      * Synchronizes adapter items from an external source by delegating to setItems().
@@ -3747,8 +3756,8 @@ class Adapter {
      *
      * @param {TItem[]} items - The source list of items to synchronize.
      */
-    syncFromSource(items) {
-        this.setItems(items);
+    async syncFromSource(items) {
+        await this.setItems(items);
     }
     /**
      * Iterates through all items and ensures each has a viewer. For new items, calls viewHolder()
@@ -4343,24 +4352,20 @@ class MixedAdapter extends Adapter {
         }
         optionViewer.view.tags.LabelContent.innerHTML = optionModel.text;
         if (!optionModel.isInit) {
-            optionViewer.view.tags.OptionView.addEventListener("click", (ev) => {
+            optionViewer.view.tags.OptionView.addEventListener("click", async (ev) => {
                 ev.stopPropagation();
                 ev.preventDefault();
                 if (this.isSkipEvent)
                     return;
                 if (this.isMultiple) {
-                    this.changingProp("select");
-                    setTimeout(() => {
-                        optionModel.selected = !optionModel.selected;
-                    }, 5);
+                    await this.changingProp("select");
+                    optionModel.selected = !optionModel.selected;
                 }
                 else if (optionModel.selected !== true) {
-                    this.changingProp("select");
-                    setTimeout(() => {
-                        if (this.selectedItemSingle)
-                            this.selectedItemSingle.selected = false;
-                        optionModel.selected = true;
-                    }, 5);
+                    await this.changingProp("select");
+                    if (this.selectedItemSingle)
+                        this.selectedItemSingle.selected = false;
+                    optionModel.selected = true;
                 }
             });
             optionViewer.view.tags.OptionView.title = optionModel.textContent;
@@ -4392,19 +4397,19 @@ class MixedAdapter extends Adapter {
      *
      * @param {Array<GroupModel|OptionModel>} items - The new collection of items to be displayed.
      */
-    setItems(items) {
-        this.changingProp("items", items);
+    async setItems(items) {
+        await this.changingProp("items", items);
         this.items = items;
         this.buildFlatStructure();
-        this.changeProp("items", items);
+        await this.changeProp("items", items);
     }
     /**
      * Synchronizes the component's items from an external source by delegating to setItems().
      *
      * @param {Array<GroupModel|OptionModel>} items - The new collection of items to sync.
      */
-    syncFromSource(items) {
-        this.setItems(items);
+    async syncFromSource(items) {
+        await this.setItems(items);
     }
     /**
      * Updates the component's data items and rebuilds the internal flat structure
@@ -4895,7 +4900,7 @@ class VirtualRecyclerView extends RecyclerView {
     containerTopInScroll() {
         const a = this.viewElement.getBoundingClientRect();
         const b = this.scrollEl.getBoundingClientRect();
-        return a.top - b.top + this.scrollEl.scrollTop;
+        return Math.max(0, a.top - b.top + this.scrollEl.scrollTop);
     }
     /**
      * Returns sticky header height with 16ms cache to avoid DOM thrashing.
@@ -5144,7 +5149,9 @@ class VirtualRecyclerView extends RecyclerView {
             const targetScroll = this.containerTopInScroll() + anchorTopNew - anchorDelta;
             const maxScroll = Math.max(0, this.scrollEl.scrollHeight - this.scrollEl.clientHeight);
             const clamped = Math.min(Math.max(0, targetScroll), maxScroll);
-            if (Math.abs(this.scrollEl.scrollTop - clamped) > 0.5) {
+            const heightChanged = Math.abs(anchorTopNew - anchorTop) > 1;
+            const scrollDiff = Math.abs(this.scrollEl.scrollTop - clamped);
+            if (heightChanged && scrollDiff > 0.5 && scrollDiff < 100) {
                 this.scrollEl.scrollTop = clamped;
             }
         }
@@ -5418,12 +5425,6 @@ class SelectBox {
                 this.isVisible = Libs.string2Boolean(dataset.visible ?? "1");
             }
         };
-        // Custom event (manual refresh)
-        select.addEventListener("options:changed", () => {
-            optionModelManager.update(Libs.parseSelectToArray(select));
-            this.getAction()?.refreshMask();
-            container.popup?.triggerResize?.();
-        });
         // AJAX setup (if provided)
         if (options.ajax) {
             searchController.setAjax(options.ajax);
@@ -6283,7 +6284,7 @@ const SECLASS = new Selective();
  *
  * Declared as `const` literal type to enable strict typing and easy tree-shaking.
  */
-const version = "1.2.2";
+const version = "1.2.3";
 /**
  * Library name identifier.
  *