@schukai/monster 1.25.0 → 1.28.0

package/source/data/datasource.js

@@ -31,7 +31,7 @@ const internalDataSymbol = Symbol('internalData');
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/datasource.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.Data.Datasource()
  * </script>
  * ```
@@ -40,14 +40,14 @@ const internalDataSymbol = Symbol('internalData');
  *
  * ```
  * <script type="module">
- * import {Datasource} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/datasource.js';
+ * import {Datasource} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/datasource.js';
  * new Datasource()
  * </script>
  * ```
  *
  * @example
  *
- * import {Datasource} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/datasource.js'
+ * import {Datasource} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/datasource.js'
  *
  * class MyDatasource extends Datasource {
  *  

package/source/data/diff.js

@@ -17,7 +17,7 @@ import {typeOf} from "../types/typeof.js";
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/diff.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.Data.Diff(a, b)
  * </script>
  * ```
@@ -26,14 +26,14 @@ import {typeOf} from "../types/typeof.js";
  *
  * ```
  * <script type="module">
- * import {Diff} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/diff.js';
+ * import {Diff} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/diff.js';
  * Diff(a, b)
  * </script>
  * ```
  *
  * @example
  *
- * import {Diff} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/diff.js';
+ * import {Diff} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/diff.js';
  *
  * // given are two objects x and y.
  *

package/source/data/extend.js

@@ -15,7 +15,7 @@ import {typeOf} from "../types/typeof.js";
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/extend.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.Data.extend(a, b)
  * </script>
  * ```
@@ -24,7 +24,7 @@ import {typeOf} from "../types/typeof.js";
  *
  * ```
  * <script type="module">
- * import {extend} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/extend.js';
+ * import {extend} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/extend.js';
  * extend(a, b)
  * </script>
  * ```

package/source/data/pathfinder.js

@@ -27,7 +27,7 @@ export const WILDCARD = '*';
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/pathfinder.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * console.log(new Monster.Data.Pathfinder())
  * </script>
  * ```
@@ -36,7 +36,7 @@ export const WILDCARD = '*';
  *
  * ```
  * <script type="module">
- * import {Pathfinder} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/pathfinder.js';
+ * import {Pathfinder} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/pathfinder.js';
  * console.log(new Pathfinder())
  * </script>
  * ```
@@ -78,7 +78,7 @@ export const WILDCARD = '*';
  *
  * @example
  *
