Merge branch 'next' into jeppe/fix-nextjs-redirect-1404

CHANGELOG.prerelease.md

@@ -1,3 +1,14 @@
+## 8.1.0-beta.0
+
+- Dependencies: Upgrade `@joshwooding/vite-plugin-react-docgen-typescript` to `0.3.1` - [#26673](https://github.com/storybookjs/storybook/pull/26673), thanks @joshwooding!
+- Dependencies: Upgrade `ejs` to `3.1.10` - [#27054](https://github.com/storybookjs/storybook/pull/27054), thanks @RiuSalvi!
+- Nextjs: Implement next redirect and the RedirectBoundary - [#27050](https://github.com/storybookjs/storybook/pull/27050), thanks @yannbf!
+- Onboarding: Improve UI - [#27074](https://github.com/storybookjs/storybook/pull/27074), thanks @ndelangen!
+- Portable Stories: Remove link to missing docs - [#27075](https://github.com/storybookjs/storybook/pull/27075), thanks @JReinhold!
+- React: Support v19 betas in peer dependencies - [#26960](https://github.com/storybookjs/storybook/pull/26960), thanks @JReinhold!
+- Tags: Add project tags, negation, `dev`/`autodocs`/`test` system tags - [#26634](https://github.com/storybookjs/storybook/pull/26634), thanks @shilman!
+- UI: Fix panel layout resizing do not apply when done too fast - [#26460](https://github.com/storybookjs/storybook/pull/26460), thanks @jorge-ji!
+
 ## 8.1.0-alpha.8
 
 - Addon-actions: Fix falsy args printing as object - 22163 - [#26917](https://github.com/storybookjs/storybook/pull/26917), thanks @Fatcat560!

code/addons/a11y/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Test component compliance with web accessibility standards",
   "keywords": [
     "a11y",

code/addons/actions/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Get UI feedback when an action is performed on an interactive element",
   "keywords": [
     "storybook",

code/addons/backgrounds/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Switch backgrounds to view components in different settings",
   "keywords": [
     "addon",

code/addons/controls/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-controls",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Interact with component inputs dynamically in the Storybook UI",
   "keywords": [
     "addon",

code/addons/docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Document component usage and properties in Markdown",
   "keywords": [
     "addon",

code/addons/essentials/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-essentials",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Curated addons to bring out the best of Storybook",
   "keywords": [
     "addon",

code/addons/gfm/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-mdx-gfm",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "GitHub Flavored Markdown in Storybook",
   "keywords": [
     "addon",

code/addons/highlight/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-highlight",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Highlight DOM nodes within your stories",
   "keywords": [
     "storybook-addons",

code/addons/interactions/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-interactions",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Automate, test and debug user interactions",
   "keywords": [
     "storybook-addons",

code/addons/jest/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",

code/addons/links/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Link stories together to build demos and prototypes with your UI components",
   "keywords": [
     "addon",

code/addons/measure/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-measure",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Inspect layouts by visualizing the box model",
   "keywords": [
     "storybook-addons",

code/addons/onboarding/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-onboarding",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook Addon Onboarding - Introduces a new onboarding experience",
   "keywords": [
     "storybook-addons",

code/addons/onboarding/src/features/WriteStoriesModal/WriteStoriesModal.styled.tsx

@@ -1,9 +1,7 @@
 import { keyframes, styled } from '@storybook/theming';
 import { Modal } from '@storybook/components';
 
-export const ModalWrapper = styled(Modal)`
-  background: white;
-`;
+export const ModalWrapper = styled(Modal)``;
 
 export const ModalContent = styled.div`
   display: flex;
@@ -21,10 +19,13 @@ export const Main = styled.div`
   flex: 1;
   display: flex;
   flex-direction: column;
+  background: white;
   font-family: ${({ theme }) => theme.typography.fonts.base};
 `;
 
 export const Header = styled.div`
+  position: relative;
+  z-index: 1;
   box-sizing: border-box;
   display: flex;
   justify-content: space-between;
@@ -64,20 +65,20 @@ export const Content = styled.div`
   }
 `;
 
-export const SpanHighlight = styled.span`
-  display: inline-flex;
-  border-radius: 3px;
-  padding: 0 5px;
-  margin-bottom: -2px;
-  opacity: 0.8;
-  font-family: ${({ theme }) => theme.typography.fonts.mono};
-  font-size: 11px;
-  border: 1px solid #ecf4f9;
-  color: ${({ theme }) => theme.color.darkest};
-  background-color: #f7fafc;
-  box-sizing: border-box;
-  line-height: 17px;
-`;
+export const SpanHighlight = styled.span(({ theme }) => ({
+  display: 'inline-flex',
+  borderRadius: 3,
+  padding: '0 5px',
+  marginBottom: -2,
+  opacity: 0.8,
+  fontFamily: theme.typography.fonts.mono,
+  fontSize: 11,
+  border: theme.base === 'dark' ? theme.color.darkest : theme.color.lightest,
+  color: theme.base === 'dark' ? theme.color.lightest : theme.color.darkest,
+  backgroundColor: theme.base === 'dark' ? 'black' : theme.color.light,
+  boxSizing: 'border-box',
+  lineHeight: '17px',
+}));
 
 export const Image = styled.img`
   max-width: 100%;
@@ -90,8 +91,10 @@ export const Background = styled.div`
   left: 0;
   width: 100%;
   height: 100%;
-  z-index: -1;
+  z-index: 0;
   overflow: hidden;
+  z-index: 0;
+  pointer-events: none;
 `;
 
 export const circle1Anim = keyframes`

code/addons/onboarding/src/features/WriteStoriesModal/WriteStoriesModal.tsx

@@ -124,6 +124,12 @@ export const WriteStoriesModal: FC<WriteStoriesModalProps> = ({
           </Button>
         )}
         <Main>
+          <Background>
+            <Circle1 />
+            <Circle2 />
+            <Circle3 />
+          </Background>
+
           <Header>
             <Modal.Title asChild>
               <ModalTitle>
@@ -280,11 +286,6 @@ export const WriteStoriesModal: FC<WriteStoriesModalProps> = ({
                 ) : null)}
             </Content>
           </Modal.Description>
-          <Background>
-            <Circle1 />
-            <Circle2 />
-            <Circle3 />
-          </Background>
         </Main>
       </ModalContent>
     </ModalWrapper>

code/addons/outline/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-outline",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Outline all elements with CSS to help with layout placement and alignment",
   "keywords": [
     "storybook-addons",

code/addons/storysource/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "View a story’s source code to see how it works and paste into your app",
   "keywords": [
     "addon",

code/addons/themes/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-themes",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Switch between multiple themes for you components in Storybook",
   "keywords": [
     "css",

code/addons/toolbars/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-toolbars",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Create your own toolbar items that control story rendering",
   "keywords": [
     "addon",

code/addons/viewport/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-viewport",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Build responsive components by adjusting Storybook’s viewport size and orientation",
   "keywords": [
     "addon",

code/builders/builder-manager/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/builder-manager",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook manager builder",
   "keywords": [
     "storybook"

code/builders/builder-vite/package.json

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

code/builders/builder-webpack5/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/builder-webpack5",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook framework-agnostic API",
   "keywords": [
     "storybook"

code/frameworks/angular/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Angular: Develop Angular components in isolation with hot reloading.",
   "keywords": [
     "storybook",

code/frameworks/ember/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybookjs/storybook/tree/next/code/frameworks/ember",
   "bugs": {

code/frameworks/html-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html-vite",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for HTML and Vite: Develop HTML in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/html-webpack5/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html-webpack5",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/nextjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/nextjs",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Next.js",
   "keywords": [
     "storybook",

code/frameworks/preact-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact-vite",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Preact and Vite: Develop Preact components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/preact-webpack5/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact-webpack5",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Preact: Develop Preact Component in isolation.",
   "keywords": [
     "storybook"

code/frameworks/react-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-vite",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for React and Vite: Develop React components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/react-webpack5/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-webpack5",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for React: Develop React Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/server-webpack5/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/server-webpack5",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Server: View HTML snippets from a server in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/svelte-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte-vite",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Svelte and Vite: Develop Svelte components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/svelte-webpack5/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte-webpack5",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/sveltekit/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/sveltekit",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for SvelteKit",
   "keywords": [
     "storybook",

code/frameworks/vue3-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue3-vite",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Vue3 and Vite: Develop Vue3 components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"

code/frameworks/vue3-webpack5/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue3-webpack5",
-  "version": "8.1.0-alpha.8",
+  "version": "8.1.0-beta.0",
   "description": "Storybook for Vue 3: Develop Vue 3 Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"