Build: Regen lockfile

.babelrc.js

@@ -24,6 +24,7 @@ module.exports = {
   ignore: [
     './lib/codemod/src/transforms/__testfixtures__',
     './lib/postinstall/src/__testfixtures__',
+    '**/typings.d.ts',
   ],
   presets: [
     [

.eslintrc.js

@@ -46,6 +46,16 @@ module.exports = {
         'react/prop-types': 'off', // we should use types
         'react/forbid-prop-types': 'off', // we should use types
         'no-dupe-class-members': 'off', // this is called overloads in typescript
+        'react/no-unused-prop-types': 'off', // we should use types
+        'react/default-props-match-prop-types': 'off', // we should use types
+        'import/no-named-as-default': 'warn',
+        'import/no-named-as-default-member': 'warn',
+        'react/destructuring-assignment': 'warn',
+
+        // This warns about importing interfaces and types in a normal import, it's arguably better to import with the `type` prefix separate from the runtime imports,
+        // I leave this as a warning right now because we haven't really decided yet, and the codebase is riddled with errors if I set to 'error'.
+        // It IS set to 'error' for JS files.
+        'import/named': 'warn',
       },
     },
     {

addons/docs/package.json

@@ -131,6 +131,7 @@
     "require-from-string": "^2.0.2",
     "rxjs": "^6.6.3",
     "styled-components": "^5.2.1",
+    "sveltedoc-parser": "4.1.0",
     "terser-webpack-plugin": "^5.0.3",
     "tmp": "^0.2.1",
     "tslib": "^2.1.0",

addons/docs/register.js

@@ -1 +1,2 @@
+/* eslint-disable import/extensions */
 require('./dist/esm/register.js');

addons/docs/src/frameworks/angular/angular-properties.test.ts

@@ -37,7 +37,6 @@ describe('angular component properties', () => {
       const testDir = path.join(fixturesDir, testEntry.name);
       const testFile = fs.readdirSync(testDir).find((fileName) => inputRegExp.test(fileName));
       if (testFile) {
-        // eslint-disable-next-line jest/valid-title
         it(testEntry.name, () => {
           const inputPath = path.join(testDir, testFile);
 

addons/docs/src/frameworks/react/react-properties.test.ts

@@ -52,7 +52,6 @@ describe('react component properties', () => {
       const testDir = path.join(fixturesDir, testEntry.name);
       const testFile = fs.readdirSync(testDir).find((fileName) => inputRegExp.test(fileName));
       if (testFile) {
-        // eslint-disable-next-line jest/valid-title
         it(testEntry.name, () => {
           const inputPath = path.join(testDir, testFile);
 

addons/docs/src/frameworks/svelte/extractArgTypes.test.ts

@@ -3,7 +3,6 @@ import * as fs from 'fs';
 import { createArgTypes } from './extractArgTypes';
 
 const content = fs.readFileSync(`${__dirname}/sample/MockButton.svelte`, 'utf-8');
-
 describe('Extracting Arguments', () => {
   it('should be svelte', () => {
     expect(content).toMatchInlineSnapshot(`

addons/docs/src/frameworks/svelte/extractArgTypes.ts

@@ -103,6 +103,7 @@ const parseTypeToControl = (type: JSDocType): any => {
         return { type: type.type };
     }
   } else if (type.kind === 'union') {
+    // @ts-ignore TODO: fix, this seems like a broke in package update
     if (Array.isArray(type.type) && !type.type.find((t) => t.type !== 'string')) {
       return {
         type: 'radio',

addons/docs/src/frameworks/web-components/web-components-properties.test.ts

@@ -38,7 +38,6 @@ describe('web-components component properties', () => {
       const testDir = path.join(fixturesDir, testEntry.name);
       const testFile = fs.readdirSync(testDir).find((fileName) => inputRegExp.test(fileName));
       if (testFile) {
-        // eslint-disable-next-line jest/valid-title
         it(testEntry.name, () => {
           const inputPath = path.join(testDir, testFile);
 

addons/interactions/src/components/AccountForm/AccountForm.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable import/no-extraneous-dependencies */
 import { Icons, WithTooltip } from '@storybook/components';
 import { keyframes, styled } from '@storybook/theming';
 import {
@@ -6,7 +7,6 @@ import {
   Form as FormikForm,
   Formik,
   FormikProps,
-  // eslint-disable-next-line import/no-extraneous-dependencies
 } from 'formik';
 import React, { FC, HTMLAttributes, useCallback, useState } from 'react';
 

addons/jest/src/components/Panel.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable react/default-props-match-prop-types */
 import React, { Fragment } from 'react';
 import { styled, themes, convert } from '@storybook/theming';
 import { ScrollArea, TabsState, Link, Placeholder } from '@storybook/components';

addons/storyshots/storyshots-core/src/api/snapshotsTestsTemplate.ts

@@ -1,4 +1,3 @@
-/* eslint-disable jest/valid-title */
 /* eslint-disable jest/no-export */
 /* eslint-disable jest/expect-expect */
 import global from 'global';

app/angular/src/builders/build-storybook/index.spec.ts

@@ -126,7 +126,7 @@ describe('Build Storybook Builder', () => {
 
       expect(false).toEqual('Throw expected');
     } catch (error) {
-      // eslint-disable-next-line jest/no-try-expect, jest/no-conditional-expect
+      // eslint-disable-next-line jest/no-try-expect
       expect(error).toEqual(
         'Broken build, fix the error above.\nYou may need to refresh the browser.'
       );

app/angular/src/builders/start-storybook/index.spec.ts

@@ -137,7 +137,7 @@ describe('Start Storybook Builder', () => {
 
       expect(false).toEqual('Throw expected');
     } catch (error) {
-      // eslint-disable-next-line jest/no-try-expect, jest/no-conditional-expect
+      // eslint-disable-next-line jest/no-try-expect
       expect(error).toEqual(
         'Broken build, fix the error above.\nYou may need to refresh the browser.'
       );

app/angular/src/server/framework-preset-angular-cli.test.ts

@@ -1,4 +1,3 @@
-/* eslint-disable jest/no-interpolation-in-snapshots */
 import path from 'path';
 import { Configuration } from 'webpack';
 import { logger } from '@storybook/node-logger';

app/ember/src/server/framework-preset-babel-ember.ts

@@ -1,6 +1,6 @@
 import { TransformOptions } from '@babel/core';
 import { precompile } from 'ember-source/dist/ember-template-compiler';
-import { findDistEsm, StorybookConfig } from '@storybook/core-common';
+import { findDistEsm, StorybookConfig, Options } from '@storybook/core-common';
 
 let emberOptions: any;
 
@@ -13,7 +13,7 @@ function precompileWithPlugins(string: string, options: any) {
   return precompile(string, precompileOptions);
 }
 
-export function babel(config: TransformOptions, options: any) {
+export function babel(config: TransformOptions, options: Options): TransformOptions {
   if (options && options.presetsList) {
     options.presetsList.forEach((e: any, index: number) => {
       if (e.preset && e.preset.emberOptions) {

app/preact/src/server/framework-preset-preact.ts

@@ -3,7 +3,7 @@ import { TransformOptions } from '@babel/core';
 import { Configuration } from 'webpack';
 import { findDistEsm, StorybookConfig } from '@storybook/core-common';
 
-export function babelDefault(config: TransformOptions) {
+export function babelDefault(config: TransformOptions): TransformOptions {
   return {
     ...config,
     plugins: [
@@ -13,7 +13,7 @@ export function babelDefault(config: TransformOptions) {
   };
 }
 
-export function webpackFinal(config: Configuration) {
+export function webpackFinal(config: Configuration): Configuration {
   return {
     ...config,
     resolve: {

app/react/package.json

@@ -74,7 +74,8 @@
   },
   "devDependencies": {
     "@storybook/client-api": "6.5.0-alpha.21",
-    "@types/prompts": "^2.0.9"
+    "@types/prompts": "^2.0.9",
+    "webpack": "4"
   },
   "peerDependencies": {
     "@babel/core": "^7.11.5",

app/react/src/server/framework-preset-react.ts

@@ -45,7 +45,7 @@ const hasJsxRuntime = () => {
   }
 };
 
-export async function babelDefault(config: TransformOptions) {
+export async function babelDefault(config: TransformOptions): Promise<TransformOptions> {
   const presetReactOptions = hasJsxRuntime() ? { runtime: 'automatic' } : {};
   return {
     ...config,

app/server/src/lib/compiler/json-to-csf-compiler.test.ts

@@ -18,7 +18,6 @@ async function generate(filePath: string) {
     fs.readdirSync(transformFixturesDir)
       .filter((fileName: string) => inputRegExp.test(fileName))
       .forEach((fixtureFile: string) => {
-        // eslint-disable-next-line jest/valid-title
         it(fixtureFile, async () => {
           const inputPath = path.join(transformFixturesDir, fixtureFile);
           const code = await generate(inputPath);

app/vue3/package.json

@@ -66,8 +66,11 @@
     "webpack": "4"
   },
   "devDependencies": {
-    "@vue/compiler-sfc": "^3.0.0",
-    "vue": "^3.0.0"
+    "@vue/compiler-sfc": "3.0.0",
+    "vue": "3.0.0",
+    "vue-docgen-api": "4.38.0",
+    "vue-docgen-loader": "1.5.0",
+    "vue-loader": "16.0.0"
   },
   "peerDependencies": {
     "@babel/core": "*",

app/vue3/src/client/preview/render.ts

@@ -14,7 +14,8 @@ export const render: ArgsStoryFn<VueFramework> = (props, context) => {
     );
   }
 
-  return h(Component, props);
+  // TODO remove this hack
+  return h(Component as Parameters<typeof h>[0], props);
 };
 
 export const activeStoryComponent = shallowRef<StoryFnVueReturnType | null>(null);

examples/angular-cli/jest.addon-config.js

@@ -1,3 +1,4 @@
+/* eslint-disable import/extensions */
 const base = require('./jest.config.js');
 
 module.exports = {

examples/cra-kitchen-sink/package.json

@@ -20,7 +20,7 @@
     "react-scripts": "^4.0.2"
   },
   "devDependencies": {
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
     "@storybook/addon-a11y": "6.5.0-alpha.21",
     "@storybook/addon-actions": "6.5.0-alpha.21",
     "@storybook/addon-backgrounds": "6.5.0-alpha.21",

examples/cra-ts-kitchen-sink/src/stories/docgen-tests/types/prop-types.js

@@ -1,6 +1,5 @@
 /* eslint-disable react/no-unused-prop-types */
 import React from 'react';
-// @ts-ignore
 import PropTypes, { string, shape } from 'prop-types';
 import momentPropTypes from 'react-moment-proptypes';
 import { PRESET_SHAPE, SOME_PROP_TYPES } from './ext';
@@ -89,7 +88,6 @@ const SOME_INLINE_DEFAULT_PROPS = {
     return null;
   },
   inlineHtmlElement: <div>Hey!</div>,
-  // eslint-disable-next-line react/prop-types
   inlineFunctionalElementInlineWithProps: ({ foo }) => {
     return <div>{foo}</div>;
   },

examples/official-storybook/package.json

@@ -13,7 +13,7 @@
   },
   "devDependencies": {
     "@packtracker/webpack-plugin": "^2.3.0",
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
     "@storybook/addon-a11y": "6.5.0-alpha.21",
     "@storybook/addon-actions": "6.5.0-alpha.21",
     "@storybook/addon-backgrounds": "6.5.0-alpha.21",

examples/official-storybook/stories/core/events.stories.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import { addons } from '@storybook/addons';
-import Events from '@storybook/core-events';
+import { FORCE_RE_RENDER } from '@storybook/core-events';
 import { Button } from '@storybook/components';
 
 let timesClicked = 0;
 const increment = () => {
   timesClicked += 1;
-  addons.getChannel().emit(Events.FORCE_RE_RENDER);
+  addons.getChannel().emit(FORCE_RE_RENDER);
 };
 
 export default {

lib/cli/bin/index.js

@@ -1,3 +1,4 @@
 #!/usr/bin/env node
 
+// eslint-disable-next-line import/extensions
 require('../dist/cjs/generate.js');

lib/cli/src/upgrade.test.ts

@@ -16,7 +16,6 @@ describe.each([
     null,
   ],
 ])('getStorybookVersion', (input, output) => {
-  // eslint-disable-next-line jest/valid-title
   it(input, () => {
     expect(getStorybookVersion(input)).toEqual(output);
   });
@@ -31,7 +30,6 @@ describe.each([
   ['@storybook/linter-config', false],
   ['@storybook/design-system', false],
 ])('isCorePackage', (input, output) => {
-  // eslint-disable-next-line jest/valid-title
   it(input, () => {
     expect(isCorePackage(input)).toEqual(output);
   });

lib/codemod/src/transforms/__tests__/transforms.tests.js

@@ -10,7 +10,6 @@ const inputRegExp = /\.input\.js$/;
 const fixturesDir = path.resolve(__dirname, '../__testfixtures__');
 fs.readdirSync(fixturesDir).forEach((transformName) => {
   const transformFixturesDir = path.join(fixturesDir, transformName);
-  // eslint-disable-next-line jest/valid-title
   describe(transformName, () =>
     fs
       .readdirSync(transformFixturesDir)

lib/components/src/blocks/Story.tsx

@@ -1,7 +1,7 @@
 import global from 'global';
 import React, { createElement, ElementType, FunctionComponent, Fragment } from 'react';
 
-import type { Parameters } from '@storybook/api';
+import type { Parameters } from '@storybook/csf';
 
 import { IFrame } from './IFrame';
 import { EmptyBlock } from './EmptyBlock';

lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev-posix

@@ -86,7 +86,7 @@ Object {
               "babelrc": false,
               "cacheCompression": false,
               "cacheDirectory": true,
-              "cacheIdentifier": "development:babel-plugin-named-asset-import@0.3.7:babel-preset-react-app@10.0.0:react-dev-utils@11.0.3:react-scripts@4.0.3",
+              "cacheIdentifier": "development:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3",
               "compact": false,
               "configFile": false,
               "customize": "NODE_MODULES/babel-preset-react-app/webpack-overrides.js",
@@ -147,7 +147,7 @@ Object {
               "babelrc": false,
               "cacheCompression": false,
               "cacheDirectory": true,
-              "cacheIdentifier": "development:babel-plugin-named-asset-import@0.3.7:babel-preset-react-app@10.0.0:react-dev-utils@11.0.3:react-scripts@4.0.3",
+              "cacheIdentifier": "development:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3",
               "compact": false,
               "configFile": false,
               "inputSourceMap": true,

lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod-posix

@@ -85,7 +85,7 @@ Object {
               "babelrc": false,
               "cacheCompression": false,
               "cacheDirectory": true,
-              "cacheIdentifier": "production:babel-plugin-named-asset-import@0.3.7:babel-preset-react-app@10.0.0:react-dev-utils@11.0.3:react-scripts@4.0.3",
+              "cacheIdentifier": "production:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3",
               "compact": true,
               "configFile": false,
               "customize": "NODE_MODULES/babel-preset-react-app/webpack-overrides.js",
@@ -145,7 +145,7 @@ Object {
               "babelrc": false,
               "cacheCompression": false,
               "cacheDirectory": true,
-              "cacheIdentifier": "production:babel-plugin-named-asset-import@0.3.7:babel-preset-react-app@10.0.0:react-dev-utils@11.0.3:react-scripts@4.0.3",
+              "cacheIdentifier": "production:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3",
               "compact": false,
               "configFile": false,
               "inputSourceMap": true,

lib/postinstall/src/codemods.test.ts

@@ -10,7 +10,6 @@ const inputRegExp = /\.input\.js$/;
 const fixturesDir = path.resolve(__dirname, './__testfixtures__');
 fs.readdirSync(fixturesDir).forEach((transformName) => {
   const transformFixturesDir = path.join(fixturesDir, transformName);
-  // eslint-disable-next-line jest/valid-title
   describe(transformName, () =>
     fs
       .readdirSync(transformFixturesDir)

lib/preview-web/src/PreviewWeb.test.ts

@@ -468,7 +468,7 @@ describe('PreviewWeb', () => {
           expect(preview.view.showErrorDisplay).toHaveBeenCalled();
           expect((preview.view.showErrorDisplay as jest.Mock).mock.calls[0][0])
             .toMatchInlineSnapshot(`
-            [Error: Expected your framework's preset to export a \\\`renderToDOM\\\` field.
+            [Error: Expected your framework's preset to export a \`renderToDOM\` field.
 
             Perhaps it needs to be upgraded for Storybook 6.4?
 

lib/router/package.json

@@ -48,8 +48,8 @@
     "lodash": "^4.17.21",
     "memoizerific": "^1.11.3",
     "qs": "^6.10.0",
-    "react-router": "^6.0.0",
-    "react-router-dom": "^6.0.0",
+    "react-router": "6.0.2",
+    "react-router-dom": "6.0.2",
     "ts-dedent": "^2.0.0"
   },
   "peerDependencies": {

lib/ui/src/components/layout/desktop.stories.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable react/destructuring-assignment */
 import React, { Fragment } from 'react';
 import { DecoratorFn } from '@storybook/react';
 

lib/ui/src/components/layout/mobile.stories.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable react/destructuring-assignment */
 import React, { Fragment } from 'react';
 import { ActiveTabs } from '@storybook/api';
 import { DecoratorFn } from '@storybook/react';