@storybook/cli 7.0.0-alpha.4 → 7.0.0-alpha.7

package/dist/cjs/automigrate/fixes/index.js

@@ -22,6 +22,8 @@ var _eslintPlugin = require("./eslint-plugin");
 
 var _builderVite = require("./builder-vite");
 
+var _npm = require("./npm7");
+
 var _types = require("../types");
 
 Object.keys(_types).forEach(function (key) {
@@ -35,5 +37,5 @@ Object.keys(_types).forEach(function (key) {
     }
   });
 });
-const fixes = [_cra.cra5, _webpack.webpack5, _angular.angular12, _vue.vue3, _mainjsFramework.mainjsFramework, _eslintPlugin.eslintPlugin, _builderVite.builderVite];
+const fixes = [_cra.cra5, _webpack.webpack5, _angular.angular12, _vue.vue3, _mainjsFramework.mainjsFramework, _eslintPlugin.eslintPlugin, _builderVite.builderVite, _npm.npm7];
 exports.fixes = fixes;

package/dist/cjs/automigrate/fixes/npm7.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.npm7 = void 0;
+
+require("core-js/modules/es.promise.js");
+
+var _chalk = _interopRequireDefault(require("chalk"));
+
+var _tsDedent = _interopRequireDefault(require("ts-dedent"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/**
+ * Is the user using npm7+? If so create a .npmrc with legacy-peer-deps=true
+ */
+const npm7 = {
+  id: 'npm7',
+
+  async check({
+    packageManager
+  }) {
+    if (packageManager.type !== 'npm') return null;
+    const npmVersion = packageManager.getNpmVersion();
+
+    if (packageManager.needsLegacyPeerDeps(npmVersion)) {
+      return {
+        npmVersion
+      };
+    }
+
+    return null;
+  },
+
+  prompt({
+    npmVersion
+  }) {
+    const npmFormatted = _chalk.default.cyan(`npm ${npmVersion}`);
+
+    return (0, _tsDedent.default)`
+      We've detected you are running ${npmFormatted} which has peer dependency semantics which Storybook is incompatible with.
+
+      In order to work with Storybook's package structure, you'll need to run \`npm\` with the
+      \`--legacy-peer-deps=true\` flag. We can generate an \`.npmrc\` which will do that automatically.
+      
+      More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/issues/18298')}
+    `;
+  },
+
+  async run({
+    packageManager
+  }) {
+    packageManager.setLegacyPeerDeps();
+  }
+
+};
+exports.npm7 = npm7;

package/dist/cjs/frameworks/angular/Button.stories.ts

@@ -1,5 +1,5 @@
 // also exported from '@storybook/angular' if you can deal with breaking changes in 6.1
-import { Story, Meta } from '@storybook/angular/types-6-0';
+import type { Meta, StoryFn } from '@storybook/angular';
 import Button from './button.component';
 
 // More on default export: https://storybook.js.org/docs/angular/writing-stories/introduction#default-export
@@ -13,7 +13,7 @@ export default {
 } as Meta;
 
 // More on component templates: https://storybook.js.org/docs/angular/writing-stories/introduction#using-args
-const Template: Story<Button> = (args: Button) => {
+const Template: StoryFn<Button> = (args: Button) => {
   return {
     props: { backgroundColor: null, ...args },
   };

package/dist/cjs/frameworks/angular/Header.stories.ts

@@ -1,6 +1,6 @@
 import { moduleMetadata } from '@storybook/angular';
 import { CommonModule } from '@angular/common';
-import type { Story, Meta } from '@storybook/angular';
+import type { Meta, StoryFn } from '@storybook/angular';
 
 import Button from './button.component';
 import Header from './header.component';
@@ -20,7 +20,7 @@ export default {
   },
 } as Meta;
 
-const Template: Story<Header> = (args: Header) => ({
+const Template: StoryFn<Header> = (args: Header) => ({
   props: args,
 });
 

package/dist/cjs/frameworks/angular/Page.stories.ts

@@ -1,4 +1,4 @@
-import { moduleMetadata, Story, Meta } from '@storybook/angular';
+import { moduleMetadata, StoryFn, Meta } from '@storybook/angular';
 import { within, userEvent } from '@storybook/testing-library';
 import { CommonModule } from '@angular/common';
 
@@ -10,7 +10,7 @@ export default {
   title: 'Example/Page',
   component: Page,
   parameters: {
-    // More on Story layout: https://storybook.js.org/docs/angular/configure/story-layout
+    // More on StoryFn layout: https://storybook.js.org/docs/angular/configure/story-layout
     layout: 'fullscreen',
   },
   decorators: [
@@ -21,7 +21,7 @@ export default {
   ],
 } as Meta;
 
-const Template: Story<Page> = (args: Page) => ({
+const Template: StoryFn<Page> = (args: Page) => ({
   props: args,
 });
 

package/dist/cjs/frameworks/html/ts/Button.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/html';
+import type { Meta, StoryFn } from '@storybook/html';
 import { createButton, ButtonProps } from './Button';
 
 // More on default export: https://storybook.js.org/docs/html/writing-stories/introduction#default-export
@@ -18,7 +18,7 @@ export default {
 } as Meta;
 
 // More on component templates: https://storybook.js.org/docs/html/writing-stories/introduction#using-args
-const Template: Story<ButtonProps> = (args) => {
+const Template: StoryFn<ButtonProps> = (args) => {
   // You can either use a function to create DOM elements or use a plain html string!
   // return `<div>${label}</div>`;
   return createButton(args);

package/dist/cjs/frameworks/html/ts/Header.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/html';
+import type { Meta, StoryFn } from '@storybook/html';
 import { createHeader, HeaderProps } from './Header';
 
 export default {
@@ -15,7 +15,7 @@ export default {
   },
 } as Meta;
 
-const Template: Story<HeaderProps> = (args) => createHeader(args);
+const Template: StoryFn<HeaderProps> = (args) => createHeader(args);
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/cjs/frameworks/html/ts/Page.stories.ts

@@ -1,5 +1,5 @@
 import { within, userEvent } from '@storybook/testing-library';
-import { Story, Meta } from '@storybook/html';
+import type { Meta, StoryFn } from '@storybook/html';
 import { createPage } from './Page';
 
 export default {
@@ -10,7 +10,7 @@ export default {
   },
 } as Meta;
 
-const Template: Story = () => createPage();
+const Template: StoryFn = () => createPage();
 
 export const LoggedOut = Template.bind({});
 

package/dist/cjs/frameworks/react/ts/Button.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ComponentStory, ComponentMeta } from '@storybook/react';
+import type { ComponentStoryFn, ComponentMeta } from '@storybook/react';
 
 import { Button } from './Button';
 
@@ -14,7 +14,7 @@ export default {
 } as ComponentMeta<typeof Button>;
 
 // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
-const Template: ComponentStory<typeof Button> = (args) => <Button {...args} />;
+const Template: ComponentStoryFn<typeof Button> = (args) => <Button {...args} />;
 
 export const Primary = Template.bind({});
 // More on args: https://storybook.js.org/docs/react/writing-stories/args

package/dist/cjs/frameworks/react/ts/Header.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ComponentStory, ComponentMeta } from '@storybook/react';
+import type { ComponentStoryFn, ComponentMeta } from '@storybook/react';
 
 import { Header } from './Header';
 
@@ -12,7 +12,7 @@ export default {
   },
 } as ComponentMeta<typeof Header>;
 
-const Template: ComponentStory<typeof Header> = (args) => <Header {...args} />;
+const Template: ComponentStoryFn<typeof Header> = (args) => <Header {...args} />;
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/cjs/frameworks/react/ts/Page.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ComponentStory, ComponentMeta } from '@storybook/react';
+import type { ComponentStoryFn, ComponentMeta } from '@storybook/react';
 import { within, userEvent } from '@storybook/testing-library';
 import { Page } from './Page';
 
@@ -12,7 +12,7 @@ export default {
   },
 } as ComponentMeta<typeof Page>;
 
-const Template: ComponentStory<typeof Page> = (args) => <Page {...args} />;
+const Template: ComponentStoryFn<typeof Page> = (args) => <Page {...args} />;
 
 export const LoggedOut = Template.bind({});
 

package/dist/cjs/frameworks/web-components/ts/Button.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/web-components';
+import type { Meta, StoryFn } from '@storybook/web-components';
 import { Button, ButtonProps } from './Button';
 
 // More on default export: https://storybook.js.org/docs/web-components/writing-stories/introduction#default-export
@@ -16,7 +16,7 @@ export default {
 } as Meta;
 
 // More on component templates: https://storybook.js.org/docs/web-components/writing-stories/introduction#using-args
-const Template: Story<Partial<ButtonProps>> = (args) => Button(args);
+const Template: StoryFn<ButtonProps> = (args) => Button(args);
 
 export const Primary = Template.bind({});
 // More on args: https://storybook.js.org/docs/web-components/writing-stories/args

package/dist/cjs/frameworks/web-components/ts/Header.stories.ts

@@ -1,11 +1,11 @@
-import { Story, Meta } from '@storybook/web-components';
+import type { Meta, StoryFn } from '@storybook/web-components';
 import { Header, HeaderProps } from './Header';
 
 export default {
   title: 'Example/Header',
 } as Meta;
 
-const Template: Story<Partial<HeaderProps>> = (args) => Header(args);
+const Template: StoryFn<HeaderProps> = (args) => Header(args);
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/cjs/frameworks/web-components/ts/Page.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/web-components';
+import type { Meta, StoryFn } from '@storybook/web-components';
 import { Page, PageProps } from './Page';
 import * as HeaderStories from './Header.stories';
 
@@ -6,7 +6,7 @@ export default {
   title: 'Example/Page',
 } as Meta;
 
-const Template: Story<Partial<PageProps>> = (args) => Page(args);
+const Template: StoryFn<PageProps> = (args) => Page(args);
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/cjs/generators/REACT_SCRIPTS/index.js

@@ -30,10 +30,10 @@ const generator = async (packageManager, npmOptions, options) => {
       config.resolve.plugins.forEach((p) => {
         if (Array.isArray(p.appSrcs)) {
           p.appSrcs.push('${monorepoRootPath}');
-        }
-      });
-      return config;
-    }
+              }
+            });
+          return config;
+          }
     %%`
   } : {};
   const craVersion = (_semver$coerce = _semver.default.coerce(packageManager.retrievePackageJson().dependencies['react-scripts'])) === null || _semver$coerce === void 0 ? void 0 : _semver$coerce.version;

package/dist/cjs/generators/SVELTE/index.js

@@ -16,25 +16,21 @@ var _baseGenerator = require("../baseGenerator");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const generator = async (packageManager, npmOptions, options) => {
-  let extraMain;
+  let svelteOptions;
   let commonJs = false; // svelte.config.js ?
 
   if (_fsExtra.default.existsSync('./svelte.config.js')) {
     _nodeLogger.logger.info("Configuring preprocessor from 'svelte.config.js'");
 
-    extraMain = {
-      svelteOptions: {
-        preprocess: '%%require("../svelte.config.js").preprocess%%'
-      }
+    svelteOptions = {
+      preprocess: '%%require("../svelte.config.js").preprocess%%'
     };
   } else if (_fsExtra.default.existsSync('./svelte.config.cjs')) {
     _nodeLogger.logger.info("Configuring preprocessor from 'svelte.config.cjs'");
 
     commonJs = true;
-    extraMain = {
-      svelteOptions: {
-        preprocess: '%%require("../svelte.config.cjs").preprocess%%'
-      }
+    svelteOptions = {
+      preprocess: '%%require("../svelte.config.cjs").preprocess%%'
     };
   } else {
     // svelte-preprocess dependencies ?
@@ -43,10 +39,8 @@ const generator = async (packageManager, npmOptions, options) => {
     if (packageJson.devDependencies && packageJson.devDependencies['svelte-preprocess']) {
       _nodeLogger.logger.info("Configuring preprocessor with 'svelte-preprocess'");
 
-      extraMain = {
-        svelteOptions: {
-          preprocess: '%%require("svelte-preprocess")()%%'
-        }
+      svelteOptions = {
+        preprocess: '%%require("svelte-preprocess")()%%'
       };
     }
   }
@@ -54,7 +48,7 @@ const generator = async (packageManager, npmOptions, options) => {
   await (0, _baseGenerator.baseGenerator)(packageManager, npmOptions, options, 'svelte', {
     extraPackages: ['svelte', 'svelte-loader'],
     extensions: ['js', 'jsx', 'ts', 'tsx', 'svelte'],
-    extraMain,
+    framework: svelteOptions,
     commonJs
   });
 };

package/dist/cjs/generators/baseGenerator.js

@@ -34,6 +34,7 @@ const defaultOptions = {
   addBabel: true,
   addESLint: false,
   extraMain: undefined,
+  framework: undefined,
   extensions: undefined,
   commonJs: false
 };
@@ -152,7 +153,7 @@ async function baseGenerator(packageManager, npmOptions, {
   await (0, _configure.configureMain)(Object.assign({
     framework: {
       name: frameworkInclude,
-      options: {}
+      options: options.framework || {}
     },
     addons: pnp ? addons.map(wrapForPnp) : addons,
     extensions,

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

@@ -30,10 +30,26 @@ class NPMProxy extends _JsPackageManager.JsPackageManager {
     return `npm run ${command}`;
   }
 
+  getNpmVersion() {
+    return this.executeCommand('npm', ['--version']);
+  }
+
+  hasLegacyPeerDeps() {
+    const result = this.executeCommand('npm', ['config', 'get', 'legacy-peer-deps', '--location=project']);
+    return result.trim() === 'true';
+  }
+
+  setLegacyPeerDeps() {
+    this.executeCommand('npm', ['config', 'set', 'legacy-peer-deps=true', '--location=project']);
+  }
+
+  needsLegacyPeerDeps(version) {
+    return _semver.default.gte(version, '7.0.0') && !this.hasLegacyPeerDeps();
+  }
+
   getInstallArgs() {
     if (!this.installArgs) {
-      const version = this.executeCommand('npm', ['--version']);
-      this.installArgs = _semver.default.gte(version, '7.0.0') ? ['install', '--legacy-peer-deps'] : ['install'];
+      this.installArgs = this.needsLegacyPeerDeps(this.getNpmVersion()) ? ['install', '--legacy-peer-deps'] : ['install'];
     }
 
     return this.installArgs;

package/dist/cjs/versions.js

@@ -6,78 +6,79 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 // auto generated file, do not edit
 var _default = {
-  '@storybook/addon-a11y': '7.0.0-alpha.4',
-  '@storybook/addon-actions': '7.0.0-alpha.4',
-  '@storybook/addon-backgrounds': '7.0.0-alpha.4',
-  '@storybook/addon-controls': '7.0.0-alpha.4',
-  '@storybook/addon-docs': '7.0.0-alpha.4',
-  '@storybook/addon-essentials': '7.0.0-alpha.4',
-  '@storybook/addon-interactions': '7.0.0-alpha.4',
-  '@storybook/addon-jest': '7.0.0-alpha.4',
-  '@storybook/addon-links': '7.0.0-alpha.4',
-  '@storybook/addon-measure': '7.0.0-alpha.4',
-  '@storybook/addon-outline': '7.0.0-alpha.4',
-  '@storybook/addon-storyshots': '7.0.0-alpha.4',
-  '@storybook/addon-storyshots-puppeteer': '7.0.0-alpha.4',
-  '@storybook/addon-storysource': '7.0.0-alpha.4',
-  '@storybook/addon-toolbars': '7.0.0-alpha.4',
-  '@storybook/addon-viewport': '7.0.0-alpha.4',
-  '@storybook/addons': '7.0.0-alpha.4',
-  '@storybook/angular': '7.0.0-alpha.4',
-  '@storybook/api': '7.0.0-alpha.4',
-  '@storybook/builder-webpack5': '7.0.0-alpha.4',
-  '@storybook/channel-postmessage': '7.0.0-alpha.4',
-  '@storybook/channel-websocket': '7.0.0-alpha.4',
-  '@storybook/channels': '7.0.0-alpha.4',
-  '@storybook/cli': '7.0.0-alpha.4',
-  '@storybook/client-api': '7.0.0-alpha.4',
-  '@storybook/client-logger': '7.0.0-alpha.4',
-  '@storybook/codemod': '7.0.0-alpha.4',
-  '@storybook/components': '7.0.0-alpha.4',
-  '@storybook/core-client': '7.0.0-alpha.4',
-  '@storybook/core-common': '7.0.0-alpha.4',
-  '@storybook/core-events': '7.0.0-alpha.4',
-  '@storybook/core-server': '7.0.0-alpha.4',
-  '@storybook/core-webpack': '7.0.0-alpha.4',
-  '@storybook/csf-tools': '7.0.0-alpha.4',
-  '@storybook/docs-tools': '7.0.0-alpha.4',
-  '@storybook/ember': '7.0.0-alpha.4',
-  '@storybook/html': '7.0.0-alpha.4',
-  '@storybook/html-webpack5': '7.0.0-alpha.4',
-  '@storybook/instrumenter': '7.0.0-alpha.4',
-  '@storybook/manager-webpack5': '7.0.0-alpha.4',
-  '@storybook/node-logger': '7.0.0-alpha.4',
-  '@storybook/postinstall': '7.0.0-alpha.4',
-  '@storybook/preact': '7.0.0-alpha.4',
-  '@storybook/preact-webpack5': '7.0.0-alpha.4',
-  '@storybook/preset-html-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-preact-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-react-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-server-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-svelte-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-vue-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-vue3-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-web-components-webpack': '7.0.0-alpha.4',
-  '@storybook/preview-web': '7.0.0-alpha.4',
-  '@storybook/react': '7.0.0-alpha.4',
-  '@storybook/react-webpack5': '7.0.0-alpha.4',
-  '@storybook/router': '7.0.0-alpha.4',
-  '@storybook/server': '7.0.0-alpha.4',
-  '@storybook/server-webpack5': '7.0.0-alpha.4',
-  '@storybook/source-loader': '7.0.0-alpha.4',
-  '@storybook/store': '7.0.0-alpha.4',
-  '@storybook/svelte': '7.0.0-alpha.4',
-  '@storybook/svelte-webpack5': '7.0.0-alpha.4',
-  '@storybook/telemetry': '7.0.0-alpha.4',
-  '@storybook/theming': '7.0.0-alpha.4',
-  '@storybook/ui': '7.0.0-alpha.4',
-  '@storybook/vue': '7.0.0-alpha.4',
-  '@storybook/vue-webpack5': '7.0.0-alpha.4',
-  '@storybook/vue3': '7.0.0-alpha.4',
-  '@storybook/vue3-webpack5': '7.0.0-alpha.4',
-  '@storybook/web-components': '7.0.0-alpha.4',
-  '@storybook/web-components-webpack5': '7.0.0-alpha.4',
-  sb: '7.0.0-alpha.4',
-  storybook: '7.0.0-alpha.4'
+  '@storybook/addon-a11y': '7.0.0-alpha.7',
+  '@storybook/addon-actions': '7.0.0-alpha.7',
+  '@storybook/addon-backgrounds': '7.0.0-alpha.7',
+  '@storybook/addon-controls': '7.0.0-alpha.7',
+  '@storybook/addon-docs': '7.0.0-alpha.7',
+  '@storybook/addon-essentials': '7.0.0-alpha.7',
+  '@storybook/addon-highlight': '7.0.0-alpha.7',
+  '@storybook/addon-interactions': '7.0.0-alpha.7',
+  '@storybook/addon-jest': '7.0.0-alpha.7',
+  '@storybook/addon-links': '7.0.0-alpha.7',
+  '@storybook/addon-measure': '7.0.0-alpha.7',
+  '@storybook/addon-outline': '7.0.0-alpha.7',
+  '@storybook/addon-storyshots': '7.0.0-alpha.7',
+  '@storybook/addon-storyshots-puppeteer': '7.0.0-alpha.7',
+  '@storybook/addon-storysource': '7.0.0-alpha.7',
+  '@storybook/addon-toolbars': '7.0.0-alpha.7',
+  '@storybook/addon-viewport': '7.0.0-alpha.7',
+  '@storybook/addons': '7.0.0-alpha.7',
+  '@storybook/angular': '7.0.0-alpha.7',
+  '@storybook/api': '7.0.0-alpha.7',
+  '@storybook/builder-webpack5': '7.0.0-alpha.7',
+  '@storybook/channel-postmessage': '7.0.0-alpha.7',
+  '@storybook/channel-websocket': '7.0.0-alpha.7',
+  '@storybook/channels': '7.0.0-alpha.7',
+  '@storybook/cli': '7.0.0-alpha.7',
+  '@storybook/client-api': '7.0.0-alpha.7',
+  '@storybook/client-logger': '7.0.0-alpha.7',
+  '@storybook/codemod': '7.0.0-alpha.7',
+  '@storybook/components': '7.0.0-alpha.7',
+  '@storybook/core-client': '7.0.0-alpha.7',
+  '@storybook/core-common': '7.0.0-alpha.7',
+  '@storybook/core-events': '7.0.0-alpha.7',
+  '@storybook/core-server': '7.0.0-alpha.7',
+  '@storybook/core-webpack': '7.0.0-alpha.7',
+  '@storybook/csf-tools': '7.0.0-alpha.7',
+  '@storybook/docs-tools': '7.0.0-alpha.7',
+  '@storybook/ember': '7.0.0-alpha.7',
+  '@storybook/html': '7.0.0-alpha.7',
+  '@storybook/html-webpack5': '7.0.0-alpha.7',
+  '@storybook/instrumenter': '7.0.0-alpha.7',
+  '@storybook/manager-webpack5': '7.0.0-alpha.7',
+  '@storybook/node-logger': '7.0.0-alpha.7',
+  '@storybook/postinstall': '7.0.0-alpha.7',
+  '@storybook/preact': '7.0.0-alpha.7',
+  '@storybook/preact-webpack5': '7.0.0-alpha.7',
+  '@storybook/preset-html-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-preact-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-react-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-server-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-svelte-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-vue-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-vue3-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-web-components-webpack': '7.0.0-alpha.7',
+  '@storybook/preview-web': '7.0.0-alpha.7',
+  '@storybook/react': '7.0.0-alpha.7',
+  '@storybook/react-webpack5': '7.0.0-alpha.7',
+  '@storybook/router': '7.0.0-alpha.7',
+  '@storybook/server': '7.0.0-alpha.7',
+  '@storybook/server-webpack5': '7.0.0-alpha.7',
+  '@storybook/source-loader': '7.0.0-alpha.7',
+  '@storybook/store': '7.0.0-alpha.7',
+  '@storybook/svelte': '7.0.0-alpha.7',
+  '@storybook/svelte-webpack5': '7.0.0-alpha.7',
+  '@storybook/telemetry': '7.0.0-alpha.7',
+  '@storybook/theming': '7.0.0-alpha.7',
+  '@storybook/ui': '7.0.0-alpha.7',
+  '@storybook/vue': '7.0.0-alpha.7',
+  '@storybook/vue-webpack5': '7.0.0-alpha.7',
+  '@storybook/vue3': '7.0.0-alpha.7',
+  '@storybook/vue3-webpack5': '7.0.0-alpha.7',
+  '@storybook/web-components': '7.0.0-alpha.7',
+  '@storybook/web-components-webpack5': '7.0.0-alpha.7',
+  sb: '7.0.0-alpha.7',
+  storybook: '7.0.0-alpha.7'
 };
 exports.default = _default;

package/dist/esm/automigrate/fixes/index.js

@@ -22,6 +22,8 @@ var _eslintPlugin = require("./eslint-plugin");
 
 var _builderVite = require("./builder-vite");
 
+var _npm = require("./npm7");
+
 var _types = require("../types");
 
 Object.keys(_types).forEach(function (key) {
@@ -35,5 +37,5 @@ Object.keys(_types).forEach(function (key) {
     }
   });
 });
-const fixes = [_cra.cra5, _webpack.webpack5, _angular.angular12, _vue.vue3, _mainjsFramework.mainjsFramework, _eslintPlugin.eslintPlugin, _builderVite.builderVite];
+const fixes = [_cra.cra5, _webpack.webpack5, _angular.angular12, _vue.vue3, _mainjsFramework.mainjsFramework, _eslintPlugin.eslintPlugin, _builderVite.builderVite, _npm.npm7];
 exports.fixes = fixes;

package/dist/esm/automigrate/fixes/npm7.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.npm7 = void 0;
+
+require("core-js/modules/es.promise.js");
+
+var _chalk = _interopRequireDefault(require("chalk"));
+
+var _tsDedent = _interopRequireDefault(require("ts-dedent"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/**
+ * Is the user using npm7+? If so create a .npmrc with legacy-peer-deps=true
+ */
+const npm7 = {
+  id: 'npm7',
+
+  async check({
+    packageManager
+  }) {
+    if (packageManager.type !== 'npm') return null;
+    const npmVersion = packageManager.getNpmVersion();
+
+    if (packageManager.needsLegacyPeerDeps(npmVersion)) {
+      return {
+        npmVersion
+      };
+    }
+
+    return null;
+  },
+
+  prompt({
+    npmVersion
+  }) {
+    const npmFormatted = _chalk.default.cyan(`npm ${npmVersion}`);
+
+    return (0, _tsDedent.default)`
+      We've detected you are running ${npmFormatted} which has peer dependency semantics which Storybook is incompatible with.
+
+      In order to work with Storybook's package structure, you'll need to run \`npm\` with the
+      \`--legacy-peer-deps=true\` flag. We can generate an \`.npmrc\` which will do that automatically.
+      
+      More info: ${_chalk.default.yellow('https://github.com/storybookjs/storybook/issues/18298')}
+    `;
+  },
+
+  async run({
+    packageManager
+  }) {
+    packageManager.setLegacyPeerDeps();
+  }
+
+};
+exports.npm7 = npm7;

