feat(ui5-tooling-modules): serializer for JSDoc in control wrappers

packages/ui5-tooling-modules/lib/rollup-plugin-webcomponents.js

@@ -6,6 +6,7 @@ const WebComponentRegistry = require("./utils/WebComponentRegistry");
 
 const { compile } = require("handlebars");
 const { lt, gte } = require("semver");
+const JSDocSerializer = require("./utils/JSDocSerializer");
 
 // checks wehether the given class is based on UI5Element
 const isUI5Element = (clazz) => {
@@ -301,6 +302,7 @@ module.exports = function ({ log, resolveModule, pkgJson, getPackageJson, framew
 					metadata,
 					namespace,
 					enums: lib.enums,
+					interfaces: lib.interfaces,
 					hasEnums: Object.keys(lib.enums).length > 0,
 					dependencies: lib.dependencies,
 					isBaseLib: namespace === "@ui5/webcomponents-base",
@@ -344,7 +346,12 @@ module.exports = function ({ log, resolveModule, pkgJson, getPackageJson, framew
 					library: `${ui5Metadata.namespace}.library`, // if not defined, the library is derived from the namespace
 					designtime: `${ui5Metadata.namespace}/designtime/${clazz.name}.designtime`, // add a default designtime
 				});
-				const metadata = JSON.stringify(metadataObject, undefined, 2);
+
+				// TODO: Merge with Peter's code + move "tag", "library" and "designtime" to WebComponentRegistry
+				clazz._ui5metadata = metadataObject;
+				JSDocSerializer.serializeMetadata(clazz);
+				const metadata = clazz._jsDoc.metadata;
+				// const metadata = JSON.stringify(metadataObject, undefined, 2);
 				const webcModule = moduleInfo.attributes.absModulePath;
 				const webcClass = webcModule.replace(/\\/g, "/"); // is the absolute path of the original Web Component class
 
@@ -367,10 +374,14 @@ module.exports = function ({ log, resolveModule, pkgJson, getPackageJson, framew
 					webcBaseClass = `${namespace}/${module}`;
 				}
 
+				// JSDoc Serialization for the class header
+				const jsDocClassHeader = clazz._jsDoc?.classHeader;
+
 				// generate the WebComponentControl code
 				const code = webcTmplFnControl({
 					ui5Class,
 					namespace,
+					jsDocClassHeader,
 					metadata,
 					webcClass,
 					webcBaseClass,

packages/ui5-tooling-modules/lib/templates/Package.hbs

@@ -37,14 +37,21 @@ const pkg = {
 	"_ui5metadata": {{{metadata}}}
 };
 
+// Interfaces
+{{#each interfaces}}
+{{this._jsDoc}}
+{{/each}}
+
+// Enums
 {{#each enums}}
-pkg["{{@key}}"] = {
-{{#each this}}
-	"{{this}}": "{{this}}",
+{{this._jsDoc}}
+pkg["{{this.name}}"] = {
+{{#each this.values}}
+	{{this._jsDoc}}
+	"{{this.name}}": "{{this.name}}",
 {{/each}}
 };
-registerEnum("{{../namespace}}.{{@key}}", pkg["{{@key}}"]);
-
+registerEnum("{{this.prefixedName}}", pkg["{{this.name}}"]);
 {{/each}}
 
 export default pkg;

packages/ui5-tooling-modules/lib/templates/WrapperControl.hbs

@@ -11,6 +11,7 @@ import EnabledPropagator from "sap/ui/core/EnabledPropagator";
 import MessageMixin from "sap/ui/core/message/MessageMixin";
 {{/if}}
 
+{{{jsDocClassHeader}}}
 const WrapperClass = WebComponentBaseClass.extend("{{ui5Class}}", {
   metadata: {{{metadata}}},
   // TODO: Quick solution to fix a conversion between "number" and "core.CSSSize".

packages/ui5-tooling-modules/lib/templates/jsdoc/BasicComment.hbs

@@ -0,0 +1,3 @@
+/**
+ * {{{description}}}
+ */

packages/ui5-tooling-modules/lib/templates/jsdoc/ClassHeader.hbs

@@ -0,0 +1,8 @@
+/**
+ * @class
+ * {{{description}}}
+ * @extends {{extendsTag}}
+ * @constructor
+ * @public
+ * @alias {{alias}}
+ */

packages/ui5-tooling-modules/lib/templates/jsdoc/EnumHeader.hbs

@@ -0,0 +1,6 @@
+/**
+ * {{description}}
+ * @enum {string}
+ * @public
+ * @alias {{alias}}
+ */

packages/ui5-tooling-modules/lib/templates/jsdoc/EnumValue.hbs

@@ -0,0 +1,4 @@
+/**
+ * {{description}}
+ * @public
+ */

packages/ui5-tooling-modules/lib/templates/jsdoc/Event.hbs

@@ -0,0 +1,13 @@
+/**
+ * {{{description}}}
+ */
+"{{eventName}}": {
+{{#if event.parameters}}
+    "parameters": {
+    {{#each event.parameters}}
+{{lookup @root.parametersJsDoc @key}}
+        "{{@key}}": {{{json this}}},
+    {{/each}}
+    }
+{{/if}}
+},

packages/ui5-tooling-modules/lib/templates/jsdoc/Interface.hbs

@@ -0,0 +1,6 @@
+/**
+ * {{description}}
+ * @name {{alias}}
+ * @interface
+ * @public
+ */

packages/ui5-tooling-modules/lib/templates/jsdoc/MethodsAndGetter.hbs

@@ -0,0 +1,9 @@
+/**
+ * {{{description}}}
+{{#each parameters}}
+ * @param {{escapeType this.type}} {{this.name}} {{this.description}}
+{{/each}}
+ * @public
+ * @name {{alias}}
+ * @function
+ */

packages/ui5-tooling-modules/lib/templates/jsdoc/UI5Metadata.hbs

@@ -0,0 +1,51 @@
+{
+  "tag": "{{metadata.tag}}",
+  "library": "{{metadata.library}}",
+  "designtime": "{{metadata.designtime}}",
+
+  "namespace": "{{metadata.namespace}}",
+  "interfaces": {{{json metadata.interfaces}}},
+
+  "defaultAggregation": "{{metadata.defaultAggregation}}",
+
+  "properties": {
+  {{#each metadata.properties}}
+{{{lookup (lookup @root.jsDoc "properties") @key}}}
+    "{{@key}}": {{{json this}}},
+  {{/each}}
+  },
+
+  "aggregations": {
+  {{#each metadata.aggregations}}
+{{{lookup (lookup @root.jsDoc "aggregations") @key}}}
+    "{{@key}}": {{{json this}}},
+  {{/each}}
+  },
+
+  "associations": {
+  {{#each metadata.associations}}
+{{{lookup (lookup @root.jsDoc "associations") @key}}}
+    "{{@key}}": {{{json this}}},
+  {{/each}}
+  },
+
+  "events": {
+    {{#each jsDoc.events}}
+{{{this.serializedJsDoc}}}
+    {{/each}}
+  },
+
+  "getters": [
+    {{#each metadata.getters}}
+{{{lookup (lookup (lookup @root.jsDoc "getters") this) "serializedJsDoc"}}}
+      "{{this}}",
+    {{/each}}
+  ],
+
+  "methods": [
+    {{#each metadata.methods}}
+{{{lookup (lookup (lookup @root.jsDoc "methods") this) "serializedJsDoc"}}}
+      "{{this}}",
+    {{/each}}
+  ]
+}