@ui5/webcomponents-tools 0.0.0-07d38e78e → 0.0.0-093de5dd1

package/lib/icons-hash/icons-hash.mjs

@@ -0,0 +1,149 @@
+import fs from "fs/promises";
+import path from "path";
+import ignore from "ignore";
+import { fileURLToPath } from "url";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+// -------------------
+// FNV-1a 32-bit hash
+// -------------------
+function fnv1aHash(str) {
+	let hash = 0x811c9dc5;
+	for (let i = 0; i < str.length; i++) {
+		hash ^= str.charCodeAt(i);
+		hash = (hash * 0x01000193) >>> 0;
+	}
+	return hash.toString(16);
+}
+
+async function findGitignoreFiles(startDir) {
+	const gitignores = [];
+	let currentDir = path.resolve(startDir);
+	while (true) {
+		const candidate = path.join(currentDir, ".gitignore");
+		try {
+			await fs.access(candidate);
+			gitignores.push(candidate);
+		} catch { }
+		const parentDir = path.dirname(currentDir);
+		if (parentDir === currentDir) break;
+		currentDir = parentDir;
+	}
+	return gitignores;
+}
+
+async function loadIgnoreRules(dir) {
+	const files = await findGitignoreFiles(dir);
+	const ig = ignore();
+	for (const file of files) {
+		const content = await fs.readFile(file, "utf8");
+		ig.add(content);
+	}
+	return ig;
+}
+
+async function walkDir(dir, ig, baseDir) {
+	const results = [];
+	const entries = await fs.readdir(dir, { withFileTypes: true });
+
+	for (const entry of entries) {
+		const absPath = path.join(dir, entry.name);
+		let relPath = path.relative(baseDir, absPath).replace(/\\/g, "/"); // normalize for .gitignore
+
+		if (ig.ignores(relPath) || relPath.startsWith("dist/")) continue;
+
+		if (entry.isDirectory()) {
+			results.push(...await walkDir(absPath, ig, baseDir));
+		} else {
+			results.push(relPath);
+		}
+	}
+	return results;
+}
+
+// Hash file content + mtime
+async function hashFile(filePath) {
+	const stat = await fs.stat(filePath);
+	const content = await fs.readFile(filePath, "utf8");
+	return fnv1aHash(String(stat.mtimeMs) + content);
+}
+
+function getRepoName(repoPath) {
+	return repoPath.split("/").pop();
+}
+
+async function computeHashes(repoPath, ig) {
+	const files = await walkDir(repoPath, ig, repoPath);
+	const hashEntries = await Promise.all(
+		files.map(async (file) => {
+			const absPath = path.join(repoPath, file);
+			const hash = await hashFile(absPath);
+			return [path.relative(process.cwd(), absPath), hash];
+		})
+	);
+	return Object.fromEntries(hashEntries);
+}
+
+async function saveHashes(repoPath, ig) {
+	const distPath = path.join(repoPath, "dist");
+	await fs.mkdir(distPath, { recursive: true });
+	const ui5iconsHashPath = path.join(distPath, ".ui5iconsHash");
+
+	// Cache the hashes for both the icons and tools packages, since the output depends on the content of both.
+	const hashes = {
+		...(await computeHashes(repoPath, ig)),
+		...(await computeHashes(path.resolve(__dirname, "../../"), ig)),
+	};
+
+	await fs.writeFile(ui5iconsHashPath, JSON.stringify(hashes, null, 2), "utf8");
+	console.log(`Saved build hashes for the ${getRepoName(repoPath)} package.`);
+}
+
+async function checkHashes(repoPath, ig) {
+	const ui5iconsHashPath = path.join(repoPath, "dist", ".ui5iconsHash");
+	let oldHashes = {};
+	try {
+		const raw = await fs.readFile(ui5iconsHashPath, "utf8");
+		oldHashes = JSON.parse(raw);
+	} catch {
+		console.log(`No build hashes found for the ${getRepoName(repoPath)} package. Building it now.`);
+		process.exit(1);
+	}
+
+	// Compare the hashes for both the icons and tools packages, since the output depends on the content of both.
+	const newHashes = {
+		...(await computeHashes(repoPath, ig)),
+		...(await computeHashes(path.resolve(__dirname, "../../"), ig)),
+	};
+
+	let changed = false;
+	for (const file of new Set([...Object.keys(oldHashes), ...Object.keys(newHashes)])) {
+		if (oldHashes[file] !== newHashes[file]) {
+			changed = true;
+		}
+	}
+
+	if (!changed) {
+		console.log(`No changes detected in the ${getRepoName(repoPath)} package.`);
+	} else {
+		console.log(`Changes detected in the ${getRepoName(repoPath)} package. Rebuilding it.`);
+		process.exit(1);
+	}
+}
+
+async function main() {
+	const mode = process.argv[2];
+	if (!["save", "check"].includes(mode)) {
+		throw new Error("Usage: node hashes.js <save|check>");
+	}
+
+	const repoPath = process.cwd();
+	const ig = await loadIgnoreRules(repoPath);
+
+	if (mode === "save") await saveHashes(repoPath, ig);
+	if (mode === "check") await checkHashes(repoPath, ig);
+}
+
+main().catch(console.error);

