@schukai/monster 4.74.2 → 4.75.0

package/CHANGELOG.md

@@ -2,6 +2,23 @@
 
 
 
+## [4.75.0] - 2026-01-04
+
+### Add Features
+
+- Add demo for tracking click events with enhanced datasource behavior
+
+
+
+## [4.74.3] - 2026-01-03
+
+### Bug Fixes
+
+- filter quotes
+- export filter
+
+
+
 ## [4.74.2] - 2026-01-03
 
 ### Bug Fixes

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.74.2"}
+{"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.75.0"}

package/source/components/datatable/dataset.mjs

@@ -13,6 +13,7 @@
  */
 
 import { instanceSymbol } from "../../constants.mjs";
+import { diff } from "../../data/diff.mjs";
 import { Pathfinder } from "../../data/pathfinder.mjs";
 import {
 	assembleMethodSymbol,
@@ -121,6 +122,8 @@ class DataSet extends CustomElement {
 				 * @type {boolean}
 				 */
 				refreshOnMutation: true,
+				// Feature flag: default-on no-op write suppression, can be rolled back.
+				skipNoopWrite: true,
 			},
 
 			/**
@@ -201,6 +204,22 @@ class DataSet extends CustomElement {
 					pathWithIndex = String(index);
 				}
 
+				if (this.getOption("features.skipNoopWrite") === true) {
+					const currentData = this[datasourceLinkedElementSymbol]?.data;
+					let currentValue;
+					if (currentData) {
+						try {
+							currentValue = new Pathfinder(currentData).getVia(pathWithIndex);
+						} catch (e) {
+							currentValue = undefined;
+						}
+					}
+					if (diff(currentValue, internalData).length === 0) {
+						resolve();
+						return;
+					}
+				}
+
 				if (this.getOption("logLevel") === "debug") {
 					console.log("monster-dataset: write", {
 						path: pathWithIndex,

package/source/components/datatable/datasource.mjs

@@ -16,6 +16,7 @@ import {
 	CustomElement,
 	assembleMethodSymbol,
 } from "../../dom/customelement.mjs";
+import { diff } from "../../data/diff.mjs";
 import { Datasource as DatasourceBase } from "../../data/datasource.mjs";
 import { instanceSymbol } from "../../constants.mjs";
 
@@ -70,6 +71,10 @@ class Datasource extends CustomElement {
 	get defaults() {
 		return Object.assign({}, super.defaults, {
 			logLevel: "error",
+			features: {
+				// Feature flag: default-on no-op event suppression, can be rolled back.
+				skipNoopEvents: true,
+			},
 		});
 	}
 
@@ -98,6 +103,12 @@ class Datasource extends CustomElement {
 				data: data,
 			});
 		}
+		if (this.getOption("features.skipNoopEvents") === true) {
+			const current = this[dataSourceSymbol].get();
+			if (diff(current, data).length === 0) {
+				return;
+			}
+		}
 		this[dataSourceSymbol].set(data);
 	}
 

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

@@ -17,6 +17,8 @@ import { getSummaryTemplate, Select } from "../../form/select.mjs";
 import { FilterControlsDefaultsStyleSheet } from "../stylesheet/filter-controls-defaults.mjs";
 import { FilterSelectStyleSheet } from "../stylesheet/filter-select.mjs";
 
+export { FilterSelect, getSummaryTemplate };
+
 /**
  * This is a filter select for the datatable filter.
  *
@@ -36,37 +38,37 @@ import { FilterSelectStyleSheet } from "../stylesheet/filter-select.mjs";
 
  */
 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/components/datatable/filter.mjs

@@ -719,7 +719,7 @@ function initFilter() {
 				const v = valuesFromHash[element.id];
 				const searchInput = element.firstElementChild;
 				try {
-					searchInput.value = v;
+					searchInput.value = normalizeFilterValue(v);
 				} catch (error) {}
 			}
 
@@ -738,6 +738,30 @@ function initFilter() {
 	updateFilterSelections.call(this);
 }
 
+/**
+ * @private
+ * @param {*} value
+ * @return {*}
+ */
+function normalizeFilterValue(value) {
+	if (!isString(value)) {
+		return value;
+	}
+
+	const trimmed = value.trim();
+	if (trimmed.length < 2) {
+		return value;
+	}
+
+	const first = trimmed[0];
+	const last = trimmed[trimmed.length - 1];
+	if ((first === '"' && last === '"') || (first === "'" && last === "'")) {
+		return trimmed.slice(1, -1);
+	}
+
+	return value;
+}
+
 /**
  * @private
  * @param {string} input

package/source/data/datasource.mjs

@@ -19,6 +19,7 @@ import { parseDataURL } from "../types/dataurl.mjs";
 import { isString } from "../types/is.mjs";
 import { ProxyObserver } from "../types/proxyobserver.mjs";
 import { validateObject } from "../types/validate.mjs";
+import { diff } from "./diff.mjs";
 import { extend } from "./extend.mjs";
 import { Pathfinder } from "./pathfinder.mjs";
 
@@ -109,7 +110,12 @@ class Datasource extends Base {
 	 * ```
 	 */
 	get defaults() {
-		return {};
+		return {
+			features: {
+				// Feature flag: default-on no-op event suppression, can be rolled back.
+				skipNoopEvents: true,
+			},
+		};
 	}
 
 	/**
@@ -195,6 +201,12 @@ class Datasource extends Base {
 	 * @return {Datasource}
 	 */
 	set(data) {
+		if (this.getOption("features.skipNoopEvents") === true) {
+			const current = this[internalDataSymbol].getRealSubject();
+			if (diff(current, data).length === 0) {
+				return this;
+			}
+		}
 		this[internalDataSymbol].setSubject(data);
 		return this;
 	}