@ui5/webcomponents-tools 1.23.1-rc.0 → 1.24.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.24.0-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.23.1...v1.24.0-rc.0) (2024-03-14)
+
+**Note:** Version bump only for package @ui5/webcomponents-tools
+
+
+
+
+
+## [1.23.1](https://github.com/SAP/ui5-webcomponents/compare/v1.23.1-rc.0...v1.23.1) (2024-03-08)
+
+**Note:** Version bump only for package @ui5/webcomponents-tools
+
+
+
+
+
 ## [1.23.1-rc.0](https://github.com/SAP/ui5-webcomponents/compare/v1.23.0...v1.23.1-rc.0) (2024-03-07)
 
 **Note:** Version bump only for package @ui5/webcomponents-tools

package/components-package/nps.js

@@ -72,9 +72,10 @@ const getScripts = (options) => {
 			default: "nps prepare lint build.bundle", // build.bundle2
 			templates: `mkdirp src/generated/templates && ${tsCrossEnv} node "${LIB}/hbs2ui5/index.js" -d src/ -o src/generated/templates`,
 			styles: {
-				default: `concurrently "nps build.styles.themes" "nps build.styles.components"`,
+				default: `concurrently "nps build.styles.themes" "nps build.styles.components" "nps build.styles.componentStyles"`,
 				themes: `node "${LIB}/css-processors/css-processor-themes.mjs"`,
 				components: `node "${LIB}/css-processors/css-processor-components.mjs"`,
+				componentStyles: `node "${LIB}/css-processors/css-processor-component-styles.mjs"`,
 			},
 			i18n: {
 				default: "nps build.i18n.defaultsjs build.i18n.json",
@@ -108,9 +109,10 @@ const getScripts = (options) => {
 			props: 'nps "copy.props --watch --safe --skip-initial-copy"',
 			bundle: `node ${LIB}/dev-server/dev-server.js ${viteConfig}`,
 			styles: {
-				default: 'concurrently "nps watch.styles.themes" "nps watch.styles.components"',
+				default: 'concurrently "nps watch.styles.themes" "nps watch.styles.components"  "nps watch.styles.componentStyles" ',
 				themes: 'nps "build.styles.themes -w"',
 				components: `nps "build.styles.components -w"`,
+				componentStyles: `nps "build.styles.componentStyles -w"`,
 			},
 			templates: 'chokidar "src/**/*.hbs" -c "nps build.templates"',
 			api: 'chokidar "test/**/*.sample.html" -c "nps generateAPI"',

package/lib/cem/custom-elements-manifest.config.mjs

@@ -19,8 +19,11 @@ import {
 	isClass,
 	normalizeTagType,
 	logDocumentationError,
-	displayDocumentationErrors
+	displayDocumentationErrors,
+	toKebabCase
 } from "./utils.mjs";
+import { generateCustomData } from "cem-plugin-vs-code-custom-data-generator";
+import { customElementJetBrainsPlugin } from "custom-element-jet-brains-integration";
 
 const packageJSON = JSON.parse(fs.readFileSync("./package.json"));
 
@@ -169,6 +172,23 @@ function processClass(ts, classNode, moduleDoc) {
 					member._ui5noAttribute = propertyDecorator?.expression?.arguments[0]?.properties?.find(property => property.name.text === "noAttribute")?.initializer?.kind === ts.SyntaxKind.TrueKeyword || undefined;
 				}
 
+				if (currClass.customElement && member.privacy === "public" && !propertyDecorator?.expression?.arguments[0]?.properties?.find(property => property.name.text === "multiple") && !["object"].includes(member._ui5validator?.toLowerCase())) {
+					const filename = classNode.getSourceFile().fileName;
+					const sourceFile = typeProgram.getSourceFile(filename);
+					const tsProgramClassNode = sourceFile.statements.find(statement => ts.isClassDeclaration(statement) && statement.name?.text === classNode.name?.text);
+					const tsProgramMember = tsProgramClassNode.members.find(m => ts.isPropertyDeclaration(m) && m.name?.text === member.name);
+					const attributeValue = typeChecker.typeToString(typeChecker.getTypeAtLocation(tsProgramMember), tsProgramMember);
+
+					currClass.attributes.push({
+						description: member.description,
+						name: toKebabCase(member.name),
+						default: member.default,
+						fieldName: member.name,
+						type: { text: attributeValue },
+						deprecated: member.deprecated
+					})
+				}
+
 				if (hasTag(memberParsedJsDoc, "formProperty")) {
 					member._ui5formProperty = true;
 				}
@@ -334,7 +354,7 @@ const processPublicAPI = object => {
 		if ((key === "privacy" && object[key] !== "public") || (key === "_ui5privacy" && object[key] !== "public")) {
 			return true;
 		} else if (typeof object[key] === "object") {
-			if (key === "cssParts" || key === "_ui5implements") {
+			if (key === "cssParts" || key === "attributes" || key === "_ui5implements") {
 				continue;
 			}
 
@@ -475,5 +495,7 @@ export default {
 				}
 			}
 		},
+		generateCustomData({ outdir: "dist", cssFileName: null, cssPropertiesDocs: false }),
+		customElementJetBrainsPlugin({ outdir: "dist", cssFileName: null, cssPropertiesDocs: false })
 	],
 };

package/lib/cem/utils.mjs

@@ -14,6 +14,10 @@ const getDeprecatedStatus = (jsdocComment) => {
             : undefined;
 };
 
+const toKebabCase = str => {
+    return str.replaceAll(/[A-Z]+(?![a-z])|[A-Z]/g, ($, ofs) => (ofs ? "-" : "") + $.toLowerCase())
+}
+
 const normalizeDescription = (description) => {
 	return typeof description === 'string' ? description.replaceAll(/^-\s+|^(\n)+|(\n)+$/g, ""): description;
 }
@@ -376,4 +380,5 @@ export {
     normalizeTagType,
     displayDocumentationErrors,
     logDocumentationError,
+    toKebabCase
 };

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

@@ -0,0 +1,47 @@
+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',
+    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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents-tools",
-  "version": "1.23.1-rc.0",
+  "version": "1.24.0-rc.0",
   "description": "UI5 Web Components: webcomponents.tools",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -31,6 +31,7 @@
     "@wdio/spec-reporter": "^7.19.7",
     "@wdio/static-server-service": "^7.19.5",
     "ajv": "^8.12.0",
+    "cem-plugin-vs-code-custom-data-generator": "^1.4.2",
     "chai": "^4.3.4",
     "child_process": "^1.0.2",
     "chokidar": "^3.5.1",
@@ -39,6 +40,7 @@
     "comment-parser": "^1.4.0",
     "concurrently": "^6.0.0",
     "cross-env": "^7.0.3",
+    "custom-element-jet-brains-integration": "^1.4.4",
     "escodegen": "^2.0.0",
     "eslint": "^7.22.0",
     "eslint-config-airbnb-base": "^14.2.1",
@@ -79,5 +81,5 @@
     "esbuild": "^0.19.9",
     "yargs": "^17.5.1"
   },
-  "gitHead": "33cfce9ec9ae9b4e086b976b98e0a77bc75a2e06"
+  "gitHead": "41fccb5ed1980879eac12c7b9c096208b986e79d"
 }