generator-nitro 9.4.2 → 10.0.0

package/generators/app/templates/.node-version

@@ -1 +1 @@
-20.18.1
+20.19.4

package/generators/app/templates/CUTAWAYpackage.json

@@ -6,8 +6,8 @@
   "private": true,
   "author": "The Nitro Team",
   "engines": {
-    "node": ">=18.12.0 <21",
-    "npm": ">=8.19.2 <11"
+    "node": ">=20.18.1 <21",
+    "npm": ">=10.8.2 <11"
   },
   "scripts": {
     "\n# PROJECT ------- ": "",
@@ -27,7 +27,7 @@
     "cypress-test:open": "cypress open --project ./tests/cypress/ --e2e --browser chrome",
     "lighthouse-test": "npm run build && cross-env PORT=8889 NITRO_MODE=test npm-run-all --parallel --race prod:serve lighthouse-test:run",
     "lighthouse-test:run": "lighthouse http://localhost:8889/<% if (options.exampleCode) { %>example-patterns<% } else { %>index<% } %> --quiet --configPath=./tests/lighthouse/lighthouse.config.js --output-path=./public/reports/lighthouse/report.html --view",
-    "lint": "npm-run-all lint:*",
+    "lint": "npm-run-all --parallel lint:*",
     "lint:css": "stylelint src/**/*.*ss --allow-empty-input",
     "lint:data": "nitro-app-validate-pattern-data",
     "lint:html": "gulp lint-html",
@@ -80,19 +80,18 @@
   "dependencies": {<% if (options.exampleCode) { %>
     "@gondel/core": "1.2.8",
     "@gondel/plugin-hot": "1.2.8",
-    "bootstrap": "5.3.5",<% } %>
-    "core-js": "3.42.0"<% if (options.exampleCode) { %>,
+    "bootstrap": "5.3.7",<% } %>
+    "core-js": "3.45.0"<% if (options.exampleCode) { %>,
     "flatpickr": "4.6.13",
     "handlebars": "4.7.8",
     "jquery": "3.7.1",
     "lazysizes": "5.3.2",
-    "lottie-web": "5.12.2",
-    "prevent-window-opener-attacks": "0.3.1"<% } %><% if (options.jsCompiler === 'js') { %>,
+    "lottie-web": "5.13.0"<% } %><% if (options.jsCompiler === 'js') { %>,
     "regenerator-runtime": "0.14.1"<% } %><% if (options.exampleCode) { %>,
     "svg4everybody": "2.1.9"<% } %>
   },
   "devDependencies": {<% if (options.jsCompiler === 'js') { %>
-    "@babel/eslint-parser": "7.27.1",<% } %>
+    "@babel/eslint-parser": "7.28.0",<% } %>
     "@merkle-open/eslint-config": "4.0.0",
     "@merkle-open/html-validate-config": "1.0.2",
     "@merkle-open/prettier-config": "1.2.1",
@@ -102,7 +101,7 @@
     "@nitro/exporter": "<%= version %>",
     "@nitro/gulp": "<%= version %>",
     "@nitro/webpack": "<%= version %>",
-    "@playwright/test": "1.52.0",<% if (options.jsCompiler === 'ts') { %>
+    "@playwright/test": "1.54.2",<% if (options.jsCompiler === 'ts') { %>
     "@types/bootstrap": "5.2.10",<% if (options.exampleCode ) { %>
     "@types/jquery": "3.5.32",<% } %>
     "@types/svg4everybody": "2.1.5",
@@ -110,29 +109,29 @@
     "backstopjs": "6.3.25",
     "check-node-version": "4.2.1",
     "commitizen": "4.3.1",
-    "config": "3.3.12",<% if (options.themes) { %>
-    "cookie-session": "2.1.0",<% } %>
+    "config": "4.1.0",<% if (options.themes) { %>
+    "cookie-session": "2.1.1",<% } %>
     "cross-env": "7.0.3",
-    "cypress": "13.17.0",
+    "cypress": "14.5.4",
     "cz-conventional-changelog": "3.3.0",
     "env-linter": "2.0.0",
     "eslint": "8.57.1",
-    "eslint-plugin-import": "2.31.0",
+    "eslint-plugin-import": "2.32.0",
     "extend": "3.0.2",
     "generator-nitro": "<%= version %>",
-    "gulp": "5.0.0",
+    "gulp": "5.0.1",
     "html-validate": "7.18.1",
     "husky": "9.1.7",
     "license-checker": "25.0.1",
-    "lighthouse": "12.6.0",
-    "lint-staged": "15.5.1",<% if (options.themes) { %>
+    "lighthouse": "12.8.1",
+    "lint-staged": "15.5.2",<% if (options.themes) { %>
     "node-sass": "9.0.0",<% } %>
-    "npm-check-updates": "18.0.1",
+    "npm-check-updates": "18.0.2",
     "npm-run-all": "4.1.5",
-    "prettier": "3.5.3",
+    "prettier": "3.6.2",
     "rimraf": "5.0.10",
-    "stylelint": "16.19.1",<% if (options.jsCompiler === 'ts') { %>
-    "typescript": "5.8.3",<% } %>
+    "stylelint": "16.23.1",<% if (options.jsCompiler === 'ts') { %>
+    "typescript": "5.9.2",<% } %>
     "webpack-cli": "4.10.0",
     "yo": "5.1.0"
   },

package/generators/app/templates/project/docs/nitro.md

@@ -21,8 +21,7 @@ Nitro is simple, fast and flexible. Use this app for all your frontend work.
 
 This application was created by the yeoman generator for nitro.  
 Before using, you need of course [node](https://nodejs.org/) installed.  
-Nitro is tested with the current ["Active" LTS version](https://github.com/nodejs/Release#release-schedule)
-and with the LTS maintenance versions.
+Nitro is currently only tested with node 20.
 
 Install the project dependencies in the project root:
 
@@ -288,8 +287,8 @@ The pattern helper will find also pattern elements.
 
 - Pattern with name `example-sub`: `<type>/example-sub/example-sub.<%= options.viewExt %>`
 - Element with name `example-sub`: `<type>/*/elements/example-sub/example-sub.<%= options.viewExt %>`
-
-<% if (options.templateEngine === 'hbs') { %>Please note:
+<% if (options.templateEngine === 'hbs') { %>
+Please note:
 The parameter `type` is also available for rendering pattern elements the same as for normal patterns. Therefore, the same
 rules and restrictions regarding unique names apply. Additionally, for pattern elements, their name should also be unique
 within a certain pattern type as otherwise, the pattern helper would just return the first found match.
@@ -299,7 +298,8 @@ within a certain pattern type as otherwise, the pattern helper would just return
 Render a partial (<%= options.viewExt %> snippet). Partials are placed in `src/views/_partials/` as `*.<%= options.viewExt %>` files (e.g. `head.<%= options.viewExt %>`).
 
 ```<% if (options.templateEngine === 'twig') { %>
-{% partial 'head' %}<% } else { %>
+{% partial 'head' %}
+```<% } else { %>
 {{> head}}
 ```
 
@@ -432,7 +432,7 @@ For final use, all assets are copied from the 'src' to the 'public' folder.
 The main assets will be bundled with an easy to use webpack config.
 
 The configuration includes loaders for JavaScript, TypeScript, CSS & SCSS,
-clientside handlebars, webfonts and images (with minification). It also includes an iconfont generator.
+clientside handlebars, webfonts and images (with minification).
 
 You only have to enable the desired loaders and features. And of course, it is possible to extend the configuration to your needs.
 

package/generators/app/templates/src/patterns/atoms/checkbox/css/checkbox.scss

@@ -28,13 +28,13 @@ $checkbox-color: $color-gray-5;
 		border-radius: 4px;
 	}
 
-	// Checkbox Replacement - checked state: Check-Icon
+	// Checkbox Replacement - checked state:  check char
 	&:checked + .a-checkbox__label::after {
-		font-icon: -0.4 + $checkbox-size url('../img/check.svg');
+		content: '✔';
 		color: $color-gray-4;
 		position: absolute;
-		top: 32%;
-		left: 4px;
+		top: 20%;
+		left: 5px;
 	}
 
 	&:focus,

package/generators/app/templates/src/patterns/atoms/checkbox/readme.md

@@ -1,6 +1,6 @@
 # checkbox
 
-Displays a custom checkbox example with label by using css and a fonticon
+Displays a custom checkbox example with label by using css and background image
 
 ## Things to note
 
@@ -8,10 +8,6 @@ Displays a custom checkbox example with label by using css and a fonticon
 
 You may use this pattern with a [div, li or span](./schema.json) root node.
 
-### Iconfont
-
-The checkbox icon will be extracted to an iconfont with the [iconfont-webpack-plugin](https://www.npmjs.com/package/iconfont-webpack-plugin)
-
 ## Testing
 
 [Example page](http://localhost:8081/example-patterns)

package/generators/app/templates/src/patterns/atoms/list/css/list.scss

@@ -9,8 +9,11 @@ $a-list-size: 2rem;
 	margin: 0.3 * $a-list-size 0;
 	&::before {
 		position: absolute;
+		content: '';
+		width: 1em;
+		height: 1em;
 		margin-top: 0.1 * $a-list-size;
-		margin-left: -1.8 * $a-list-size;
-		font-icon: url('../img/check.svg');
+		margin-left: -1.6 * $a-list-size;
+		background: center / contain no-repeat url('../img/check.svg');
 	}
 }

package/generators/app/templates/src/patterns/atoms/list/css/modifier/list-mix.scss

@@ -3,12 +3,12 @@
 		/* stylelint-disable max-nesting-depth */
 		&:nth-child(2n) {
 			&::before {
-				font-icon: url('../../img/arrow.svg');
+				background-image: url('../../img/arrow.svg');
 			}
 		}
 		&:nth-child(3n) {
 			&::before {
-				font-icon: url('../../img/nitro.svg');
+				background-image: url('../../img/nitro.svg');
 			}
 		}
 		/* stylelint-enable max-nesting-depth */

package/generators/app/templates/src/patterns/atoms/list/readme.md

@@ -1,12 +1,11 @@
 # list
 
 Unordered list with icon as bullet point (default: checkmark).  
-Icons will be extracted to an iconfont with the [iconfont-webpack-plugin](https://www.npmjs.com/package/iconfont-webpack-plugin)  
-Possibility to add an svg icon at the end of the text using icon pattern
+Possibility to add an svg icon at the end of the text using the icon pattern
 
 ## API
 
-modifier `a-list-mix` for different icons per line
+modifier `a-list--mix` for different icons per line
 
 ## Testing
 

package/generators/app/templates/src/ui.ts

@@ -4,7 +4,6 @@
 
 import 'core-js/features/promise/index';
 
-import './shared/base/security/js/security';
 import './shared/base/reset/css/reset.scss';
 import './shared/base/grid/css/grid.scss';
 import './shared/base/document/css/document.scss';

package/generators/server/templates/package.json

@@ -27,12 +27,12 @@
   "dependencies": {
     "@nitro/app": "<%= nitroAppVersion %>",
     "check-node-version": "4.2.1",
-    "config": "3.3.12",
-    "cookie-session": "2.1.0",
+    "config": "4.1.0",
+    "cookie-session": "2.1.1",
     "cross-env": "7.0.3",
     "extend": "3.0.2",
     "hbs": "4.2.0",
-    "i18next": "24.2.3",
+    "i18next": "25.3.4",
     "npm-run-all": "4.1.5"
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "generator-nitro",
-  "version": "9.4.2",
+  "version": "10.0.0",
   "description": "Yeoman generator for the nitro frontend framework",
   "license": "MIT",
   "repository": {
@@ -9,8 +9,8 @@
   },
   "author": "The Nitro Team",
   "engines": {
-    "node": ">=18.12.0 <21",
-    "npm": ">=8.19.2 <11"
+    "node": ">=20.18.1 <21",
+    "npm": ">=10.8.2 <11"
   },
   "main": "generators/app/index.js",
   "scripts": {
@@ -37,7 +37,7 @@
   ],
   "dependencies": {
     "cli-color": "2.0.4",
-    "config": "3.3.12",
+    "config": "4.1.0",
     "find-git-root": "1.0.4",
     "git-config": "0.0.7",
     "glob": "10.4.5",
@@ -50,9 +50,9 @@
     "@merkle-open/eslint-config": "4.0.0",
     "ejs": "3.1.10",
     "eslint": "8.57.1",
-    "eslint-plugin-import": "2.31.0",
-    "fs-extra": "11.3.0",
-    "jasmine": "5.7.1",
+    "eslint-plugin-import": "2.32.0",
+    "fs-extra": "11.3.1",
+    "jasmine": "5.9.0",
     "yeoman-assert": "3.1.1",
     "yeoman-test": "6.3.0"
   }

package/readme.md

@@ -16,8 +16,7 @@ Nitro is simple, fast and flexible. It works on macOS, Windows and Linux. Use th
 ## Usage
 
 Before using, you need of course [node](https://nodejs.org/) installed.  
-Nitro and the Nitro generator are tested with the current ["Active" LTS version](https://github.com/nodejs/Release#release-schedule)
-and with the LTS maintenance versions.
+Nitro and the Nitro generator are currently only tested with node 20.
 
 ### Create a new project
 

package/generators/app/templates/src/patterns/atoms/checkbox/img/check.svg

@@ -1,20 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-	<!-- Generator: Sketch 49.3 (51167) - http://www.bohemiancoding.com/sketch -->
-	<title>check_16x16px</title>
-	<desc>Created with Sketch.</desc>
-	<defs>
-		<path d="M5.5148,11.9997 L0.3738,7.9557 C-0.0562,7.6167 -0.1262,6.9997 0.2208,6.5787 C0.5668,6.1577 1.1958,6.0887 1.6258,6.4277 L5.3448,9.3537 L14.2818,0.2977 C14.6658,-0.0893 15.2978,-0.1013 15.6958,0.2747 C16.0918,0.6507 16.1028,1.2707 15.7188,1.6607 L5.5148,11.9997 Z" id="path-1"></path>
-	</defs>
-	<g id="check_16x16px" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-		<g id="check-icon" transform="translate(0.000000, 2.000000)">
-			<mask id="mask-2" fill="white">
-				<use xlink:href="#path-1"></use>
-			</mask>
-			<use id="Mask" fill="#000000" xlink:href="#path-1"></use>
-			<g id="corporate/Green" mask="url(#mask-2)">
-				<g transform="translate(-8.000000, -11.000000)"></g>
-			</g>
-		</g>
-	</g>
-</svg>

package/generators/app/templates/src/shared/base/security/js/security.js

@@ -1 +0,0 @@
-import 'prevent-window-opener-attacks';

package/generators/app/templates/src/shared/base/security/js/security.ts

@@ -1 +0,0 @@
-import 'prevent-window-opener-attacks';

package/generators/app/templates/src/shared/base/security/readme.md

@@ -1,3 +0,0 @@
-# Security
-
-[prevent-window-opener-attacks](https://www.npmjs.com/package/prevent-window-opener-attacks)