Skip to content

Commit 21502a1

Browse files
authored
Merge pull request #32987 from storybookjs/version-patch-from-10.0.6
Release: Patch 10.0.7
2 parents 8ca96a8 + c3c971a commit 21502a1

16 files changed

Lines changed: 422 additions & 119 deletions

CHANGELOG.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
## 10.0.7
2+
3+
- ESLint: Only apply csf-strict rules on stories files - [#31963](https://github.com/storybookjs/storybook/pull/31963), thanks @cylewaitforit!
4+
- Next.js: Update SWC loader to support new wasm detection - [#33003](https://github.com/storybookjs/storybook/pull/33003), thanks @yannbf!
5+
16
## 10.0.6
27

38
- CSF: Fix export interface declaration for NextPreview - [#32914](https://github.com/storybookjs/storybook/pull/32914), thanks @icopp!

code/frameworks/nextjs/src/swc/next-swc-loader-patch.ts

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ DEALINGS IN THE SOFTWARE.
2929
import { isAbsolute, relative } from 'node:path';
3030

3131
import type { NextConfig } from 'next';
32-
import { isWasm, transform } from 'next/dist/build/swc/index.js';
32+
import * as nextSwcUtils from 'next/dist/build/swc/index.js';
3333
import { getLoaderSWCOptions } from 'next/dist/build/swc/options.js';
3434

3535
export interface SWCLoaderOptions {
@@ -136,7 +136,7 @@ async function loaderTransform(this: any, parentTrace: any, source?: string, inp
136136

137137
const swcSpan = parentTrace.traceChild('next-swc-transform');
138138
return swcSpan.traceAsyncFn(() =>
139-
transform(source as any, programmaticOptions).then((output) => {
139+
nextSwcUtils.transform(source as any, programmaticOptions).then((output) => {
140140
if (output.eliminatedPackages && this.eliminatedPackages) {
141141
for (const pkg of JSON.parse(output.eliminatedPackages)) {
142142
this.eliminatedPackages.add(pkg);
@@ -152,14 +152,25 @@ const EXCLUDED_PATHS = /[\\/](cache[\\/][^\\/]+\.zip[\\/]node_modules|__virtual_
152152
export function pitch(this: any) {
153153
const callback = this.async();
154154
(async () => {
155+
let isWasm: boolean = false;
156+
157+
if (!!nextSwcUtils.isWasm) {
158+
isWasm = await nextSwcUtils.isWasm();
159+
// @ts-expect-error Relevant from Next.js >= 16.0.2-canary.12
160+
} else if (!!nextSwcUtils.getBindingsSync) {
161+
await nextSwcUtils.loadBindings();
162+
// @ts-expect-error Relevant from Next.js >= 16.0.2-canary.12
163+
isWasm = nextSwcUtils.getBindingsSync().isWasm;
164+
}
165+
155166
if (
156167
// TODO: Evaluate if this is correct after removing pnp compatibility code in SB11
157168
// TODO: investigate swc file reading in PnP mode?
158169
!process.versions.pnp &&
159170
!EXCLUDED_PATHS.test(this.resourcePath) &&
160171
this.loaders.length - 1 === this.loaderIndex &&
161172
isAbsolute(this.resourcePath) &&
162-
!(await isWasm())
173+
!isWasm
163174
) {
164175
const loaderSpan = mockCurrentTraceSpan.traceChild('next-swc-loader');
165176
this.addDependency(this.resourcePath);

code/lib/eslint-plugin/scripts/update-lib-configs.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,10 @@ function formatCategory(category: TCategory) {
5050
// This file is bundled in an index.js file at the root
5151
// so the reference is relative to the src directory
5252
extends: './configs/${extendsCategoryId}',
53-
rules: ${formatRules(category.rules)}
53+
overrides: [{
54+
files: [${STORIES_GLOBS.join(', ')}],
55+
rules: ${formatRules(category.rules)}
56+
},]
5457
}
5558
`;
5659
}

code/lib/eslint-plugin/scripts/update-lib-flat-configs.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@ function formatCategory(category: TCategory) {
6464
...config,
6565
{
6666
name: 'storybook:${category.categoryId}:rules',
67+
files: [${STORIES_GLOBS.join(', ')}],
6768
rules: ${formatRules(category.rules)}
6869
}
6970
]

code/lib/eslint-plugin/src/configs/csf-strict.ts

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,15 @@ export default {
77
// This file is bundled in an index.js file at the root
88
// so the reference is relative to the src directory
99
extends: './configs/csf',
10-
rules: {
11-
'react-hooks/rules-of-hooks': 'off',
12-
'import/no-anonymous-default-export': 'off',
13-
'storybook/no-stories-of': 'error',
14-
'storybook/no-title-property-in-meta': 'error',
15-
} as const,
10+
overrides: [
11+
{
12+
files: ['**/*.stories.@(ts|tsx|js|jsx|mjs|cjs)', '**/*.story.@(ts|tsx|js|jsx|mjs|cjs)'],
13+
rules: {
14+
'react-hooks/rules-of-hooks': 'off',
15+
'import/no-anonymous-default-export': 'off',
16+
'storybook/no-stories-of': 'error',
17+
'storybook/no-title-property-in-meta': 'error',
18+
} as const,
19+
},
20+
],
1621
};

code/lib/eslint-plugin/src/configs/flat/csf-strict.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ export default [
99
...config,
1010
{
1111
name: 'storybook:csf-strict:rules',
12+
files: ['**/*.stories.@(ts|tsx|js|jsx|mjs|cjs)', '**/*.story.@(ts|tsx|js|jsx|mjs|cjs)'],
1213
rules: {
1314
'react-hooks/rules-of-hooks': 'off',
1415
'import/no-anonymous-default-export': 'off',

code/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -283,5 +283,6 @@
283283
"Dependency Upgrades"
284284
]
285285
]
286-
}
286+
},
287+
"deferredNextVersion": "10.0.7"
287288
}

docs/_snippets/component-story-with-custom-render-function.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -325,3 +325,31 @@ export const Example = meta.story({
325325
),
326326
});
327327
```
328+
329+
```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js"
330+
<script module>
331+
import { defineMeta } from '@storybook/addon-svelte-csf';
332+
333+
import Layout from './Layout.svelte';
334+
import MyComponent from './MyComponent.svelte';
335+
336+
const { Story } = defineMeta({
337+
component: MyComponent,
338+
});
339+
</script>
340+
341+
<Story
342+
name="Example"
343+
>
344+
{#snippet template(args)}
345+
<Layout>
346+
<header>
347+
<h1>Example</h1>
348+
</header>
349+
<article>
350+
<MyComponent />
351+
</article>
352+
</Layout>
353+
{/snippet}
354+
</Story>
355+
```
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
```js filename=".storybook/main.js" renderer="svelte" language="js"
2+
// Replace your-framework with svelte-vite or sveltekit
3+
export default {
4+
framework: {
5+
name: '@storybook/your-framework',
6+
options: {
7+
docgen: false, // Disable docgen for better performance
8+
},
9+
},
10+
};
11+
```
12+
13+
```ts filename=".storybook/main.ts" renderer="svelte" language="ts"
14+
// Replace your-framework with svelte-vite or sveltekit
15+
import type { StorybookConfig } from '@storybook/your-framework';
16+
17+
const config: StorybookConfig = {
18+
framework: {
19+
name: '@storybook/your-framework',
20+
options: {
21+
docgen: false, // Disable docgen for better performance
22+
},
23+
},
24+
};
25+
26+
export default config;
27+
```
Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="js" tabTitle="Svelte CSF"
2+
<script module>
3+
import { defineMeta } from '@storybook/addon-svelte-csf';
4+
5+
import MyComponent from './MyComponent.svelte';
6+
7+
const { Story } = defineMeta({
8+
component: MyComponent,
9+
});
10+
</script>
11+
12+
<Story
13+
name="MyStory"
14+
parameters={{
15+
sveltekit_experimental: {
16+
state: {
17+
page: {
18+
data: {
19+
test: 'passed',
20+
},
21+
},
22+
navigating: {
23+
to: {
24+
route: { id: '/storybook' },
25+
params: {},
26+
url: new URL('http://localhost/storybook'),
27+
},
28+
},
29+
updated: {
30+
current: true,
31+
},
32+
},
33+
},
34+
}}
35+
/>
36+
```
37+
38+
```js filename="MyComponent.stories.js" renderer="svelte" language="js" tabTitle="CSF"
39+
import MyComponent from './MyComponent.svelte';
40+
41+
export default {
42+
component: MyComponent,
43+
};
44+
45+
export const MyStory = {
46+
parameters: {
47+
sveltekit_experimental: {
48+
state: {
49+
page: {
50+
data: {
51+
test: 'passed',
52+
},
53+
},
54+
navigating: {
55+
to: {
56+
route: { id: '/storybook' },
57+
params: {},
58+
url: new URL('http://localhost/storybook'),
59+
},
60+
},
61+
updated: {
62+
current: true,
63+
},
64+
},
65+
},
66+
},
67+
};
68+
```
69+
70+
```svelte filename="MyComponent.stories.svelte" renderer="svelte" language="ts" tabTitle="Svelte CSF"
71+
<script module>
72+
import { defineMeta } from '@storybook/addon-svelte-csf';
73+
74+
import MyComponent from './MyComponent.svelte';
75+
76+
const { Story } = defineMeta({
77+
component: MyComponent,
78+
});
79+
</script>
80+
81+
<Story
82+
name="MyStory"
83+
parameters={{
84+
sveltekit_experimental: {
85+
state: {
86+
page: {
87+
data: {
88+
test: 'passed',
89+
},
90+
},
91+
navigating: {
92+
to: {
93+
route: { id: '/storybook' },
94+
params: {},
95+
url: new URL('http://localhost/storybook'),
96+
},
97+
},
98+
updated: {
99+
current: true,
100+
},
101+
},
102+
},
103+
}}
104+
/>
105+
```
106+
107+
```ts filename="MyComponent.stories.ts" renderer="svelte" language="ts" tabTitle="CSF"
108+
import type { Meta, StoryObj } from '@storybook/sveltekit';
109+
110+
import MyComponent from './MyComponent.svelte';
111+
112+
const meta = {
113+
component: MyComponent,
114+
} satisfies Meta<typeof MyComponent>;
115+
116+
export default meta;
117+
type Story = StoryObj<typeof meta>;
118+
119+
export const MyStory: Story = {
120+
parameters: {
121+
sveltekit_experimental: {
122+
state: {
123+
page: {
124+
data: {
125+
test: 'passed',
126+
},
127+
},
128+
navigating: {
129+
to: {
130+
route: { id: '/storybook' },
131+
params: {},
132+
url: new URL('http://localhost/storybook'),
133+
},
134+
},
135+
updated: {
136+
current: true,
137+
},
138+
},
139+
},
140+
},
141+
};
142+
```

0 commit comments

Comments
 (0)