@storybook/experimental-nextjs-vite 0.0.0-pr-28920-sha-480f404a → 0.0.0-pr-28882-sha-441ae2cd

package/dist/export-mocks/navigation/index.d.ts

@@ -5,10 +5,9 @@ export * from 'next/dist/client/components/navigation';
 
 /**
  * Creates a next/navigation router API mock. Used internally.
- *
  * @ignore
  * @internal
- */
+ * */
 declare const createNavigation: (overrides: any) => {
     push: Mock;
     replace: Mock;

package/dist/export-mocks/router/index.d.ts

@@ -11,10 +11,9 @@ import { NextRouter } from 'next/router';
 
 /**
  * Creates a next/router router API mock. Used internally.
- *
  * @ignore
  * @internal
- */
+ * */
 declare const createRouter: (overrides: Partial<NextRouter>) => originalRouter.NextRouter;
 declare const getRouter: () => {
     push: Mock;

package/dist/index.d.ts

@@ -7,7 +7,6 @@ type BuilderName = CompatibleString<'@storybook/builder-vite'>;
 type FrameworkOptions = {
     /**
      * The directory where the Next.js app is located.
-     *
      * @default process.cwd()
      */
     nextAppDir?: string;
@@ -25,39 +24,37 @@ type StorybookConfigFramework = {
         };
     };
 };
-/** The interface for Storybook configuration in `main.ts` files. */
+/**
+ * The interface for Storybook configuration in `main.ts` files.
+ */
 type StorybookConfig = Omit<StorybookConfig$1, keyof StorybookConfigVite | keyof StorybookConfigFramework> & StorybookConfigVite & StorybookConfigFramework & {};
 
-/**
- * Function that sets the globalConfig of your storybook. The global config is the preview module of
- * your .storybook folder.
+/** Function that sets the globalConfig of your storybook. The global config is the preview module of your .storybook folder.
  *
- * It should be run a single time, so that your global config (e.g. decorators) is applied to your
- * stories when using `composeStories` or `composeStory`.
+ * It should be run a single time, so that your global config (e.g. decorators) is applied to your stories when using `composeStories` or `composeStory`.
  *
  * Example:
- *
- * ```jsx
+ *```jsx
  * // setup.js (for jest)
  * import { setProjectAnnotations } from '@storybook/experimental-nextjs-vite';
  * import projectAnnotations from './.storybook/preview';
  *
  * setProjectAnnotations(projectAnnotations);
- * ```
+ *```
  *
- * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')
+ * @param projectAnnotations - e.g. (import projectAnnotations from '../.storybook/preview')
  */
-declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]): NormalizedProjectAnnotations<ReactRenderer>;
+declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProjectAnnotations | NamedOrDefaultProjectAnnotations[]): NormalizedProjectAnnotations<ReactRenderer>;
 /**
  * Function that will receive a story along with meta (e.g. a default export from a .stories file)
- * and optionally projectAnnotations e.g. (import * from '../.storybook/preview) and will return a
- * composed component that has all args/parameters/decorators/etc combined and applied to it.
+ * and optionally projectAnnotations e.g. (import * from '../.storybook/preview)
+ * and will return a composed component that has all args/parameters/decorators/etc combined and applied to it.
+ *
  *
  * It's very useful for reusing a story in scenarios outside of Storybook like unit testing.
  *
  * Example:
- *
- * ```jsx
+ *```jsx
  * import { render } from '@testing-library/react';
  * import { composeStory } from '@storybook/experimental-nextjs-vite';
  * import Meta, { Primary as PrimaryStory } from './Button.stories';
@@ -68,26 +65,24 @@ declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProject
  *   const { getByText } = render(<Primary>Hello world</Primary>);
  *   expect(getByText(/Hello world/i)).not.toBeNull();
  * });
- * ```
+ *```
  *
  * @param story
- * @param componentAnnotations - E.g. (import Meta from './Button.stories')
- * @param [projectAnnotations] - E.g. (import * as projectAnnotations from '../.storybook/preview')
- *   this can be applied automatically if you use `setProjectAnnotations` in your setup files.
- * @param [exportsName] - In case your story does not contain a name and you want it to have a name.
+ * @param componentAnnotations - e.g. (import Meta from './Button.stories')
+ * @param [projectAnnotations] - e.g. (import * as projectAnnotations from '../.storybook/preview') this can be applied automatically if you use `setProjectAnnotations` in your setup files.
+ * @param [exportsName] - in case your story does not contain a name and you want it to have a name.
  */
 declare function composeStory<TArgs extends Args = Args>(story: StoryAnnotationsOrFn<ReactRenderer, TArgs>, componentAnnotations: Meta<TArgs | any>, projectAnnotations?: ProjectAnnotations<ReactRenderer>, exportsName?: string): ComposedStoryFn<ReactRenderer, Partial<TArgs>>;
 /**
  * Function that will receive a stories import (e.g. `import * as stories from './Button.stories'`)
- * and optionally projectAnnotations (e.g. `import * from '../.storybook/preview`) and will return
- * an object containing all the stories passed, but now as a composed component that has all
- * args/parameters/decorators/etc combined and applied to it.
+ * and optionally projectAnnotations (e.g. `import * from '../.storybook/preview`)
+ * and will return an object containing all the stories passed, but now as a composed component that has all args/parameters/decorators/etc combined and applied to it.
+ *
  *
  * It's very useful for reusing stories in scenarios outside of Storybook like unit testing.
  *
  * Example:
- *
- * ```jsx
+ *```jsx
  * import { render } from '@testing-library/react';
  * import { composeStories } from '@storybook/experimental-nextjs-vite';
  * import * as stories from './Button.stories';
@@ -98,11 +93,10 @@ declare function composeStory<TArgs extends Args = Args>(story: StoryAnnotations
  *   const { getByText } = render(<Primary>Hello world</Primary>);
  *   expect(getByText(/Hello world/i)).not.toBeNull();
  * });
- * ```
+ *```
  *
- * @param csfExports - E.g. (import * as stories from './Button.stories')
- * @param [projectAnnotations] - E.g. (import * as projectAnnotations from '../.storybook/preview')
- *   this can be applied automatically if you use `setProjectAnnotations` in your setup files.
+ * @param csfExports - e.g. (import * as stories from './Button.stories')
+ * @param [projectAnnotations] - e.g. (import * as projectAnnotations from '../.storybook/preview') this can be applied automatically if you use `setProjectAnnotations` in your setup files.
  */
 declare function composeStories<TModule extends Store_CSFExports<ReactRenderer, any>>(csfExports: TModule, projectAnnotations?: ProjectAnnotations<ReactRenderer>): Omit<StoriesWithPartialProps<ReactRenderer, TModule>, keyof Store_CSFExports>;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/experimental-nextjs-vite",
