CLI: Split create-storybook package from toolbox

code/lib/create-storybook/.eslintrc.cjs

@@ -0,0 +1,36 @@
+const ignore = 0;
+
+module.exports = {
+  overrides: [
+    {
+      files: 'templates/**/*',
+      env: {
+        browser: true,
+      },
+      rules: {
+        'react/no-this-in-sfc': ignore,
+        'import/no-unresolved': ignore,
+        'react/react-in-jsx-scope': ignore,
+        'import/no-extraneous-dependencies': ignore,
+        'global-require': ignore,
+        'no-redeclare': ignore,
+        'react/prop-types': ignore,
+      },
+    },
+    {
+      files: 'rendererAssets/**/*',
+      env: {
+        browser: true,
+      },
+      rules: {
+        'jsx-a11y/anchor-is-valid': ignore,
+        'import/no-unresolved': ignore,
+        'react/prop-types': ignore,
+        'react/react-in-jsx-scope': ignore,
+        'import/no-extraneous-dependencies': ignore,
+        'import/extensions': ignore,
+        'import/named': ignore,
+      },
+    },
+  ],
+};

code/lib/create-storybook/README.md

@@ -0,0 +1,3 @@
+# Storybook
+
+## Toolbox

code/lib/create-storybook/bin/index.cjs

@@ -0,0 +1,26 @@
+#!/usr/bin/env node
+
+const majorNodeVersion = parseInt(process.versions.node, 10);
+if (majorNodeVersion < 18) {
+  console.error('To run Storybook you need to have Node.js 18 or higher');
+  process.exit(1);
+}
+
+// The Storybook CLI has a catch block for all of its commands, but if an error
+// occurs before the command even runs, for instance, if an import fails, then
+// such error will fall under the uncaughtException handler.
+// This is the earliest moment we can catch such errors.
+process.once('uncaughtException', (error) => {
+  if (error.message.includes('string-width')) {
+    console.error(
+      [
+        '🔴 Error: It looks like you are having a known issue with package hoisting.',
+        'Please check the following issue for details and solutions: https://github.com/storybookjs/storybook/issues/22431#issuecomment-1630086092\n\n',
+      ].join('\n')
+    );
+  }
+
+  throw error;
+});
+
+require('../dist/generate.cjs');

code/lib/create-storybook/package.json

