@schukai/monster 3.105.0 → 3.105.2

package/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 
 
+## [3.105.2] - 2025-02-06
+
+### Bug Fixes
+
+- **select:** prevent lookup race condition
+
+
+
+## [3.105.1] - 2025-02-06
+
+### Bug Fixes
+
+- **select:** lookup after setSelection
+
+
+
 ## [3.105.0] - 2025-02-05
 
 ### Add Features

package/package.json

@@ -1 +1 @@
-{"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.6.13","@popperjs/core":"^2.11.8"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"type":"module","version":"3.105.0"}
+{"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.6.13","@popperjs/core":"^2.11.8"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"type":"module","version":"3.105.2"}

package/source/components/form/button.mjs

@@ -314,7 +314,7 @@ function getTemplate() {
             <button data-monster-attributes="disabled path:disabled | if:true, 
                                              class path:classes.button,
                                              aria-role path:aria.role,
-                                              path:aria.label | if:true,
+                                             path:aria.label | if:true,
                                              type path:type"
                     data-monster-role="button"
                     part="button"

package/source/components/form/select.mjs

@@ -221,6 +221,12 @@ const areOptionsAvailableAndInitSymbol = Symbol("@@areOptionsAvailableAndInit");
  */
 const disabledRequestMarker = Symbol("@@disabledRequestMarker");
 
+/**
+ * @private
+ * @type {symbol}
+ */
+const runLookupOnceSymbol = Symbol("runLookupOnce");
+
 /**
  * @private
  * @type {number}
@@ -560,7 +566,7 @@ class Select extends CustomControl {
             );
 
             areOptionsAvailableAndInit.call(self);
-        },0);
+        }, 0);
 
         return this;
     }
@@ -1120,14 +1126,14 @@ function attachResizeObserver() {
     });
 
 
-        let parent = this.parentNode;
-        while (!(parent instanceof HTMLElement) && parent !== null) {
-            parent = parent.parentNode;
-        }
+    let parent = this.parentNode;
+    while (!(parent instanceof HTMLElement) && parent !== null) {
+        parent = parent.parentNode;
+    }
 
-        if (parent instanceof HTMLElement) {
-            this[resizeObserverSymbol].observe(parent);
-        }
+    if (parent instanceof HTMLElement) {
+        this[resizeObserverSymbol].observe(parent);
+    }
 
 }
 
@@ -1352,13 +1358,13 @@ function initOptionObserver() {
                     self.updateI18n();
                 } catch (e) {
                     addErrorAttribute(self, e);
-                        setStatusOrRemoveBadges.call(self, "error");
+                    setStatusOrRemoveBadges.call(self, "error");
                 }
                 try {
                     areOptionsAvailableAndInit.call(self);
                 } catch (e) {
                     addErrorAttribute(self, e);
-                        setStatusOrRemoveBadges.call(self, "error");
+                    setStatusOrRemoveBadges.call(self, "error");
                 }
 
                 setSummaryAndControlText.call(self);
@@ -2246,8 +2252,8 @@ function isValueIsEmpty(value) {
     let equivalents = this.getOption("empty.equivalents");
     if (!isArray(equivalents)) {
         if (equivalents === undefined) {
-        return false;
-       }
+            return false;
+        }
         equivalents = [equivalents];
     }
 
@@ -2262,13 +2268,13 @@ function isValueIsEmpty(value) {
  */
 function isValueIsEmptyThenGetNormalize(value) {
     let emptyDefault = null
-    if (this.getOption("type")==="checkbox") {
+    if (this.getOption("type") === "checkbox") {
         emptyDefault = this.getOption("empty.defaultValueCheckbox");
     } else {
         emptyDefault = this.getOption("empty.defaultValueRadio");
     }
 
-    if (isValueIsEmpty.call(this,value)) {
+    if (isValueIsEmpty.call(this, value)) {
         return emptyDefault;
     }
 
@@ -2282,19 +2288,20 @@ function isValueIsEmptyThenGetNormalize(value) {
  * @returns {Promise<unknown | void>}
  */
 function setSelection(selection) {
+    const self = this;
 
     if (isString(selection) || isInteger(selection)) {
         const result = convertValueToSelection.call(this, selection);
         selection = result?.selection;
     }
 
-    selection = isValueIsEmptyThenGetNormalize.call(this,selection);
+    selection = isValueIsEmptyThenGetNormalize.call(this, selection);
     validateArray(selection);
 
     let resultSelection = [];
     for (let i = 0; i < selection.length; i++) {
 
-        if(isValueIsEmpty.call(this,selection[i].value)) {
+        if (isValueIsEmpty.call(this, selection[i].value)) {
             continue
         }
 
@@ -2328,6 +2335,18 @@ function setSelection(selection) {
 
     fireEvent(this, "change"); // https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/291
 
+    if(this[runLookupOnceSymbol] !== true && selection.length > 0) {
+
+        this[runLookupOnceSymbol] = true
+
+        const lazyLoadFlag =
+            this.getOption("features.lazyLoad") && this[lazyLoadDoneSymbol] !== true;
+        let remoteFilterFlag = getFilterMode.call(this) === FILTER_MODE_REMOTE;
+        if (lazyLoadFlag || remoteFilterFlag) {
+            lookupSelection.call(self);
+        }
+    }
+
     return new Processing(() => {
         const CLASSNAME = "selected";
 
@@ -2854,12 +2873,12 @@ function getTemplate() {
                            data-monster-attributes="
             type path:type,
             role path:role,
-            value path:options | index:value, 
+            value path:options.value, 
             name path:name, 
             part path:type | prefix:option- | suffix: form,
             class path:options.class 
             " tabindex="-1">
-                    <div data-monster-replace="path:options | index:label"
+                    <div data-monster-replace="path:options.label"
                          part="option-label"></div>
                 </label>
             </div>