@schukai/monster 4.25.3 → 4.25.4

package/CHANGELOG.md

@@ -2,6 +2,18 @@
 
 
 
+## [4.25.4] - 2025-07-03
+
+### Bug Fixes
+
+- Refactor image handling in MessageContent for better readability [#328](https://gitlab.schukai.com/oss/libraries/javascript/monster/issues/328)
+### Changes
+
+- update webtests
+- close issue [#328](https://gitlab.schukai.com/oss/libraries/javascript/monster/issues/328)
+
+
+
 ## [4.25.3] - 2025-07-01
 
 ### Bug Fixes

package/package.json

@@ -1 +1 @@
-{"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.7.1","@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.25.3"}
+{"author":"schukai GmbH","dependencies":{"@floating-ui/dom":"^1.7.1","@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.25.4"}

package/source/components/content/viewer/message.mjs

@@ -26,6 +26,9 @@ import { isArray, isObject } from "../../../types/is.mjs";
 import { findTargetElementFromEvent } from "../../../dom/events.mjs";
 import { getLocaleOfDocument } from "../../../dom/locale.mjs";
 
+import "./html.mjs";
+import "../../layout/tabs.mjs";
+
 export { MessageContent };
 
 /**
@@ -258,6 +261,7 @@ class MessageContent extends CustomElement {
 							(part.filename
 								? part.filename.split(".").slice(0, -1).join(".")
 								: null);
+
 						if (cid) {
 							embeddedImages[cid] = part;
 						} else {
@@ -282,6 +286,7 @@ class MessageContent extends CustomElement {
 		}
 
 		for (const cid in embeddedImages) {
+
 			const imagePart = embeddedImages[cid];
 			if (imagePart.content && imagePart.contentType) {
 				try {
@@ -314,14 +319,11 @@ class MessageContent extends CustomElement {
 					const objectUrl = URL.createObjectURL(blob);
 					this[embeddedImageUrlsSymbol].push(objectUrl); // Speichern zur späteren Widerrufung
 
-					// Den CID für die RegExp escapen, um Sonderzeichen zu behandeln
-					const escapedCid = cleanCid.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-					const cidRegex = new RegExp(
-						`src=["']cid:[^"']*?${escapedCid}[^"']*?["']`,
-						"gi",
+     				const imgRegex = /(<img\b(?:(?!src\s*=)[^>])*?)(?:\s+src\s*=\s*(["'])(?:\s*cid:[^'"]*|\s*)\2)?([^>]*>)/gi;
+					htmlContent = htmlContent.replace(
+						imgRegex,
+						`$1 src="${objectUrl}"$3`
 					);
-
-					htmlContent = htmlContent.replace(cidRegex, `src="${objectUrl}"`);
 				} catch (e) {
 					console.error(
 						`Error processing embedded image with CID '${cid}':`,

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.25.0");
+	monsterVersion = new Version("4.25.3");
 
 	return monsterVersion;
 }

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.25.0")
+        monsterVersion = new Version("4.25.3")
 
         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.25.0</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update Mo 30. Jun 16:45:37 CEST 2025</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 4.25.3</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update Do 3. Jul 13:10:44 CEST 2025</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>