@schukai/monster 4.100.1 → 4.101.0

package/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 
 
+## [4.101.0] - 2026-01-17
+
+### Add Features
+
+- Add control overflow property to Panel component
+
+
+
 ## [4.100.1] - 2026-01-16
 
 ### 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.100.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.101.0"}

package/source/components/layout/panel.mjs

@@ -72,6 +72,7 @@ class Panel extends CustomElement {
 	 * @property {Object} templates Template definitions
 	 * @property {string} templates.main Main template
 	 * @property {string} heightAdjustment Height adjustment
+	 * @property {string} controlOverflow Overflow value applied to the control element
 	 */
 	get defaults() {
 		return Object.assign({}, super.defaults, {
@@ -79,6 +80,7 @@ class Panel extends CustomElement {
 				main: getTemplate(),
 			},
 			heightAdjustment: 4,
+			controlOverflow: "auto",
 		});
 	}
 
@@ -91,6 +93,7 @@ class Panel extends CustomElement {
 
 		initControlReferences.call(this);
 		initEventHandler.call(this);
+		applyControlOverflow.call(this);
 
 		calcHeight.call(this);
 	}
@@ -272,6 +275,24 @@ function initEventHandler() {
 	return this;
 }
 
+/**
+ * @private
+ */
+function applyControlOverflow() {
+	const control = this[PanelElementSymbol];
+	if (!(control instanceof HTMLElement)) {
+		return;
+	}
+
+	const overflow = this.getOption("controlOverflow");
+	if (overflow === null || overflow === undefined || overflow === "") {
+		control.style.removeProperty("overflow");
+		return;
+	}
+
+	control.style.overflow = overflow;
+}
+
 /**
  * @private
  * @return {string}