@storybook/experimental-nextjs-vite 0.0.0-pr-28882-sha-441ae2cd → 0.0.0-pr-28916-sha-7e83d7e4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,9 +5,10 @@ export * from 'next/dist/client/components/navigation';
5
5
 
6
6
  /**
7
7
  * Creates a next/navigation router API mock. Used internally.
8
+ *
8
9
  * @ignore
9
10
  * @internal
10
- * */
11
+ */
11
12
  declare const createNavigation: (overrides: any) => {
12
13
  push: Mock;
13
14
  replace: Mock;
@@ -11,9 +11,10 @@ import { NextRouter } from 'next/router';
11
11
 
12
12
  /**
13
13
  * Creates a next/router router API mock. Used internally.
14
+ *
14
15
  * @ignore
15
16
  * @internal
16
- * */
17
+ */
17
18
  declare const createRouter: (overrides: Partial<NextRouter>) => originalRouter.NextRouter;
18
19
  declare const getRouter: () => {
19
20
  push: Mock;
package/dist/index.d.ts CHANGED
@@ -7,6 +7,7 @@ type BuilderName = CompatibleString<'@storybook/builder-vite'>;
7
7
  type FrameworkOptions = {
8
8
  /**
9
9
  * The directory where the Next.js app is located.
10
+ *
10
11
  * @default process.cwd()
11
12
  */
12
13
  nextAppDir?: string;
@@ -24,37 +25,39 @@ type StorybookConfigFramework = {
24
25
  };
25
26
  };
26
27
  };
27
- /**
28
- * The interface for Storybook configuration in `main.ts` files.
29
- */
28
+ /** The interface for Storybook configuration in `main.ts` files. */
30
29
  type StorybookConfig = Omit<StorybookConfig$1, keyof StorybookConfigVite | keyof StorybookConfigFramework> & StorybookConfigVite & StorybookConfigFramework & {};
31
30
 
32
- /** Function that sets the globalConfig of your storybook. The global config is the preview module of your .storybook folder.
31
+ /**
32
+ * Function that sets the globalConfig of your storybook. The global config is the preview module of
33
+ * your .storybook folder.
33
34
  *
34
- * 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`.
35
+ * It should be run a single time, so that your global config (e.g. decorators) is applied to your
36
+ * stories when using `composeStories` or `composeStory`.
35
37
  *
36
38
  * Example:
37
- *```jsx
38
- * // setup.js (for jest)
39
+ *
40
+ * ```jsx
41
+ * // setup-file.js
39
42
  * import { setProjectAnnotations } from '@storybook/experimental-nextjs-vite';
40
43
  * import projectAnnotations from './.storybook/preview';
41
44
  *
42
45
  * setProjectAnnotations(projectAnnotations);
43
- *```
46
+ * ```
44
47
  *
45
- * @param projectAnnotations - e.g. (import projectAnnotations from '../.storybook/preview')
48
+ * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')
46
49
  */
47
- declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProjectAnnotations | NamedOrDefaultProjectAnnotations[]): NormalizedProjectAnnotations<ReactRenderer>;
50
+ declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]): NormalizedProjectAnnotations<ReactRenderer>;
48
51
  /**
49
52
  * Function that will receive a story along with meta (e.g. a default export from a .stories file)
50
- * and optionally projectAnnotations e.g. (import * from '../.storybook/preview)
51
- * and will return a composed component that has all args/parameters/decorators/etc combined and applied to it.
52
- *
53
+ * and optionally projectAnnotations e.g. (import * from '../.storybook/preview) and will return a
54
+ * composed component that has all args/parameters/decorators/etc combined and applied to it.
53
55
  *
54
56
  * It's very useful for reusing a story in scenarios outside of Storybook like unit testing.
55
57
  *
56
58
  * Example:
57
- *```jsx
59
+ *
60
+ * ```jsx
58
61
  * import { render } from '@testing-library/react';
59
62
  * import { composeStory } from '@storybook/experimental-nextjs-vite';
60
63
  * import Meta, { Primary as PrimaryStory } from './Button.stories';
@@ -65,24 +68,26 @@ declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProject
65
68
  * const { getByText } = render(<Primary>Hello world</Primary>);
66
69
  * expect(getByText(/Hello world/i)).not.toBeNull();
67
70
  * });
68
- *```
71
+ * ```
69
72
  *
70
73
  * @param story
71
- * @param componentAnnotations - e.g. (import Meta from './Button.stories')
72
- * @param [projectAnnotations] - e.g. (import * as projectAnnotations from '../.storybook/preview') this can be applied automatically if you use `setProjectAnnotations` in your setup files.
73
- * @param [exportsName] - in case your story does not contain a name and you want it to have a name.
74
+ * @param componentAnnotations - E.g. (import Meta from './Button.stories')
75
+ * @param [projectAnnotations] - E.g. (import * as projectAnnotations from '../.storybook/preview')
76
+ * this can be applied automatically if you use `setProjectAnnotations` in your setup files.
77
+ * @param [exportsName] - In case your story does not contain a name and you want it to have a name.
74
78
  */
