feat: add description for properties

db-ui · Sep 20, 2024 · 020fbc4 · 020fbc4
1 parent c1f8c0d
commit 020fbc4
Show file tree

Hide file tree

Showing 6 changed files with 1,453 additions and 37 deletions.
diff --git a/output/stencil/custom-elements-manifest.config.js b/output/stencil/custom-elements-manifest.config.js
@@ -2,6 +2,8 @@ import { generateVsCodeCustomElementData } from 'custom-element-vs-code-integrat
 import { getTsProgram } from 'cem-plugin-expanded-types';
 import { resolveTypesPlugin } from './scripts/resolveTypes.js';
 import { generateJetBrainsWebTypes } from 'custom-element-jet-brains-integration';
+import { writeFileSync } from 'node:fs';
+import { customElementsManifestToMarkdown } from '@custom-elements-manifest/to-markdown';
 
 const outdir = './dist';
 
@@ -42,6 +44,19 @@ export default {
 	},
 	plugins: [
 		resolveTypesPlugin(({ customElementsManifest }) => {
+			writeFileSync(
+				`${outdir}/custom-elements.md`,
+				customElementsManifestToMarkdown(customElementsManifest, {
+					private: 'hidden',
+					omitDeclarations: [
+						'mixins',
+						'variables',
+						'functions',
+						'exports'
+					],
+					omitSections: ['attributes', 'methods']
+				})
+			);
 			generateVsCodeCustomElementData(
 				customElementsManifest,
 				vsCodeOptions

diff --git a/output/stencil/package.json b/output/stencil/package.json
@@ -41,5 +41,8 @@
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
-  "web-types": "./dist/web-types.json"
+  "web-types": "./dist/web-types.json",
+  "dependencies": {
+    "@custom-elements-manifest/to-markdown": "^0.1.0"
+  }
 }
diff --git a/output/stencil/scripts/analyzePhase.js b/output/stencil/scripts/analyzePhase.js
@@ -66,36 +66,37 @@ const getTypeOfList = (type) => {
  * @param ts {object} Typescript ast
  * @param members {object[]}
  */
-const getMembers = (ts, members) => {
-	return {
-		values: members.map((member) => {
-			const memberType = member.type;
-			let type;
+const getMembers = (ts, members) => ({
+	values: members.map((member) => {
+		const memberType = member.type;
+		const comment = member.jsDoc?.map((doc) => doc.comment).join('\n');
+		let type;
 
-			if (memberType.typeName) {
-				type = memberType?.typeName?.escapedText;
-			} else if (memberType.types) {
-				type = getUnions(ts, memberType.types);
-			} else {
-				type = getPrimitive(ts, memberType.kind);
-			}
+		if (memberType.typeName) {
+			type = memberType?.typeName?.escapedText;
+		} else if (memberType.types) {
+			type = getUnions(ts, memberType.types);
+		} else {
+			type = getPrimitive(ts, memberType.kind);
+		}
 
-			return {
-				name: member.name.escapedText,
-				type
-			};
-		}),
-		type: 'props'
-	};
-};
+		return {
+			name: member.name.escapedText,
+			type,
+			comment
+		};
+	}),
+	type: 'props'
+});
 
-export const analyzePhase = ({ ts, node, moduleDoc, context }) => {
+export const analyzePhase = ({ ts, node,  context }) => {
 	if (!context.data) {
 		context.data = {};
 	}
 
-	// ts.SyntaxKind.Bundle
-	if (node.kind === 312) {
+	const sourceFile = ts.SyntaxKind['SourceFile'];
+
+	if (node.kind === sourceFile) {
 		if (node.symbol.exports) {
 			node.symbol.exports.forEach((localExport) => {
 				const name = localExport.escapedName;

diff --git a/output/stencil/scripts/packageLinkPhase.js b/output/stencil/scripts/packageLinkPhase.js
@@ -46,11 +46,11 @@ const getFilteredContextData = (data) => {
 /**
  * Resolves props by data
  * @param resolvedData {object}
- * @param name {string}
- * @param type {string}
+ * @param value {object}
  * @return {{resolvedType, name, type}}
  */
-const resolveProp = (resolvedData, name, type) => {
+const resolveProp = (resolvedData, value) => {
+	const { type } = value;
 	if (type !== type?.toLowerCase()) {
 		// This isn't a primitive like string, boolean, etc.
 		const foundData = resolvedData[type];
@@ -61,9 +61,9 @@ const resolveProp = (resolvedData, name, type) => {
 			warn('resolveProp', `Cannot find ${type}`);
 		}
 
-		return { name, type, resolvedType };
+		return { ...value, resolvedType };
 	} else {
-		return { name, type, resolvedType: type };
+		return { ...value, resolvedType: type };
 	}
 };
 
@@ -76,12 +76,12 @@ const resolveAllProps = (resolvedData, resolvedProps) => {
 	for (const [key, obj] of Object.entries(resolvedProps)) {
 		resolvedProps[key] = {
 			...obj,
-			values: obj.values.map(({ name, type }) => {
+			values: obj.values.map((value) => {
+				const { name, type } = value;
 				if (type instanceof Object) {
 					// In this case we have a literal or union
 					return {
-						name,
-						type,
+						...value,
 						resolvedType: type.values
 							.map((val) => {
 								return resolveProp(resolvedData, '', val)
@@ -90,7 +90,7 @@ const resolveAllProps = (resolvedData, resolvedProps) => {
 							.join(unionSeperator)
 					};
 				} else {
-					return resolveProp(resolvedData, name, type);
+					return resolveProp(resolvedData, value);
 				}
 			})
 		};
@@ -162,6 +162,7 @@ const resolveManifestTypes = (resolvedUnions, manifestValues) =>
 		}
 
 		let text = manifestValue.type.text;
+		let resolvedValue;
 		if (text.includes('[')) {
 			const splitText = text.includes("'")
 				? text.split("'")
@@ -176,6 +177,7 @@ const resolveManifestTypes = (resolvedUnions, manifestValues) =>
 					);
 					if (foundResolvedValue) {
 						text = foundResolvedValue.resolvedType;
+						resolvedValue = foundResolvedValue;
 					} else {
 						warn(
 							'resolveManifestTypes',
@@ -187,7 +189,12 @@ const resolveManifestTypes = (resolvedUnions, manifestValues) =>
 				}
 			}
 		}
-		return { ...manifestValue, type: { text } };
+		return {
+			...manifestValue,
+			type: { text },
+			description: resolvedValue?.comment,
+			resolvedValue
+		};
 	});
 
 export const packageLinkPhase = (
@@ -218,8 +225,9 @@ export const packageLinkPhase = (
 
 				return { ...declaration, members, attributes };
 			});
+			const path = module.path.split('/').at(-1);
 
-			return { ...module, declarations };
+			return { ...module, path, declarations };
 		});
 
 	if (postFn) {