Merge branch 'future/docs2-core' into tom/sb-337-manager-side-type-ba…

…ck-compat
storybookjs · Jun 18, 2022 · a9d323b · a9d323b
2 parents fcec058 + 238fa5c
commit a9d323b
Show file tree

Hide file tree

Showing 191 changed files with 557 additions and 747 deletions.
diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -1,3 +1,5 @@
+# documentation: https://yarnpkg.com/configuration/yarnrc
+
 compressionLevel: 0
 
 enableGlobalCache: true
@@ -16,3 +18,15 @@ unsafeHttpWhitelist:
   - localhost
 
 yarnPath: .yarn/releases/yarn-3.1.1.cjs
+
+logFilters:
+  - code: "YN0005"
+    level: "discard"
+  - code: "YN0076"
+    level: "discard"
+  - pattern: "@workspace:examples"
+    level: "discard"
+  - pattern: "@storybook/root@workspace:."
+    level: "discard"
+  - pattern: "@workspace:addons/storyshots/"
+    level: "discard"
diff --git a/addons/a11y/package.json b/addons/a11y/package.json
@@ -51,7 +51,6 @@
     "global": "^4.4.0",
     "lodash": "^4.17.21",
     "react-sizeme": "^3.0.1",
-    "regenerator-runtime": "^0.13.7",
     "ts-dedent": "^2.0.0",
     "util-deprecate": "^1.0.2"
   },

diff --git a/addons/a11y/tsconfig.json b/addons/a11y/tsconfig.json
@@ -1,15 +1,7 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "types": [
-      "jest"
-    ],
-    "forceConsistentCasingInFileNames": true,
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true
+    "strict": true
   },
   "include": [
     "src/**/*"

diff --git a/addons/actions/package.json b/addons/actions/package.json
@@ -48,7 +48,6 @@
     "polished": "^4.2.2",
     "prop-types": "^15.7.2",
     "react-inspector": "^5.1.0",
-    "regenerator-runtime": "^0.13.7",
     "telejson": "^6.0.8",
     "ts-dedent": "^2.0.0",
     "util-deprecate": "^1.0.2",

diff --git a/addons/actions/src/containers/ActionLogger/index.tsx b/addons/actions/src/containers/ActionLogger/index.tsx
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import deepEqual from 'fast-deep-equal';
 
-import { API } from '@storybook/api';
+import type { API } from '@storybook/api';
 import { STORY_CHANGED } from '@storybook/core-events';
 
 import { ActionLogger as ActionLoggerComponent } from '../../components/ActionLogger';
@@ -31,6 +31,8 @@ export default class ActionLogger extends Component<ActionLoggerProps, ActionLog
   constructor(props: ActionLoggerProps) {
     super(props);
 
+    this.mounted = false;
+
     this.state = { actions: [] };
   }
 

diff --git a/addons/actions/src/manager.tsx b/addons/actions/src/manager.tsx
@@ -23,7 +23,7 @@ addons.register(ADDON_ID, (api) => {
       return `Actions${suffix}`;
     },
     type: types.PANEL,
-    render: ({ active, key }) => <ActionLogger key={key} api={api} active={active} />,
+    render: ({ active, key }) => <ActionLogger key={key} api={api} active={!!active} />,
     paramKey: PARAM_KEY,
   });
 });