75
79
  declare function composeStory<TArgs extends Args = Args>(story: StoryAnnotationsOrFn<ReactRenderer, TArgs>, componentAnnotations: Meta<TArgs | any>, projectAnnotations?: ProjectAnnotations<ReactRenderer>, exportsName?: string): ComposedStoryFn<ReactRenderer, Partial<TArgs>>;
76
80
  /**
77
81
  * Function that will receive a stories import (e.g. `import * as stories from './Button.stories'`)
78
- * and optionally projectAnnotations (e.g. `import * from '../.storybook/preview`)
79
- * 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.
80
- *
82
+ * and optionally projectAnnotations (e.g. `import * from '../.storybook/preview`) and will return
83
+ * an object containing all the stories passed, but now as a composed component that has all
84
+ * args/parameters/decorators/etc combined and applied to it.
81
85
  *
82
86
  * It's very useful for reusing stories in scenarios outside of Storybook like unit testing.
83
87
  *
84
88
  * Example:
85
- *```jsx
89
+ *
90
+ * ```jsx
86
91
  * import { render } from '@testing-library/react';
87
92
  * import { composeStories } from '@storybook/experimental-nextjs-vite';
88
93
  * import * as stories from './Button.stories';
@@ -93,10 +98,11 @@ declare function composeStory<TArgs extends Args = Args>(story: StoryAnnotations
93
98
  * const { getByText } = render(<Primary>Hello world</Primary>);
94
99
  * expect(getByText(/Hello world/i)).not.toBeNull();
95
100
  * });
96
- *```
101
+ * ```
97
102
  *
98
- * @param csfExports - e.g. (import * as stories from './Button.stories')
99
- * @param [projectAnnotations] - e.g. (import * as projectAnnotations from '../.storybook/preview') this can be applied automatically if you use `setProjectAnnotations` in your setup files.
103
+ * @param csfExports - E.g. (import * as stories from './Button.stories')
104
+ * @param [projectAnnotations] - E.g. (import * as projectAnnotations from '../.storybook/preview')
105
+ * this can be applied automatically if you use `setProjectAnnotations` in your setup files.
100
106
  */
101
107
  declare function composeStories<TModule extends Store_CSFExports<ReactRenderer, any>>(csfExports: TModule, projectAnnotations?: ProjectAnnotations<ReactRenderer>): Omit<StoriesWithPartialProps<ReactRenderer, TModule>, keyof Store_CSFExports>;
102
108
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storybook/experimental-nextjs-vite",
3
- "version": "0.0.0-pr-28882-sha-441ae2cd",
3
+ "version": "0.0.0-pr-28916-sha-7e83d7e4",
4
4
  "description": "Storybook for Next.js and Vite",
5
5
  "keywords": [
6
6
  "storybook",
@@ -90,9 +90,9 @@
90
90
  "prep": "jiti ../../../scripts/prepare/bundle.ts"
91
91
  },
92
92
  "dependencies": {
93
- "@storybook/builder-vite": "0.0.0-pr-28882-sha-441ae2cd",
94
- "@storybook/react": "0.0.0-pr-28882-sha-441ae2cd",
95
- "@storybook/test": "0.0.0-pr-28882-sha-441ae2cd",
93
+ "@storybook/builder-vite": "0.0.0-pr-28916-sha-7e83d7e4",
94
+ "@storybook/react": "0.0.0-pr-28916-sha-7e83d7e4",
95
+ "@storybook/test": "0.0.0-pr-28916-sha-7e83d7e4",
96
96
  "styled-jsx": "5.1.6"
97
97
  },
