Docs parsing exploration

packages/components/.prettierrc.cjs

@@ -3,10 +3,21 @@
 module.exports = {
   plugins: ['prettier-plugin-ember-template-tag'],
   trailingComma: 'es5',
+
+  jsdocPrintWidth: 80,
+
   overrides: [
     {
-      files: '*.{js,gjs,ts,gts,mjs,mts,cjs,cts}',
+      files: '*.{ts,mts,cts,js,cjs,mjs}',
+      options: {
+        singleQuote: true,
+        plugins: ['prettier-plugin-jsdoc'],
+      },
+    },
+    {
+      files: '*.{gjs,gts}',
       options: {
+        plugins: ['prettier-plugin-ember-template-tag'],
         singleQuote: true,
         templateSingleQuote: false,
       },

packages/components/package.json

@@ -17,7 +17,10 @@
   "license": "MPL-2.0",
   "author": "HashiCorp Design Systems <design-systems@hashicorp.com>",
   "scripts": {
-    "build": "rollup --config",
+    "build": "rollup --config && node scripts/parse-docs.mjs",
+    "catalog:build": "node scripts/build-component-catalog.mjs",
+    "catalog:enrich": "node scripts/enrich-component-catalog-from-docs.mjs",
+    "catalog:generate": "node scripts/generate-component-catalog.mjs",
     "format": "prettier . --cache --write",
     "lint": "concurrently \"pnpm:lint:*(!fix)\" --names \"lint:\" --prefixColors auto",
     "lint:fix": "concurrently \"pnpm:lint:*:fix\" --names \"fix:\" --prefixColors auto && pnpm run format",
@@ -92,6 +95,9 @@
     "@types/luxon": "^3.4.2",
     "@types/prismjs": "^1.26.5",
     "babel-plugin-ember-template-compilation": "^2.4.1",
+    "boxen": "^8.0.1",
+    "chalk": "^5.4.1",
+    "cli-table3": "^0.6.5",
     "concurrently": "^9.1.2",
     "ember-basic-dropdown": "^8.8.0",
     "ember-intl": "^8.0.0",
@@ -104,16 +110,20 @@
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-n": "^17.18.0",
     "globals": "^16.0.0",
+    "log-symbols": "^7.0.1",
+    "ora": "^9.4.1",
     "postcss": "^8.5.10",
     "prettier": "^3.5.3",
     "prettier-plugin-ember-template-tag": "^2.0.5",
+    "prettier-plugin-jsdoc": "^1.8.1",
     "rollup": "^4.59.0",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-scss": "^4.0.1",
     "sass": "^1.98.0",
     "stylelint": "^16.17.0",
     "stylelint-config-rational-order": "^0.1.2",
     "stylelint-config-standard-scss": "^14.0.0",
+    "ts-morph": "^28.0.0",
     "typescript": "^5.8.2",
     "typescript-eslint": "^8.29.0",
     "webpack": "^5.97.1"

packages/components/scripts/build-component-catalog.mjs

@@ -0,0 +1,113 @@
+/** Copyright IBM Corp. 2021, 2026 SPDX-License-Identifier: MPL-2.0 */
+
+import { execFileSync } from 'node:child_process';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const SCRIPT_DIR = dirname(fileURLToPath(import.meta.url));
+const GENERATE_SCRIPT_PATH = resolve(SCRIPT_DIR, 'generate-component-catalog.mjs');
+const ENRICH_SCRIPT_PATH = resolve(
+  SCRIPT_DIR,
+  'enrich-component-catalog-from-docs.mjs'
+);
+
+function runNodeScript(scriptPath, args) {
+  execFileSync(process.execPath, [scriptPath, ...args], {
+    stdio: 'inherit',
+  });
+}
+
+function parseCliOptions(argv) {
+  let component = null;
+  let group = null;
+  let provider = null;
+  let yes = false;
+
+  for (let index = 0; index < argv.length; index += 1) {
+    const arg = argv[index];
+
+    if (arg === '--') {
+      continue;
+    }
+
+    if (arg.startsWith('--component=')) {
+      component = arg.slice('--component='.length).trim();
+      continue;
+    }
+
+    if (arg === '--component') {
+      component = `${argv[index + 1] || ''}`.trim();
+      index += 1;
+      continue;
+    }
+
+    if (arg.startsWith('--group=')) {
+      group = arg.slice('--group='.length).trim();
+      continue;
+    }
+
+    if (arg === '--group') {
+      group = `${argv[index + 1] || ''}`.trim();
+      index += 1;
+      continue;
+    }
+
+    if (arg.startsWith('--provider=')) {
+      provider = arg.slice('--provider='.length).trim();
+      continue;
+    }
+
+    if (arg === '--provider') {
+      provider = `${argv[index + 1] || ''}`.trim();
+      index += 1;
+      continue;
+    }
+
+    if (arg === '--yes') {
+      yes = true;
+      continue;
+    }
+
+    throw new Error(`Unknown argument: ${arg}`);
+  }
+
+  return {
+    component,
+    group,
+    provider,
+    yes,
+  };
+}
+
+function main() {
+  const options = parseCliOptions(process.argv.slice(2));
+  const generateArgs = [];
+  const enrichArgs = [];
+
+  if (options.group) {
+    generateArgs.push(`--group=${options.group}`);
+    enrichArgs.push(`--group=${options.group}`);
+  }
+
+  if (options.component) {
+    generateArgs.push(`--component=${options.component}`);
+  }
+
+  if (options.component) {
+    enrichArgs.push(`--component=${options.component}`);
+  }
+
+  if (options.provider) {
+    enrichArgs.push(`--provider=${options.provider}`);
+  }
+
+  enrichArgs.push('--yes');
+
+  console.log('Step 1/2: Generating base component catalog');
+  runNodeScript(GENERATE_SCRIPT_PATH, generateArgs);
+
+  console.log('\nStep 2/2: Enriching catalog with component docs');
+  runNodeScript(ENRICH_SCRIPT_PATH, enrichArgs);
+}
+
+main();