package/lib/remove-dev-mode/remove-dev-mode.mjs

@@ -1,37 +1,51 @@
 import { globby } from "globby";
 import * as esbuild from 'esbuild'
 import * as fs from "fs";
+import { pathToFileURL } from "url";
 
-let customPlugin = {
+const generate = async () => {
+  let customPlugin = {
     name: 'ui5-tools',
     setup(build) {
-        build.onLoad({ filter: /UI5Element.ts$/ }, async (args) => {
-          let text = await fs.promises.readFile(args.path, 'utf8');
-          text = text.replaceAll(/const DEV_MODE = true/g, "");
-          text = text.replaceAll(/if \(DEV_MODE\)/g, "if (false)");
-          return {
-            contents: text,
-            loader: 'ts',
-          }
-        })
-      },
-}
+      build.onLoad({ filter: /UI5Element.ts$/ }, async (args) => {
+        let text = await fs.promises.readFile(args.path, 'utf8');
+        text = text.replaceAll(/const DEV_MODE = true/g, "");
+        text = text.replaceAll(/if \(DEV_MODE\)/g, "if (false)");
+        return {
+          contents: text,
+          loader: 'ts',
+        }
+      })
+    },
+  }
 
-const getConfig = async () => {
+  const getConfig = async () => {
     const config = {
-        entryPoints: await globby("src/**/*.ts"),
-        bundle: false,
-        minify: true,
-        sourcemap: true,
-        outdir: 'dist/prod',
-        outbase: 'src',
-        plugins: [
-            customPlugin,
-        ]
+      entryPoints: await globby("src/**/*.ts"),
+      bundle: false,
+      minify: true,
+      sourcemap: true,
+      outdir: 'dist/prod',
+      outbase: 'src',
+      plugins: [
+        customPlugin,
+      ]
     };
     return config;
+  }
+
+
+  const config = await getConfig();
+  const result = await esbuild.build(config);
 }
 
+const filePath = process.argv[1];
+const fileUrl = pathToFileURL(filePath).href;
+
+if (import.meta.url === fileUrl) {
+  generate()
+}
 
-const config = await getConfig();
-const result = await esbuild.build(config);
+export default {
+  _ui5mainFn: generate
+}

package/lib/rimraf/rimraf.js

@@ -0,0 +1,31 @@
+const fs = require('fs');
+const path = require('path');
+
+const rimraf = dir => {
+	if (fs.existsSync(dir)) {
+		fs.readdirSync(dir).forEach(entry => {
+			const entryPath = path.join(dir, entry);
+			if (fs.lstatSync(entryPath).isDirectory()) {
+				rimraf(entryPath);
+			} else {
+				fs.unlinkSync(entryPath);
+			}
+		});
+		fs.rmdirSync(dir);
+	}
+};
+
+const main = argv => {
+	if (argv.length < 3) {
+		console.error("rimraf <dir>");
+		process.exit(1);
+	}
+	const dir = argv[2];
+	rimraf(dir);
+};
+
+if (require.main === module) {
+	main(process.argv)
+}
+
+exports._ui5mainFn = main;

package/lib/scoping/get-all-tags.js