package/dist/esm/frameworks/angular/Button.stories.ts

@@ -1,5 +1,5 @@
 // also exported from '@storybook/angular' if you can deal with breaking changes in 6.1
-import { Story, Meta } from '@storybook/angular/types-6-0';
+import type { Meta, StoryFn } from '@storybook/angular';
 import Button from './button.component';
 
 // More on default export: https://storybook.js.org/docs/angular/writing-stories/introduction#default-export
@@ -13,7 +13,7 @@ export default {
 } as Meta;
 
 // More on component templates: https://storybook.js.org/docs/angular/writing-stories/introduction#using-args
-const Template: Story<Button> = (args: Button) => {
+const Template: StoryFn<Button> = (args: Button) => {
   return {
     props: { backgroundColor: null, ...args },
   };

package/dist/esm/frameworks/angular/Header.stories.ts

@@ -1,6 +1,6 @@
 import { moduleMetadata } from '@storybook/angular';
 import { CommonModule } from '@angular/common';
-import type { Story, Meta } from '@storybook/angular';
+import type { Meta, StoryFn } from '@storybook/angular';
 
 import Button from './button.component';
 import Header from './header.component';
@@ -20,7 +20,7 @@ export default {
   },
 } as Meta;
 
-const Template: Story<Header> = (args: Header) => ({
+const Template: StoryFn<Header> = (args: Header) => ({
   props: args,
 });
 

package/dist/esm/frameworks/angular/Page.stories.ts

@@ -1,4 +1,4 @@
-import { moduleMetadata, Story, Meta } from '@storybook/angular';
+import { moduleMetadata, StoryFn, Meta } from '@storybook/angular';
 import { within, userEvent } from '@storybook/testing-library';
 import { CommonModule } from '@angular/common';
 
@@ -10,7 +10,7 @@ export default {
   title: 'Example/Page',
   component: Page,
   parameters: {
-    // More on Story layout: https://storybook.js.org/docs/angular/configure/story-layout
+    // More on StoryFn layout: https://storybook.js.org/docs/angular/configure/story-layout
     layout: 'fullscreen',
   },
   decorators: [
@@ -21,7 +21,7 @@ export default {
   ],
 } as Meta;
 
-const Template: Story<Page> = (args: Page) => ({
+const Template: StoryFn<Page> = (args: Page) => ({
   props: args,
 });
 

package/dist/esm/frameworks/html/ts/Button.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/html';
+import type { Meta, StoryFn } from '@storybook/html';
 import { createButton, ButtonProps } from './Button';
 
 // More on default export: https://storybook.js.org/docs/html/writing-stories/introduction#default-export
@@ -18,7 +18,7 @@ export default {
 } as Meta;
 
 // More on component templates: https://storybook.js.org/docs/html/writing-stories/introduction#using-args
-const Template: Story<ButtonProps> = (args) => {
+const Template: StoryFn<ButtonProps> = (args) => {
   // You can either use a function to create DOM elements or use a plain html string!
   // return `<div>${label}</div>`;
   return createButton(args);

package/dist/esm/frameworks/html/ts/Header.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/html';
+import type { Meta, StoryFn } from '@storybook/html';
 import { createHeader, HeaderProps } from './Header';
 
 export default {
@@ -15,7 +15,7 @@ export default {
   },
 } as Meta;
 
-const Template: Story<HeaderProps> = (args) => createHeader(args);
+const Template: StoryFn<HeaderProps> = (args) => createHeader(args);
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/esm/frameworks/html/ts/Page.stories.ts

@@ -1,5 +1,5 @@
 import { within, userEvent } from '@storybook/testing-library';
-import { Story, Meta } from '@storybook/html';
+import type { Meta, StoryFn } from '@storybook/html';
 import { createPage } from './Page';
 
 export default {
@@ -10,7 +10,7 @@ export default {
   },
 } as Meta;
 
-const Template: Story = () => createPage();
+const Template: StoryFn = () => createPage();
 
 export const LoggedOut = Template.bind({});
 

package/dist/esm/frameworks/react/ts/Button.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ComponentStory, ComponentMeta } from '@storybook/react';
+import type { ComponentStoryFn, ComponentMeta } from '@storybook/react';
 
 import { Button } from './Button';
 
@@ -14,7 +14,7 @@ export default {
 } as ComponentMeta<typeof Button>;
 
 // More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
-const Template: ComponentStory<typeof Button> = (args) => <Button {...args} />;
+const Template: ComponentStoryFn<typeof Button> = (args) => <Button {...args} />;
 
 export const Primary = Template.bind({});
 // More on args: https://storybook.js.org/docs/react/writing-stories/args

package/dist/esm/frameworks/react/ts/Header.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ComponentStory, ComponentMeta } from '@storybook/react';
+import type { ComponentStoryFn, ComponentMeta } from '@storybook/react';
 
 import { Header } from './Header';
 
@@ -12,7 +12,7 @@ export default {
   },
 } as ComponentMeta<typeof Header>;
 
-const Template: ComponentStory<typeof Header> = (args) => <Header {...args} />;
+const Template: ComponentStoryFn<typeof Header> = (args) => <Header {...args} />;
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/esm/frameworks/react/ts/Page.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ComponentStory, ComponentMeta } from '@storybook/react';
+import type { ComponentStoryFn, ComponentMeta } from '@storybook/react';
 import { within, userEvent } from '@storybook/testing-library';
 import { Page } from './Page';
 
@@ -12,7 +12,7 @@ export default {
   },
 } as ComponentMeta<typeof Page>;
 
-const Template: ComponentStory<typeof Page> = (args) => <Page {...args} />;
+const Template: ComponentStoryFn<typeof Page> = (args) => <Page {...args} />;
 
 export const LoggedOut = Template.bind({});
 

package/dist/esm/frameworks/web-components/ts/Button.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/web-components';
+import type { Meta, StoryFn } from '@storybook/web-components';
 import { Button, ButtonProps } from './Button';
 
 // More on default export: https://storybook.js.org/docs/web-components/writing-stories/introduction#default-export
@@ -16,7 +16,7 @@ export default {
 } as Meta;
 
 // More on component templates: https://storybook.js.org/docs/web-components/writing-stories/introduction#using-args
-const Template: Story<Partial<ButtonProps>> = (args) => Button(args);
+const Template: StoryFn<ButtonProps> = (args) => Button(args);
 
 export const Primary = Template.bind({});
 // More on args: https://storybook.js.org/docs/web-components/writing-stories/args

package/dist/esm/frameworks/web-components/ts/Header.stories.ts

@@ -1,11 +1,11 @@
-import { Story, Meta } from '@storybook/web-components';
+import type { Meta, StoryFn } from '@storybook/web-components';
 import { Header, HeaderProps } from './Header';
 
 export default {
   title: 'Example/Header',
 } as Meta;
 
-const Template: Story<Partial<HeaderProps>> = (args) => Header(args);
+const Template: StoryFn<HeaderProps> = (args) => Header(args);
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/esm/frameworks/web-components/ts/Page.stories.ts

@@ -1,4 +1,4 @@
-import { Story, Meta } from '@storybook/web-components';
+import type { Meta, StoryFn } from '@storybook/web-components';
 import { Page, PageProps } from './Page';
 import * as HeaderStories from './Header.stories';
 
@@ -6,7 +6,7 @@ export default {
   title: 'Example/Page',
 } as Meta;
 
-const Template: Story<Partial<PageProps>> = (args) => Page(args);
+const Template: StoryFn<PageProps> = (args) => Page(args);
 
 export const LoggedIn = Template.bind({});
 LoggedIn.args = {

package/dist/esm/generators/REACT_SCRIPTS/index.js

@@ -30,10 +30,10 @@ const generator = async (packageManager, npmOptions, options) => {
       config.resolve.plugins.forEach((p) => {
         if (Array.isArray(p.appSrcs)) {
           p.appSrcs.push('${monorepoRootPath}');
-        }
-      });
-      return config;
-    }
+              }
+            });
+          return config;
+          }
     %%`
   } : {};
   const craVersion = (_semver$coerce = _semver.default.coerce(packageManager.retrievePackageJson().dependencies['react-scripts'])) === null || _semver$coerce === void 0 ? void 0 : _semver$coerce.version;

package/dist/esm/generators/SVELTE/index.js

@@ -16,25 +16,21 @@ var _baseGenerator = require("../baseGenerator");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const generator = async (packageManager, npmOptions, options) => {
-  let extraMain;
+  let svelteOptions;
   let commonJs = false; // svelte.config.js ?
 
   if (_fsExtra.default.existsSync('./svelte.config.js')) {
     _nodeLogger.logger.info("Configuring preprocessor from 'svelte.config.js'");
 
-    extraMain = {
-      svelteOptions: {
-        preprocess: '%%require("../svelte.config.js").preprocess%%'
-      }
+    svelteOptions = {
+      preprocess: '%%require("../svelte.config.js").preprocess%%'
     };
   } else if (_fsExtra.default.existsSync('./svelte.config.cjs')) {
     _nodeLogger.logger.info("Configuring preprocessor from 'svelte.config.cjs'");
 
     commonJs = true;
-    extraMain = {
-      svelteOptions: {
-        preprocess: '%%require("../svelte.config.cjs").preprocess%%'
-      }
+    svelteOptions = {
+      preprocess: '%%require("../svelte.config.cjs").preprocess%%'
     };
   } else {
     // svelte-preprocess dependencies ?
@@ -43,10 +39,8 @@ const generator = async (packageManager, npmOptions, options) => {
     if (packageJson.devDependencies && packageJson.devDependencies['svelte-preprocess']) {
       _nodeLogger.logger.info("Configuring preprocessor with 'svelte-preprocess'");
 
-      extraMain = {
-        svelteOptions: {
-          preprocess: '%%require("svelte-preprocess")()%%'
-        }
+      svelteOptions = {
+        preprocess: '%%require("svelte-preprocess")()%%'
       };
     }
   }
@@ -54,7 +48,7 @@ const generator = async (packageManager, npmOptions, options) => {
   await (0, _baseGenerator.baseGenerator)(packageManager, npmOptions, options, 'svelte', {
     extraPackages: ['svelte', 'svelte-loader'],
     extensions: ['js', 'jsx', 'ts', 'tsx', 'svelte'],
-    extraMain,
+    framework: svelteOptions,
     commonJs
   });
 };

package/dist/esm/generators/baseGenerator.js

@@ -34,6 +34,7 @@ const defaultOptions = {
   addBabel: true,
   addESLint: false,
   extraMain: undefined,
+  framework: undefined,
   extensions: undefined,
   commonJs: false
 };
@@ -152,7 +153,7 @@ async function baseGenerator(packageManager, npmOptions, {
   await (0, _configure.configureMain)(Object.assign({
     framework: {
       name: frameworkInclude,
-      options: {}
+      options: options.framework || {}
     },
     addons: pnp ? addons.map(wrapForPnp) : addons,
     extensions,

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

@@ -30,10 +30,26 @@ class NPMProxy extends _JsPackageManager.JsPackageManager {
     return `npm run ${command}`;
   }
 
+  getNpmVersion() {
+    return this.executeCommand('npm', ['--version']);
+  }
+
+  hasLegacyPeerDeps() {
+    const result = this.executeCommand('npm', ['config', 'get', 'legacy-peer-deps', '--location=project']);
+    return result.trim() === 'true';
+  }
+
+  setLegacyPeerDeps() {
+    this.executeCommand('npm', ['config', 'set', 'legacy-peer-deps=true', '--location=project']);
+  }
+
+  needsLegacyPeerDeps(version) {
+    return _semver.default.gte(version, '7.0.0') && !this.hasLegacyPeerDeps();
+  }
+
   getInstallArgs() {
     if (!this.installArgs) {
-      const version = this.executeCommand('npm', ['--version']);
-      this.installArgs = _semver.default.gte(version, '7.0.0') ? ['install', '--legacy-peer-deps'] : ['install'];
+      this.installArgs = this.needsLegacyPeerDeps(this.getNpmVersion()) ? ['install', '--legacy-peer-deps'] : ['install'];
     }
 
     return this.installArgs;

package/dist/esm/versions.js

@@ -6,78 +6,79 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 // auto generated file, do not edit
 var _default = {
-  '@storybook/addon-a11y': '7.0.0-alpha.4',
-  '@storybook/addon-actions': '7.0.0-alpha.4',
-  '@storybook/addon-backgrounds': '7.0.0-alpha.4',
-  '@storybook/addon-controls': '7.0.0-alpha.4',
-  '@storybook/addon-docs': '7.0.0-alpha.4',
-  '@storybook/addon-essentials': '7.0.0-alpha.4',
-  '@storybook/addon-interactions': '7.0.0-alpha.4',
-  '@storybook/addon-jest': '7.0.0-alpha.4',
-  '@storybook/addon-links': '7.0.0-alpha.4',
-  '@storybook/addon-measure': '7.0.0-alpha.4',
-  '@storybook/addon-outline': '7.0.0-alpha.4',
-  '@storybook/addon-storyshots': '7.0.0-alpha.4',
-  '@storybook/addon-storyshots-puppeteer': '7.0.0-alpha.4',
-  '@storybook/addon-storysource': '7.0.0-alpha.4',
-  '@storybook/addon-toolbars': '7.0.0-alpha.4',
-  '@storybook/addon-viewport': '7.0.0-alpha.4',
-  '@storybook/addons': '7.0.0-alpha.4',
-  '@storybook/angular': '7.0.0-alpha.4',
-  '@storybook/api': '7.0.0-alpha.4',
-  '@storybook/builder-webpack5': '7.0.0-alpha.4',
-  '@storybook/channel-postmessage': '7.0.0-alpha.4',
-  '@storybook/channel-websocket': '7.0.0-alpha.4',
-  '@storybook/channels': '7.0.0-alpha.4',
-  '@storybook/cli': '7.0.0-alpha.4',
-  '@storybook/client-api': '7.0.0-alpha.4',
-  '@storybook/client-logger': '7.0.0-alpha.4',
-  '@storybook/codemod': '7.0.0-alpha.4',
-  '@storybook/components': '7.0.0-alpha.4',
-  '@storybook/core-client': '7.0.0-alpha.4',
-  '@storybook/core-common': '7.0.0-alpha.4',
-  '@storybook/core-events': '7.0.0-alpha.4',
-  '@storybook/core-server': '7.0.0-alpha.4',
-  '@storybook/core-webpack': '7.0.0-alpha.4',
-  '@storybook/csf-tools': '7.0.0-alpha.4',
-  '@storybook/docs-tools': '7.0.0-alpha.4',
-  '@storybook/ember': '7.0.0-alpha.4',
-  '@storybook/html': '7.0.0-alpha.4',
-  '@storybook/html-webpack5': '7.0.0-alpha.4',
-  '@storybook/instrumenter': '7.0.0-alpha.4',
-  '@storybook/manager-webpack5': '7.0.0-alpha.4',
-  '@storybook/node-logger': '7.0.0-alpha.4',
-  '@storybook/postinstall': '7.0.0-alpha.4',
-  '@storybook/preact': '7.0.0-alpha.4',
-  '@storybook/preact-webpack5': '7.0.0-alpha.4',
-  '@storybook/preset-html-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-preact-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-react-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-server-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-svelte-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-vue-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-vue3-webpack': '7.0.0-alpha.4',
-  '@storybook/preset-web-components-webpack': '7.0.0-alpha.4',
-  '@storybook/preview-web': '7.0.0-alpha.4',
-  '@storybook/react': '7.0.0-alpha.4',
-  '@storybook/react-webpack5': '7.0.0-alpha.4',
-  '@storybook/router': '7.0.0-alpha.4',
-  '@storybook/server': '7.0.0-alpha.4',
-  '@storybook/server-webpack5': '7.0.0-alpha.4',
-  '@storybook/source-loader': '7.0.0-alpha.4',
-  '@storybook/store': '7.0.0-alpha.4',
-  '@storybook/svelte': '7.0.0-alpha.4',
-  '@storybook/svelte-webpack5': '7.0.0-alpha.4',
-  '@storybook/telemetry': '7.0.0-alpha.4',
-  '@storybook/theming': '7.0.0-alpha.4',
-  '@storybook/ui': '7.0.0-alpha.4',
-  '@storybook/vue': '7.0.0-alpha.4',
-  '@storybook/vue-webpack5': '7.0.0-alpha.4',
-  '@storybook/vue3': '7.0.0-alpha.4',
-  '@storybook/vue3-webpack5': '7.0.0-alpha.4',
-  '@storybook/web-components': '7.0.0-alpha.4',
-  '@storybook/web-components-webpack5': '7.0.0-alpha.4',
-  sb: '7.0.0-alpha.4',
-  storybook: '7.0.0-alpha.4'
+  '@storybook/addon-a11y': '7.0.0-alpha.7',
+  '@storybook/addon-actions': '7.0.0-alpha.7',
+  '@storybook/addon-backgrounds': '7.0.0-alpha.7',
+  '@storybook/addon-controls': '7.0.0-alpha.7',
+  '@storybook/addon-docs': '7.0.0-alpha.7',
+  '@storybook/addon-essentials': '7.0.0-alpha.7',
+  '@storybook/addon-highlight': '7.0.0-alpha.7',
+  '@storybook/addon-interactions': '7.0.0-alpha.7',
+  '@storybook/addon-jest': '7.0.0-alpha.7',
+  '@storybook/addon-links': '7.0.0-alpha.7',
+  '@storybook/addon-measure': '7.0.0-alpha.7',
+  '@storybook/addon-outline': '7.0.0-alpha.7',
+  '@storybook/addon-storyshots': '7.0.0-alpha.7',
+  '@storybook/addon-storyshots-puppeteer': '7.0.0-alpha.7',
+  '@storybook/addon-storysource': '7.0.0-alpha.7',
+  '@storybook/addon-toolbars': '7.0.0-alpha.7',
+  '@storybook/addon-viewport': '7.0.0-alpha.7',
+  '@storybook/addons': '7.0.0-alpha.7',
+  '@storybook/angular': '7.0.0-alpha.7',
+  '@storybook/api': '7.0.0-alpha.7',
+  '@storybook/builder-webpack5': '7.0.0-alpha.7',
+  '@storybook/channel-postmessage': '7.0.0-alpha.7',
+  '@storybook/channel-websocket': '7.0.0-alpha.7',
+  '@storybook/channels': '7.0.0-alpha.7',
+  '@storybook/cli': '7.0.0-alpha.7',
+  '@storybook/client-api': '7.0.0-alpha.7',
+  '@storybook/client-logger': '7.0.0-alpha.7',
+  '@storybook/codemod': '7.0.0-alpha.7',
+  '@storybook/components': '7.0.0-alpha.7',
+  '@storybook/core-client': '7.0.0-alpha.7',
+  '@storybook/core-common': '7.0.0-alpha.7',
+  '@storybook/core-events': '7.0.0-alpha.7',
+  '@storybook/core-server': '7.0.0-alpha.7',
+  '@storybook/core-webpack': '7.0.0-alpha.7',
+  '@storybook/csf-tools': '7.0.0-alpha.7',
+  '@storybook/docs-tools': '7.0.0-alpha.7',
+  '@storybook/ember': '7.0.0-alpha.7',
+  '@storybook/html': '7.0.0-alpha.7',
+  '@storybook/html-webpack5': '7.0.0-alpha.7',
+  '@storybook/instrumenter': '7.0.0-alpha.7',
+  '@storybook/manager-webpack5': '7.0.0-alpha.7',
+  '@storybook/node-logger': '7.0.0-alpha.7',
+  '@storybook/postinstall': '7.0.0-alpha.7',
+  '@storybook/preact': '7.0.0-alpha.7',
+  '@storybook/preact-webpack5': '7.0.0-alpha.7',
+  '@storybook/preset-html-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-preact-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-react-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-server-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-svelte-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-vue-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-vue3-webpack': '7.0.0-alpha.7',
+  '@storybook/preset-web-components-webpack': '7.0.0-alpha.7',
+  '@storybook/preview-web': '7.0.0-alpha.7',
+  '@storybook/react': '7.0.0-alpha.7',
+  '@storybook/react-webpack5': '7.0.0-alpha.7',
+  '@storybook/router': '7.0.0-alpha.7',
+  '@storybook/server': '7.0.0-alpha.7',
+  '@storybook/server-webpack5': '7.0.0-alpha.7',
+  '@storybook/source-loader': '7.0.0-alpha.7',
+  '@storybook/store': '7.0.0-alpha.7',
+  '@storybook/svelte': '7.0.0-alpha.7',
+  '@storybook/svelte-webpack5': '7.0.0-alpha.7',
+  '@storybook/telemetry': '7.0.0-alpha.7',
+  '@storybook/theming': '7.0.0-alpha.7',
+  '@storybook/ui': '7.0.0-alpha.7',
+  '@storybook/vue': '7.0.0-alpha.7',
+  '@storybook/vue-webpack5': '7.0.0-alpha.7',
+  '@storybook/vue3': '7.0.0-alpha.7',
+  '@storybook/vue3-webpack5': '7.0.0-alpha.7',
+  '@storybook/web-components': '7.0.0-alpha.7',
+  '@storybook/web-components-webpack5': '7.0.0-alpha.7',
+  sb: '7.0.0-alpha.7',
+  storybook: '7.0.0-alpha.7'
 };
 exports.default = _default;

package/dist/types/automigrate/fixes/npm7.d.ts

@@ -0,0 +1,9 @@
+import { Fix } from '../types';
+interface Npm7RunOptions {
+    npmVersion: string;
+}
+/**
+ * Is the user using npm7+? If so create a .npmrc with legacy-peer-deps=true
+ */
+export declare const npm7: Fix<Npm7RunOptions>;
+export {};

package/dist/types/generators/types.d.ts

@@ -17,6 +17,7 @@ export interface FrameworkOptions {
     addESLint?: boolean;
     extraMain?: any;
     extensions?: string[];
+    framework?: Record<string, any>;
     commonJs?: boolean;
 }
 export declare type Generator = (packageManagerInstance: JsPackageManager, npmOptions: NpmOptions, generatorOptions: GeneratorOptions) => Promise<void>;

package/dist/types/js-package-manager/NPMProxy.d.ts

@@ -5,6 +5,10 @@ export declare class NPMProxy extends JsPackageManager {
     initPackageJson(): string;
     getRunStorybookCommand(): string;
     getRunCommand(command: string): string;
+    getNpmVersion(): string;
+    hasLegacyPeerDeps(): boolean;
+    setLegacyPeerDeps(): void;
+    needsLegacyPeerDeps(version: string): boolean;
     getInstallArgs(): string[];
     protected runInstall(): void;
     protected runAddDeps(dependencies: string[], installAsDevDependencies: boolean): void;

package/dist/types/versions.d.ts

@@ -5,6 +5,7 @@ declare const _default: {
     '@storybook/addon-controls': string;
     '@storybook/addon-docs': string;
     '@storybook/addon-essentials': string;
+    '@storybook/addon-highlight': string;
     '@storybook/addon-interactions': string;
     '@storybook/addon-jest': string;
     '@storybook/addon-links': string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/cli",
-  "version": "7.0.0-alpha.4",
+  "version": "7.0.0-alpha.7",
   "description": "Storybook's CLI - easiest method of adding storybook to your projects",
   "keywords": [
     "cli",
@@ -47,13 +47,13 @@
   "dependencies": {
     "@babel/core": "^7.12.10",
     "@babel/preset-env": "^7.12.11",
-    "@storybook/codemod": "7.0.0-alpha.4",
-    "@storybook/core-common": "7.0.0-alpha.4",
-    "@storybook/core-server": "7.0.0-alpha.4",
-    "@storybook/csf-tools": "7.0.0-alpha.4",
-    "@storybook/node-logger": "7.0.0-alpha.4",
+    "@storybook/codemod": "7.0.0-alpha.7",
+    "@storybook/core-common": "7.0.0-alpha.7",
+    "@storybook/core-server": "7.0.0-alpha.7",
+    "@storybook/csf-tools": "7.0.0-alpha.7",
+    "@storybook/node-logger": "7.0.0-alpha.7",
     "@storybook/semver": "^7.3.2",
-    "@storybook/telemetry": "7.0.0-alpha.4",
+    "@storybook/telemetry": "7.0.0-alpha.7",
     "boxen": "^5.1.2",
     "chalk": "^4.1.0",
     "commander": "^6.2.1",
@@ -78,7 +78,7 @@
     "update-notifier": "^5.0.1"
   },
   "devDependencies": {
-    "@storybook/client-api": "7.0.0-alpha.4",
+    "@storybook/client-api": "7.0.0-alpha.7",
     "@types/cross-spawn": "^6.0.2",
     "@types/prompts": "^2.0.9",
     "@types/puppeteer-core": "^2.1.0",
@@ -91,5 +91,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "006ed54452dd7c37a8cbe91a84f5312182f7ca00"
+  "gitHead": "d334cabd251cd0ed8b845a87707dc84f007d4074"
 }