chore: add build step to generate react docgen metadata (#4662)

* chore: add build step to generate react docgen metadata

* fix: ci check

package.json

@@ -188,6 +188,7 @@
       "/dist/",
       "/es/",
       "/lib/",
+      "/build/",
       "e2e",
       "examples",
       "/umd/"

packages/react/.gitignore

@@ -1,2 +1,5 @@
 # Storybook
 storybook-static
+
+# Generated metadata
+react-docgen.json

packages/react/package.json

@@ -26,7 +26,7 @@
   "scripts": {
     "build": "yarn clean && node scripts/build.js",
     "build-storybook": "build-storybook",
-    "clean": "rimraf es lib umd storybook-static",
+    "clean": "rimraf es lib umd storybook-static build react-docgen.json",
     "prepublish": "yarn build",
     "start": "yarn storybook",
     "storybook": "rimraf node_modules/.cache/storybook && start-storybook -p 9000"

packages/react/scripts/build.js

@@ -3,6 +3,8 @@
 const { execSync } = require('child_process');
 const { inInstall } = require('in-publish');
 const path = require('path');
+const fs = require('fs');
+const mapValues = require('lodash/mapValues');
 
 if (inInstall()) {
   process.exit(0);
@@ -32,6 +34,16 @@ try {
   exec(`${babelPath} src -q -d lib --ignore "${ignoreGlobs}"`, {
     BABEL_ENV: 'cjs',
   });
+
+  // Create docgen metadata
+  exec(`${babelPath} src -q -d build/docgen --ignore "${ignoreGlobs}"`, {
+    BABEL_ENV: 'docgen',
+  });
+  fs.writeFileSync(
+    'react-docgen.json',
+    JSON.stringify(mapValues(require(`../build/docgen`), '__docgenInfo'))
+  );
+
   exec(
     `${rollupPath} -c scripts/rollup.config.js -o umd/carbon-components-react.js`,
     {

packages/react/scripts/env.js

@@ -2,6 +2,17 @@
 
 const BABEL_ENV = process.env.BABEL_ENV;
 
+const docgenConfig = {
+  plugins: [
+    [
+      'babel-plugin-react-docgen',
+      {
+        removeMethods: true,
+      },
+    ],
+  ],
+};
+
 module.exports = () => ({
   presets: [
     [
@@ -14,4 +25,5 @@ module.exports = () => ({
       },
     ],
   ],
+  ...(BABEL_ENV === 'docgen' && docgenConfig),
 });