@schukai/monster 4.91.0 → 4.92.0

package/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 
 
+## [4.92.0] - 2026-01-12
+
+### Add Features
+
+- Improve data resolution in form handling [#372](https://gitlab.schukai.com/oss/libraries/javascript/monster/issues/372)
+
+
+
+## [4.91.1] - 2026-01-12
+
+### Bug Fixes
+
+- update colums
+
+
+
 ## [4.91.0] - 2026-01-12
 
 ### 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.91.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.92.0"}

package/source/components/form/repeat-field-set.mjs

@@ -28,6 +28,7 @@ import {
 import { fireCustomEvent } from "../../dom/events.mjs";
 import { addErrorAttribute } from "../../dom/error.mjs";
 import { getDocumentTheme } from "../../dom/theme.mjs";
+import { getLocaleOfDocument } from "../../dom/locale.mjs";
 import { Pathfinder } from "../../data/pathfinder.mjs";
 import { datasourceLinkedElementSymbol } from "../datatable/util.mjs";
 import { Observer } from "../../types/observer.mjs";
@@ -126,12 +127,9 @@ class RepeatFieldSet extends CustomControl {
 			templates: {
 				main: getTemplate(),
 			},
-			labels: {
-				add: "Add",
-				remove: "Remove",
-			},
+			labels: getTranslations(),
 			classes: {
-				content: "collapse-alignment",
+				content: "collapse-alignment-no-padding",
 			},
 			features: {
 				multipleColumns: true,
@@ -185,6 +183,56 @@ class RepeatFieldSet extends CustomControl {
 	}
 }
 
+/**
+ * @private
+ * @returns {object}
+ */
+function getTranslations() {
+	const locale = getLocaleOfDocument();
+	switch (locale.language) {
+		case "de":
+			return { add: "Hinzufügen", remove: "Entfernen" };
+		case "fr":
+			return { add: "Ajouter", remove: "Supprimer" };
+		case "es":
+			return { add: "Agregar", remove: "Eliminar" };
+		case "zh":
+			return { add: "添加", remove: "删除" };
+		case "hi":
+			return { add: "जोड़ें", remove: "हटाएं" };
+		case "bn":
+			return { add: "যোগ করুন", remove: "মুছে ফেলুন" };
+		case "pt":
+			return { add: "Adicionar", remove: "Remover" };
+		case "ru":
+			return { add: "Добавить", remove: "Удалить" };
+		case "ja":
+			return { add: "追加", remove: "削除" };
+		case "pa":
+			return { add: "ਸ਼ਾਮਲ ਕਰੋ", remove: "ਹਟਾਓ" };
+		case "mr":
+			return { add: "जोडा", remove: "काढा" };
+		case "it":
+			return { add: "Aggiungi", remove: "Rimuovi" };
+		case "nl":
+			return { add: "Toevoegen", remove: "Verwijderen" };
+		case "sv":
+			return { add: "Lägg till", remove: "Ta bort" };
+		case "pl":
+			return { add: "Dodaj", remove: "Usuń" };
+		case "da":
+			return { add: "Tilføj", remove: "Fjern" };
+		case "fi":
+			return { add: "Lisää", remove: "Poista" };
+		case "no":
+			return { add: "Legg til", remove: "Fjern" };
+		case "cs":
+			return { add: "Přidat", remove: "Odebrat" };
+		default:
+			return { add: "Add", remove: "Remove" };
+	}
+}
+
 /**
  * @private
  */
@@ -221,8 +269,8 @@ function ensureItemsContainer() {
  * @return {HTMLStyleElement}
  */
 function ensureItemsStyleSheet() {
-	const root = this.ownerDocument || document;
-	if (!("adoptedStyleSheets" in root)) {
+	const root = this.getRootNode?.() || this.ownerDocument || document;
+	if (!root || !("adoptedStyleSheets" in root)) {
 		return;
 	}
 	const sheets = root.adoptedStyleSheets || [];
@@ -462,7 +510,6 @@ function syncInsertDefinition() {
 	if (this.getAttribute(ATTRIBUTE_UPDATER_INSERT)) {
 		this.removeAttribute(ATTRIBUTE_UPDATER_INSERT);
 	}
-
 }
 
 /**
@@ -844,7 +891,10 @@ function persistItems(items, options = {}) {
 		if (syncDatasource) {
 			const datasourceContext = getDatasourceContext.call(this);
 			const datasourceData = datasourceContext?.target?.data;
-			if (datasourceContext && (isObject(datasourceData) || isArray(datasourceData))) {
+			if (
+				datasourceContext &&
+				(isObject(datasourceData) || isArray(datasourceData))
+			) {
 				const nextData = clone(datasourceData);
 				try {
 					new Pathfinder(nextData).setVia(datasourceContext.path, items);
@@ -878,7 +928,6 @@ function persistItems(items, options = {}) {
 			path: context.path,
 		},
 	});
-
 }
 
 /**
@@ -985,7 +1034,6 @@ function syncOptionData() {
 			}
 		}
 	}
-
 }
 
 /**
@@ -995,34 +1043,32 @@ function syncOptionData() {
  * @return {object}
  */
 function resolveFormRecord(form, datasource) {
-	let data = datasource?.data;
+	const { data, dataPath } = resolveDatasourceBasePath(form, datasource);
 	if (!isObject(data) && !isArray(data)) {
 		return {};
 	}
 
-	const mappingData = form.getOption?.("mapping.data");
-	if (isString(mappingData) && mappingData.trim() !== "") {
-		try {
-			data = new Pathfinder(data).getVia(mappingData.trim());
-		} catch {
-			data = {};
+	let resolvedData = data;
+	if (isObject(resolvedData) && !isArray(resolvedData)) {
+		if (isArray(resolvedData.data)) {
+			resolvedData = resolvedData.data;
+		} else if (isArray(resolvedData.dataset)) {
+			resolvedData = resolvedData.dataset;
+		} else if (dataPath === "") {
+			resolvedData = Object.values(resolvedData);
 		}
 	}
 
-	if (isObject(data)) {
-		data = Object.values(data);
-	}
-
 	const mappingIndex = form.getOption?.("mapping.index");
 	if (mappingIndex !== null && mappingIndex !== undefined) {
-		data = data?.[mappingIndex];
+		resolvedData = resolvedData?.[mappingIndex];
 	}
 
-	if (!isObject(data) && !isArray(data)) {
+	if (!isObject(resolvedData) && !isArray(resolvedData)) {
 		return {};
 	}
 
-	return data;
+	return resolvedData;
 }
 
 /**
@@ -1037,14 +1083,14 @@ function getDatasourceContext() {
 		return null;
 	}
 
-	const mappingData = form?.getOption?.("mapping.data");
 	const mappingIndex = form?.getOption?.("mapping.index");
+	const { dataPath } = resolveDatasourceBasePath(form, datasource);
 	const record = resolveFormRecord(form, datasource);
 	const normalizedPath = normalizePathForRecord(path, record);
 	let basePath = "";
 
-	if (isString(mappingData) && mappingData.trim() !== "") {
-		basePath = mappingData.trim();
+	if (isString(dataPath) && dataPath.trim() !== "") {
+		basePath = dataPath.trim();
 	}
 
 	if (mappingIndex !== null && mappingIndex !== undefined) {
@@ -1056,6 +1102,42 @@ function getDatasourceContext() {
 	return { target: datasource, path: finalPath };
 }
 
+/**
+ * @private
+ * @param {HTMLElement} form
+ * @param {HTMLElement} datasource
+ * @return {{data: object|Array, dataPath: string}}
+ */
+function resolveDatasourceBasePath(form, datasource) {
+	let data = datasource?.data;
+	if (!isObject(data) && !isArray(data)) {
+		return { data: {}, dataPath: "" };
+	}
+
+	let dataPath = "";
+	const mappingData = form?.getOption?.("mapping.data");
+	if (isString(mappingData) && mappingData.trim() !== "") {
+		const trimmed = mappingData.trim();
+		try {
+			const mapped = new Pathfinder(data).getVia(trimmed);
+			if (mapped !== undefined) {
+				data = mapped;
+				dataPath = trimmed;
+			}
+		} catch {}
+	}
+
+	if (dataPath === "" && isObject(data) && !isArray(data)) {
+		if (isArray(data.data)) {
+			dataPath = "data";
+		} else if (isArray(data.dataset)) {
+			dataPath = "dataset";
+		}
+	}
+
+	return { data, dataPath };
+}
+
 /**
  * @private
  * @return {string}

package/source/monster.mjs

@@ -65,6 +65,7 @@ export * from "./components/form/variant-select.mjs";
 export * from "./components/form/register-wizard.mjs";
 export * from "./components/form/action-button.mjs";
 export * from "./components/form/form.mjs";
+export * from "./components/form/repeat-field-set.mjs";
 export * from "./components/form/api-button.mjs";
 export * from "./components/form/digits.mjs";
 export * from "./components/form/tree-select.mjs";
@@ -74,7 +75,6 @@ export * from "./components/form/input-group.mjs";
 export * from "./components/form/shadow-reload.mjs";
 export * from "./components/form/button.mjs";
 export * from "./components/form/field-set.mjs";
-export * from "./components/form/repeat-field-set.mjs";
 export * from "./components/form/toggle-switch.mjs";
 export * from "./components/form/types/state.mjs";
 export * from "./components/form/template.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.76.0");
+	monsterVersion = new Version("4.91.0");
 
 	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.76.0")
+        monsterVersion = new Version("4.91.0")
 
         let m = getMonsterVersion();
 

package/test/web/import.js

@@ -4,10 +4,10 @@ import "../cases/components/layout/tabs.mjs";
 import "../cases/components/layout/slit-panel.mjs";
 import "../cases/components/layout/panel.mjs";
 import "../cases/components/form/buy-box.mjs";
+import "../cases/components/form/message-state-button.mjs";
 import "../cases/components/form/button-bar.mjs";
 import "../cases/components/form/reload.mjs";
 import "../cases/components/form/state-button.mjs";
-import "../cases/components/form/message-state-button.mjs";
 import "../cases/components/form/select.mjs";
 import "../cases/components/form/confirm-button.mjs";
 import "../cases/components/form/form.mjs";

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.76.0</h1>
-  <div id="lastupdate" style='font-size:0.7em'>last update Mo 5. Jan 16:52:49 CET 2026</div>
+  <h1 style='margin-bottom: 0.1em;'>Monster 4.91.0</h1>
+  <div id="lastupdate" style='font-size:0.7em'>last update Mo 12. Jan 23:49:41 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>