98
98
  "devDependencies": {
@@ -105,7 +105,7 @@
105
105
  "next": "^14.2.5",
106
106
  "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
107
107
  "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
108
- "storybook": "^0.0.0-pr-28882-sha-441ae2cd",
108
+ "storybook": "^0.0.0-pr-28916-sha-7e83d7e4",
109
109
  "vite": "^5.0.0",
110
110
  "vite-plugin-storybook-nextjs": "^1.0.0"
111
111
  },
@@ -1,6 +1,5 @@
1
1
  {
2
2
  "rules": {
3
- "import/no-extraneous-dependencies": "off",
4
3
  "import/extensions": "off",
5
4
  "react/no-unknown-property": "off"
6
5
  }
@@ -4,9 +4,7 @@ import PropTypes from 'prop-types';
4
4
 
5
5
  import './button.css';
6
6
 
7
- /**
8
- * Primary UI component for user interaction
9
- */
7
+ /** Primary UI component for user interaction */
10
8
  export const Button = ({ primary, backgroundColor, size, label, ...props }) => {
11
9
  const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary';
12
10
  return (
@@ -26,25 +24,15 @@ export const Button = ({ primary, backgroundColor, size, label, ...props }) => {
26
24
  };
27
25
 
28
26
  Button.propTypes = {
29
- /**
30
- * Is this the principal call to action on the page?
31
- */
27
+ /** Is this the principal call to action on the page? */
32
28
  primary: PropTypes.bool,
33
- /**
34
- * What background color to use
35
- */
29
+ /** What background color to use */
36
30
  backgroundColor: PropTypes.string,
37
- /**
38
- * How large should the button be?
39
- */
31
+ /** How large should the button be? */
40
32
  size: PropTypes.oneOf(['small', 'medium', 'large']),
41
- /**
42
- * Button contents
43
- */
33
+ /** Button contents */
44
34
  label: PropTypes.string.isRequired,
45
- /**
46
- * Optional click handler
47
- */
35
+ /** Optional click handler */
48
36
  onClick: PropTypes.func,
49
37
  };
50
38
 
@@ -3,31 +3,19 @@ import React from 'react';
3
3
  import './button.css';
4
4
 
5
5
  export interface ButtonProps {
6
- /**
7
- * Is this the principal call to action on the page?
8
- */
6
+ /** Is this the principal call to action on the page? */
9
7
  primary?: boolean;
10
- /**
11
- * What background color to use
12
- */
8
+ /** What background color to use */
13
9
  backgroundColor?: string;
14
- /**
15
- * How large should the button be?
16
- */
10
+ /** How large should the button be? */
17
11
  size?: 'small' | 'medium' | 'large';
18
- /**
19
- * Button contents
20
- */
12
+ /** Button contents */
21
13
  label: string;
22
- /**
23
- * Optional click handler
24
- */
14
+ /** Optional click handler */
25
15
  onClick?: () => void;
26
16
  }
27
17
 
28
- /**
29
- * Primary UI component for user interaction
30
- */
18
+ /** Primary UI component for user interaction */
31
19
  export const Button = ({
32
20
  primary = false,
33
21
  size = 'medium',
@@ -3,31 +3,19 @@ import React from 'react';
3
3
  import './button.css';
4
4
 
5
5
  export interface ButtonProps {
6
- /**
7
- * Is this the principal call to action on the page?
8
- */
6
+ /** Is this the principal call to action on the page? */
9
7
  primary?: boolean;
10
- /**
11
- * What background color to use
12
- */
8
+ /** What background color to use */
13
9
  backgroundColor?: string;
14
- /**
15
- * How large should the button be?
16
- */
10
+ /** How large should the button be? */
17
11
  size?: 'small' | 'medium' | 'large';
18
- /**
19
- * Button contents
20
- */
12
+ /** Button contents */
21
13
  label: string;
22
- /**
23
- * Optional click handler
24
- */
14
+ /** Optional click handler */
25
15
  onClick?: () => void;
26
16
  }
27
17
 
28
- /**
29
- * Primary UI component for user interaction
30
- */
18
+ /** Primary UI component for user interaction */
31
19
  export const Button = ({
32
20
  primary = false,
33
21
  size = 'medium',