diff --git a/addons/actions/src/preview/action.ts b/addons/actions/src/preview/action.ts
@@ -20,6 +20,7 @@ const isReactSyntheticEvent = (e: unknown): e is SyntheticEvent =>
 const serializeArg = <T>(a: T) => {
   if (isReactSyntheticEvent(a)) {
     const e: SyntheticEvent = Object.create(
+      // @ts-ignore
       a.constructor.prototype,
       Object.getOwnPropertyDescriptors(a)
     );

diff --git a/addons/actions/src/preview/withActions.ts b/addons/actions/src/preview/withActions.ts
@@ -31,7 +31,7 @@ const hasMatchInAncestry = (element: any, selector: any): boolean => {
 const createHandlers = (actionsFn: (...arg: any[]) => object, ...handles: any[]) => {
   const actionsObject = actionsFn(...handles);
   return Object.entries(actionsObject).map(([key, action]) => {
-    const [_, eventName, selector] = key.match(delegateEventSplitter);
+    const [_, eventName, selector] = key.match(delegateEventSplitter) || [];
     return {
       eventName,
       handler: (e: { target: any }) => {

diff --git a/addons/actions/tsconfig.json b/addons/actions/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "types": ["jest"]
+    "strict": true
   },
   "include": [
     "src/**/*"

diff --git a/addons/backgrounds/package.json b/addons/backgrounds/package.json
@@ -48,7 +48,6 @@
     "core-js": "^3.8.2",
     "global": "^4.4.0",
     "memoizerific": "^1.11.3",
-    "regenerator-runtime": "^0.13.7",
     "ts-dedent": "^2.0.0",
     "util-deprecate": "^1.0.2"
   },

diff --git a/addons/controls/tsconfig.json b/addons/controls/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "types": ["jest", "node"]
+    "strict": true
   },
   "include": [
     "src/**/*"

diff --git a/addons/docs/package.json b/addons/docs/package.json
@@ -72,7 +72,6 @@
     "fast-deep-equal": "^3.1.3",
     "global": "^4.4.0",
     "lodash": "^4.17.21",
-    "regenerator-runtime": "^0.13.7",
     "remark-external-links": "^8.0.0",
     "remark-slug": "^6.0.0",
     "ts-dedent": "^2.0.0",

diff --git a/addons/docs/tsconfig.json b/addons/docs/tsconfig.json
@@ -1,8 +1,7 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "skipLibCheck": true,
-    "types": ["jest", "node"]
+    "skipLibCheck": true
   },
   "include": [
     "src/**/*"

diff --git a/addons/essentials/package.json b/addons/essentials/package.json
@@ -45,7 +45,6 @@
     "@storybook/core-common": "7.0.0-alpha.3",
     "@storybook/node-logger": "7.0.0-alpha.3",
     "core-js": "^3.8.2",
-    "regenerator-runtime": "^0.13.7",
     "ts-dedent": "^2.0.0"
   },
   "devDependencies": {

diff --git a/addons/essentials/src/index.ts b/addons/essentials/src/index.ts
@@ -3,7 +3,7 @@ import { logger } from '@storybook/node-logger';
 import { serverRequire } from '@storybook/core-common';
 
 interface PresetOptions {
-  configDir?: string;
+  configDir: string;
   docs?: boolean;
   controls?: boolean;
   actions?: boolean;
@@ -23,7 +23,7 @@ const requireMain = (configDir: string) => {
   return serverRequire(mainFile) ?? {};
 };
 
-export function addons(options: PresetOptions = {}) {
+export function addons(options: PresetOptions) {
   const checkInstalled = (addon: string, main: any) => {
     const existingAddon = main.addons?.find((entry: string | { name: string }) => {
       const name = typeof entry === 'string' ? entry : entry.name;

diff --git a/addons/essentials/tsconfig.json b/addons/essentials/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "types": ["jest", "node"]
+    "strict": true
   },
   "include": [
     "src/**/*"

diff --git a/addons/jest/package.json b/addons/jest/package.json
@@ -49,7 +49,6 @@
     "core-js": "^3.8.2",
     "global": "^4.4.0",
     "react-sizeme": "^3.0.1",
-    "regenerator-runtime": "^0.13.7",
     "upath": "^1.2.0"
   },
   "peerDependencies": {

diff --git a/addons/jest/tsconfig.json b/addons/jest/tsconfig.json
@@ -1,7 +1,6 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "types": ["jest"]
   },
   "include": [
     "src/**/*"

diff --git a/addons/links/package.json b/addons/links/package.json
@@ -42,7 +42,6 @@
     "core-js": "^3.8.2",
     "global": "^4.4.0",
     "prop-types": "^15.7.2",
-    "regenerator-runtime": "^0.13.7",
     "ts-dedent": "^2.0.0"
   },
   "peerDependencies": {

diff --git a/addons/links/src/react/components/RoutedLink.tsx b/addons/links/src/react/components/RoutedLink.tsx
@@ -18,7 +18,9 @@ const RoutedLink: React.FC<
   const handleClick = (e: React.MouseEvent<HTMLAnchorElement>) => {
     if (isPlainLeftClick(e)) {
       e.preventDefault();
-      onClick(e);
+      if (onClick) {
+        onClick(e);
+      }
     }
   };
 

diff --git a/addons/links/src/react/components/link.tsx b/addons/links/src/react/components/link.tsx
@@ -19,8 +19,8 @@ const cancelled = (e: MouseEvent<HTMLAnchorElement>, cb = (_e: any) => {}) => {
 };
 
 interface Props {
-  kind: string;
-  story: string;
+  kind: string | null;
+  story: string | null;
   children: ReactNode;
 }
 
@@ -53,12 +53,17 @@ export default class LinkTo extends PureComponent<Props, State> {
 
   updateHref = async () => {
     const { kind, story } = this.props;
-    const href = await hrefTo(kind, story);
-    this.setState({ href });
+    if (kind && story) {
+      const href = await hrefTo(kind, story);
+      this.setState({ href });
+    }
   };
 
   handleClick = () => {
-    navigate(this.props);
+    const { kind, story } = this.props;
+    if (kind && story) {
+      navigate({ kind, story });
+    }
   };
 
   render() {

diff --git a/addons/links/src/utils.ts b/addons/links/src/utils.ts
@@ -36,7 +36,9 @@ export const hrefTo = (title: ComponentTitle, name: StoryName): Promise<string>
   return new Promise((resolve) => {
     const { location } = document;
     const query = parseQuery(location.search);
+    // @ts-ignore
     const existingId = [].concat(query.id)[0];
+    // @ts-ignore
     const titleToLink = title || existingId.split('--', 2)[0];
     const id = toId(titleToLink, name);
     const url = `${location.origin + location.pathname}?${Object.entries({ ...query, id })
@@ -55,12 +57,16 @@ export const linkTo =
   (...args: any[]) => {
     const resolver = valueOrCall(args);
     const title = resolver(idOrTitle);
-    const name = resolver(nameInput);
+    const name = nameInput ? resolver(nameInput) : false;
 
     if (title?.match(/--/) && !name) {
       navigate({ storyId: title });
-    } else {
+    } else if (name && title) {
       navigate({ kind: title, story: name });
+    } else if (title) {
+      navigate({ kind: title });
+    } else if (name) {
+      navigate({ story: name });
     }
   };
 

diff --git a/addons/links/tsconfig.json b/addons/links/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "types": ["@testing-library/jest-dom"]
+    "strict": true
   },
   "include": [
     "src/**/*"

diff --git a/addons/outline/package.json b/addons/outline/package.json
@@ -48,7 +48,6 @@
     "@storybook/csf": "0.0.2--canary.4566f4d.1",
     "core-js": "^3.8.2",
     "global": "^4.4.0",
-    "regenerator-runtime": "^0.13.7",
     "ts-dedent": "^2.0.0"
   },
   "peerDependencies": {

diff --git a/addons/storyshots/storyshots-core/package.json b/addons/storyshots/storyshots-core/package.json
@@ -55,7 +55,6 @@
     "pretty-format": "^26.6.2",
     "react-test-renderer": "^16.8.0 || ^17.0.0",
     "read-pkg-up": "^7.0.1",
-    "regenerator-runtime": "^0.13.7",
     "ts-dedent": "^2.0.0"
   },
   "devDependencies": {

diff --git a/addons/storyshots/storyshots-core/tsconfig.json b/addons/storyshots/storyshots-core/tsconfig.json
@@ -1,13 +1,13 @@
 {
   "extends": "../../../tsconfig.json",
-  "include": [
-    "src/**/*.ts"
-  ],
   "compilerOptions": {
     "experimentalDecorators": true,
     "declaration": true,
     "jsx": "preserve",
     "skipLibCheck": true,
     "skipDefaultLibCheck": true
-  }
+  },
+  "include": [
+    "src/**/*.ts"
+  ]
 }
diff --git a/addons/storyshots/storyshots-puppeteer/package.json b/addons/storyshots/storyshots-puppeteer/package.json
@@ -38,8 +38,7 @@
     "@storybook/node-logger": "7.0.0-alpha.3",
     "@types/jest-image-snapshot": "^4.1.3",
     "core-js": "^3.8.2",
-    "jest-image-snapshot": "^4.3.0",
-    "regenerator-runtime": "^0.13.7"
+    "jest-image-snapshot": "^4.3.0"
   },
   "devDependencies": {
     "@storybook/csf": "0.0.2--canary.4566f4d.1",

diff --git a/addons/storyshots/storyshots-puppeteer/tsconfig.json b/addons/storyshots/storyshots-puppeteer/tsconfig.json
@@ -8,5 +8,7 @@
   "include": [
     "src/**/*"
   ],
-  "exclude": ["src/__tests__/**/*"]
+  "exclude": [
+    "src/__tests__/**/*"
+  ]
 }
diff --git a/addons/storysource/package.json b/addons/storysource/package.json
@@ -44,8 +44,7 @@
     "core-js": "^3.8.2",
     "estraverse": "^5.2.0",
     "prop-types": "^15.7.2",
-    "react-syntax-highlighter": "^15.4.5",
-    "regenerator-runtime": "^0.13.7"
+    "react-syntax-highlighter": "^15.4.5"
   },
   "devDependencies": {
     "@types/react": "^16.14.23",

diff --git a/addons/toolbars/package.json b/addons/toolbars/package.json
@@ -43,8 +43,7 @@
     "@storybook/client-logger": "7.0.0-alpha.3",
     "@storybook/components": "7.0.0-alpha.3",
     "@storybook/theming": "7.0.0-alpha.3",
-    "core-js": "^3.8.2",
-    "regenerator-runtime": "^0.13.7"
+    "core-js": "^3.8.2"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",

diff --git a/addons/toolbars/src/components/ToolbarMenuList.tsx b/addons/toolbars/src/components/ToolbarMenuList.tsx
@@ -45,7 +45,7 @@ export const ToolbarMenuList: FC<ToolbarMenuListProps> = withKeyboardCycle(
     }
 
     const handleItemClick = useCallback(
-      (value: string) => {
+      (value: string | undefined) => {
         updateGlobals({ [id]: value });
       },
       [currentValue, updateGlobals]
@@ -85,9 +85,9 @@ export const ToolbarMenuList: FC<ToolbarMenuListProps> = withKeyboardCycle(
       >
         <ToolbarMenuButton
           active={hasGlobalValue}
-          description={description}
+          description={description || ''}
           icon={icon}
-          title={title}
+          title={title || ''}
         />
       </WithTooltip>
     );

diff --git a/addons/toolbars/src/components/ToolbarMenuListItem.tsx b/addons/toolbars/src/components/ToolbarMenuListItem.tsx
@@ -30,7 +30,7 @@ export const ToolbarMenuListItem = ({
   const hasContent = left || right || title;
 
   const Item: ListItem = {
-    id: value,
+    id: value || currentValue,
     active: currentValue === value,
     onClick,
   };

diff --git a/addons/toolbars/src/hoc/withKeyboardCycle.tsx b/addons/toolbars/src/hoc/withKeyboardCycle.tsx
@@ -17,7 +17,7 @@ export const withKeyboardCycle = (Component: React.ComponentType<ToolbarMenuProp
 
     const api = useStorybookApi();
     const [globals, updateGlobals] = useGlobals();
-    const cycleValues = useRef([]);
+    const cycleValues = useRef<any[]>([]);
     const currentValue = globals[id];
 
     const reset = useCallback(() => {