@storybook/cli 6.4.0-alpha.7 → 6.4.0-beta.1

package/dist/cjs/babel-config.js

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateStorybookBabelConfig = exports.generateStorybookBabelConfigInCWD = void 0;
+
+require("core-js/modules/es.promise.js");
+
+var _fsExtra = require("fs-extra");
+
+var _nodeLogger = require("@storybook/node-logger");
+
+var _coreCommon = require("@storybook/core-common");
+
+var _path = _interopRequireDefault(require("path"));
+
+var _prompts = _interopRequireDefault(require("prompts"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const generateStorybookBabelConfigInCWD = async () => {
+  const target = process.cwd();
+  return generateStorybookBabelConfig({
+    target
+  });
+};
+
+exports.generateStorybookBabelConfigInCWD = generateStorybookBabelConfigInCWD;
+
+const generateStorybookBabelConfig = async ({
+  target
+}) => {
+  _nodeLogger.logger.info(`Generating the storybook default babel config at ${target}`);
+
+  const config = (0, _coreCommon.getStorybookBabelConfig)({
+    local: true
+  });
+  const contents = JSON.stringify(config, null, 2);
+  const fileName = '.babelrc.json';
+
+  const location = _path.default.join(target, fileName);
+
+  const exists = await (0, _fsExtra.access)(location).then(() => true, () => false);
+
+  if (exists) {
+    const {
+      overwrite
+    } = await (0, _prompts.default)({
+      type: 'confirm',
+      initial: true,
+      name: 'overwrite',
+      message: `${fileName} already exists. Would you like overwrite it?`
+    });
+
+    if (overwrite === false) {
+      _nodeLogger.logger.warn(`Cancelled, babel config file was NOT written to file-system.`);
+
+      return;
+    }
+  }
+
+  _nodeLogger.logger.info(`Writing file to ${location}`);
+
+  await (0, _fsExtra.writeFile)(location, contents);
+};
+
+exports.generateStorybookBabelConfig = generateStorybookBabelConfig;

package/dist/cjs/extract.js

@@ -60,7 +60,8 @@ const usePuppeteerBrowser = async () => {
 
   try {
     return await _puppeteerCore.default.launch({
-      args
+      args,
+      executablePath: process.env.SB_CHROMIUM_PATH
     });
   } catch (e) {
     // it's not installed

package/dist/cjs/frameworks/angular/User.ts

@@ -0,0 +1,2 @@
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface User {}

package/dist/cjs/frameworks/angular/header.component.ts

@@ -1,4 +1,5 @@
 import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { User } from './User';
 
 @Component({
   selector: 'storybook-header',
@@ -50,7 +51,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 })
 export default class HeaderComponent {
   @Input()
-  user: unknown = null;
+  user: User | null = null;
 
   @Output()
   onLogin = new EventEmitter<Event>();

package/dist/cjs/frameworks/angular/page.component.ts

@@ -1,4 +1,5 @@
 import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { User } from './User';
 
 @Component({
   selector: 'storybook-page',
@@ -61,7 +62,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 })
 export default class PageComponent {
   @Input()
-  user: unknown = null;
+  user: User | null = null;
 
   @Output()
   onLogin = new EventEmitter<Event>();

package/dist/cjs/frameworks/svelte/Header.svelte

@@ -23,7 +23,7 @@
   <div class="wrapper">
     <div>
       <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
-        <g fill="none" fillRule="evenodd">
+        <g fill="none" fill-rule="evenodd">
           <path
             d="M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z"
             fill="#FFF" />

package/dist/cjs/frameworks/svelte/Page.svelte

@@ -62,7 +62,7 @@
       <span class="tip">Tip</span>
       Adjust the width of the canvas with the
       <svg width="10" height="10" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-        <g fill="none" fillRule="evenodd">
+        <g fill="none" fill-rule="evenodd">
           <path
             d="M1.5 5.2h4.8c.3 0 .5.2.5.4v5.1c-.1.2-.3.3-.4.3H1.4a.5.5 0
             01-.5-.4V5.7c0-.3.2-.5.5-.5zm0-2.1h6.9c.3 0 .5.2.5.4v7a.5.5 0 01-1 0V4H1.5a.5.5 0

package/dist/cjs/generate.js

@@ -14,7 +14,7 @@ var _leven = _interopRequireDefault(require("leven"));
 
 var _readPkgUp = require("read-pkg-up");
 
-var _initiate = _interopRequireDefault(require("./initiate"));
+var _initiate = require("./initiate");
 
 var _add = require("./add");
 
@@ -28,6 +28,8 @@ var _repro = require("./repro");
 
 var _link = require("./link");
 
+var _babelConfig = require("./babel-config");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const pkg = (0, _readPkgUp.sync)({
@@ -35,10 +37,12 @@ const pkg = (0, _readPkgUp.sync)({
 }).packageJson;
 const logger = console;
 
-_commander.default.command('init').description('Initialize Storybook into your project.').option('-f --force', 'Force add Storybook').option('-s --skip-install', 'Skip installing deps').option('-N --use-npm', 'Use npm to install deps').option('-p --parser <babel | babylon | flow | ts | tsx>', 'jscodeshift parser').option('-t --type <type>', 'Add Storybook for a specific project type').option('--story-format <csf | csf-ts | mdx >', 'Generate stories in a specified format').option('-y --yes', 'Answer yes to all prompts').option('-b --builder <builder>', 'Builder library').option('-l --linkable', 'Prepare installation for link (contributor helper)').action(options => (0, _initiate.default)(options, pkg));
+_commander.default.command('init').description('Initialize Storybook into your project.').option('-f --force', 'Force add Storybook').option('-s --skip-install', 'Skip installing deps').option('-N --use-npm', 'Use npm to install deps').option('-p --parser <babel | babylon | flow | ts | tsx>', 'jscodeshift parser').option('-t --type <type>', 'Add Storybook for a specific project type').option('--story-format <csf | csf-ts | mdx >', 'Generate stories in a specified format').option('-y --yes', 'Answer yes to all prompts').option('-b --builder <builder>', 'Builder library').option('-l --linkable', 'Prepare installation for link (contributor helper)').action(options => (0, _initiate.initiate)(options, pkg));
 
 _commander.default.command('add <addon>').description('Add an addon to your Storybook').option('-N --use-npm', 'Use NPM to build the Storybook server').option('-s --skip-postinstall', 'Skip package specific postinstall config modifications').action((addonName, options) => (0, _add.add)(addonName, options));
 
+_commander.default.command('babelrc').description('generate the default storybook babel config into your current working directory').action(() => (0, _babelConfig.generateStorybookBabelConfigInCWD)());
+
 _commander.default.command('upgrade').description('Upgrade your Storybook packages to the latest').option('-N --use-npm', 'Use NPM to build the Storybook server').option('-n --dry-run', 'Only check for upgrades, do not install').option('-p --prerelease', 'Upgrade to the pre-release packages').option('-s --skip-check', 'Skip postinstall version consistency checks').action(options => (0, _upgrade.upgrade)(options));
 
 _commander.default.command('info').description('Prints debugging information about the local environment').action(() => {

package/dist/cjs/generators/baseGenerator.js

@@ -7,6 +7,10 @@ exports.baseGenerator = baseGenerator;
 
 require("core-js/modules/es.promise.js");
 
+var _fsExtra = _interopRequireDefault(require("fs-extra"));
+
+var _coreCommon = require("@storybook/core-common");
+
 var _project_types = require("../project_types");
 
 var _helpers = require("../helpers");
@@ -15,6 +19,10 @@ var _configure = require("./configure");
 
 var _jsPackageManager = require("../js-package-manager");
 
+var _babelConfig = require("../babel-config");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const defaultOptions = {
   extraPackages: [],
   extraAddons: [],
@@ -62,6 +70,8 @@ async function baseGenerator(packageManager, npmOptions, {
 
   const addonPackages = [...addons, '@storybook/addon-actions'];
   const yarn2Dependencies = packageManager.type === 'yarn2' ? ['@storybook/addon-docs', '@mdx-js/react'] : [];
+  const files = await _fsExtra.default.readdir(process.cwd());
+  const isNewFolder = !files.some(fname => fname.startsWith('.babel') || fname.startsWith('babel') || fname === 'package.json');
   const packageJson = packageManager.retrievePackageJson();
   const installedDependencies = new Set(Object.keys(packageJson.dependencies));
   const packages = [`@storybook/${framework}`, ...addonPackages, ...extraPackages, ...extraAddons, ...yarn2Dependencies, ...builderDependencies(builder)].filter(Boolean).filter(packageToInstall => !installedDependencies.has((0, _jsPackageManager.getPackageDetails)(packageToInstall)[0]));
@@ -82,6 +92,12 @@ async function baseGenerator(packageManager, npmOptions, {
   }
 
   const babelDependencies = addBabel ? await (0, _helpers.getBabelDependencies)(packageManager, packageJson) : [];
+
+  if (isNewFolder) {
+    babelDependencies.push(...(0, _coreCommon.getStorybookBabelDependencies)());
+    await (0, _babelConfig.generateStorybookBabelConfigInCWD)();
+  }
+
   packageManager.addDependencies(Object.assign({}, npmOptions, {
     packageJson
   }), [...versionedPackages, ...babelDependencies]);

package/dist/cjs/initiate.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = _default;
+exports.initiate = initiate;
 
 require("core-js/modules/es.promise.js");
 
@@ -249,7 +249,7 @@ const projectTypeInquirer = async options => {
   return Promise.resolve();
 };
 
-function _default(options, pkg) {
+function initiate(options, pkg) {
   const welcomeMessage = 'sb init - the simplest way to add a Storybook to your project.';
   logger.log(_chalk.default.inverse(`\n ${welcomeMessage} \n`)); // Update notify code.
 

package/dist/cjs/js-package-manager/NPMProxy.js

@@ -67,7 +67,7 @@ class NPMProxy extends _JsPackageManager.JsPackageManager {
         return parsedOutput;
       }
     } catch (e) {
-      throw new Error(`Unable to find versions of ${packageName} using yarn`);
+      throw new Error(`Unable to find versions of ${packageName} using npm`);
     }
   }
 

package/dist/cjs/link.js

@@ -58,8 +58,8 @@ const link = async ({
     stdio: 'pipe'
   }).stdout.toString();
 
-  if (!version.startsWith('2.')) {
-    _nodeLogger.logger.warn(`🚨 Expected yarn 2 in ${reproDir}!`);
+  if (!/^[23]\./.test(version)) {
+    _nodeLogger.logger.warn(`🚨 Expected yarn 2 or 3 in ${reproDir}!`);
 
     _nodeLogger.logger.warn('');
 

package/dist/cjs/project_types.js

@@ -61,7 +61,8 @@ exports.StoryFormat = StoryFormat;
   StoryFormat["MDX"] = "mdx";
 })(StoryFormat || (exports.StoryFormat = StoryFormat = {}));
 
-let CoreBuilder;
+let CoreBuilder; // The `& {}` bit allows for auto-complete, see: https://github.com/microsoft/TypeScript/issues/29729
+
 exports.CoreBuilder = CoreBuilder;
 
 (function (CoreBuilder) {
@@ -259,7 +260,7 @@ const supportedTemplates = [{
     return dependencies.every(Boolean);
   }
 }]; // A TemplateConfiguration that matches unsupported frameworks
-// Framework matchers can be added to this object to give
+// AnyFramework matchers can be added to this object to give
 // users an "Unsupported framework" message
 
 exports.supportedTemplates = supportedTemplates;

package/dist/cjs/repro-generators/scripts.js

@@ -124,7 +124,7 @@ const addRequiredDeps = async ({
   additionalDeps
 }) => {
   // Remove any lockfile generated without Yarn 2
-  _shelljs.default.rm(_path.default.join(cwd, 'package-lock.json'), _path.default.join(cwd, 'yarn.lock'));
+  _shelljs.default.rm('-f', _path.default.join(cwd, 'package-lock.json'), _path.default.join(cwd, 'yarn.lock'));
 
   const command = additionalDeps && additionalDeps.length > 0 ? `yarn add -D ${additionalDeps.join(' ')}` : `yarn install`;
   await exec(command, {

package/dist/cjs/versions.json

@@ -1,57 +1,57 @@
 {
-  "@storybook/addon-a11y": "6.4.0-alpha.7",
-  "@storybook/addon-actions": "6.4.0-alpha.7",
-  "@storybook/addon-backgrounds": "6.4.0-alpha.7",
-  "@storybook/addon-controls": "6.4.0-alpha.7",
-  "@storybook/addon-docs": "6.4.0-alpha.7",
-  "@storybook/addon-essentials": "6.4.0-alpha.7",
-  "@storybook/addon-jest": "6.4.0-alpha.7",
-  "@storybook/addon-links": "6.4.0-alpha.7",
-  "@storybook/addon-storyshots": "6.4.0-alpha.7",
-  "@storybook/addon-storyshots-puppeteer": "6.4.0-alpha.7",
-  "@storybook/addon-storysource": "6.4.0-alpha.7",
-  "@storybook/addon-toolbars": "6.4.0-alpha.7",
-  "@storybook/addon-viewport": "6.4.0-alpha.7",
-  "@storybook/addons": "6.4.0-alpha.7",
-  "@storybook/angular": "6.4.0-alpha.7",
-  "@storybook/api": "6.4.0-alpha.7",
-  "@storybook/aurelia": "6.4.0-alpha.7",
-  "@storybook/builder-webpack4": "6.4.0-alpha.7",
-  "@storybook/builder-webpack5": "6.4.0-alpha.7",
-  "@storybook/channel-postmessage": "6.4.0-alpha.7",
-  "@storybook/channel-websocket": "6.4.0-alpha.7",
-  "@storybook/channels": "6.4.0-alpha.7",
-  "@storybook/cli": "6.4.0-alpha.7",
-  "@storybook/client-api": "6.4.0-alpha.7",
-  "@storybook/client-logger": "6.4.0-alpha.7",
-  "@storybook/codemod": "6.4.0-alpha.7",
-  "@storybook/components": "6.4.0-alpha.7",
-  "@storybook/core": "6.4.0-alpha.7",
-  "@storybook/core-client": "6.4.0-alpha.7",
-  "@storybook/core-common": "6.4.0-alpha.7",
-  "@storybook/core-events": "6.4.0-alpha.7",
-  "@storybook/core-server": "6.4.0-alpha.7",
-  "@storybook/csf-tools": "6.4.0-alpha.7",
-  "@storybook/ember": "6.4.0-alpha.7",
-  "@storybook/html": "6.4.0-alpha.7",
-  "@storybook/manager-webpack4": "6.4.0-alpha.7",
-  "@storybook/manager-webpack5": "6.4.0-alpha.7",
-  "@storybook/marionette": "6.4.0-alpha.7",
-  "@storybook/marko": "6.4.0-alpha.7",
-  "@storybook/mithril": "6.4.0-alpha.7",
-  "@storybook/node-logger": "6.4.0-alpha.7",
-  "@storybook/postinstall": "6.4.0-alpha.7",
-  "@storybook/preact": "6.4.0-alpha.7",
-  "@storybook/rax": "6.4.0-alpha.7",
-  "@storybook/react": "6.4.0-alpha.7",
-  "@storybook/riot": "6.4.0-alpha.7",
-  "@storybook/router": "6.4.0-alpha.7",
-  "@storybook/server": "6.4.0-alpha.7",
-  "@storybook/source-loader": "6.4.0-alpha.7",
-  "@storybook/svelte": "6.4.0-alpha.7",
-  "@storybook/theming": "6.4.0-alpha.7",
-  "@storybook/ui": "6.4.0-alpha.7",
-  "@storybook/vue": "6.4.0-alpha.7",
-  "@storybook/vue3": "6.4.0-alpha.7",
-  "@storybook/web-components": "6.4.0-alpha.7"
+  "@storybook/addon-a11y": "6.4.0-beta.1",
+  "@storybook/addon-actions": "6.4.0-beta.1",
+  "@storybook/addon-backgrounds": "6.4.0-beta.1",
+  "@storybook/addon-controls": "6.4.0-beta.1",
+  "@storybook/addon-docs": "6.4.0-beta.1",
+  "@storybook/addon-essentials": "6.4.0-beta.1",
+  "@storybook/addon-jest": "6.4.0-beta.1",
+  "@storybook/addon-links": "6.4.0-beta.1",
+  "@storybook/addon-storyshots": "6.4.0-beta.1",
+  "@storybook/addon-storyshots-puppeteer": "6.4.0-beta.1",
+  "@storybook/addon-storysource": "6.4.0-beta.1",
+  "@storybook/addon-toolbars": "6.4.0-beta.1",
+  "@storybook/addon-viewport": "6.4.0-beta.1",
+  "@storybook/addons": "6.4.0-beta.1",
+  "@storybook/angular": "6.4.0-beta.1",
+  "@storybook/api": "6.4.0-beta.1",
+  "@storybook/aurelia": "6.4.0-beta.1",
+  "@storybook/builder-webpack4": "6.4.0-beta.1",
+  "@storybook/builder-webpack5": "6.4.0-beta.1",
+  "@storybook/channel-postmessage": "6.4.0-beta.1",
+  "@storybook/channel-websocket": "6.4.0-beta.1",
+  "@storybook/channels": "6.4.0-beta.1",
+  "@storybook/cli": "6.4.0-beta.1",
+  "@storybook/client-api": "6.4.0-beta.1",
+  "@storybook/client-logger": "6.4.0-beta.1",
+  "@storybook/codemod": "6.4.0-beta.1",
+  "@storybook/components": "6.4.0-beta.1",
+  "@storybook/core": "6.4.0-beta.1",
+  "@storybook/core-client": "6.4.0-beta.1",
+  "@storybook/core-common": "6.4.0-beta.1",
+  "@storybook/core-events": "6.4.0-beta.1",
+  "@storybook/core-server": "6.4.0-beta.1",
+  "@storybook/csf-tools": "6.4.0-beta.1",
+  "@storybook/ember": "6.4.0-beta.1",
+  "@storybook/html": "6.4.0-beta.1",
+  "@storybook/manager-webpack4": "6.4.0-beta.1",
+  "@storybook/manager-webpack5": "6.4.0-beta.1",
+  "@storybook/marionette": "6.4.0-beta.1",
+  "@storybook/marko": "6.4.0-beta.1",
+  "@storybook/mithril": "6.4.0-beta.1",
+  "@storybook/node-logger": "6.4.0-beta.1",
+  "@storybook/postinstall": "6.4.0-beta.1",
+  "@storybook/preact": "6.4.0-beta.1",
+  "@storybook/rax": "6.4.0-beta.1",
+  "@storybook/react": "6.4.0-beta.1",
+  "@storybook/riot": "6.4.0-beta.1",
+  "@storybook/router": "6.4.0-beta.1",
+  "@storybook/server": "6.4.0-beta.1",
+  "@storybook/source-loader": "6.4.0-beta.1",
+  "@storybook/svelte": "6.4.0-beta.1",
+  "@storybook/theming": "6.4.0-beta.1",
+  "@storybook/ui": "6.4.0-beta.1",
+  "@storybook/vue": "6.4.0-beta.1",
+  "@storybook/vue3": "6.4.0-beta.1",
+  "@storybook/web-components": "6.4.0-beta.1"
 }

package/dist/esm/babel-config.js

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateStorybookBabelConfig = exports.generateStorybookBabelConfigInCWD = void 0;
+
+require("core-js/modules/es.promise.js");
+
+var _fsExtra = require("fs-extra");
+
+var _nodeLogger = require("@storybook/node-logger");
+
+var _coreCommon = require("@storybook/core-common");
+
+var _path = _interopRequireDefault(require("path"));
+
+var _prompts = _interopRequireDefault(require("prompts"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const generateStorybookBabelConfigInCWD = async () => {
+  const target = process.cwd();
+  return generateStorybookBabelConfig({
+    target
+  });
+};
+
+exports.generateStorybookBabelConfigInCWD = generateStorybookBabelConfigInCWD;
+
+const generateStorybookBabelConfig = async ({
+  target
+}) => {
+  _nodeLogger.logger.info(`Generating the storybook default babel config at ${target}`);
+
+  const config = (0, _coreCommon.getStorybookBabelConfig)({
+    local: true
+  });
+  const contents = JSON.stringify(config, null, 2);
+  const fileName = '.babelrc.json';
+
+  const location = _path.default.join(target, fileName);
+
+  const exists = await (0, _fsExtra.access)(location).then(() => true, () => false);
+
+  if (exists) {
+    const {
+      overwrite
+    } = await (0, _prompts.default)({
+      type: 'confirm',
+      initial: true,
+      name: 'overwrite',
+      message: `${fileName} already exists. Would you like overwrite it?`
+    });
+
+    if (overwrite === false) {
+      _nodeLogger.logger.warn(`Cancelled, babel config file was NOT written to file-system.`);
+
+      return;
+    }
+  }
+
+  _nodeLogger.logger.info(`Writing file to ${location}`);
+
+  await (0, _fsExtra.writeFile)(location, contents);
+};
+
+exports.generateStorybookBabelConfig = generateStorybookBabelConfig;

package/dist/esm/extract.js

@@ -60,7 +60,8 @@ const usePuppeteerBrowser = async () => {
 
   try {
     return await _puppeteerCore.default.launch({
-      args
+      args,
+      executablePath: process.env.SB_CHROMIUM_PATH
     });
   } catch (e) {
     // it's not installed

package/dist/esm/frameworks/angular/User.ts

@@ -0,0 +1,2 @@
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface User {}

package/dist/esm/frameworks/angular/header.component.ts

@@ -1,4 +1,5 @@
 import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { User } from './User';
 
 @Component({
   selector: 'storybook-header',
@@ -50,7 +51,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 })
 export default class HeaderComponent {
   @Input()
-  user: unknown = null;
+  user: User | null = null;
 
   @Output()
   onLogin = new EventEmitter<Event>();

package/dist/esm/frameworks/angular/page.component.ts

@@ -1,4 +1,5 @@
 import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { User } from './User';
 
 @Component({
   selector: 'storybook-page',
@@ -61,7 +62,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 })
 export default class PageComponent {
   @Input()
-  user: unknown = null;
+  user: User | null = null;
 
   @Output()
   onLogin = new EventEmitter<Event>();

package/dist/esm/frameworks/svelte/Header.svelte

@@ -23,7 +23,7 @@
   <div class="wrapper">
     <div>
       <svg width="32" height="32" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
-        <g fill="none" fillRule="evenodd">
+        <g fill="none" fill-rule="evenodd">
           <path
             d="M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z"
             fill="#FFF" />

package/dist/esm/frameworks/svelte/Page.svelte

@@ -62,7 +62,7 @@
       <span class="tip">Tip</span>
       Adjust the width of the canvas with the
       <svg width="10" height="10" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
-        <g fill="none" fillRule="evenodd">
+        <g fill="none" fill-rule="evenodd">
           <path
             d="M1.5 5.2h4.8c.3 0 .5.2.5.4v5.1c-.1.2-.3.3-.4.3H1.4a.5.5 0
             01-.5-.4V5.7c0-.3.2-.5.5-.5zm0-2.1h6.9c.3 0 .5.2.5.4v7a.5.5 0 01-1 0V4H1.5a.5.5 0

package/dist/esm/generate.js

@@ -14,7 +14,7 @@ var _leven = _interopRequireDefault(require("leven"));
 
 var _readPkgUp = require("read-pkg-up");
 
-var _initiate = _interopRequireDefault(require("./initiate"));
+var _initiate = require("./initiate");
 
 var _add = require("./add");
 
@@ -28,6 +28,8 @@ var _repro = require("./repro");
 
 var _link = require("./link");
 
+var _babelConfig = require("./babel-config");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const pkg = (0, _readPkgUp.sync)({
@@ -35,10 +37,12 @@ const pkg = (0, _readPkgUp.sync)({
 }).packageJson;
 const logger = console;
 
-_commander.default.command('init').description('Initialize Storybook into your project.').option('-f --force', 'Force add Storybook').option('-s --skip-install', 'Skip installing deps').option('-N --use-npm', 'Use npm to install deps').option('-p --parser <babel | babylon | flow | ts | tsx>', 'jscodeshift parser').option('-t --type <type>', 'Add Storybook for a specific project type').option('--story-format <csf | csf-ts | mdx >', 'Generate stories in a specified format').option('-y --yes', 'Answer yes to all prompts').option('-b --builder <builder>', 'Builder library').option('-l --linkable', 'Prepare installation for link (contributor helper)').action(options => (0, _initiate.default)(options, pkg));
+_commander.default.command('init').description('Initialize Storybook into your project.').option('-f --force', 'Force add Storybook').option('-s --skip-install', 'Skip installing deps').option('-N --use-npm', 'Use npm to install deps').option('-p --parser <babel | babylon | flow | ts | tsx>', 'jscodeshift parser').option('-t --type <type>', 'Add Storybook for a specific project type').option('--story-format <csf | csf-ts | mdx >', 'Generate stories in a specified format').option('-y --yes', 'Answer yes to all prompts').option('-b --builder <builder>', 'Builder library').option('-l --linkable', 'Prepare installation for link (contributor helper)').action(options => (0, _initiate.initiate)(options, pkg));
 
 _commander.default.command('add <addon>').description('Add an addon to your Storybook').option('-N --use-npm', 'Use NPM to build the Storybook server').option('-s --skip-postinstall', 'Skip package specific postinstall config modifications').action((addonName, options) => (0, _add.add)(addonName, options));
 
+_commander.default.command('babelrc').description('generate the default storybook babel config into your current working directory').action(() => (0, _babelConfig.generateStorybookBabelConfigInCWD)());
+
 _commander.default.command('upgrade').description('Upgrade your Storybook packages to the latest').option('-N --use-npm', 'Use NPM to build the Storybook server').option('-n --dry-run', 'Only check for upgrades, do not install').option('-p --prerelease', 'Upgrade to the pre-release packages').option('-s --skip-check', 'Skip postinstall version consistency checks').action(options => (0, _upgrade.upgrade)(options));
 
 _commander.default.command('info').description('Prints debugging information about the local environment').action(() => {

package/dist/esm/generators/baseGenerator.js

@@ -7,6 +7,10 @@ exports.baseGenerator = baseGenerator;
 
 require("core-js/modules/es.promise.js");
 
+var _fsExtra = _interopRequireDefault(require("fs-extra"));
+
+var _coreCommon = require("@storybook/core-common");
+
 var _project_types = require("../project_types");
 
 var _helpers = require("../helpers");
@@ -15,6 +19,10 @@ var _configure = require("./configure");
 
 var _jsPackageManager = require("../js-package-manager");
 
+var _babelConfig = require("../babel-config");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const defaultOptions = {
   extraPackages: [],
   extraAddons: [],
@@ -62,6 +70,8 @@ async function baseGenerator(packageManager, npmOptions, {
 
   const addonPackages = [...addons, '@storybook/addon-actions'];
   const yarn2Dependencies = packageManager.type === 'yarn2' ? ['@storybook/addon-docs', '@mdx-js/react'] : [];
+  const files = await _fsExtra.default.readdir(process.cwd());
+  const isNewFolder = !files.some(fname => fname.startsWith('.babel') || fname.startsWith('babel') || fname === 'package.json');
   const packageJson = packageManager.retrievePackageJson();
   const installedDependencies = new Set(Object.keys(packageJson.dependencies));
   const packages = [`@storybook/${framework}`, ...addonPackages, ...extraPackages, ...extraAddons, ...yarn2Dependencies, ...builderDependencies(builder)].filter(Boolean).filter(packageToInstall => !installedDependencies.has((0, _jsPackageManager.getPackageDetails)(packageToInstall)[0]));
@@ -82,6 +92,12 @@ async function baseGenerator(packageManager, npmOptions, {
   }
 
   const babelDependencies = addBabel ? await (0, _helpers.getBabelDependencies)(packageManager, packageJson) : [];
+
+  if (isNewFolder) {
+    babelDependencies.push(...(0, _coreCommon.getStorybookBabelDependencies)());
+    await (0, _babelConfig.generateStorybookBabelConfigInCWD)();
+  }
+
   packageManager.addDependencies(Object.assign({}, npmOptions, {
     packageJson
   }), [...versionedPackages, ...babelDependencies]);

package/dist/esm/initiate.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = _default;
+exports.initiate = initiate;
 
 require("core-js/modules/es.promise.js");
 
@@ -249,7 +249,7 @@ const projectTypeInquirer = async options => {
   return Promise.resolve();
 };
 
-function _default(options, pkg) {
+function initiate(options, pkg) {
   const welcomeMessage = 'sb init - the simplest way to add a Storybook to your project.';
   logger.log(_chalk.default.inverse(`\n ${welcomeMessage} \n`)); // Update notify code.
 

package/dist/esm/js-package-manager/NPMProxy.js

@@ -67,7 +67,7 @@ class NPMProxy extends _JsPackageManager.JsPackageManager {
         return parsedOutput;
       }
     } catch (e) {
-      throw new Error(`Unable to find versions of ${packageName} using yarn`);
+      throw new Error(`Unable to find versions of ${packageName} using npm`);
     }
   }