@schukai/monster 4.15.3 → 4.16.0

package/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 
 
+## [4.16.0] - 2025-06-08
+
+### Add Features
+
+- Introduce enhanced select component and archive issue 322
+
+
+
+## [4.15.4] - 2025-06-07
+
+### Bug Fixes
+
+- Remove unused property and improve option fetching in select component
+
+
+
 ## [4.15.3] - 2025-06-07
 
 ### 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.15.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.16.0"}

package/source/components/form/select.mjs

@@ -417,7 +417,6 @@ class Select extends CustomControl {
      * @property {boolean} features.useStrictValueComparison Use strict (`===`) comparison when matching option values.
      * @property {boolean} features.showRemoteInfo When the filter mode is set to "remote," display a badge indicating the possibility of additional remote options.
      * @property {Object} remoteInfo Configuration for remote info badge.
-     * @property {string} remoteInfo.path Path to the remote info badge.
      * @property {string} remoteInfo.url URL for total count of options when `filter.mode==="remote"` is set.
      * @property {Object} placeholder Placeholder text for the control.
      * @property {string} placeholder.filter Placeholder text for filter input.
@@ -474,7 +473,6 @@ class Select extends CustomControl {
                 url: null,
 
                 remoteInfo: {
-                    path: null,
                     url: null,
                 },
 
@@ -2440,20 +2438,42 @@ function gatherState() {
         throw new Error("no shadow-root is defined");
     }
 
-    const selection = [];
-    const elements = this.shadowRoot.querySelectorAll(
-        `input[type=${type}]:checked`,
-    );
+    let filteredSelection=[];
+    if (type === "radio") {
+
+        const selection = [];
+        const elements = this.shadowRoot.querySelectorAll(
+            `input[type=${type}]:checked`,
+        );
+
+        for (const e of elements) {
+            selection.push({
+                label: getSelectionLabel.call(this, e.value),
+                value: e.value,
+            });
+        }
+
+        filteredSelection = selection;
+
+    } else {
+
+        const selection = [...this.getOption("selection", [])];
+        const allElements = this.shadowRoot.querySelectorAll(`input[type=${type}]`);
+        const checkedElements = this.shadowRoot.querySelectorAll(`input[type=${type}]:checked`);
+        const currentInputValues = new Set(Array.from(allElements).map(el => el.value));
+        filteredSelection = selection.filter(sel => !currentInputValues.has(sel.value));
+        for (const input of checkedElements) {
+            filteredSelection.push({
+                label: getSelectionLabel.call(this, input.value),
+                value: input.value,
+            });
+        }
 
-    for (const e of elements) {
-        selection.push({
-            label: getSelectionLabel.call(this, e.value),
-            value: e.value,
-        });
     }
 
+
     setSelection
-        .call(this, selection)
+        .call(this, filteredSelection)
         .then(() => {
         })
         .catch((e) => {
@@ -3035,8 +3055,10 @@ function initTotal() {
         return;
     }
 
+    const fetchOptions = this.getOption("fetch", {});
+
     getGlobal()
-        .fetch(url)
+        .fetch(url, fetchOptions)
         .then((response) => {
             if (!response.ok) {
                 // Improved status checking using `response.ok`