@@ -0,0 +1,79 @@
+{
+  "name": "create-storybook",
+  "version": "8.2.0-beta.0",
+  "description": "Storybook's Toolbox",
+  "homepage": "https://github.com/storybookjs/storybook/tree/next/code/lib/toolbox",
+  "bugs": {
+    "url": "https://github.com/storybookjs/storybook/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/storybookjs/storybook.git",
+    "directory": "code/lib/toolbox"
+  },
+  "funding": {
+    "type": "opencollective",
+    "url": "https://opencollective.com/storybook"
+  },
+  "license": "MIT",
+  "author": "Storybook Team",
+  "type": "module",
+  "exports": {
+    "./bin/index.cjs": {
+      "node": "./bin/index.cjs",
+      "require": "./bin/index.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "bin": "./bin/index.cjs",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "rendererAssets/**/*",
+    "templates/**/*",
+    "README.md",
+    "!src/**/*"
+  ],
+  "scripts": {
+    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
+    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/bundle.ts"
+  },
+  "dependencies": {
+    "@ndelangen/get-tarball": "^3.0.7",
+    "@storybook/core": "workspace:*",
+    "@types/semver": "^7.3.4",
+    "chalk": "^4.1.0",
+    "commander": "^6.2.1",
+    "execa": "^5.0.0",
+    "fd-package-json": "^1.2.0",
+    "find-up": "^5.0.0",
+    "fs-extra": "^11.1.0",
+    "get-npm-tarball-url": "^2.0.3",
+    "ora": "^5.4.1",
+    "prettier": "^3.1.1",
+    "prompts": "^2.4.0",
+    "semver": "^7.3.7",
+    "strip-json-comments": "^3.0.1",
+    "tempy": "^3.1.0",
+    "tiny-invariant": "^1.3.1",
+    "ts-dedent": "^2.0.0"
+  },
+  "devDependencies": {
+    "@types/cross-spawn": "^6.0.2",
+    "@types/prompts": "^2.0.9",
+    "@types/util-deprecate": "^1.0.0",
+    "boxen": "^7.1.1",
+    "strip-json-comments": "^3.1.1",
+    "typescript": "^5.3.2"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "bundler": {
+    "entries": [
+      "./src/generate.ts"
+    ],
+    "platform": "node"
+  },
+  "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae16"
+}

code/lib/create-storybook/project.json

@@ -0,0 +1,8 @@
+{
+  "name": "create-storybook",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "projectType": "library",
+  "targets": {
+    "build": {}
+  }
+}

code/lib/create-storybook/src/NpmOptions.ts

@@ -0,0 +1,4 @@
+export type NpmOptions = {
+  skipInstall?: boolean;
+  installAsDevDependencies?: boolean;
+};

code/lib/create-storybook/src/generate.ts

@@ -0,0 +1,49 @@
+import program from 'commander';
+import { findPackageSync } from 'fd-package-json';
+import invariant from 'tiny-invariant';
+import { addToGlobalContext } from '@storybook/core/telemetry';
+import { versions } from '@storybook/core/common';
+
+import type { CommandOptions } from './generators/types';
+import { initiate } from './initiate';
+
+addToGlobalContext('cliVersion', versions.storybook);
+
+const pkg = findPackageSync(__dirname);
+invariant(pkg, 'Failed to find the closest package.json file.');
+
+program
+  .name('Initialize Storybook into your project.')
+  .option(
+    '--disable-telemetry',
+    'Disable sending telemetry data',
+    // default value is false, but if the user sets STORYBOOK_DISABLE_TELEMETRY, it can be true
+    process.env.STORYBOOK_DISABLE_TELEMETRY && process.env.STORYBOOK_DISABLE_TELEMETRY !== 'false'
+  )
+  .option('--debug', 'Get more logs in debug mode', false)
+  .option('--enable-crash-reports', 'Enable sending crash reports to telemetry data')
+  .option('-f --force', 'Force add Storybook')
+  .option('-s --skip-install', 'Skip installing deps')
+  .option('--package-manager <npm|pnpm|yarn1|yarn2>', 'Force package manager for installing deps')
+  .option('--use-pnp', 'Enable pnp mode for Yarn 2+')
+  .option('-p --parser <babel | babylon | flow | ts | tsx>', 'jscodeshift parser')
+  .option('-t --type <type>', 'Add Storybook for a specific project type')
+  .option('-y --yes', 'Answer yes to all prompts')
+  .option('-b --builder <webpack5 | vite>', 'Builder library')
+  .option('-l --linkable', 'Prepare installation for link (contributor helper)')
+  // due to how Commander handles default values and negated options, we have to elevate the default into Commander, and we have to specify `--dev`
+  // alongside `--no-dev` even if we are unlikely to directly use `--dev`. https://github.com/tj/commander.js/issues/2068#issuecomment-1804524585
+  .option(
+    '--dev',
+    'Launch the development server after completing initialization. Enabled by default',
+    process.env.CI !== 'true' && process.env.IN_STORYBOOK_SANDBOX !== 'true'
+  )
+  .option(
+    '--no-dev',
+    'Complete the initialization of Storybook without launching the Storybook development server'
+  )
+  .action((options: CommandOptions) => {
+    initiate(options).catch(() => process.exit(1));
+  })
+  .version(String(pkg.version))
+  .parse(process.argv);

code/lib/toolbox/src/generators/baseGenerator.ts → code/lib/create-storybook/src/generators/baseGenerator.ts

@@ -12,7 +12,10 @@ import { SupportedLanguage, externalFrameworks } from '../project_types';
 import { copyTemplateFiles } from '../helpers';
 import { configureMain, configurePreview } from './configure';
 import type { FrameworkOptions, GeneratorOptions } from './types';
-import { configureEslintPlugin, extractEslintInfo } from '../automigrate/helpers/eslintPlugin';
+import {
+  configureEslintPlugin,
+  extractEslintInfo,
+} from '../../../toolbox/src/automigrate/helpers/eslintPlugin';
 import { detectBuilder } from '../detect';
 
 const logger = console;