@schukai/monster 4.81.0 → 4.83.0

package/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 
 
+## [4.83.0] - 2026-01-07
+
+### Add Features
+
+- Improve spinner handling for data fetching
+
+
+
+## [4.82.0] - 2026-01-07
+
+### Add Features
+
+- Update Select component to handle null values gracefully
+
+
+
 ## [4.81.0] - 2026-01-07
 
 ### Add Features

package/package.json

@@ -1 +1 @@
-{"author":"Volker Schukai","dependencies":{"@floating-ui/dom":"^1.7.4","@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":"4.81.0"}
+{"author":"Volker Schukai","dependencies":{"@floating-ui/dom":"^1.7.4","@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":"4.83.0"}

package/source/components/datatable/status.mjs

@@ -184,14 +184,23 @@ function initEventHandler() {
 		}
 
 		let fadeOutTimer = null;
+		const hideSpinner = () => {
+			self.setOption("state.spinner", "hide");
+		};
 
 		this[datasourceLinkedElementSymbol] = element;
+		hideSpinner();
 		element.addEventListener("monster-datasource-fetched", function () {
 			if (typeof self[errorElementSymbol]?.resetErrorMessage === "function") {
 				self[errorElementSymbol].resetErrorMessage();
 			}
+			if (fadeOutTimer) {
+				clearTimeout(fadeOutTimer);
+				fadeOutTimer = null;
+			}
 			fadeOutTimer = setTimeout(() => {
-				self.setOption("state.spinner", "hide");
+				fadeOutTimer = null;
+				hideSpinner();
 			}, 800);
 		});
 
@@ -214,7 +223,7 @@ function initEventHandler() {
 				fadeOutTimer = null;
 			}
 
-			self.setOption("state.spinner", "hide");
+			hideSpinner();
 
 			const timeout = self.getOption("timeouts.message", 4000);
 			let msg = "Cannot load data";

package/source/components/form/select.mjs

@@ -408,7 +408,7 @@ class Select extends CustomControl {
 	 * e.value=1
 	 * ```
 	 *
-	 * @property {string|array} value
+	 * @property {string|array|null} value
 	 * @throws {Error} unsupported type
 	 * @fires monster-selected this event is fired when the selection is set
 	 */
@@ -3140,6 +3140,8 @@ function checkOptionState() {
 function convertValueToSelection(value) {
 	const selection = [];
 
+	value = isValueIsEmptyThenGetNormalize.call(this, value);
+
 	if (isString(value)) {
 		value = value
 			.split(",")

package/test/cases/components/form/select.mjs

@@ -281,6 +281,34 @@ describe('Select', function () {
             }, 350);
         });
 
+        it('should treat null value as empty selection', function (done) {
+            this.timeout(2000);
+
+            let mocks = document.getElementById('mocks');
+            const select = document.createElement('monster-select');
+            select.setOption('options', [{label: 'One', value: '1'}]);
+            mocks.appendChild(select);
+
+            setTimeout(() => {
+                select.value = null;
+
+                setTimeout(() => {
+                    try {
+                        const selection = select.getOption('selection');
+                        const error = select.getAttribute('data-monster-error') ?? '';
+                        expect(Array.isArray(selection)).to.equal(true);
+                        expect(selection.length).to.equal(0);
+                        expect(select.value).to.equal('');
+                        expect(error).to.not.contain('unsupported type');
+                    } catch (e) {
+                        return done(e);
+                    }
+
+                    done();
+                }, 50);
+            }, 50);
+        });
+
     });