@@ -4,8 +4,15 @@ const glob = require("glob");
 
 const getTag = file => {
 	const fileContent = String(fs.readFileSync(file)).replace(/\n/g, "");
-	const matches = fileContent.match(/\btag\b:\s*\"(.*?)\"/);
-	return matches ? matches[1] : undefined;
+	let matches = fileContent.match(/\btag\b:\s*\"(.*?)\"/);
+	if (matches) {
+		return matches[1];
+	}
+	matches = fileContent.match(/@customElement\("(.*?)"\)/);
+	if (matches) {
+		return matches[1];
+	}
+	return undefined;
 };
 
 const getPackageTags = (packageDir) => {

package/lib/test-runner/test-runner.js

@@ -3,69 +3,77 @@ const { readFileSync } = require("fs");
 const path = require("path");
 const fs = require("fs");
 
-// search for dev-server port 
+function testFn(outArgv) {
+// search for dev-server port
 // start in current folder
 // traversing upwards in case of mono repo tests and dev-server running in root folder of repository
-let devServerFolder = process.cwd();
-let devServerPort;
-while (true) {
-    try {
-        devServerPort = readFileSync(path.join(devServerFolder, ".dev-server-port")).toString();
-        break; // found
-    } catch (e) {
-        // file not found
-        if (devServerFolder === path.dirname(devServerFolder)) {
-            break; // reached root folder "/"
-        }
-        devServerFolder = path.dirname(devServerFolder);
-    }
-}
+	let devServerFolder = process.cwd();
+	let devServerPort;
+	while (true) {
+		try {
+			devServerPort = readFileSync(path.join(devServerFolder, ".dev-server-port")).toString();
+			break; // found
+		} catch (e) {
+			// file not found
+			if (devServerFolder === path.dirname(devServerFolder)) {
+				break; // reached root folder "/"
+			}
+			devServerFolder = path.dirname(devServerFolder);
+		}
+	}
 
 // check if we are in a monorepo and extract path from package.json
-let packageRepositoryPath = "";
-const pkg = require(path.join(process.cwd(), "package.json"));
-packageRepositoryPath = pkg.repository ? pkg.repository.directory : "";
+	let packageRepositoryPath = "";
+	const pkg = require(path.join(process.cwd(), "package.json"));
+	packageRepositoryPath = pkg.repository ? pkg.repository.directory : "";
 
 // construct base url
 // use devServerPort if a dev server is running, otherwise let the baseUrl in the wdio config be used
 // if a dev server is running in the root of a mono repo, append tha package path like this
 // http://localhost:${devServerPort}/packages/main/
-let baseUrl = "";
-if (devServerPort) {
-    console.log(`Found port ${devServerPort} from '${path.join(devServerFolder, ".dev-server-port")}'`);
-    const devServerInRoot = !devServerFolder.includes(packageRepositoryPath);
-    if (devServerInRoot) {
-        baseUrl = `--base-url http://localhost:${devServerPort}/${packageRepositoryPath}/`;
-    } else {
-        baseUrl = `--base-url http://localhost:${devServerPort}/`;
-    }
-}
+	let baseUrl = "";
+	if (devServerPort) {
+		console.log(`Found port ${devServerPort} from '${path.join(devServerFolder, ".dev-server-port")}'`);
+		const devServerInRoot = !devServerFolder.includes(packageRepositoryPath);
+		if (devServerInRoot) {
+			baseUrl = `--base-url http://localhost:${devServerPort}/${packageRepositoryPath}/`;
+		} else {
+			baseUrl = `--base-url http://localhost:${devServerPort}/`;
+		}
+	}
 
-if (!baseUrl) {
-    console.log("No dev server running, running tests served from `dist`, make sure it is up to date");
-}
+	if (!baseUrl) {
+		console.log("No dev server running, running tests served from `dist`, make sure it is up to date");
+	}
 
 // add single spec parameter if passed
-let spec = "";
-if (process.argv.length === 3) {
-    const specFile = process.argv[2];
-    spec = `--spec ${specFile}`;
-}
+	let spec = "";
+	if (outArgv.length === 3) {
+		const specFile = outArgv[2];
+		spec = `--spec ${specFile}`;
+	}
 
 // more parameters - pass them to wdio
-let restParams = "";
-if (process.argv.length > 3) {
-    restParams = process.argv.slice(2).join(" ");
+	let restParams = "";
+	if (outArgv.length > 3) {
+		restParams = outArgv.slice(2).join(" ");
+	}
+
+	let wdioConfig = "";
+	if (fs.existsSync("config/wdio.conf.cjs")) {
+		wdioConfig = "config/wdio.conf.cjs";
+	} else if (fs.existsSync("config/wdio.conf.js")) {
+		wdioConfig = "config/wdio.conf.js";
+	}
+
+// run wdio with calculated parameters
+	const cmd = `npx cross-env WDIO_LOG_LEVEL=error wdio ${wdioConfig} ${spec} ${baseUrl} ${restParams}`;
+	console.log(`executing: ${cmd}`);
+	child_process.execSync(cmd, {stdio: 'inherit'});
 }
 
-let wdioConfig = "";
-if (fs.existsSync("config/wdio.conf.cjs")) {
-    wdioConfig = "config/wdio.conf.cjs";
-} else if (fs.existsSync("config/wdio.conf.js")) {
-    wdioConfig = "config/wdio.conf.js";
+if (require.main === module) {
+	testFn(process.argv)
 }
 
-// run wdio with calculated parameters
-const cmd = `yarn cross-env WDIO_LOG_LEVEL=error wdio ${wdioConfig} ${spec} ${baseUrl} ${restParams}`;
-console.log(`executing: ${cmd}`);
-child_process.execSync(cmd, {stdio: 'inherit'});
+exports._ui5mainFn = testFn;

package/lib/vite-bundler/vite-bundler.mjs

@@ -0,0 +1,35 @@
+import { build } from 'vite';
+import yargs from 'yargs';
+import { hideBin } from 'yargs/helpers';
+import { pathToFileURL } from "url";
+
+async function start(outArgv) {
+    const argv = yargs(hideBin(outArgv))
+        .alias("c", "config")
+        .alias("mode", "mode")
+        .alias("base", "base")
+        .argv;
+
+    try {
+        await build({
+            configFile: argv.config || undefined,
+            mode: argv.mode || undefined,
+            base: argv.base || undefined,
+            logLevel: 'info',
+        });
+    } catch (e) {
+        console.error(e)
+        process.exit(1);
+    }
+};
+
+const filePath = process.argv[1];
+const fileUrl = pathToFileURL(filePath).href;
+
+if (import.meta.url === fileUrl) {
+    start(process.argv)
+}
+
+export default {
+    _ui5mainFn: start
+}

package/package.json

@@ -1,27 +1,26 @@
 {
   "name": "@ui5/webcomponents-tools",
-  "version": "0.0.0-07d38e78e",
+  "version": "0.0.0-093de5dd1",
   "description": "UI5 Web Components: webcomponents.tools",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
-  "private": false,
   "keywords": [
     "openui5",
     "sapui5",
     "ui5"
   ],
-  "scripts": {},
   "bin": {
-    "wc-dev": "bin/dev.js",
-    "wc-create-ui5-element": "bin/create-ui5-element.js"
+    "ui5nps": "bin/ui5nps.js",
+    "wc-create-ui5-element": "bin/create-ui5-element.js",
+    "wc-dev": "bin/dev.js"
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/SAP/ui5-webcomponents.git",
+    "url": "https://github.com/UI5/webcomponents.git",
     "directory": "packages/tools"
   },
   "dependencies": {
-    "@custom-elements-manifest/analyzer": "^0.8.4",
+    "@custom-elements-manifest/analyzer": "^0.10.10",
     "@typescript-eslint/eslint-plugin": "^6.9.0",
     "@typescript-eslint/parser": "^6.9.0",
     "@wdio/cli": "^7.19.7",
@@ -34,27 +33,26 @@
     "cem-plugin-vs-code-custom-data-generator": "^1.4.2",
     "chai": "^4.3.4",
     "child_process": "^1.0.2",
-    "chokidar": "^3.5.1",
-    "chokidar-cli": "^3.0.0",
+    "chokidar": "^3.6.0",
     "command-line-args": "^5.1.1",
     "comment-parser": "^1.4.0",
-    "concurrently": "^6.0.0",
     "cross-env": "^7.0.3",
     "custom-element-jet-brains-integration": "^1.4.4",
+    "dotenv": "^16.5.0",
     "escodegen": "^2.0.0",
     "eslint": "^7.22.0",
     "eslint-config-airbnb-base": "^14.2.1",
-    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-jsx-no-leaked-values": "^0.1.24",
     "esprima": "^4.0.1",
     "getopts": "^2.3.0",
     "glob": "^7.1.6",
     "glob-parent": "^6.0.2",
     "globby": "^13.1.1",
     "handlebars": "^4.7.7",
+    "ignore": "^7.0.5",
     "is-port-reachable": "^3.1.0",
     "json-beautify": "^1.1.1",
-    "mkdirp": "^1.0.4",
-    "nps": "^5.10.0",
     "postcss": "^8.4.5",
     "postcss-cli": "^9.1.0",
     "postcss-selector-parser": "^6.0.10",
@@ -62,22 +60,27 @@
     "properties-reader": "^2.2.0",
     "recursive-readdir": "^2.2.2",
     "resolve": "^1.20.0",
-    "rimraf": "^3.0.2",
     "slash": "3.0.0",
-    "vite": "^4.4.9",
+    "string-argv": "^0.3.2",
+    "vite": "^5.4.8",
+    "vite-plugin-istanbul": "^6.0.2",
     "wdio-chromedriver-service": "^7.3.2"
   },
   "peerDependencies": {
     "chromedriver": "*",
-    "typescript": "^4.9.4"
+    "typescript": "^5.6.2"
   },
   "peerDependenciesMeta": {
     "typescript": {
       "optional": true
     }
   },
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
   "devDependencies": {
-    "esbuild": "^0.19.9",
+    "esbuild": "^0.25.0",
     "yargs": "^17.5.1"
-  }
-}
+  },
+  "gitHead": "7085c56734ce3d5f34881adcd86a407d2216344b"
+}

package/tsconfig.json

@@ -0,0 +1,18 @@
+{
+	"compilerOptions": {
+		"target": "ES2021",
+		"lib": [
+			"DOM",
+			"DOM.Iterable",
+			"ES2023"
+		],
+		"declaration": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"inlineSources": true,
+		"strict": true,
+		"moduleResolution": "node",
+		"jsx": "react-jsx",
+		"jsxImportSource": "@ui5/webcomponents-base",
+	}
+}

package/lib/css-processors/css-processor-component-styles.mjs

@@ -1,48 +0,0 @@
-import { globby } from "globby";
-import * as esbuild from 'esbuild'
-import * as fs from "fs";
-import * as path from "path";
-import { writeFile, mkdir } from "fs/promises";
-import scopeVariables from "./scope-variables.mjs";
-
-const packageJSON = JSON.parse(fs.readFileSync("./package.json"))
-const inputFiles = await globby("src/styles/*.module.css");
-const restArgs = process.argv.slice(2);
-
-let componentStylesPlugin = {
-    name: 'component-styles',
-    setup(build) {
-        build.initialOptions.write = false;
-
-        build.onEnd(result => {
-            result.outputFiles.forEach(async f => {
-                // scoping
-                const newText = scopeVariables(f.text, packageJSON);
-                await mkdir(path.dirname(f.path), {recursive: true});
-                writeFile(f.path, newText);
-                writeFile(f.path.replace(".module.css", ".css"), newText);
-            });
-        })
-    },
-}
-
-const config = {
-    entryPoints: inputFiles,
-    outdir: 'dist',
-    bundle: true,
-    outbase: 'src',
-    loader: {
-        ".module.css": "global-css"
-    },
-    plugins: [
-        componentStylesPlugin,
-    ]
-};
-
-if (restArgs.includes("-w")) {
-    let ctx = await esbuild.context(config);
-    await ctx.watch()
-    console.log('watching...')
-} else {
-    await esbuild.build(config);
-}

package/lib/dev-server/ssr-dom-shim-loader.js

@@ -1,26 +0,0 @@
-const fs = require("fs");
-
-/**
- * UI5Elements loads the ssr-dom.js file with a package specifier to use the export conditions
- * in the package.json so that a shim for the dom can be loaded from SSR environments
- * This however makes the TS Checker plugin used for development try to load the file from dist as input
- * This plugin loads an empty file and TS ignores the file completely
- */
-
-const ssrDomShimLoader = async () => {
-	return {
-		name: 'ssr-dom-shim-loader',
-		resolveId(id) {
-			if (id === "@ui5/webcomponents-base/dist/ssr-dom.js") {
-				return "\0shim"
-			}
-		},
-		load(id) {
-			if (id === "\0shim") {
-				return "";
-			}
-		}
-	}
-};
-
-module.exports = ssrDomShimLoader;