feat(create): --monorepo flag

Author: bennypowers

.changeset/tricky-tools-joke.md

@@ -0,0 +1,7 @@
+---
+"@patternfly/create-element": minor
+---
+
+Adds `--monorepo` flag to generator.
+In most cases, this is automatically derived from the root package.json.
+Override with `--monorepo` or `--no-monorepo`.

tools/create-element/generator/element.ts

@@ -80,6 +80,17 @@ const TEMPLATE_FILE_PATHS: Record<FileKey, string> = {
   tsconfig: 'tsconfig.json',
 };
 
+function isMonorepoFileKey(key: FileKey): boolean {
+  switch (key) {
+    case FileKey.package:
+    case FileKey.cemConfig:
+    case FileKey.tsconfig:
+      return true;
+    default:
+      return false;
+  }
+}
+
 /** Get output files */
 const getFilePathsRelativeToPackageDir =
   memoize((options: GenerateElementOptions): Record<FileKey, string> => ({
@@ -163,6 +174,10 @@ async function getTemplate(key: FileKey): Promise<string> {
 }
 
 async function writeComponentFile(key: FileKey, options: GenerateElementOptions) {
+  if (!options.monorepo && isMonorepoFileKey(key)) {
+    return;
+  }
+
   const PATH = getOutputFilePath(key, options);
   const TEMPLATE = await getTemplate(key);
   const DATA = getInterpolations(options);
@@ -204,8 +219,10 @@ async function analyzeElement(options: GenerateElementOptions): Promise<void> {
     console.log(`\nAnalyzing ${greenBright(options.tagName)}`);
   }
 
+  const monorepoArgs = !options.monorepo ? [] : ['--prefix', getComponentAbsPath(options)];
+
   const { stderr, stdout } =
-    await execa('npm', ['run', 'analyze', '--prefix', getComponentAbsPath(options)], {
+    await execa('npm', ['run', 'analyze', ...monorepoArgs], {
       all: true,
       cwd: options.directory,
     });
@@ -250,7 +267,9 @@ export async function generateElement(options: GenerateElementOptions): Promise<
   } else {
     await writeElementFiles(options);
     await analyzeElement(options);
-    await updateTsconfig(options);
-    await execaCommand('npm install');
+    if (options.monorepo) {
+      await updateTsconfig(options);
+      await execaCommand('npm install');
+    }
   }
 }

tools/create-element/main.ts

@@ -3,11 +3,14 @@ import { generateElement } from './generator/element.js';
 import Chalk from 'chalk';
 import Yargs from 'yargs';
 import prompts from 'prompts';
+import { readJson } from './generator/files.js';
+import { join } from 'node:path';
 
 export interface BaseOptions {
   silent: boolean;
   directory: string;
   overwrite: boolean;
+  monorepo: boolean;
 }
 
 export interface AppOptions extends BaseOptions {
@@ -30,6 +33,18 @@ const ERR_BAD_CE_TAG_NAME =
 
 const b = Chalk.cyanBright;
 
+interface PackageJSON {
+  customElements?: string;
+  name: string;
+  version: string;
+  workspaces?: string;
+}
+
+async function isMonorepo() {
+  const { workspaces } = await readJson<PackageJSON>(join(process.cwd(), 'package.json'));
+  return !!workspaces;
+}
+
 function banner() {
   console.log(`${Chalk.cyan(`
                     ${b('`qQQQQQQg.')}
@@ -72,7 +87,7 @@ export async function promptForElementGeneratorOptions(
       initial: options?.tagName ?? '',
       validate: name => name.includes('-') || ERR_BAD_CE_TAG_NAME,
     }, {
-      type: () => !options?.scope && 'text',
+      type: () => (!options?.scope && options?.monorepo) ? 'text' : false,
       name: 'scope',
       message: 'What is the package\'s NPM scope?',
       initial: options?.scope ?? ''
@@ -111,6 +126,11 @@ export async function main(): Promise<void> {
         default: false,
         description: 'Overwrite files without prompting',
       })
+      .option('monorepo', {
+        type: 'boolean',
+        default: await isMonorepo(),
+        description: 'Generate an npm package for the element'
+      })
       .help()
       .check(({ name }) => {
         if (typeof name === 'string' && !name.includes('-')) {

tools/pfe-tools/11ty/DocsPage.ts

@@ -14,6 +14,8 @@ import nunjucks, { Environment } from 'nunjucks';
 interface PackageJSON {
   customElements?: string;
   name: string;
+  version: string;
+  workspaces?: string;
 }
 
 export interface RenderKwargs {