-  "version": "0.0.0-pr-28920-sha-480f404a",
+  "version": "0.0.0-pr-28882-sha-441ae2cd",
   "description": "Storybook for Next.js and Vite",
   "keywords": [
     "storybook",
@@ -90,9 +90,9 @@
     "prep": "jiti ../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
-    "@storybook/builder-vite": "0.0.0-pr-28920-sha-480f404a",
-    "@storybook/react": "0.0.0-pr-28920-sha-480f404a",
-    "@storybook/test": "0.0.0-pr-28920-sha-480f404a",
+    "@storybook/builder-vite": "0.0.0-pr-28882-sha-441ae2cd",
+    "@storybook/react": "0.0.0-pr-28882-sha-441ae2cd",
+    "@storybook/test": "0.0.0-pr-28882-sha-441ae2cd",
     "styled-jsx": "5.1.6"
   },
   "devDependencies": {
@@ -105,7 +105,7 @@
     "next": "^14.2.5",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-    "storybook": "^0.0.0-pr-28920-sha-480f404a",
+    "storybook": "^0.0.0-pr-28882-sha-441ae2cd",
     "vite": "^5.0.0",
     "vite-plugin-storybook-nextjs": "^1.0.0"
   },

package/template/cli/.eslintrc.json

@@ -1,5 +1,6 @@
 {
   "rules": {
+    "import/no-extraneous-dependencies": "off",
     "import/extensions": "off",
     "react/no-unknown-property": "off"
   }

package/template/cli/js/Button.jsx

@@ -4,7 +4,9 @@ import PropTypes from 'prop-types';
 
 import './button.css';
 
-/** Primary UI component for user interaction */
+/**
+ * Primary UI component for user interaction
+ */
 export const Button = ({ primary, backgroundColor, size, label, ...props }) => {
   const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary';
   return (
@@ -24,15 +26,25 @@ export const Button = ({ primary, backgroundColor, size, label, ...props }) => {
 };
 
 Button.propTypes = {
-  /** Is this the principal call to action on the page? */
+  /**
+   * Is this the principal call to action on the page?
+   */
   primary: PropTypes.bool,
-  /** What background color to use */
+  /**
+   * What background color to use
+   */
   backgroundColor: PropTypes.string,
-  /** How large should the button be? */
+  /**
+   * How large should the button be?
+   */
   size: PropTypes.oneOf(['small', 'medium', 'large']),
-  /** Button contents */
+  /**
+   * Button contents
+   */
   label: PropTypes.string.isRequired,
-  /** Optional click handler */
+  /**
+   * Optional click handler
+   */
   onClick: PropTypes.func,
 };
 

package/template/cli/ts-3-8/Button.tsx

@@ -3,19 +3,31 @@ import React from 'react';
 import './button.css';
 
 export interface ButtonProps {
-  /** Is this the principal call to action on the page? */
+  /**
+   * Is this the principal call to action on the page?
+   */
   primary?: boolean;
-  /** What background color to use */
+  /**
+   * What background color to use
+   */
   backgroundColor?: string;
-  /** How large should the button be? */
+  /**
+   * How large should the button be?
+   */
   size?: 'small' | 'medium' | 'large';
-  /** Button contents */
+  /**
+   * Button contents
+   */
   label: string;
-  /** Optional click handler */
+  /**
+   * Optional click handler
+   */
   onClick?: () => void;
 }
 
-/** Primary UI component for user interaction */
+/**
+ * Primary UI component for user interaction
+ */
 export const Button = ({
   primary = false,
   size = 'medium',

package/template/cli/ts-4-9/Button.tsx

@@ -3,19 +3,31 @@ import React from 'react';
 import './button.css';
 
 export interface ButtonProps {
-  /** Is this the principal call to action on the page? */
+  /**
+   * Is this the principal call to action on the page?
+   */
   primary?: boolean;
-  /** What background color to use */
+  /**
+   * What background color to use
+   */
   backgroundColor?: string;
-  /** How large should the button be? */
+  /**
+   * How large should the button be?
+   */
   size?: 'small' | 'medium' | 'large';
-  /** Button contents */
+  /**
+   * Button contents
+   */
   label: string;
-  /** Optional click handler */
+  /**
+   * Optional click handler
+   */
   onClick?: () => void;
 }
 
-/** Primary UI component for user interaction */
+/**
+ * Primary UI component for user interaction
+ */
 export const Button = ({
   primary = false,
   size = 'medium',