@schukai/monster 4.76.0 → 4.77.1

package/CHANGELOG.md

@@ -2,6 +2,25 @@
 
 
 
+## [4.77.1] - 2026-01-05
+
+### Bug Fixes
+
+- timeing  issue
+
+
+
+## [4.77.0] - 2026-01-05
+
+### Add Features
+
+- Add documentation and enhance waitForCustomElement function
+### Changes
+
+- update project
+
+
+
 ## [4.76.0] - 2026-01-05
 
 ### 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.76.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.77.1"}

package/source/components/datatable/filter/select.mjs

@@ -38,37 +38,37 @@ export { FilterSelect, getSummaryTemplate };
 
  */
 class FilterSelect extends Select {
-  /**
-   * To set the options via the HTML tag, the attribute `data-monster-options` must be used.
-   * @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
-   *
-   * The individual configuration values can be found in the table.
-   */
-  get defaults() {
-    return Object.assign({}, super.defaults, {
-      type: "checkbox",
-    });
-  }
+	/**
+	 * To set the options via the HTML tag, the attribute `data-monster-options` must be used.
+	 * @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
+	 *
+	 * The individual configuration values can be found in the table.
+	 */
+	get defaults() {
+		return Object.assign({}, super.defaults, {
+			type: "checkbox",
+		});
+	}
 
-  /**
-   *
-   * @return {string}
-   */
-  static getTag() {
-    return "monster-filter-select";
-  }
+	/**
+	 *
+	 * @return {string}
+	 */
+	static getTag() {
+		return "monster-filter-select";
+	}
 
-  /**
-   * @return {CSSStyleSheet[]}
-   */
-  static getCSSStyleSheet() {
-    const styleSheet = super.getCSSStyleSheet();
-    return [
-      ...styleSheet,
-      FilterControlsDefaultsStyleSheet,
-      FilterSelectStyleSheet,
-    ];
-  }
+	/**
+	 * @return {CSSStyleSheet[]}
+	 */
+	static getCSSStyleSheet() {
+		const styleSheet = super.getCSSStyleSheet();
+		return [
+			...styleSheet,
+			FilterControlsDefaultsStyleSheet,
+			FilterSelectStyleSheet,
+		];
+	}
 }
 
 registerCustomElement(FilterSelect);

package/source/dom/util.mjs

@@ -338,7 +338,7 @@ function getRegisteredCustomElements() {
  */
 function waitForCustomElement(
 	element,
-	{ method = null, tagName = null, timeout = 2000 } = {},
+	{ method = null, tagName = null, timeout = 2000, readyCheck = null } = {},
 ) {
 	if (!(element instanceof HTMLElement)) {
 		return Promise.reject(
@@ -367,8 +367,18 @@ function waitForCustomElement(
 				}
 
 				const start = Date.now();
+				const isReady = () => {
+					if (method && typeof element[method] !== "function") {
+						return false;
+					}
+					if (typeof readyCheck === "function") {
+						return readyCheck(element) === true;
+					}
+					return true;
+				};
+
 				const check = () => {
-					if (!method || typeof element[method] === "function") {
+					if (isReady()) {
 						resolve(element);
 						return;
 					}
@@ -379,17 +389,15 @@ function waitForCustomElement(
 						Date.now() - start > timeout
 					) {
 						reject(
-							new Error(
-								`Timed out waiting for "${method}" on <${name}>.`,
-							),
+							new Error(`Timed out waiting for "${method}" on <${name}>.`),
 						);
 						return;
 					}
 
-					window.requestAnimationFrame(check);
+					window.setTimeout(check, 0);
 				};
 
-				window.requestAnimationFrame(check);
+				window.setTimeout(check, 0);
 			}),
 	);
 }

package/source/monster.mjs

@@ -101,6 +101,7 @@ export * from "./components/datatable/filter/date-presets.mjs";
 export * from "./components/datatable/filter/date.mjs";
 export * from "./components/datatable/filter/date-range.mjs";
 export * from "./components/datatable/filter/abstract-base.mjs";
+export * from "./components/datatable/filter/select.mjs";
 export * from "./components/datatable/filter/settings.mjs";
 export * from "./components/datatable/filter/date-time.mjs";
 export * from "./components/datatable/filter/range.mjs";

package/source/types/version.mjs

@@ -156,7 +156,7 @@ function getMonsterVersion() {
 	}
 
 	/** don't touch, replaced by make with package.json version */
-	monsterVersion = new Version("4.70.1");
+	monsterVersion = new Version("4.76.0");
 
 	return monsterVersion;
 }

package/test/cases/dom/util.mjs

@@ -135,6 +135,30 @@ describe('DOM', function () {
             expect(ready).to.equal(element);
             expect(ready.ping()).to.equal('pong');
         });
+
+        it('should wait for a readyCheck condition', async () => {
+            const tagName = `test-ready-${Date.now()}`;
+            const element = document.createElement(tagName);
+            document.body.appendChild(element);
+
+            const promise = waitForCustomElement(element, {
+                readyCheck: (el) => el.hasAttribute('data-ready'),
+            });
+
+            class TestReady extends HTMLElement {
+                connectedCallback() {
+                    setTimeout(() => {
+                        this.setAttribute('data-ready', 'true');
+                    }, 0);
+                }
+            }
+
+            customElements.define(tagName, TestReady);
+
+            const ready = await promise;
+            expect(ready).to.equal(element);
+            expect(ready.getAttribute('data-ready')).to.equal('true');
+        });
     });
     
 });    

package/test/cases/monster.mjs

@@ -7,7 +7,7 @@ describe('Monster', function () {
         let monsterVersion
 
         /** don´t touch, replaced by make with package.json version */
-        monsterVersion = new Version("4.70.1")
+        monsterVersion = new Version("4.76.0")
 
         let m = getMonsterVersion();
 

package/test/web/test.html

@@ -9,8 +9,8 @@
 </head>
 <body>
 <div id="headline" style="display: flex;align-items: center;justify-content: center;flex-direction: column;">
-  <h1 style='margin-bottom: 0.1em;'>Monster 4.70.1</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update Sa 3. Jan 13:33:23 CET 2026</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 4.76.0</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update Mo 5. Jan 16:52:49 CET 2026</div>
 </div>
 <div id="mocha-errors"
      style="color: red;font-weight: bold;display: flex;align-items: center;justify-content: center;flex-direction: column;margin:20px;"></div>