diff --git a/development/issues/open/329.html b/development/issues/open/329.html
new file mode 100644
index 0000000000000000000000000000000000000000..df70f2d21c27a66b6fe7aa1ce3b3fe612dcde242
--- /dev/null
+++ b/development/issues/open/329.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+ <title>new wizard navigation #329</title>
+ <script src="./329.mjs" type="module"></script>
+</head>
+<body>
+<h1>new wizard navigation #329</h1>
+<p></p>
+<ul>
+ <li><a href="https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/329">Issue #329</a></li>
+ <li><a href="/">Back to overview</a></li>
+</ul>
+<main>
+
+
+ <div style="width:400px">
+ <monster-wizard-navigation>
+ <ol class="wizard-steps">
+ <li class="step">
+ <span class="step-title">Unternehmen verifizieren</span>
+ <ul class="substeps">
+ <li class="substep active">Unternehmenstyp</li>
+ <li class="substep">Unternehmensdaten</li>
+ <li class="substep">Unternehmensvertreter</li>
+ <li class="substep active">Geschäftsinhaber/innen</li>
+ <li class="substep">Geschäftsführer/innen des Unternehmens</li>
+ <li class="substep">Geschäftsführer/innen</li>
+ <li class="substep">Öffentliche Details</li>
+ </ul>
+ </li>
+ <li class="step">
+ <span class="step-title">Bank hinzufügen</span>
+ </li>
+ <li class="step">
+ <span class="step-title">Konto schützen</span>
+ </li>
+ <li class="step">
+ <span class="step-title">Extras hinzufügen</span>
+ </li>
+ <li class="step">
+ <span class="step-title">Prüfen und einreichen</span>
+ </li>
+ </ol>
+ </monster-wizard-navigation>
+ </div>
+
+</main>
+</body>
+</html>
diff --git a/development/issues/open/329.mjs b/development/issues/open/329.mjs
new file mode 100644
index 0000000000000000000000000000000000000000..bb52772d83d6d0e00489591a25b86a30cd859d1a
--- /dev/null
+++ b/development/issues/open/329.mjs
@@ -0,0 +1,16 @@
+/**
+* @file development/issues/open/329.mjs
+* @url https://gitlab.schukai.com/oss/libraries/javascript/monster/-/issues/329
+* @description new wizard navigation
+* @issue 329
+*/
+
+import "../../../source/components/style/property.pcss";
+import "../../../source/components/style/link.pcss";
+import "../../../source/components/style/color.pcss";
+import "../../../source/components/style/theme.pcss";
+import "../../../source/components/style/normalize.pcss";
+import "../../../source/components/style/typography.pcss";
+
+
+import "../../../source/components/navigation/wizard-navigation.mjs";
diff --git a/flake.lock b/flake.lock
index e292138a0c04630417d469cca1a30a53b70a1805..6864cdd8ae21ff90ce387bf1608e6a5e064d6b5b 100644
--- a/flake.lock
+++ b/flake.lock
@@ -164,11 +164,11 @@
},
"nixpkgs_3": {
"locked": {
- "lastModified": 1750400657,
- "narHash": "sha256-3vkjFnxCOP6vm5Pm13wC/Zy6/VYgei/I/2DWgW4RFeA=",
+ "lastModified": 1751211869,
+ "narHash": "sha256-1Cu92i1KSPbhPCKxoiVG5qnoRiKTgR5CcGSRyLpOd7Y=",
"owner": "nixos",
"repo": "nixpkgs",
- "rev": "b2485d56967598da068b5a6946dadda8bfcbcd37",
+ "rev": "b43c397f6c213918d6cfe6e3550abfe79b5d1c51",
"type": "github"
},
"original": {
diff --git a/package-lock.json b/package-lock.json
index c97433956d6e03acdb5b3fb36815d55ad1380058..b47aab0f819142b2e2d925a4d6da28034b7ada33 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,25 +1,25 @@
{
"name": "@schukai/monster",
- "version": "4.23.6",
+ "version": "4.25.4",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "@schukai/monster",
- "version": "4.23.6",
+ "version": "4.25.4",
"license": "AGPL 3.0",
"dependencies": {
- "@floating-ui/dom": "^1.7.1",
+ "@floating-ui/dom": "^1.7.2",
"@popperjs/core": "^2.11.8"
},
"devDependencies": {
- "@biomejs/biome": "2.0.5",
+ "@biomejs/biome": "2.0.6",
"@esbuild-plugins/node-modules-polyfill": "^0.2.2",
"@peculiar/webcrypto": "^1.5.0",
- "@playwright/test": "^1.53.1",
+ "@playwright/test": "^1.53.2",
"@roarr/cli": "^5.12.4",
"autoprefixer": "^10.4.21",
- "browserslist": "^4.25.0",
+ "browserslist": "^4.25.1",
"btoa": "^1.2.1",
"buffer": "^6.0.3",
"c8": "^10.1.3",
@@ -32,37 +32,37 @@
"esbuild": "^0.25.5",
"espree": "^10.4.0",
"estraverse": "^5.3.0",
- "flow-bin": "^0.273.1",
+ "flow-bin": "^0.274.2",
"fs": "0.0.1-security",
"glob": "^11.0.3",
"graphviz": "^0.0.9",
"jsdom": "^26.1.0",
"jsdom-global": "^3.0.2",
- "mocha": "^11.7.0",
- "playwright": "^1.53.1",
+ "mocha": "^11.7.1",
+ "playwright": "^1.53.2",
"postcss": "^8.5.6",
"postcss-fluid": "^1.4.2",
"postcss-for": "^2.1.1",
"postcss-import": "^16.1.1",
"postcss-load-config": "^6.0.1",
- "postcss-mixins": "^11.0.3",
+ "postcss-mixins": "^12.0.0",
"postcss-nested": "^7.0.2",
"postcss-nesting": "^13.0.2",
"postcss-normalize": "^13.0.1",
"postcss-responsive-type": "^1.0.0",
"postcss-rtlcss": "^5.7.1",
"postcss-strip-units": "^2.0.1",
- "puppeteer": "^24.10.2",
+ "puppeteer": "^24.11.2",
"sinon": "^21.0.0",
"turbowatch": "^2.29.4",
"url": "^0.11.4",
"url-exist": "3.0.1",
"util": "^0.12.5",
- "vite": "6.3.5",
+ "vite": "7.0.1",
"vite-plugin-banner": "^0.8.1",
"vite-plugin-minify": "^2.1.0",
"vite-plugin-mock": "^3.0.2",
- "ws": "^8.18.2"
+ "ws": "^8.18.3"
}
},
"node_modules/@asamuzakjp/css-color": {
@@ -115,9 +115,9 @@
}
},
"node_modules/@biomejs/biome": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/biome/-/biome-2.0.5.tgz",
- "integrity": "sha512-MztFGhE6cVjf3QmomWu83GpTFyWY8KIcskgRf2AqVEMSH4qI4rNdBLdpAQ11TNK9pUfLGz3IIOC1ZYwgBePtig==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/biome/-/biome-2.0.6.tgz",
+ "integrity": "sha512-RRP+9cdh5qwe2t0gORwXaa27oTOiQRQvrFf49x2PA1tnpsyU7FIHX4ZOFMtBC4QNtyWsN7Dqkf5EDbg4X+9iqA==",
"dev": true,
"license": "MIT OR Apache-2.0",
"bin": {
@@ -131,20 +131,20 @@
"url": "https://opencollective.com/biome"
},
"optionalDependencies": {
- "@biomejs/cli-darwin-arm64": "2.0.5",
- "@biomejs/cli-darwin-x64": "2.0.5",
- "@biomejs/cli-linux-arm64": "2.0.5",
- "@biomejs/cli-linux-arm64-musl": "2.0.5",
- "@biomejs/cli-linux-x64": "2.0.5",
- "@biomejs/cli-linux-x64-musl": "2.0.5",
- "@biomejs/cli-win32-arm64": "2.0.5",
- "@biomejs/cli-win32-x64": "2.0.5"
+ "@biomejs/cli-darwin-arm64": "2.0.6",
+ "@biomejs/cli-darwin-x64": "2.0.6",
+ "@biomejs/cli-linux-arm64": "2.0.6",
+ "@biomejs/cli-linux-arm64-musl": "2.0.6",
+ "@biomejs/cli-linux-x64": "2.0.6",
+ "@biomejs/cli-linux-x64-musl": "2.0.6",
+ "@biomejs/cli-win32-arm64": "2.0.6",
+ "@biomejs/cli-win32-x64": "2.0.6"
}
},
"node_modules/@biomejs/cli-darwin-arm64": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-arm64/-/cli-darwin-arm64-2.0.5.tgz",
- "integrity": "sha512-VIIWQv9Rcj9XresjCf3isBFfWjFStsdGZvm8SmwJzKs/22YQj167ge7DkxuaaZbNf2kmYif0AcjAKvtNedEoEw==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-arm64/-/cli-darwin-arm64-2.0.6.tgz",
+ "integrity": "sha512-AzdiNNjNzsE6LfqWyBvcL29uWoIuZUkndu+wwlXW13EKcBHbbKjNQEZIJKYDc6IL+p7bmWGx3v9ZtcRyIoIz5A==",
"cpu": [
"arm64"
],
@@ -159,9 +159,9 @@
}
},
"node_modules/@biomejs/cli-darwin-x64": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-x64/-/cli-darwin-x64-2.0.5.tgz",
- "integrity": "sha512-DRpGxBgf5Z7HUFcNUB6n66UiD4VlBlMpngNf32wPraxX8vYU6N9cb3xQWOXIQVBBQ64QfsSLJnjNu79i/LNmSg==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-darwin-x64/-/cli-darwin-x64-2.0.6.tgz",
+ "integrity": "sha512-wJjjP4E7bO4WJmiQaLnsdXMa516dbtC6542qeRkyJg0MqMXP0fvs4gdsHhZ7p9XWTAmGIjZHFKXdsjBvKGIJJQ==",
"cpu": [
"x64"
],
@@ -176,9 +176,9 @@
}
},
"node_modules/@biomejs/cli-linux-arm64": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64/-/cli-linux-arm64-2.0.5.tgz",
- "integrity": "sha512-FQTfDNMXOknf8+g9Eede2daaduRjTC2SNbfWPNFMadN9K3UKjeZ62jwiYxztPaz9zQQsZU8VbddQIaeQY5CmIA==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64/-/cli-linux-arm64-2.0.6.tgz",
+ "integrity": "sha512-ZSVf6TYo5rNMUHIW1tww+rs/krol7U5A1Is/yzWyHVZguuB0lBnIodqyFuwCNqG9aJGyk7xIMS8HG0qGUPz0SA==",
"cpu": [
"arm64"
],
@@ -193,9 +193,9 @@
}
},
"node_modules/@biomejs/cli-linux-arm64-musl": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.0.5.tgz",
- "integrity": "sha512-OpflTCOw/ElEs7QZqN/HFaSViPHjAsAPxFJ22LhWUWvuJgcy/Z8+hRV0/3mk/ZRWy5A6fCDKHZqAxU+xB6W4mA==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.0.6.tgz",
+ "integrity": "sha512-CVPEMlin3bW49sBqLBg2x016Pws7eUXA27XYDFlEtponD0luYjg2zQaMJ2nOqlkKG9fqzzkamdYxHdMDc2gZFw==",
"cpu": [
"arm64"
],
@@ -210,9 +210,9 @@
}
},
"node_modules/@biomejs/cli-linux-x64": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64/-/cli-linux-x64-2.0.5.tgz",
- "integrity": "sha512-znpfydUDPuDkyBTulnODrQVK2FaG/4hIOPcQSsF2GeauQOYrBAOplj0etGB0NUrr0dFsvaQ15nzDXYb60ACoiw==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64/-/cli-linux-x64-2.0.6.tgz",
+ "integrity": "sha512-geM1MkHTV1Kh2Cs/Xzot9BOF3WBacihw6bkEmxkz4nSga8B9/hWy5BDiOG3gHDGIBa8WxT0nzsJs2f/hPqQIQw==",
"cpu": [
"x64"
],
@@ -227,9 +227,9 @@
}
},
"node_modules/@biomejs/cli-linux-x64-musl": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64-musl/-/cli-linux-x64-musl-2.0.5.tgz",
- "integrity": "sha512-9lmjCnajAzpZXbav2P6D87ugkhnaDpJtDvOH5uQbY2RXeW6Rq18uOUltxgacGBP+d8GusTr+s3IFOu7SN0Ok8g==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-linux-x64-musl/-/cli-linux-x64-musl-2.0.6.tgz",
+ "integrity": "sha512-mKHE/e954hR/hSnAcJSjkf4xGqZc/53Kh39HVW1EgO5iFi0JutTN07TSjEMg616julRtfSNJi0KNyxvc30Y4rQ==",
"cpu": [
"x64"
],
@@ -244,9 +244,9 @@
}
},
"node_modules/@biomejs/cli-win32-arm64": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-arm64/-/cli-win32-arm64-2.0.5.tgz",
- "integrity": "sha512-CP2wKQB+gh8HdJTFKYRFETqReAjxlcN9AlYDEoye8v2eQp+L9v+PUeDql/wsbaUhSsLR0sjj3PtbBtt+02AN3A==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-arm64/-/cli-win32-arm64-2.0.6.tgz",
+ "integrity": "sha512-290V4oSFoKaprKE1zkYVsDfAdn0An5DowZ+GIABgjoq1ndhvNxkJcpxPsiYtT7slbVe3xmlT0ncdfOsN7KruzA==",
"cpu": [
"arm64"
],
@@ -261,9 +261,9 @@
}
},
"node_modules/@biomejs/cli-win32-x64": {
- "version": "2.0.5",
- "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-x64/-/cli-win32-x64-2.0.5.tgz",
- "integrity": "sha512-Sw3rz2m6bBADeQpr3+MD7Ch4E1l15DTt/+dfqKnwkm3cn4BrYwnArmvKeZdVsFRDjMyjlKIP88bw1r7o+9aqzw==",
+ "version": "2.0.6",
+ "resolved": "https://registry.npmjs.org/@biomejs/cli-win32-x64/-/cli-win32-x64-2.0.6.tgz",
+ "integrity": "sha512-bfM1Bce0d69Ao7pjTjUS+AWSZ02+5UHdiAP85Th8e9yV5xzw6JrHXbL5YWlcEKQ84FIZMdDc7ncuti1wd2sdbw==",
"cpu": [
"x64"
],
@@ -885,28 +885,28 @@
}
},
"node_modules/@floating-ui/core": {
- "version": "1.7.1",
- "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.1.tgz",
- "integrity": "sha512-azI0DrjMMfIug/ExbBaeDVJXcY0a7EPvPjb2xAJPa4HeimBX+Z18HK8QQR3jb6356SnDDdxx+hinMLcJEDdOjw==",
+ "version": "1.7.2",
+ "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.2.tgz",
+ "integrity": "sha512-wNB5ooIKHQc+Kui96jE/n69rHFWAVoxn5CAzL1Xdd8FG03cgY3MLO+GF9U3W737fYDSgPWA6MReKhBQBop6Pcw==",
"license": "MIT",
"dependencies": {
- "@floating-ui/utils": "^0.2.9"
+ "@floating-ui/utils": "^0.2.10"
}
},
"node_modules/@floating-ui/dom": {
- "version": "1.7.1",
- "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.1.tgz",
- "integrity": "sha512-cwsmW/zyw5ltYTUeeYJ60CnQuPqmGwuGVhG9w0PRaRKkAyi38BT5CKrpIbb+jtahSwUl04cWzSx9ZOIxeS6RsQ==",
+ "version": "1.7.2",
+ "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.2.tgz",
+ "integrity": "sha512-7cfaOQuCS27HD7DX+6ib2OrnW+b4ZBwDNnCcT0uTyidcmyWb03FnQqJybDBoCnpdxwBSfA94UAYlRCt7mV+TbA==",
"license": "MIT",
"dependencies": {
- "@floating-ui/core": "^1.7.1",
- "@floating-ui/utils": "^0.2.9"
+ "@floating-ui/core": "^1.7.2",
+ "@floating-ui/utils": "^0.2.10"
}
},
"node_modules/@floating-ui/utils": {
- "version": "0.2.9",
- "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.9.tgz",
- "integrity": "sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==",
+ "version": "0.2.10",
+ "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.10.tgz",
+ "integrity": "sha512-aGTxbpbg8/b5JfU1HXSrbH3wXZuLPJcNEcZQFMxLs3oSzgtVu6nFPkbbGGUvBcUjKV2YyB9Wxxabo+HEH9tcRQ==",
"license": "MIT"
},
"node_modules/@isaacs/balanced-match": {
@@ -1116,13 +1116,13 @@
}
},
"node_modules/@playwright/test": {
- "version": "1.53.1",
- "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.53.1.tgz",
- "integrity": "sha512-Z4c23LHV0muZ8hfv4jw6HngPJkbbtZxTkxPNIg7cJcTc9C28N/p2q7g3JZS2SiKBBHJ3uM1dgDye66bB7LEk5w==",
+ "version": "1.53.2",
+ "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.53.2.tgz",
+ "integrity": "sha512-tEB2U5z74ebBeyfGNZ3Jfg29AnW+5HlWhvHtb/Mqco9pFdZU1ZLNdVb2UtB5CvmiilNr2ZfVH/qMmAROG/XTzw==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
- "playwright": "1.53.1"
+ "playwright": "1.53.2"
},
"bin": {
"playwright": "cli.js"
@@ -1979,9 +1979,9 @@
"license": "ISC"
},
"node_modules/browserslist": {
- "version": "4.25.0",
- "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.0.tgz",
- "integrity": "sha512-PJ8gYKeS5e/whHBh8xrwYK+dAvEj7JXtz6uTucnMRB8OiGTsKccFekoRrjajPBHV8oOY+2tI4uxeceSimKwMFA==",
+ "version": "4.25.1",
+ "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.1.tgz",
+ "integrity": "sha512-KGj0KoOMXLpSNkkEI6Z6mShmQy0bc1I+T7K9N81k4WWMrfz+6fQ6es80B/YLAeRoKvjYE1YSHHOW1qe9xIVzHw==",
"dev": true,
"funding": [
{
@@ -1999,8 +1999,8 @@
],
"license": "MIT",
"dependencies": {
- "caniuse-lite": "^1.0.30001718",
- "electron-to-chromium": "^1.5.160",
+ "caniuse-lite": "^1.0.30001726",
+ "electron-to-chromium": "^1.5.173",
"node-releases": "^2.0.19",
"update-browserslist-db": "^1.1.3"
},
@@ -2224,9 +2224,9 @@
}
},
"node_modules/caniuse-lite": {
- "version": "1.0.30001720",
- "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001720.tgz",
- "integrity": "sha512-Ec/2yV2nNPwb4DnTANEV99ZWwm3ZWfdlfkQbWSDDt+PsXEVYwlhPH8tdMaPunYTKKmz7AnHi2oNEi1GcmKCD8g==",
+ "version": "1.0.30001726",
+ "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001726.tgz",
+ "integrity": "sha512-VQAUIUzBiZ/UnlM28fSp2CRF3ivUn1BWEvxMcVTNwpw91Py1pGbPIyIKtd+tzct9C3ouceCVdGAXxZOpZAsgdw==",
"dev": true,
"funding": [
{
@@ -2876,9 +2876,9 @@
}
},
"node_modules/devtools-protocol": {
- "version": "0.0.1452169",
- "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1452169.tgz",
- "integrity": "sha512-FOFDVMGrAUNp0dDKsAU1TorWJUx2JOU1k9xdgBKKJF3IBh/Uhl2yswG5r3TEAOrCiGY2QRp1e6LVDQrCsTKO4g==",
+ "version": "0.0.1464554",
+ "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1464554.tgz",
+ "integrity": "sha512-CAoP3lYfwAGQTaAXYvA6JZR0fjGUb7qec1qf4mToyoH2TZgUFeIqYcjh6f9jNuhHfuZiEdH+PONHYrLhRQX6aw==",
"dev": true,
"license": "BSD-3-Clause"
},
@@ -3045,9 +3045,9 @@
"license": "MIT"
},
"node_modules/electron-to-chromium": {
- "version": "1.5.162",
- "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.162.tgz",
- "integrity": "sha512-hQA+Zb5QQwoSaXJWEAGEw1zhk//O7qDzib05Z4qTqZfNju/FAkrm5ZInp0JbTp4Z18A6bilopdZWEYrFSsfllA==",
+ "version": "1.5.179",
+ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.179.tgz",
+ "integrity": "sha512-UWKi/EbBopgfFsc5k61wFpV7WrnnSlSzW/e2XcBmS6qKYTivZlLtoll5/rdqRTxGglGHkmkW0j0pFNJG10EUIQ==",
"dev": true,
"license": "ISC"
},
@@ -3614,9 +3614,9 @@
}
},
"node_modules/flow-bin": {
- "version": "0.273.1",
- "resolved": "https://registry.npmjs.org/flow-bin/-/flow-bin-0.273.1.tgz",
- "integrity": "sha512-OlJkNCSd+i6z5xDoyGiS+3X5xYQx+vVUY2iUw6cHJR0LK3ttyA1wkiI93OuBALhLhF91KayzGhRSzXHqA75iUw==",
+ "version": "0.274.2",
+ "resolved": "https://registry.npmjs.org/flow-bin/-/flow-bin-0.274.2.tgz",
+ "integrity": "sha512-vTF+5hiC5qymweFKj7xs5ABlDqMWbB2fPkYC4MI32m652dFYsq/zvEVNc2M09udwAzplLcMIK2O9VswPfd8Isw==",
"dev": true,
"license": "MIT",
"bin": {
@@ -4901,9 +4901,9 @@
"license": "MIT"
},
"node_modules/mocha": {
- "version": "11.7.0",
- "resolved": "https://registry.npmjs.org/mocha/-/mocha-11.7.0.tgz",
- "integrity": "sha512-bXfLy/mI8n4QICg+pWj1G8VduX5vC0SHRwFpiR5/Fxc8S2G906pSfkyMmHVsdJNQJQNh3LE67koad9GzEvkV6g==",
+ "version": "11.7.1",
+ "resolved": "https://registry.npmjs.org/mocha/-/mocha-11.7.1.tgz",
+ "integrity": "sha512-5EK+Cty6KheMS/YLPPMJC64g5V61gIR25KsRItHw6x4hEKT6Njp1n9LOlH4gpevuwMVS66SXaBBpg+RWZkza4A==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -5596,13 +5596,13 @@
}
},
"node_modules/playwright": {
- "version": "1.53.1",
- "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.53.1.tgz",
- "integrity": "sha512-LJ13YLr/ocweuwxyGf1XNFWIU4M2zUSo149Qbp+A4cpwDjsxRPj7k6H25LBrEHiEwxvRbD8HdwvQmRMSvquhYw==",
+ "version": "1.53.2",
+ "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.53.2.tgz",
+ "integrity": "sha512-6K/qQxVFuVQhRQhFsVZ9fGeatxirtrpPgxzBYWyZLEXJzqYwuL4fuNmfOfD5et1tJE4GScKyPNeLhZeRwuTU3A==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
- "playwright-core": "1.53.1"
+ "playwright-core": "1.53.2"
},
"bin": {
"playwright": "cli.js"
@@ -5615,9 +5615,9 @@
}
},
"node_modules/playwright-core": {
- "version": "1.53.1",
- "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.53.1.tgz",
- "integrity": "sha512-Z46Oq7tLAyT0lGoFx4DOuB1IA9D1TPj0QkYxpPVUnGDqHHvDpCftu1J2hM2PiWsNMoZh8+LQaarAWcDfPBc6zg==",
+ "version": "1.53.2",
+ "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.53.2.tgz",
+ "integrity": "sha512-ox/OytMy+2w1jcYEYlOo1Hhp8hZkLCximMTUTMBXjGUA1KoFfiSZ+DU+3a739jsPY0yoKH2TFy9S2fsJas8yAw==",
"dev": true,
"license": "Apache-2.0",
"bin": {
@@ -6137,9 +6137,9 @@
}
},
"node_modules/postcss-mixins": {
- "version": "11.0.3",
- "resolved": "https://registry.npmjs.org/postcss-mixins/-/postcss-mixins-11.0.3.tgz",
- "integrity": "sha512-HZa6DHlN7uCkp7GTFNvhpyK/Gi9+vrVG7FPl2oQdj+sXUuYo4ri9OsWBseTnvnLfWxRWOq8/VwcHcixtZPrRRg==",
+ "version": "12.0.0",
+ "resolved": "https://registry.npmjs.org/postcss-mixins/-/postcss-mixins-12.0.0.tgz",
+ "integrity": "sha512-br7vXwoA5niiQAW3BLgd66xoGie/JJ1O4k7uLDbb+fbdYFXouxAjppIkBZDpPtSIzx63WeVXRGEYStSYa5kQmw==",
"dev": true,
"funding": [
{
@@ -6155,11 +6155,11 @@
"dependencies": {
"postcss-js": "^4.0.1",
"postcss-simple-vars": "^7.0.1",
- "sugarss": "^4.0.1",
- "tinyglobby": "^0.2.7"
+ "sugarss": "^5.0.0",
+ "tinyglobby": "^0.2.14"
},
"engines": {
- "node": "^18.0 || ^ 20.0 || >= 22.0"
+ "node": "^20.0 || ^22.0 || >=24.0"
},
"peerDependencies": {
"postcss": "^8.2.14"
@@ -6965,9 +6965,9 @@
"license": "MIT"
},
"node_modules/puppeteer": {
- "version": "24.10.2",
- "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-24.10.2.tgz",
- "integrity": "sha512-+k26rCz6akFZntx0hqUoFjCojgOLIxZs6p2k53LmEicwsT8F/FMBKfRfiBw1sitjiCvlR/15K7lBqfjXa251FA==",
+ "version": "24.11.2",
+ "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-24.11.2.tgz",
+ "integrity": "sha512-HopdRZWHa5zk0HSwd8hU+GlahQ3fmesTAqMIDHVY9HasCvppcYuHYXyjml0nlm+nbwVCqAQWV+dSmiNCrZGTGQ==",
"dev": true,
"hasInstallScript": true,
"license": "Apache-2.0",
@@ -6975,8 +6975,8 @@
"@puppeteer/browsers": "2.10.5",
"chromium-bidi": "5.1.0",
"cosmiconfig": "^9.0.0",
- "devtools-protocol": "0.0.1452169",
- "puppeteer-core": "24.10.2",
+ "devtools-protocol": "0.0.1464554",
+ "puppeteer-core": "24.11.2",
"typed-query-selector": "^2.12.0"
},
"bin": {
@@ -6987,18 +6987,18 @@
}
},
"node_modules/puppeteer-core": {
- "version": "24.10.2",
- "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-24.10.2.tgz",
- "integrity": "sha512-CnzhOgrZj8DvkDqI+Yx+9or33i3Y9uUYbKyYpP4C13jWwXx/keQ38RMTMmxuLCWQlxjZrOH0Foq7P2fGP7adDQ==",
+ "version": "24.11.2",
+ "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-24.11.2.tgz",
+ "integrity": "sha512-c49WifNb8hix+gQH17TldmD6TC/Md2HBaTJLHexIUq4sZvo2pyHY/Pp25qFQjibksBu/SJRYUY7JsoaepNbiRA==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"@puppeteer/browsers": "2.10.5",
"chromium-bidi": "5.1.0",
"debug": "^4.4.1",
- "devtools-protocol": "0.0.1452169",
+ "devtools-protocol": "0.0.1464554",
"typed-query-selector": "^2.12.0",
- "ws": "^8.18.2"
+ "ws": "^8.18.3"
},
"engines": {
"node": ">=18"
@@ -7984,17 +7984,23 @@
}
},
"node_modules/sugarss": {
- "version": "4.0.1",
- "resolved": "https://registry.npmjs.org/sugarss/-/sugarss-4.0.1.tgz",
- "integrity": "sha512-WCjS5NfuVJjkQzK10s8WOBY+hhDxxNt/N6ZaGwxFZ+wN3/lKKFSaaKUNecULcTTvE4urLcKaZFQD8vO0mOZujw==",
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/sugarss/-/sugarss-5.0.0.tgz",
+ "integrity": "sha512-3//knMoF9btXcxHTbMRckIYjkEzSZ6pZjiaZ3wM6OIpUtQ06Uwqc0XgAr6jf+U74cLLTV/BEgmHWoeXPC+NhdQ==",
"dev": true,
+ "funding": [
+ {
+ "type": "opencollective",
+ "url": "https://opencollective.com/postcss/"
+ },
+ {
+ "type": "github",
+ "url": "https://github.com/sponsors/ai"
+ }
+ ],
"license": "MIT",
"engines": {
- "node": ">=12.0"
- },
- "funding": {
- "type": "opencollective",
- "url": "https://opencollective.com/postcss/"
+ "node": ">=18.0"
},
"peerDependencies": {
"postcss": "^8.3.3"
@@ -8070,9 +8076,9 @@
"license": "MIT"
},
"node_modules/tar-fs": {
- "version": "3.0.10",
- "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.10.tgz",
- "integrity": "sha512-C1SwlQGNLe/jPNqapK8epDsXME7CAJR5RL3GcE6KWx1d9OUByzoHVcbu1VPI8tevg9H8Alae0AApHHFGzrD5zA==",
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.1.0.tgz",
+ "integrity": "sha512-5Mty5y/sOF1YWj1J6GiBodjlDc05CUR8PKXrsnFAiSG0xA+GHeWLovaZPYUDXkH/1iKRf2+M5+OrRgzC7O9b7w==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -8244,9 +8250,9 @@
"license": "MIT"
},
"node_modules/tinyglobby": {
- "version": "0.2.13",
- "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.13.tgz",
- "integrity": "sha512-mEwzpUgrLySlveBwEVDMKk5B57bhLPYovRfPAXD5gA/98Opn0rCDj3GtLwFvCvH5RK9uPCExUROW5NjDwvqkxw==",
+ "version": "0.2.14",
+ "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.14.tgz",
+ "integrity": "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -8261,9 +8267,9 @@
}
},
"node_modules/tinyglobby/node_modules/fdir": {
- "version": "6.4.4",
- "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz",
- "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==",
+ "version": "6.4.6",
+ "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.6.tgz",
+ "integrity": "sha512-hiFoqpyZcfNm1yc4u8oWCf9A2c4D3QjCrks3zmoVKVxpQRzmPNar1hUJcBG2RQHvEVGDN+Jm81ZheVLAQMK6+w==",
"dev": true,
"license": "MIT",
"peerDependencies": {
@@ -8647,24 +8653,24 @@
}
},
"node_modules/vite": {
- "version": "6.3.5",
- "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",
- "integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==",
+ "version": "7.0.1",
+ "resolved": "https://registry.npmjs.org/vite/-/vite-7.0.1.tgz",
+ "integrity": "sha512-BiKOQoW5HGR30E6JDeNsati6HnSPMVEKbkIWbCiol+xKeu3g5owrjy7kbk/QEMuzCV87dSUTvycYKmlcfGKq3Q==",
"dev": true,
"license": "MIT",
"dependencies": {
"esbuild": "^0.25.0",
- "fdir": "^6.4.4",
+ "fdir": "^6.4.6",
"picomatch": "^4.0.2",
- "postcss": "^8.5.3",
- "rollup": "^4.34.9",
- "tinyglobby": "^0.2.13"
+ "postcss": "^8.5.6",
+ "rollup": "^4.40.0",
+ "tinyglobby": "^0.2.14"
},
"bin": {
"vite": "bin/vite.js"
},
"engines": {
- "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+ "node": "^20.19.0 || >=22.12.0"
},
"funding": {
"url": "https://github.com/vitejs/vite?sponsor=1"
@@ -8673,14 +8679,14 @@
"fsevents": "~2.3.3"
},
"peerDependencies": {
- "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+ "@types/node": "^20.19.0 || >=22.12.0",
"jiti": ">=1.21.0",
- "less": "*",
+ "less": "^4.0.0",
"lightningcss": "^1.21.0",
- "sass": "*",
- "sass-embedded": "*",
- "stylus": "*",
- "sugarss": "*",
+ "sass": "^1.70.0",
+ "sass-embedded": "^1.70.0",
+ "stylus": ">=0.54.8",
+ "sugarss": "^5.0.0",
"terser": "^5.16.0",
"tsx": "^4.8.1",
"yaml": "^2.4.2"
@@ -8774,9 +8780,9 @@
"license": "MIT"
},
"node_modules/vite/node_modules/fdir": {
- "version": "6.4.4",
- "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz",
- "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==",
+ "version": "6.4.6",
+ "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.6.tgz",
+ "integrity": "sha512-hiFoqpyZcfNm1yc4u8oWCf9A2c4D3QjCrks3zmoVKVxpQRzmPNar1hUJcBG2RQHvEVGDN+Jm81ZheVLAQMK6+w==",
"dev": true,
"license": "MIT",
"peerDependencies": {
@@ -9042,9 +9048,9 @@
"license": "ISC"
},
"node_modules/ws": {
- "version": "8.18.2",
- "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.2.tgz",
- "integrity": "sha512-DMricUmwGZUVr++AEAe2uiVM7UoO9MAVZMDu05UQOaUII0lp+zOzLLU4Xqh/JvTqklB1T4uELaaPBKyjE1r4fQ==",
+ "version": "8.18.3",
+ "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.3.tgz",
+ "integrity": "sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==",
"dev": true,
"license": "MIT",
"engines": {
@@ -9227,9 +9233,9 @@
}
},
"node_modules/zod": {
- "version": "3.25.67",
- "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.67.tgz",
- "integrity": "sha512-idA2YXwpCdqUSKRCACDE6ItZD9TZzy3OZMtpfLoh6oPR47lipysRrJfjzMqFxQ3uJuUPyUeWe1r9vLH33xO/Qw==",
+ "version": "3.25.71",
+ "resolved": "https://registry.npmjs.org/zod/-/zod-3.25.71.tgz",
+ "integrity": "sha512-BsBc/NPk7h8WsUWYWYL+BajcJPY8YhjelaWu2NMLuzgraKAz4Lb4/6K11g9jpuDetjMiqhZ6YaexFLOC0Ogi3Q==",
"dev": true,
"license": "MIT",
"funding": {
diff --git a/package.json b/package.json
index b11825aba34ecf36e791d8426413bd5bbbad4277..b67dda51283e1343746c22d6f37dffb91c921d98 100644
--- a/package.json
+++ b/package.json
@@ -40,18 +40,18 @@
"author": "schukai GmbH",
"license": "AGPL 3.0",
"dependencies": {
- "@floating-ui/dom": "^1.7.1",
+ "@floating-ui/dom": "^1.7.2",
"@popperjs/core": "^2.11.8"
},
"devDependencies": {
- "@biomejs/biome": "2.0.5",
+ "@biomejs/biome": "2.0.6",
"buffer": "^6.0.3",
"@esbuild-plugins/node-modules-polyfill": "^0.2.2",
"@peculiar/webcrypto": "^1.5.0",
- "@playwright/test": "^1.53.1",
+ "@playwright/test": "^1.53.2",
"@roarr/cli": "^5.12.4",
"autoprefixer": "^10.4.21",
- "browserslist": "^4.25.0",
+ "browserslist": "^4.25.1",
"btoa": "^1.2.1",
"c8": "^10.1.3",
"chai": "^5.2.0",
@@ -63,36 +63,36 @@
"esbuild": "^0.25.5",
"espree": "^10.4.0",
"estraverse": "^5.3.0",
- "flow-bin": "^0.273.1",
+ "flow-bin": "^0.274.2",
"fs": "0.0.1-security",
"glob": "^11.0.3",
"graphviz": "^0.0.9",
"jsdom": "^26.1.0",
"jsdom-global": "^3.0.2",
- "mocha": "^11.7.0",
- "playwright": "^1.53.1",
+ "mocha": "^11.7.1",
+ "playwright": "^1.53.2",
"postcss": "^8.5.6",
"postcss-fluid": "^1.4.2",
"postcss-for": "^2.1.1",
"postcss-import": "^16.1.1",
"postcss-load-config": "^6.0.1",
- "postcss-mixins": "^11.0.3",
+ "postcss-mixins": "^12.0.0",
"postcss-nested": "^7.0.2",
"postcss-nesting": "^13.0.2",
"postcss-normalize": "^13.0.1",
"postcss-responsive-type": "^1.0.0",
"postcss-rtlcss": "^5.7.1",
"postcss-strip-units": "^2.0.1",
- "puppeteer": "^24.10.2",
+ "puppeteer": "^24.11.2",
"sinon": "^21.0.0",
"turbowatch": "^2.29.4",
"url": "^0.11.4",
"url-exist": "3.0.1",
"util": "^0.12.5",
- "vite": "6.3.5",
+ "vite": "7.0.1",
"vite-plugin-banner": "^0.8.1",
"vite-plugin-minify": "^2.1.0",
"vite-plugin-mock": "^3.0.2",
- "ws": "^8.18.2"
+ "ws": "^8.18.3"
}
}
diff --git a/source/components/navigation/style/wizard-navigation.pcss b/source/components/navigation/style/wizard-navigation.pcss
new file mode 100644
index 0000000000000000000000000000000000000000..2af77d0392f88a4a7d57ac1fb471c88077a452b6
--- /dev/null
+++ b/source/components/navigation/style/wizard-navigation.pcss
@@ -0,0 +1,113 @@
+
+.wizard-steps {
+ counter-reset: step;
+}
+
+
+/* Basic Reset */
+.wizard-steps,
+.wizard-steps .substeps {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+/* Main Steps */
+.wizard-steps .step {
+ position: relative;
+ padding-left: 2.5em;
+ margin-bottom: 1.5em;
+}
+
+/* Number Circle */
+.wizard-steps .step::before {
+ counter-increment: step;
+ content: counter(step);
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 1.8em;
+ height: 1.8em;
+ border: 2px solid var(--monster-color-primary-1);
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-weight: bold;
+ color: var(--monster-color-primary-4);
+ background-color: var(--monster-color-primary-1);
+ box-sizing: border-box;
+ z-index: 2;
+}
+
+/* Connecting line between circles */
+.wizard-steps .step:not(:last-child)::after {
+ content: "";
+ position: absolute;
+ left: 0.9em; /* Exakte Mitte von 1.8em Kreis */
+ top: 2em;
+ bottom: 0;
+ width: 2px;
+ background: var(--monster-color-primary-1);
+ z-index: 1;
+}
+
+/* Active / completed step */
+.wizard-steps .step-active::before {
+ border-color: var(--monster-color-secondary-1);
+ background: var(--monster-bg-color-secondary-2);
+ color: var(--monster-color-secondary-1);
+}
+
+.wizard-steps .step-active .step-title {
+ font-weight: bold;
+ color: var(--monster-color-secondary-1);
+}
+
+/* Step titles */
+.wizard-steps .step-title {
+ font-size: 1rem;
+ line-height: 1.6em;
+ vertical-align: middle;
+ color: var(--monster-color-primary-1);
+ background-color: var(--monster-bg-color-primary-1);
+}
+
+/* Sub-steps */
+.wizard-steps .substeps {
+ margin-top: 0.5em;
+ margin-left: 1.5em;
+}
+
+.wizard-steps .substep {
+ position: relative;
+ padding-left: 1.2em;
+ margin-bottom: 0.4em;
+ color: var(--monster-color-primary-1);
+ background-color: var(--monster-bg-color-primary-1);
+ font-size: 0.9rem;
+}
+
+/* Bullet point */
+.wizard-steps .substep::before {
+ content: "•";
+ position: absolute;
+ left: 0;
+ top: 0;
+ font-size: 1.2em;
+ line-height: 1;
+ color: var(--monster-color-primary-1);
+ background-color: var(--monster-bg-color-primary-1);
+}
+
+/* Active sub-step */
+.wizard-steps .substep.active {
+ font-weight: bold;
+ color: var(--monster-color-secondary-2);
+ background-color: var(--monster-bg-color-secondary-2);
+}
+
+.wizard-steps .substep.active::before {
+ color: var(--monster-color-secondary-2);
+ background-color: var(--monster-bg-color-secondary-2);
+}
diff --git a/source/components/navigation/stylesheet/wizard-navigation.mjs b/source/components/navigation/stylesheet/wizard-navigation.mjs
new file mode 100644
index 0000000000000000000000000000000000000000..6337b5adb0be1449428c0c51990e0c7814572603
--- /dev/null
+++ b/source/components/navigation/stylesheet/wizard-navigation.mjs
@@ -0,0 +1,31 @@
+/**
+ * Copyright © schukai GmbH and all contributing authors, 2025. All rights reserved.
+ * Node module: @schukai/monster
+ *
+ * This source code is licensed under the GNU Affero General Public License version 3 (AGPLv3).
+ * The full text of the license can be found at: https://www.gnu.org/licenses/agpl-3.0.en.html
+ *
+ * For those who do not wish to adhere to the AGPLv3, a commercial license is available.
+ * Acquiring a commercial license allows you to use this software without complying with the AGPLv3 terms.
+ * For more information about purchasing a commercial license, please contact schukai GmbH.
+ */
+
+import {addAttributeToken} from "../../../dom/attributes.mjs";
+import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
+
+export {WizardNavigationStyleSheet}
+
+/**
+ * @private
+ * @type {CSSStyleSheet}
+ */
+const WizardNavigationStyleSheet = new CSSStyleSheet();
+
+try {
+ WizardNavigationStyleSheet.insertRule(`
+@layer wizardnavigation {
+.wizard-steps{counter-reset:step}.wizard-steps,.wizard-steps .substeps{list-style:none;margin:0;padding:0}.wizard-steps .step{margin-bottom:1.5em;padding-left:2.5em;position:relative}.wizard-steps .step:before{align-items:center;background-color:var(--monster-color-primary-1);border:2px solid var(--monster-color-primary-1);border-radius:50%;box-sizing:border-box;color:var(--monster-color-primary-4);content:counter(step);counter-increment:step;display:flex;font-weight:700;height:1.8em;justify-content:center;left:0;position:absolute;top:0;width:1.8em;z-index:2}.wizard-steps .step:not(:last-child):after{background:var(--monster-color-primary-1);bottom:0;content:\"\";left:.9em;position:absolute;top:2em;width:2px;z-index:1}.wizard-steps .step-active:before{background:var(--monster-bg-color-secondary-2);border-color:var(--monster-color-secondary-1);color:var(--monster-color-secondary-1)}.wizard-steps .step-active .step-title{color:var(--monster-color-secondary-1);font-weight:700}.wizard-steps .step-title{background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1);font-size:1rem;line-height:1.6em;vertical-align:middle}.wizard-steps .substeps{margin-left:1.5em;margin-top:.5em}.wizard-steps .substep{font-size:.9rem;margin-bottom:.4em;padding-left:1.2em;position:relative}.wizard-steps .substep,.wizard-steps .substep:before{background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1)}.wizard-steps .substep:before{content:\"•\";font-size:1.2em;left:0;line-height:1;position:absolute;top:0}.wizard-steps .substep.active{font-weight:700}.wizard-steps .substep.active,.wizard-steps .substep.active:before{background-color:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-2)}
+}`, 0);
+} catch (e) {
+ addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
+}
diff --git a/source/components/navigation/wizard-navigation.mjs b/source/components/navigation/wizard-navigation.mjs
new file mode 100644
index 0000000000000000000000000000000000000000..6848c1802c7b4f944be662e6a739b29fa0d3990e
--- /dev/null
+++ b/source/components/navigation/wizard-navigation.mjs
@@ -0,0 +1,219 @@
+/**
+ * Copyright © schukai GmbH and all contributing authors, {{copyRightYear}}. All rights reserved.
+ * Node module: @schukai/monster
+ *
+ * This source code is licensed under the GNU Affero General Public License version 3 (AGPLv3).
+ * The full text of the license can be found at: https://www.gnu.org/licenses/agpl-3.0.en.html
+ *
+ * For those who do not wish to adhere to the AGPLv3, a commercial license is available.
+ * Acquiring a commercial license allows you to use this software without complying with the AGPLv3 terms.
+ * For more information about purchasing a commercial license, please contact schukai GmbH.
+ */
+
+import { instanceSymbol } from "../../constants.mjs";
+import { addAttributeToken } from "../../dom/attributes.mjs";
+import {
+ ATTRIBUTE_ERRORMESSAGE,
+ ATTRIBUTE_ROLE,
+} from "../../dom/constants.mjs";
+import { CustomControl } from "../../dom/customcontrol.mjs";
+import {CustomElement, getSlottedElements} from "../../dom/customelement.mjs";
+import {
+ assembleMethodSymbol,
+ registerCustomElement,
+} from "../../dom/customelement.mjs";
+import {findTargetElementFromEvent, fireEvent} from "../../dom/events.mjs";
+import { isFunction } from "../../types/is.mjs";
+import { WizardNavigationStyleSheet } from "./stylesheet/wizard-navigation.mjs";
+import { fireCustomEvent } from "../../dom/events.mjs";
+import {buildTree} from "../../data/buildtree.mjs";
+import { NodeRecursiveIterator } from "../../types/noderecursiveiterator.mjs";
+import {validateInstance} from "../../types/validate.mjs";
+import {Node} from "../../types/node.mjs";
+import {Formatter} from "../../text/formatter.mjs";
+
+
+export { WizardNavigation };
+
+/**
+ * @private
+ * @type {symbol}
+ */
+const wizardNavigationElementSymbol = Symbol("wizardNavigationElement");
+
+/**
+ * @private
+ * @type {symbol}
+ */
+const wizardNavigationListElementSymbol = Symbol("wizardNavigationListElement");
+
+
+/**
+ * A WizardNavigation
+ *
+ * @fragments /fragments/components/navigation/wizard-navigation/
+ *
+ * @example /examples/components/navigation/wizard-navigation-simple
+ *
+ * Work in Progress, currently only the basic functionality is implemented.
+ *
+ * @since 4.26.0
+ * @copyright schukai GmbH
+ * @summary A beautiful WizardNavigation that can make your life easier and also looks good.
+ */
+class WizardNavigation extends CustomElement {
+ /**
+ * This method is called by the `instanceof` operator.
+ * @returns {symbol}
+ */
+ static get [instanceSymbol]() {
+ return Symbol.for(
+ "@schukai/monster/components/navigation/wizard-navigation@@instance",
+ );
+ }
+
+ /**
+ *
+ * @return {Components.Navigation.WizardNavigation
+ */
+ [assembleMethodSymbol]() {
+ super[assembleMethodSymbol]();
+ initControlReferences.call(this);
+ initEventHandler.call(this);
+ queueMicrotask(() => {
+ importContent.call(this);
+ });
+ return this;
+ }
+
+ /**
+ * To set the options via the HTML Tag, the attribute `data-monster-options` must be used.
+ * @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
+ *
+ * The individual configuration values can be found in the table.
+ *
+ * @property {Object} templates Template definitions
+ * @property {string} templates.main Main template
+ * @property {Object} labels Label definitions
+ * @property {Object} actions Callbacks
+ * @property {string} actions.click="throw Error" Callback when clicked
+ * @property {Object} features Features
+ * @property {Object} classes CSS classes
+ * @property {boolean} disabled=false Disabled state
+ */
+ get defaults() {
+ return Object.assign({}, super.defaults, {
+ templates: {
+ main: getTemplate(),
+ },
+ labels: {},
+ classes: {},
+ disabled: false,
+ features: {},
+ actions: {
+ click: () => {
+ throw new Error("the click action is not defined");
+ },
+ },
+ });
+ }
+
+ /**
+ * @return {string}
+ */
+ static getTag() {
+ return "monster-wizard-navigation";
+ }
+
+ /**
+ * @return {CSSStyleSheet[]}
+ */
+ static getCSSStyleSheet() {
+ return [WizardNavigationStyleSheet];
+ }
+}
+
+/**
+ * @private
+ * @return {initEventHandler}
+ * @fires monster-wizard-navigation-clicked
+ */
+function initEventHandler() {
+ const self = this;
+ const element = this[wizardNavigationElementSymbol];
+
+ const type = "click";
+
+ element.addEventListener(type, function (event) {
+ const callback = self.getOption("actions.click");
+
+ fireCustomEvent(self, "monster-wizard-navigation-clicked", {
+ element: self,
+ });
+
+ if (!isFunction(callback)) {
+ return;
+ }
+
+ const element = findTargetElementFromEvent(
+ event,
+ ATTRIBUTE_ROLE,
+ "control",
+ );
+
+ if (!(element instanceof Node && self.hasNode(element))) {
+ return;
+ }
+
+ callback.call(self, event);
+ });
+
+ return this;
+}
+
+/**
+ * @private
+ * @return {void}
+ */
+function initControlReferences() {
+ this[wizardNavigationElementSymbol] = this.shadowRoot.querySelector(
+ `[${ATTRIBUTE_ROLE}="control"]`,
+ );
+
+ this[wizardNavigationListElementSymbol] = this.shadowRoot.querySelector(
+ `[${ATTRIBUTE_ROLE}="list"]`,
+ );
+}
+
+/**
+ * Import Menu Entries from dataset
+ *
+ * @since 1.0.0
+ * @return {TreeMenu}
+ * @throws {Error} map is not iterable
+ * @private
+ */
+function importContent() {
+ const elements = getSlottedElements.call(this, "ol.wizard-steps")
+ elements.forEach(element => {
+ const clonedContent = element.cloneNode(true);
+ this[wizardNavigationListElementSymbol].innerHTML = '';
+ this[wizardNavigationListElementSymbol].appendChild(clonedContent);
+ })
+}
+
+
+/**
+ * @private
+ * @return {string}
+ */
+function getTemplate() {
+ // language=HTML
+ return `
+ <div data-monster-role="control" part="control">
+ <slot style="display: none;"></slot>
+ <div data-monster-role="list"></div>
+ </div>`;
+}
+
+registerCustomElement(WizardNavigation);
diff --git a/source/components/tree-menu/tree-menu.mjs b/source/components/tree-menu/tree-menu.mjs
index c3ea5daee4a03584254bbd16167f46d64e443c23..bff2e8a190a01bd12ced746e4c2320e5ee2f0563 100644
--- a/source/components/tree-menu/tree-menu.mjs
+++ b/source/components/tree-menu/tree-menu.mjs
@@ -456,7 +456,7 @@ function importEntries() {
let filteredData;
if (this[firstRunDoneSymbol] !== true) {
- filteredData = data.filter(
+ filteredData = data?.filter(
(entry) =>
!entry[parentKey] ||
entry[parentKey] === null ||