- * import {Pathfinder} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/pathfinder.js';
+ * import {Pathfinder} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/pathfinder.js';
  *
  * let value = new Pathfinder({
  * a: {
@@ -104,7 +104,7 @@ export const WILDCARD = '*';
  *
  * @example
  *
- * import {Pathfinder} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/pathfinder.js';
+ * import {Pathfinder} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/pathfinder.js';
  *
  * let p = new Pathfinder({
  *                a: {

package/source/data/pipe.js

@@ -19,7 +19,7 @@ const DELIMITER = '|';
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/pipe.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * new Monster.Data.Pipe()
  * </script>
  * ```
@@ -28,7 +28,7 @@ const DELIMITER = '|';
  *
  * ```
  * <script type="module">
- * import {Pipe} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/pipe.js';
+ * import {Pipe} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/pipe.js';
  * new Pipe()
  * </script>
  * ```
@@ -39,7 +39,7 @@ const DELIMITER = '|';
  * the word is then converted to uppercase letters and a prefix Hello is added. the two backslash safe the space char.
  *
  * @example
- * import {Pipe} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/pipe.js';
+ * import {Pipe} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/pipe.js';
  *
  * let obj = {
  *    a: {

package/source/data/transformer.js

@@ -25,7 +25,7 @@ import {Pathfinder} from "./pathfinder.js";
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/transformer.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * new Monster.Data.Transformer()
  * </script>
  * ```
@@ -34,7 +34,7 @@ import {Pathfinder} from "./pathfinder.js";
  *
  * ```
  * <script type="module">
- * import {Transformer} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/transformer.js';
+ * import {Transformer} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/transformer.js';
  * new Transformer()
  * </script>
  * ```
@@ -120,7 +120,7 @@ import {Pathfinder} from "./pathfinder.js";
  *
  * @example
  *
- * import {Transformer} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/data/transformer.js';
+ * import {Transformer} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/data/transformer.js';
  *
  * const transformer = new Transformer("tolower")
  *

package/source/dom/assembler.js

@@ -23,7 +23,7 @@ const ATTRIBUTEPREFIX = "data-monster-";
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/assembler.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * console.log(new Monster.DOM.Assembler())
  * </script>
  * ```
@@ -32,7 +32,7 @@ const ATTRIBUTEPREFIX = "data-monster-";
  *
  * ```
  * <script type="module">
- * import {Assembler} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/assembler.js';
+ * import {Assembler} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/assembler.js';
  * console.log(new Assembler())
  * </script>
  * ```

package/source/dom/attributes.js

@@ -20,7 +20,7 @@ import {ATTRIBUTE_OBJECTLINK} from "./constants.js";
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/updater.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * console.log(Monster.DOM.findClosestObjectLink())
  * </script>
  * ```
@@ -29,7 +29,7 @@ import {ATTRIBUTE_OBJECTLINK} from "./constants.js";
  *
  * ```
  * <script type="module">
- * import {getUpdaterFromNode} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/updater.js';
+ * import {getUpdaterFromNode} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/updater.js';
  * console.log(findClosestObjectLink())
  * </script>
  * ```
@@ -50,7 +50,7 @@ function findClosestObjectLink(element) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.addToObjectLink();
  * </script>
  * ```
@@ -59,7 +59,7 @@ function findClosestObjectLink(element) {
  *
  * ```
  * <script type="module">
- * import {addToObjectLink} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {addToObjectLink} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * addToObjectLink();
  * </script>
  * ```
@@ -92,7 +92,7 @@ function addToObjectLink(element, symbol, object) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.removeObjectLink();
  * </script>
  * ```
@@ -101,7 +101,7 @@ function addToObjectLink(element, symbol, object) {
  *
  * ```
  * <script type="module">
- * import {removeObjectLink} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {removeObjectLink} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * removeObjectLink();
  * </script>
  * ```
@@ -134,7 +134,7 @@ function removeObjectLink(element, symbol) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.hasObjectLink();
  * </script>
  * ```
@@ -143,7 +143,7 @@ function removeObjectLink(element, symbol) {
  *
  * ```
  * <script type="module">
- * import {hasObjectLink} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {hasObjectLink} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * hasObjectLink();
  * </script>
  * ```
@@ -180,7 +180,7 @@ function hasObjectLink(element, symbol) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.getLinkedObjects();
  * </script>
  * ```
@@ -189,7 +189,7 @@ function hasObjectLink(element, symbol) {
  *
  * ```
  * <script type="module">
- * import {getLinkedObjects} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {getLinkedObjects} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * getLinkedObjects();
  * </script>
  * ```
@@ -225,7 +225,7 @@ function getLinkedObjects(element, symbol) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.toggleAttributeToken();
  * </script>
  * ```
@@ -234,7 +234,7 @@ function getLinkedObjects(element, symbol) {
  *
  * ```
  * <script type="module">
- * import {toggleAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {toggleAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * toggleAttributeToken();
  * </script>
  * ```
@@ -269,7 +269,7 @@ function toggleAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.addAttributeToken();
  * </script>
  * ```
@@ -278,7 +278,7 @@ function toggleAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {addAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {addAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * addAttributeToken();
  * </script>
  * ```
@@ -315,7 +315,7 @@ function addAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.removeAttributeToken();
  * </script>
  * ```
@@ -324,7 +324,7 @@ function addAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {removeAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {removeAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * removeAttributeToken();
  * </script>
  * ```
@@ -360,7 +360,7 @@ function removeAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.containsAttributeToken();
  * </script>
  * ```
@@ -369,7 +369,7 @@ function removeAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {containsAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {containsAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * containsAttributeToken();
  * </script>
  * ```
@@ -402,7 +402,7 @@ function containsAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.replaceAttributeToken();
  * </script>
  * ```
@@ -411,7 +411,7 @@ function containsAttributeToken(element, key, token) {
  *
  * ```
  * <script type="module">
- * import {replaceAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {replaceAttributeToken} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * replaceAttributeToken();
  * </script>
  * ```
@@ -447,7 +447,7 @@ function replaceAttributeToken(element, key, from, to) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.clearAttributeTokens();
  * </script>
  * ```
@@ -456,7 +456,7 @@ function replaceAttributeToken(element, key, from, to) {
  *
  * ```
  * <script type="module">
- * import {clearAttributeTokens} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {clearAttributeTokens} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * clearAttributeTokens();
  * </script>
  * ```
@@ -482,11 +482,29 @@ function clearAttributeTokens(element, key) {
 }
 
 /**
+ * This function searches, starting from an `HTMLElemement`, for the next element that has a certain attribute.
+ *
+ * ```html
+ * <div data-my-attribute="2" id="2">
+ *     <div id="1"></div>
+ * </div>
+ * ```
+ *
+ * ```javascript
+ * // if no value is specified (undefined), then only the attribute is checked.
+ * findClosestByAttribute(document.getElementById('1'),'data-my-attribute'); // ↦ node with id 2
+ * findClosestByAttribute(document.getElementById('2'),'data-my-attribute'); // ↦ node with id 2
+ *
+ * // if a value is specified, for example an empty string, then the name and the value are checked.
+ * findClosestByAttribute(document.getElementById('1'),'data-my-attribute', '');  // ↦ undefined
+ * findClosestByAttribute(document.getElementById('1'),'data-my-attribute', '2'); // ↦ node with id 2
+ * ```
+ *
  * You can call the method via the monster namespace `new Monster.DOM.findClosestByAttribute()`.
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * Monster.DOM.findClosestByAttribute();
  * </script>
  * ```
@@ -495,7 +513,7 @@ function clearAttributeTokens(element, key) {
  *
  * ```
  * <script type="module">
- * import {findClosestByAttribute} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/attributes.js';
+ * import {findClosestByAttribute} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
  * findClosestByAttribute();
  * </script>
  * ```
@@ -507,12 +525,20 @@ function clearAttributeTokens(element, key) {
  * @param {string} key
  * @param {string|undefined} value
  * @return {HTMLElement|undefined}
+ * @summary find closest node
  */
 function findClosestByAttribute(element, key, value) {
     validateInstance(element, getGlobalFunction('HTMLElement'));
 
-    if (element.hasAttribute(key) && element.getAttribute(key) === value) {
-        return element;
+    if (element.hasAttribute(key)) {
+        if (value === undefined) {
+            return element;
+        }
+
+        if (element.getAttribute(key) === value) {
+            return element;
+        }
+
     }
 
     let selector = validateString(key);
@@ -524,8 +550,64 @@ function findClosestByAttribute(element, key, value) {
     return undefined;
 }
 
+/**
+ * This function searches, starting from an `HTMLElemement`, for the next element that has a certain attribute.
+ *
+ * ```html
+ * <div class="myclass" id="2">
+ *     <div id="1"></div>
+ * </div>
+ * ```
+ *
+ * ```javascript
+ * // if no value is specified (undefined), then only the attribute is checked.
+ * findClosestByClass(document.getElementById('1'),'myclass'); // ↦ node with id 2
+ * findClosestByClass(document.getElementById('2'),'myclass'); // ↦ node with id 2
+ * ```
+ *
+ * You can call the method via the monster namespace `new Monster.DOM.findClosestByClass()`.
+ *
+ * ```
+ * <script type="module">
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
+ * Monster.DOM.findClosestByClass();
+ * </script>
+ * ```
+ *
+ * Alternatively, you can also integrate this function individually.
+ *
+ * ```
+ * <script type="module">
+ * import {findClosestByClass} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/attributes.js';
+ * findClosestByClass();
+ * </script>
+ * ```
+ *
+ * @since 1.27.0
+ * @copyright schukai GmbH
+ * @memberOf Monster.DOM
+ * @param {HTMLElement} element
+ * @param {string} className
+ * @return {HTMLElement|undefined}
+ * @summary find closest node
+ */
+function findClosestByClass(element, className) {
+    validateInstance(element, getGlobalFunction('HTMLElement'));
+
+    if (element?.classList?.contains(validateString(className))) {
+        return element;
+    }
+
+    let result = element.closest('.' + className);
+    if (result instanceof HTMLElement) {
+        return result;
+    }
+    
+    return undefined;
+}
+
 // exports
-assignToNamespace('Monster.DOM', getLinkedObjects, addToObjectLink, removeObjectLink, findClosestByAttribute, hasObjectLink, clearAttributeTokens, replaceAttributeToken, containsAttributeToken, removeAttributeToken, addAttributeToken, toggleAttributeToken);
+assignToNamespace('Monster.DOM', findClosestByClass, getLinkedObjects, addToObjectLink, removeObjectLink, findClosestByAttribute, hasObjectLink, clearAttributeTokens, replaceAttributeToken, containsAttributeToken, removeAttributeToken, addAttributeToken, toggleAttributeToken);
 export {
     Monster,
     addToObjectLink,
@@ -539,5 +621,6 @@ export {
     addAttributeToken,
     toggleAttributeToken,
     getLinkedObjects,
-    findClosestObjectLink
+    findClosestObjectLink,
+    findClosestByClass
 }

package/source/dom/constants.js

@@ -49,6 +49,13 @@ const ATTRIBUTE_THEME_NAME = ATTRIBUTE_THEME_PREFIX + 'name';
  */
 const ATTRIBUTE_UPDATER_ATTRIBUTES = ATTRIBUTE_PREFIX + 'attributes';
 
+/**
+ * @memberOf Monster.DOM
+ * @type {string}
+ * @since 1.27.1
+ */
+const ATTRIBUTE_UPDATER_SELECT_THIS = ATTRIBUTE_PREFIX + 'select-this';
+
 /**
  * @memberOf Monster.DOM
  * @type {string}
@@ -84,6 +91,13 @@ const ATTRIBUTE_UPDATER_REMOVE = ATTRIBUTE_PREFIX + 'remove';
  */
 const ATTRIBUTE_UPDATER_BIND = ATTRIBUTE_PREFIX + 'bind';
 
+/**
+ * @memberOf Monster.DOM
+ * @type {string}
+ * @since 1.27.0
+ */
+const ATTRIBUTE_TEMPLATE_PREFIX = ATTRIBUTE_PREFIX + 'template-prefix';
+
 /**
  * @memberOf Monster.DOM
  * @type {string}
@@ -414,5 +428,7 @@ export {
     ATTRIBUTE_DISABLED,
     ATTRIBUTE_ERRORMESSAGE,
     ATTRIBUTE_VALUE,
-    objectUpdaterLinkSymbol
+    objectUpdaterLinkSymbol,
+    ATTRIBUTE_TEMPLATE_PREFIX,
+    ATTRIBUTE_UPDATER_SELECT_THIS
 } 

package/source/dom/customcontrol.js

@@ -30,7 +30,7 @@ const attachedInternalSymbol = Symbol('attachedInternal');
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/customcontrol.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * document.createElement('monster-')
  * </script>
  * ```

package/source/dom/customelement.js

@@ -96,7 +96,7 @@ const attributeObserverSymbol = Symbol('attributeObserver');
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/customelement.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * document.createElement('monster-')
  * </script>
  * ```

package/source/dom/events.js

@@ -13,7 +13,7 @@ import {getDocument} from "./util.js";
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/events.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * console.log(new Monster.DOM.fireEvent())
  * </script>
  * ```
@@ -22,7 +22,7 @@ import {getDocument} from "./util.js";
  *
  * ```
  * <script type="module">
- * import {fireEvent} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/events.js';
+ * import {fireEvent} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/events.js';
  * console.log(fireEvent())
  * </script>
  * ```
@@ -73,8 +73,8 @@ function fireEvent(element, type) {
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/events.js';
- * console.log(new Monster.DOM.findTargetElementFromEvent())
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
+ * new Monster.DOM.findTargetElementFromEvent()
  * </script>
  * ```
  *
@@ -82,8 +82,8 @@ function fireEvent(element, type) {
  *
  * ```
  * <script type="module">
- * import {findTargetElementFromEvent} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/events.js';
- * console.log(findTargetElementFromEvent())
+ * import {findTargetElementFromEvent} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/events.js';
+ * findTargetElementFromEvent()
  * </script>
  * ```
  *
@@ -105,7 +105,6 @@ function findTargetElementFromEvent(event, attributeName, attributeValue) {
     }
 
     const path = event.composedPath();
-    const element = path?.[0];
 
     // closest cannot be used here, because closest is not correct for slotted elements
     if (isArray(path)) {

package/source/dom/focusmanager.js

@@ -35,23 +35,22 @@ const stackSymbol = Symbol('stack');
 
 
 /**
- * With this function you can read the language version set by the document.
- * For this the attribute `lang` in the html tag is read. If no attribute is set, `en` is used as default.
+ * With the focusmanager the focus can be stored in a document, recalled and moved.
  *
- * You can create the class via the monster namespace `new Monster.DOM.FocusManager()`.
+ * You can create the object via the monster namespace `new Monster.DOM.FocusManager()`.
  *
  * ```
  * <script type="module">
- * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/focusmanager.js';
+ * import {Monster} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/monster.js';
  * new Monster.DOM.FocusManager()
  * </script>
  * ```
  *
- * Alternatively, you can also integrate this function individually.
+ * Alternatively, you can also integrate this object individually.
  *
  * ```
  * <script type="module">
- * import {FocusManager} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.25.0/dist/modules/dom/focusmanager.js';
+ * import {FocusManager} from 'https://cdn.jsdelivr.net/npm/@schukai/monster@1.28.0/dist/modules/dom/focusmanager.js';
  * new FocusManager()
  * </script>
  * ```
@@ -60,7 +59,7 @@ const stackSymbol = Symbol('stack');
  * @copyright schukai GmbH
  * @memberOf Monster.DOM
  * @throws {Error} unsupported locale
- * @summary Manage the focus
+ * @summary Handle the focus
  */
 class FocusManager extends BaseWithOptions {