@ui5/webcomponents-tools 1.10.3 → 1.11.0-rc.0

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.11.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.10.4-rc.0...v1.11.0-rc.0) (2023-02-02)
+
+**Note:** Version bump only for package @ui5/webcomponents-tools
+
+
+
+
+
+## [1.10.4-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.10.3...v1.10.4-rc.0) (2023-01-26)
+
+**Note:** Version bump only for package @ui5/webcomponents-tools
+
+
+
+
+
 ## [1.10.3](https://github.com/SAP/ui5-webcomponents/compare/v1.10.2...v1.10.3) (2023-01-25)
 
 **Note:** Version bump only for package @ui5/webcomponents-tools

package/components-package/nps.js

@@ -42,17 +42,17 @@ const getScripts = (options) => {
 	}
 
 	const scripts = {
-		clean: 'rimraf jsdoc-dist && rimraf dist && rimraf .port && nps "scope.testPages.clean"',
+		clean: 'rimraf jsdoc-dist && rimraf src/generated && rimraf dist && rimraf .port && nps "scope.testPages.clean"',
 		lint: `eslint . ${eslintConfig}`,
 		lintfix: `eslint . ${eslintConfig}`,
 		prepare: {
-			default: "nps clean prepare.all generateAPI",
-			all: 'concurrently "nps build.templates" "nps build.i18n" "nps prepare.styleRelated" "nps copy" "nps typescript" "nps build.illustrations"',
+			default: "nps clean prepare.all typescript generateAPI",
+			all: 'concurrently "nps build.templates" "nps build.i18n" "nps prepare.styleRelated" "nps copy" "nps build.illustrations"',
 			styleRelated: "nps build.styles build.jsonImports build.jsImports",
 		},
 		typescript: tsCommand,
 		build: {
-			default: "nps lint prepare build.bundle",
+			default: "nps prepare lint build.bundle",
 			templates: `mkdirp dist/generated/templates && node "${LIB}/hbs2ui5/index.js" -d src/ -o dist/generated/templates`,
 			styles: {
 				default: "nps build.styles.themes build.styles.components",
@@ -61,7 +61,7 @@ const getScripts = (options) => {
 			},
 			i18n: {
 				default: "nps build.i18n.defaultsjs build.i18n.json",
-				defaultsjs: `node "${LIB}/i18n/defaults.js" src/i18n dist/generated/i18n`,
+				defaultsjs: `node "${LIB}/i18n/defaults.js" src/i18n src/generated/i18n`,
 				json: `node "${LIB}/i18n/toJSON.js" src/i18n dist/generated/assets/i18n`,
 			},
 			jsonImports: {
@@ -120,8 +120,9 @@ const getScripts = (options) => {
 			bundle: `node ${LIB}/dev-server/dev-server.js ${viteConfig}`,
 		},
 		generateAPI: {
-			default: "nps generateAPI.prepare generateAPI.preprocess generateAPI.jsdoc generateAPI.cleanup",
+			default: "nps generateAPI.prepare generateAPI.preprocess generateAPI.jsdoc generateAPI.cleanup generateAPI.prepareManifest",
 			prepare: `node "${LIB}/copy-and-watch/index.js" --silent "dist/**/*.js" jsdoc-dist/`,
+			prepareManifest: `node "${LIB}/generate-custom-elements-manifest/index.js" dist dist`,
 			preprocess: `node "${preprocessJSDocScript}" jsdoc-dist/ src`,
 			jsdoc: `jsdoc -c "${LIB}/jsdoc/configTypescript.json"`,
 			cleanup: "rimraf jsdoc-dist/"

package/icons-collection/nps.js

@@ -43,13 +43,13 @@ const getScripts = (options) => {
 	const copyAssetsCmd = copyIconAssetsCommand(options);
 
 	const scripts = {
-		clean: "rimraf dist",
+		clean: "rimraf dist && rimraf src/generated",
 		copy: copyAssetsCmd,
 		build: {
-			default: `nps clean typescript copy build.i18n build.icons build.jsonImports`,
+			default: `nps clean copy build.i18n typescript build.icons build.jsonImports`,
 			i18n: {
 				default: "nps build.i18n.defaultsjs build.i18n.json",
-				defaultsjs: `mkdirp dist/generated/i18n && node "${LIB}/i18n/defaults.js" src/i18n dist/generated/i18n`,
+				defaultsjs: `mkdirp dist/generated/i18n && node "${LIB}/i18n/defaults.js" src/i18n src/generated/i18n`,
 				json: `mkdirp dist/generated/assets/i18n && node "${LIB}/i18n/toJSON.js" src/i18n dist/generated/assets/i18n`,
 			},
 			jsonImports: {

package/lib/generate-custom-elements-manifest/index.js

@@ -1,9 +1,12 @@
 const fs = require("fs").promises;
+const path = require("path");
 // https://github.com/webcomponents/custom-elements-manifest/blob/main/schema.json
 
+const inputDir = process.argv[2];
+const outputDir = process.argv[3];
+
 const camelToKebabMap = new Map();
 const apiIndex = new Map();
-const processedApiIndex = new Set();
 const forbiddenAttributeTypes = ["object", "array"];
 
 const camelToKebabCase = string => {
@@ -16,7 +19,7 @@ const camelToKebabCase = string => {
 
 const generateJavaScriptExport = entity => {
 	return {
-		declaration: generateRefenrece(entity),
+		declaration: generateRefenrece(entity.name),
 		deprecated: !!entity.deprecated,
 		kind: "js",
 		name: "default",
@@ -226,8 +229,6 @@ const generateSlots = slots => {
 };
 
 const generateCustomElementDeclaration = entity => {
-	entity = generateFullComponentApi(entity);
-
 	let generatedCustomElementDeclaration = {
 		deprecated: !!entity.deprecated,
 		customElement: true,
@@ -265,107 +266,60 @@ const generateCustomElementDeclaration = entity => {
 	}
 
 	if (entity.extends && entity.extends !== "HTMLElement") {
-		generatedCustomElementDeclaration.superclass = generateRefenrece(apiIndex.get(entity.extends));
+		generatedCustomElementDeclaration.superclass = generateRefenrece(entity.extends);
 	}
 
 	return generatedCustomElementDeclaration;
 };
 
-const generateRefenrece = (entity) => {
+const generateRefenrece = (entityName) => {
 	let packageName;
+	let basename;
 
-	if (!entity.name) {
+	if (!entityName) {
 		throw new Error("JSDoc error: entity not found in api.json.");
 	}
 
-	if (entity.name.includes("sap.ui.webc.main")) {
+	if (entityName.includes(".")) {
+		basename = entityName.split(".").pop();
+	} else {
+		basename = entityName
+	}
+
+	if (entityName.includes("sap.ui.webc.main")) {
 		packageName = "@ui5/webcomponents";
-	} else if (entity.name.includes("sap.ui.webc.fiori")) {
+	} else if (entityName.includes("sap.ui.webc.fiori")) {
 		packageName = "@ui5/webcomponents-fiori";
-	} else if (entity.name.includes("sap.ui.webc.base")) {
+	} else if (entityName.includes("sap.ui.webc.base")) {
 		packageName = "@ui5/webcomponents-base";
 	}
 
 	return {
-		module: `${entity.module}.js`,
-		name: `${entity.basename}`,
+		module: `${basename}.js`,
+		name: `${basename}`,
 		package: packageName,
 	};
 };
 
-const generateFullComponentApi = entity => {
-	const componentProps = ["properties", "slots", "events", "methods"];
-	let parent = apiIndex.get(entity.extends);
-
-	if (!parent) {
-		processedApiIndex.add(entity.name);
-
-		return entity;
-	}
-
-	parent = processedApiIndex.has(entity.extends) ? apiIndex.get(entity.extends) : generateFullComponentApi(parent);
-
-	componentProps.forEach(prop => {
-		if (parent[prop] && parent[prop].length) {
-			if (entity[prop] && entity[prop].length) {
-				const uniqueParentState = parent[prop].filter(pSlot => {
-					return !entity[prop].some(eSlot => eSlot.name === pSlot.name);
-				});
-
-				entity[prop] = entity[prop].concat(uniqueParentState);
-			} else {
-				entity[prop] = [...parent[prop]];
-			}
-		}
-	});
-
-	processedApiIndex.add(entity.name);
-
-	return entity;
-};
-
 const filterPublicApi = array => {
 	return (array || []).filter(el => el.visibility === "public");
 };
 
 const generate = async () => {
-	const apiFilesPaths = [
-		require.resolve("@ui5/webcomponents-base/dist/api.json"),
-		require.resolve("@ui5/webcomponents/dist/api.json"),
-		require.resolve("@ui5/webcomponents-fiori/dist/api.json"),
-	];
-
-	let apiFiles = new Map();
-
-	await Promise.all(apiFilesPaths.map(async (apiFilePath) => {
-		const file = JSON.parse(await fs.readFile(apiFilePath));
-
-		apiFiles.set(apiFilePath, file);
-
-		file.symbols.forEach(symbol => {
-			apiIndex.set(symbol.name, symbol);
-		});
-	}));
+	const file = JSON.parse(await fs.readFile(path.join(inputDir, "api.json")));
+	let customElementsManifest = {
+		schemaVersion: "1.0.0",
+		readme: "",
+		modules: [],
+	};
 
-	await Promise.all(apiFilesPaths.map(async (apiFilePath) => {
-		if (apiFilePath.includes("base")) {
-			return;
+	file.symbols.forEach(entity => {
+		if (entity.tagname) {
+			customElementsManifest.modules.push(generateJavaScriptModule(entity));
 		}
+	});
 
-		let customElementsManifest = {
-			schemaVersion: "1.0.0",
-			readme: "",
-			modules: [],
-		};
-
-		apiFiles.get(apiFilePath).symbols.forEach(entity => {
-			if (entity.tagname) {
-				customElementsManifest.modules.push(generateJavaScriptModule(entity));
-			}
-		});
-
-		await fs.writeFile(apiFilePath.replace("api.json", "custom-elements.json"), JSON.stringify(customElementsManifest));
-	}));
+	await fs.writeFile(path.join(outputDir, "custom-elements.json"), JSON.stringify(customElementsManifest));
 };
 
 generate().then(() => {

package/lib/i18n/defaults.js

@@ -8,7 +8,7 @@ const generate = async () => {
 
 	const messageBundle = path.normalize(`${process.argv[2]}/messagebundle.properties`);
 	const messageBundleDefaultLanguage = path.normalize(`${process.argv[2]}/messagebundle_${defaultLanguage}.properties`);
-	const outputFile = path.normalize(`${process.argv[3]}/i18n-defaults.js`);
+	const outputFile = path.normalize(`${process.argv[3]}/i18n-defaults.ts`);
 
 	if (!messageBundle || !outputFile) {
 		return;
@@ -45,7 +45,7 @@ const generate = async () => {
 		let effectiveValue = defaultLanguageValue || value;
 		effectiveValue = effectiveValue.replace(/\"/g, "\\\""); // escape double quotes in translations
 
-		return `const ${key} = {key: "${key}", defaultText: "${effectiveValue}"};`;
+		return `const ${key}: I18nText = {key: "${key}", defaultText: "${effectiveValue}"};`;
 	};
 
 	/*
@@ -62,7 +62,8 @@ const generate = async () => {
 		const textKeys = Object.keys(properties);
 		const texts = textKeys.map(prop => getTextInfo(prop, properties[prop], defaultLanguageProperties && defaultLanguageProperties[prop])).join('');
 
-		return `${texts}
+		return `import { I18nText } from "@ui5/webcomponents-base/dist/i18nBundle.js";
+${texts}
 export {${textKeys.join()}};`;
 	};
 

package/lib/postcss-css-to-esm/index.js

@@ -4,15 +4,17 @@ const mkdirp = require('mkdirp');
 const assets = require("../../assets-meta.js");
 
 const DEFAULT_THEME = assets.themes.default;
+const requiredImports = "import type { StyleData } from \"@ui5/webcomponents-base/dist/types.js\";";
 
 const getDefaultThemeCode = packageName => {
 	return `import { registerThemePropertiesLoader } from "@ui5/webcomponents-base/dist/asset-registries/Themes.js";
+${requiredImports}
 
 import defaultThemeBase from "@ui5/webcomponents-theming/dist/generated/themes/${DEFAULT_THEME}/parameters-bundle.css.js";
 import defaultTheme from "./${DEFAULT_THEME}/parameters-bundle.css.js";
 
-registerThemePropertiesLoader("@ui5/webcomponents-theming", "${DEFAULT_THEME}", () => defaultThemeBase);
-registerThemePropertiesLoader("${packageName}", "${DEFAULT_THEME}", () => defaultTheme);
+registerThemePropertiesLoader("@ui5/webcomponents-theming", "${DEFAULT_THEME}", async () => defaultThemeBase);
+registerThemePropertiesLoader("${packageName}", "${DEFAULT_THEME}", async () => defaultTheme);
 `;
 };
 
@@ -33,12 +35,12 @@ module.exports = function (opts) {
 			let css = root.toString();
 			css = proccessCSS(css);
 
-			const targetFile = root.source.input.from.replace(`/${opts.toReplace}/`, "/dist/generated/").replace(`\\${opts.toReplace}\\`, "\\dist\\generated\\");
+			const targetFile = root.source.input.from.replace(`/${opts.toReplace}/`, "/src/generated/").replace(`\\${opts.toReplace}\\`, "\\src\\generated\\");
 			mkdirp.sync(path.dirname(targetFile));
 
-			const filePath = `${targetFile}.js`;
-			const defaultTheme = opts.includeDefaultTheme ? getDefaultThemeCode(opts.packageName) : ``;
-			
+			const filePath = `${targetFile}.ts`;
+			const defaultTheme = opts.includeDefaultTheme ? getDefaultThemeCode(opts.packageName) : requiredImports;
+
 			// it seems slower to read the old content, but writing the same content with no real changes
 			// (as in initial build and then watch mode) will cause an unnecessary dev server refresh
 			let oldContent = "";
@@ -47,7 +49,11 @@ module.exports = function (opts) {
 			} catch (e) {
 				// file not found
 			}
-			const content = `${defaultTheme}export default {packageName:"${opts.packageName}",fileName:"${targetFile.substr(targetFile.lastIndexOf("themes"))}",content:${css}}`
+
+			const content = `${defaultTheme}
+const styleData: StyleData = {packageName:"${opts.packageName}",fileName:"${targetFile.substr(targetFile.lastIndexOf("themes"))}",content:${css}};
+export default styleData;
+`;
 			if (content !== oldContent) {
 				fs.writeFileSync(filePath, content);
 			}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents-tools",
-  "version": "1.10.3",
+  "version": "1.11.0-rc.0",
   "description": "UI5 Web Components: webcomponents.tools",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -72,5 +72,5 @@
   "devDependencies": {
     "yargs": "^17.5.1"
   },
-  "gitHead": "78222ac6ff90e19163d924b84ef405d39943e98d"
+  "gitHead": "6464abd79265425ce65232ebeee53cf6585e6ec6"
 }