Merge branch 'refs/heads/kasper/update-csf' into kasper/before-each

storybookjs · Apr 12, 2024 · bfecf80 · bfecf80
2 parents 7b0781a + cf2e5b9
commit bfecf80
Show file tree

Hide file tree

Showing 99 changed files with 690 additions and 446 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,14 @@
+## 8.0.8
+
+- Automigration: Fix name of VTA addon - [#26816](https://github.com/storybookjs/storybook/pull/26816), thanks @valentinpalkovic!
+
+## 8.0.7
+
+- CLI: Add Visual Tests addon install auto-migration when upgrading to 8.0.x - [#26766](https://github.com/storybookjs/storybook/pull/26766), thanks @ndelangen!
+- Next.js: Move sharp into optional deps - [#26787](https://github.com/storybookjs/storybook/pull/26787), thanks @shuta13!
+- Vue: Disable controls for events, slots, and expose - [#26751](https://github.com/storybookjs/storybook/pull/26751), thanks @shilman!
+- Webpack: Bump webpack-dev-middleware to patch high security issue - [#26655](https://github.com/storybookjs/storybook/pull/26655), thanks @jwilliams-met!
+
 ## 8.0.6
 
 - CLI: Add --config-dir flag to migrate command - [#26721](https://github.com/storybookjs/storybook/pull/26721), thanks @yannbf!

diff --git a/CHANGELOG.prerelease.md b/CHANGELOG.prerelease.md
@@ -1,3 +1,12 @@
+## 8.1.0-alpha.7
+
+- CLI: Add --config-dir flag to add command - [#26771](https://github.com/storybookjs/storybook/pull/26771), thanks @eric-blue!
+- CLI: Add Visual Tests addon install auto-migration when upgrading to 8.0.x - [#26766](https://github.com/storybookjs/storybook/pull/26766), thanks @ndelangen!
+- Controls: Add Channels API to search for files in the project root - [#26726](https://github.com/storybookjs/storybook/pull/26726), thanks @valentinpalkovic!
+- Test: Make spies reactive so that they can be logged by addon-actions - [#26740](https://github.com/storybookjs/storybook/pull/26740), thanks @kasperpeulen!
+- Vue: Disable controls for events, slots, and expose - [#26751](https://github.com/storybookjs/storybook/pull/26751), thanks @shilman!
+- Webpack: Bump webpack-dev-middleware to patch high security issue - [#26655](https://github.com/storybookjs/storybook/pull/26655), thanks @jwilliams-met!
+
 ## 8.1.0-alpha.6
 
 - CLI: Add --config-dir flag to migrate command - [#26721](https://github.com/storybookjs/storybook/pull/26721), thanks @yannbf!

diff --git a/MIGRATION.md b/MIGRATION.md
@@ -5477,7 +5477,7 @@ Currently there is no recommended way of accessing the component options of a st
 
 ## From version 4.0.x to 4.1.x
 
-There are are a few migrations you should be aware of in 4.1, including one unintentionally breaking change for advanced addon usage.
+There are a few migrations you should be aware of in 4.1, including one unintentionally breaking change for advanced addon usage.
 
 ### Private addon config
 

diff --git a/code/addons/a11y/package.json b/code/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Test component compliance with web accessibility standards",
   "keywords": [
     "a11y",

diff --git a/code/addons/actions/package.json b/code/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Get UI feedback when an action is performed on an interactive element",
   "keywords": [
     "storybook",

diff --git a/code/addons/backgrounds/package.json b/code/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Switch backgrounds to view components in different settings",
   "keywords": [
     "addon",

diff --git a/code/addons/controls/package.json b/code/addons/controls/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-controls",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Interact with component inputs dynamically in the Storybook UI",
   "keywords": [
     "addon",

diff --git a/code/addons/docs/package.json b/code/addons/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Document component usage and properties in Markdown",
   "keywords": [
     "addon",

diff --git a/code/addons/essentials/package.json b/code/addons/essentials/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-essentials",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Curated addons to bring out the best of Storybook",
   "keywords": [
     "addon",

diff --git a/code/addons/gfm/package.json b/code/addons/gfm/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-mdx-gfm",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "GitHub Flavored Markdown in Storybook",
   "keywords": [
     "addon",

diff --git a/code/addons/highlight/package.json b/code/addons/highlight/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-highlight",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Highlight DOM nodes within your stories",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/interactions/package.json b/code/addons/interactions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-interactions",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Automate, test and debug user interactions",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/jest/package.json b/code/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",

diff --git a/code/addons/links/package.json b/code/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Link stories together to build demos and prototypes with your UI components",
   "keywords": [
     "addon",
@@ -67,7 +67,7 @@
     "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
   },
   "dependencies": {
-    "@storybook/csf": "0.1.4--canary.82.934057e.0",
+    "@storybook/csf": "^0.1.4",
     "@storybook/global": "^5.0.0",
     "ts-dedent": "^2.0.0"
   },

diff --git a/code/addons/measure/package.json b/code/addons/measure/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-measure",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Inspect layouts by visualizing the box model",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/onboarding/package.json b/code/addons/onboarding/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-onboarding",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook Addon Onboarding - Introduces a new onboarding experience",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/outline/package.json b/code/addons/outline/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-outline",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Outline all elements with CSS to help with layout placement and alignment",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/storysource/package.json b/code/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "View a story’s source code to see how it works and paste into your app",
   "keywords": [
     "addon",

diff --git a/code/addons/themes/package.json b/code/addons/themes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-themes",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Switch between multiple themes for you components in Storybook",
   "keywords": [
     "css",

diff --git a/code/addons/toolbars/package.json b/code/addons/toolbars/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-toolbars",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Create your own toolbar items that control story rendering",
   "keywords": [
     "addon",

diff --git a/code/addons/viewport/README.md b/code/addons/viewport/README.md
@@ -22,7 +22,7 @@ export default {
 };
 ```
 
-You should now be able to see the viewport addon icon in the the toolbar at the top of the screen.
+You should now be able to see the viewport addon icon in the toolbar at the top of the screen.
 
 ## Usage
 

diff --git a/code/addons/viewport/package.json b/code/addons/viewport/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Build responsive components by adjusting Storybook’s viewport size and orientation",
   "keywords": [
     "addon",

diff --git a/code/builders/builder-manager/package.json b/code/builders/builder-manager/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/builder-manager",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook manager builder",
   "keywords": [
     "storybook"

diff --git a/code/builders/builder-vite/package.json b/code/builders/builder-vite/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/builder-vite",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "A plugin to run and build Storybooks with Vite",
   "homepage": "https://github.com/storybookjs/storybook/tree/next/code/builders/builder-vite/#readme",
   "bugs": {

diff --git a/code/builders/builder-webpack5/package.json b/code/builders/builder-webpack5/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/builder-webpack5",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"
@@ -94,7 +94,7 @@
     "util": "^0.12.4",
     "util-deprecate": "^1.0.2",
     "webpack": "5",
-    "webpack-dev-middleware": "^6.1.1",
+    "webpack-dev-middleware": "^6.1.2",
     "webpack-hot-middleware": "^2.25.1",
     "webpack-virtual-modules": "^0.5.0"
   },

diff --git a/code/frameworks/angular/package.json b/code/frameworks/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Angular: Develop Angular components in isolation with hot reloading.",
   "keywords": [
     "storybook",

diff --git a/code/frameworks/ember/package.json b/code/frameworks/ember/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybookjs/storybook/tree/next/code/frameworks/ember",
   "bugs": {

diff --git a/code/frameworks/html-vite/package.json b/code/frameworks/html-vite/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html-vite",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for HTML and Vite: Develop HTML in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/html-webpack5/package.json b/code/frameworks/html-webpack5/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html-webpack5",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/nextjs/package.json b/code/frameworks/nextjs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/nextjs",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Next.js",
   "keywords": [
     "storybook",
@@ -138,7 +138,6 @@
     "resolve-url-loader": "^5.0.0",
     "sass-loader": "^12.4.0",
     "semver": "^7.3.5",
-    "sharp": "^0.32.6",
     "style-loader": "^3.3.1",
     "styled-jsx": "5.1.1",
     "ts-dedent": "^2.0.0",
@@ -170,6 +169,9 @@
       "optional": true
     }
   },
+  "optionalDependencies": {
+    "sharp": "^0.33.3"
+  },
   "engines": {
     "node": ">=18.0.0"
   },

diff --git a/code/frameworks/nextjs/src/next-image-loader-stub.ts b/code/frameworks/nextjs/src/next-image-loader-stub.ts
@@ -2,18 +2,27 @@ import { interpolateName } from 'loader-utils';
 import imageSizeOf from 'image-size';
 import type { RawLoaderDefinition } from 'webpack';
 import type { NextConfig } from 'next';
-import sharp from 'sharp';
 import { cpus } from 'os';
+import { NextJsSharpError } from '@storybook/core-events/preview-errors';
 
 interface LoaderOptions {
   filename: string;
   nextConfig: NextConfig;
 }
 
-if (sharp.concurrency() > 1) {
-  // Reducing concurrency reduces the memory usage too.
-  const divisor = process.env.NODE_ENV === 'development' ? 4 : 2;
-  sharp.concurrency(Math.floor(Math.max(cpus().length / divisor, 1)));
+let sharp: typeof import('sharp') | undefined;
+
+try {
+  sharp = require('sharp');
+  if (sharp && sharp.concurrency() > 1) {
+    // Reducing concurrency reduces the memory usage too.
+    const divisor = process.env.NODE_ENV === 'development' ? 4 : 2;
+    sharp.concurrency(Math.floor(Math.max(cpus().length / divisor, 1)));
+  }
+} catch (e) {
+  console.warn(
+    'You have to install sharp in order to use image optimization features in Next.js. AVIF support is also disabled.'
+  );
 }
 
 const nextImageLoaderStub: RawLoaderDefinition<LoaderOptions> = async function NextImageLoader(
@@ -37,10 +46,14 @@ const nextImageLoaderStub: RawLoaderDefinition<LoaderOptions> = async function N
   let height;
 
   if (extension === 'avif') {
-    const transformer = sharp(content);
-    const result = await transformer.metadata();
-    width = result.width;
-    height = result.height;
+    if (sharp) {
+      const transformer = sharp(content);
+      const result = await transformer.metadata();
+      width = result.width;
+      height = result.height;
+    } else {
+      throw new NextJsSharpError();
+    }
   } else {
     const result = imageSizeOf(this.resourcePath);
     width = result.width;

diff --git a/code/frameworks/preact-vite/package.json b/code/frameworks/preact-vite/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact-vite",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Preact and Vite: Develop Preact components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/preact-webpack5/package.json b/code/frameworks/preact-webpack5/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact-webpack5",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/react-vite/package.json b/code/frameworks/react-vite/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-vite",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for React and Vite: Develop React components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/react-webpack5/package.json b/code/frameworks/react-webpack5/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-webpack5",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/server-webpack5/package.json b/code/frameworks/server-webpack5/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/server-webpack5",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Server: View HTML snippets from a server in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/svelte-vite/package.json b/code/frameworks/svelte-vite/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte-vite",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Svelte and Vite: Develop Svelte components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

diff --git a/code/frameworks/svelte-webpack5/package.json b/code/frameworks/svelte-webpack5/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte-webpack5",
-  "version": "8.1.0-alpha.6",
+  "version": "8.1.0-alpha.7",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"