storybook-solidjs-vite 10.7.3 → 10.7.4

package/dist/{render-to-canvas-5L3YXi18.js → render-to-canvas-CUzXHGXU.js}

@@ -105,7 +105,7 @@ function createDefaultRender(createComponent) {
 //#endregion
 //#region src/renderer/shared/mount.ts
 /** Play/mount API: sync reactive args and globals, then render via `renderToCanvas`. */
-function createMount({ storyStore }) {
+function createMount({ storyStore, flush }) {
 	return (context) => {
 		const storyId = getStoryId(context);
 		const { forceRemount } = context;
@@ -115,6 +115,7 @@ function createMount({ storyStore }) {
 			if (forceRemount) storyStore.disposeStory(storyId);
 			if (!storyStore.isStoryRendered(storyId) || forceRemount) storyStore.resetStory(storyId);
 			storyStore.makeContextReactive(context);
+			flush?.();
 			await context.renderToCanvas();
 			return context.canvas;
 		};
@@ -152,4 +153,4 @@ function createRenderToCanvas(options) {
 //#endregion
 export { createApplyDecorators as a, beforeAll as i, createMount as n, createStoryState as o, createDefaultRender as r, createRenderToCanvas as t };
 
-//# sourceMappingURL=render-to-canvas-5L3YXi18.js.map
+//# sourceMappingURL=render-to-canvas-CUzXHGXU.js.map

package/dist/{render-to-canvas-5L3YXi18.js.map → render-to-canvas-CUzXHGXU.js.map}

@@ -1 +1 @@
-{"version":3,"file":"render-to-canvas-5L3YXi18.js","names":[],"sources":["../src/renderer/shared/story-store.ts","../src/renderer/shared/apply-decorators.ts","../src/renderer/shared/before-all.ts","../src/renderer/shared/default-render.ts","../src/renderer/shared/mount.ts","../src/renderer/shared/render-to-canvas.ts"],"sourcesContent":["import type { Args, Globals, StoryContext as InternalStoryContext } from 'storybook/internal/types';\nimport type { SolidRenderer } from '../../preview/public-api';\n\n/** Update store via `(prev) => next` (version layer applies reconcile/draft setter). */\ntype SetStoreFn<T extends object> = (update: (prev: T) => T) => void;\n\n/** Reactive store tuple returned by `createStore` (state + setter). */\ntype SolidStore<T extends object> = readonly [\n    state: T,\n    setState: SetStoreFn<T>\n];\n\ntype CreateStoreFn = <T extends object>(initial: T) => SolidStore<T>;\n\nexport interface StoryStateStore {\n    isStoryRendered: (storyId: string) => boolean;\n    resetStory: (storyId: string) => void;\n    setRendered: (storyId: string, rendered: boolean) => void;\n    setDisposeFn: (storyId: string, disposeFn: (() => void) | null) => void;\n    makeContextReactive: (context: InternalStoryContext<SolidRenderer, Args>) => void;\n    disposeStory: (storyId: string) => void;\n}\n\nexport function getStoryId(context: { id?: string; canvasElement?: { id?: string } }): string | undefined {\n    const canvasId = context.canvasElement?.id;\n\n    if (!canvasId || canvasId === 'storybook-root') {\n        return context.id;\n    }\n\n    return canvasId;\n}\n\nexport function createStoryState(createStore: CreateStoreFn): StoryStateStore {\n    const [globals, setGlobals] = createStore<Globals>({});\n    const renderedStories = new Set<string>();\n    const argsStores = new Map<string, SolidStore<Args>>();\n    const disposers = new Map<string, () => void>();\n\n    const getArgsStore = (storyId: string): SolidStore<Args> => {\n        let store = argsStores.get(storyId);\n\n        if (!store) {\n            store = createStore({} as Args);\n            argsStores.set(storyId, store);\n        }\n\n        return store;\n    };\n\n    return {\n        isStoryRendered(storyId) {\n            return renderedStories.has(storyId);\n        },\n\n        resetStory(storyId) {\n            renderedStories.delete(storyId);\n            disposers.delete(storyId);\n            argsStores.delete(storyId);\n        },\n\n        setRendered(storyId, isRendered) {\n            if (isRendered) {\n                renderedStories.add(storyId);\n            }\n            else {\n                renderedStories.delete(storyId);\n            }\n        },\n\n        setDisposeFn(storyId, disposeFn) {\n            if (disposeFn) {\n                disposers.set(storyId, disposeFn);\n            }\n            else {\n                disposers.delete(storyId);\n            }\n        },\n\n        makeContextReactive(context) {\n            const storyId = getStoryId(context);\n\n            if (!storyId) {\n                throw new Error('Story ID is required');\n            }\n\n            const [args, setArgs] = getArgsStore(storyId);\n\n            // Update reactive stores with the new values\n            setArgs(() => context.args);\n            setGlobals(() => context.globals);\n\n            // Sync the reactive stores to the context\n            context.args = args;\n            context.globals = globals;\n        },\n\n        disposeStory(storyId) {\n            disposers.get(storyId)?.();\n            disposers.delete(storyId);\n        },\n    };\n}\n","import { defaultDecorateStory } from 'storybook/preview-api';\n\nimport { IS_SOLID_JSX_FLAG, type Decorator, type SolidRenderer } from '../../preview/public-api';\nimport { getStoryId } from './story-store';\n\nimport type { LegacyStoryFn } from 'storybook/internal/types';\nimport type { StoryStateStore } from './story-store';\n\nexport function createApplyDecorators({\n    storyStore,\n}: {\n    storyStore: StoryStateStore;\n}): (\n    storyFn: LegacyStoryFn<SolidRenderer>,\n    rawDecorators: Decorator[]\n) => LegacyStoryFn<SolidRenderer> {\n    return (storyFn, rawDecorators) => {\n        const decorators = rawDecorators.map(\n            (decorator): Decorator => {\n                const originalFn = (decorator as Decorator & { originalFn?: Decorator }).originalFn;\n                const isJSX = Boolean(\n                    decorator[IS_SOLID_JSX_FLAG] || originalFn?.[IS_SOLID_JSX_FLAG]\n                );\n\n                return (StoryFn, context) => {\n                    if (isJSX) {\n                        const storyId = getStoryId(context);\n\n                        if (storyId && storyStore.isStoryRendered(storyId)) {\n                            return StoryFn(context);\n                        }\n                    }\n\n                    return decorator(StoryFn, context);\n                };\n            }\n        );\n\n        return defaultDecorateStory((context) => {\n            const storyId = getStoryId(context);\n\n            if (storyId && storyStore.isStoryRendered(storyId)) {\n                return null;\n            }\n\n            return storyFn(context);\n        }, decorators);\n    };\n}\n","import { configure } from 'storybook/test';\n\n/** Configures `storybook/test` wrappers so Solid updates flush after async play steps. */\nexport async function beforeAll() {\n    try {\n        configure({\n            unstable_advanceTimersWrapper: (cb: () => any) => cb(),\n            asyncWrapper: async(cb: () => any) => {\n                const result = await cb();\n\n                await new Promise<void>((resolve) => {\n                    setTimeout(resolve, 0);\n\n                    // @ts-expect-error global jest\n                    if (typeof jest !== 'undefined' && jest != null && ((setTimeout as any)._isMockFunction === true || Object.hasOwn(setTimeout, 'clock'))) {\n                        // @ts-expect-error global jest\n                        jest!.advanceTimersByTime(0);\n                    }\n                });\n\n                return result;\n            },\n            eventWrapper: (cb: () => any) => cb(),\n        });\n    }\n    catch {\n        // storybook/test might not be available; noop\n    }\n}\n","import type { ArgsStoryFn } from 'storybook/internal/types';\nimport type { SolidRenderer } from '../../preview/public-api';\nimport type { SolidRuntimeCreateComponent } from './render-to-canvas';\n\n/** Default render for meta/stories with `component` + `args` and no custom `render` (CSF 3+). */\nexport function createDefaultRender(createComponent: SolidRuntimeCreateComponent): ArgsStoryFn<SolidRenderer> {\n    return (_, context) => {\n        if (!context.component) {\n            throw new Error(\n                `Unable to render story ${ context.id } as the component annotation is missing from the default export`\n            );\n        }\n\n        return createComponent(context.component, context.args);\n    };\n}\n","import { getStoryId } from './story-store';\n\nimport type { Args } from 'storybook/internal/types';\nimport type { StoryContext, StoryFnReturnType } from '../../preview/public-api';\nimport type { StoryStateStore } from './story-store';\n\n/** Play/mount API: sync reactive args and globals, then render via `renderToCanvas`. */\nexport function createMount({ storyStore }: { storyStore: StoryStateStore }) {\n    return (context: StoryContext<Args>) => {\n        const storyId = getStoryId(context);\n        const { forceRemount } = context;\n\n        if (!storyId) {\n            throw new Error('Story ID is required');\n        }\n\n        return async(ui?: StoryFnReturnType) => {\n            if (ui != null) {\n                context.originalStoryFn = () => ui;\n            }\n\n            if (forceRemount) {\n                storyStore.disposeStory(storyId);\n            }\n\n            if (!storyStore.isStoryRendered(storyId) || forceRemount) {\n                storyStore.resetStory(storyId);\n            }\n\n            storyStore.makeContextReactive(context);\n\n            await context.renderToCanvas();\n\n            return context.canvas;\n        };\n    };\n}\n","import { getStoryId } from './story-store';\n\nimport type { RenderContext, SolidComponent, SolidRenderer } from '../../preview/public-api';\nimport type { StoryStateStore } from './story-store';\n\nexport type SolidRuntimeCreateComponent = (\n    component: SolidComponent,\n    props: object\n) => SolidRenderer['storyResult'];\n\nexport interface SolidRendererRuntime {\n    storyStore: StoryStateStore;\n    createComponent: SolidRuntimeCreateComponent;\n    render: (\n        renderFn: () => SolidRenderer['storyResult'],\n        canvasElement: SolidRenderer['canvasElement']\n    ) => () => void;\n}\n\nexport type StoryThunk = () => SolidRenderer['storyResult'];\n\nexport interface StoryAppContext {\n    Story: StoryThunk;\n    storyContext: RenderContext['storyContext'];\n    showMain: RenderContext['showMain'];\n    showException: RenderContext['showException'];\n    storyId: string;\n}\n\ntype RenderToCanvasOptions = SolidRendererRuntime & {\n    createStoryApp: (context: StoryAppContext) => SolidComponent;\n};\n\n/** Mounts or updates the story in the preview canvas. Returns cleanup when the story changes. */\nexport function createRenderToCanvas(options: RenderToCanvasOptions) {\n    const { storyStore, createComponent, render, createStoryApp } = options;\n\n    return async(\n        renderContext: RenderContext,\n        canvasElement: SolidRenderer['canvasElement']\n    ) => {\n        const storyId = getStoryId({ ...renderContext, canvasElement });\n\n        if (!storyId) {\n            throw new Error('Story ID is required');\n        }\n\n        const { storyContext, storyFn: StoryFn, showMain, showException } = renderContext;\n\n        if (!storyStore.isStoryRendered(storyId)) {\n            const App = createStoryApp({\n                Story: StoryFn,\n                storyContext,\n                showMain,\n                showException,\n                storyId,\n            });\n\n            const disposeFn = render(() => createComponent(App, {}), canvasElement);\n\n            storyStore.setDisposeFn(storyId, disposeFn);\n        }\n        else {\n            StoryFn();\n        }\n\n        return () => {\n            storyStore.disposeStory(storyId);\n            storyStore.resetStory(storyId);\n        };\n    };\n}\n"],"mappings":"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"}
+{"version":3,"file":"render-to-canvas-CUzXHGXU.js","names":[],"sources":["../src/renderer/shared/story-store.ts","../src/renderer/shared/apply-decorators.ts","../src/renderer/shared/before-all.ts","../src/renderer/shared/default-render.ts","../src/renderer/shared/mount.ts","../src/renderer/shared/render-to-canvas.ts"],"sourcesContent":["import type { Args, Globals, StoryContext as InternalStoryContext } from 'storybook/internal/types';\nimport type { SolidRenderer } from '../../preview/public-api';\n\n/** Update store via `(prev) => next` (version layer applies reconcile/draft setter). */\ntype SetStoreFn<T extends object> = (update: (prev: T) => T) => void;\n\n/** Reactive store tuple returned by `createStore` (state + setter). */\ntype SolidStore<T extends object> = readonly [\n    state: T,\n    setState: SetStoreFn<T>\n];\n\ntype CreateStoreFn = <T extends object>(initial: T) => SolidStore<T>;\n\nexport interface StoryStateStore {\n    isStoryRendered: (storyId: string) => boolean;\n    resetStory: (storyId: string) => void;\n    setRendered: (storyId: string, rendered: boolean) => void;\n    setDisposeFn: (storyId: string, disposeFn: (() => void) | null) => void;\n    makeContextReactive: (context: InternalStoryContext<SolidRenderer, Args>) => void;\n    disposeStory: (storyId: string) => void;\n}\n\nexport function getStoryId(context: { id?: string; canvasElement?: { id?: string } }): string | undefined {\n    const canvasId = context.canvasElement?.id;\n\n    if (!canvasId || canvasId === 'storybook-root') {\n        return context.id;\n    }\n\n    return canvasId;\n}\n\nexport function createStoryState(createStore: CreateStoreFn): StoryStateStore {\n    const [globals, setGlobals] = createStore<Globals>({});\n    const renderedStories = new Set<string>();\n    const argsStores = new Map<string, SolidStore<Args>>();\n    const disposers = new Map<string, () => void>();\n\n    const getArgsStore = (storyId: string): SolidStore<Args> => {\n        let store = argsStores.get(storyId);\n\n        if (!store) {\n            store = createStore({} as Args);\n            argsStores.set(storyId, store);\n        }\n\n        return store;\n    };\n\n    return {\n        isStoryRendered(storyId) {\n            return renderedStories.has(storyId);\n        },\n\n        resetStory(storyId) {\n            renderedStories.delete(storyId);\n            disposers.delete(storyId);\n            argsStores.delete(storyId);\n        },\n\n        setRendered(storyId, isRendered) {\n            if (isRendered) {\n                renderedStories.add(storyId);\n            }\n            else {\n                renderedStories.delete(storyId);\n            }\n        },\n\n        setDisposeFn(storyId, disposeFn) {\n            if (disposeFn) {\n                disposers.set(storyId, disposeFn);\n            }\n            else {\n                disposers.delete(storyId);\n            }\n        },\n\n        makeContextReactive(context) {\n            const storyId = getStoryId(context);\n\n            if (!storyId) {\n                throw new Error('Story ID is required');\n            }\n\n            const [args, setArgs] = getArgsStore(storyId);\n\n            // Update reactive stores with the new values\n            setArgs(() => context.args);\n            setGlobals(() => context.globals);\n\n            // Sync the reactive stores to the context\n            context.args = args;\n            context.globals = globals;\n        },\n\n        disposeStory(storyId) {\n            disposers.get(storyId)?.();\n            disposers.delete(storyId);\n        },\n    };\n}\n","import { defaultDecorateStory } from 'storybook/preview-api';\n\nimport { IS_SOLID_JSX_FLAG, type Decorator, type SolidRenderer } from '../../preview/public-api';\nimport { getStoryId } from './story-store';\n\nimport type { LegacyStoryFn } from 'storybook/internal/types';\nimport type { StoryStateStore } from './story-store';\n\nexport function createApplyDecorators({\n    storyStore,\n}: {\n    storyStore: StoryStateStore;\n}): (\n    storyFn: LegacyStoryFn<SolidRenderer>,\n    rawDecorators: Decorator[]\n) => LegacyStoryFn<SolidRenderer> {\n    return (storyFn, rawDecorators) => {\n        const decorators = rawDecorators.map(\n            (decorator): Decorator => {\n                const originalFn = (decorator as Decorator & { originalFn?: Decorator }).originalFn;\n                const isJSX = Boolean(\n                    decorator[IS_SOLID_JSX_FLAG] || originalFn?.[IS_SOLID_JSX_FLAG]\n                );\n\n                return (StoryFn, context) => {\n                    if (isJSX) {\n                        const storyId = getStoryId(context);\n\n                        if (storyId && storyStore.isStoryRendered(storyId)) {\n                            return StoryFn(context);\n                        }\n                    }\n\n                    return decorator(StoryFn, context);\n                };\n            }\n        );\n\n        return defaultDecorateStory((context) => {\n            const storyId = getStoryId(context);\n\n            if (storyId && storyStore.isStoryRendered(storyId)) {\n                return null;\n            }\n\n            return storyFn(context);\n        }, decorators);\n    };\n}\n","import { configure } from 'storybook/test';\n\n/** Configures `storybook/test` wrappers so Solid updates flush after async play steps. */\nexport async function beforeAll() {\n    try {\n        configure({\n            unstable_advanceTimersWrapper: (cb: () => any) => cb(),\n            asyncWrapper: async(cb: () => any) => {\n                const result = await cb();\n\n                await new Promise<void>((resolve) => {\n                    setTimeout(resolve, 0);\n\n                    // @ts-expect-error global jest\n                    if (typeof jest !== 'undefined' && jest != null && ((setTimeout as any)._isMockFunction === true || Object.hasOwn(setTimeout, 'clock'))) {\n                        // @ts-expect-error global jest\n                        jest!.advanceTimersByTime(0);\n                    }\n                });\n\n                return result;\n            },\n            eventWrapper: (cb: () => any) => cb(),\n        });\n    }\n    catch {\n        // storybook/test might not be available; noop\n    }\n}\n","import type { ArgsStoryFn } from 'storybook/internal/types';\nimport type { SolidRenderer } from '../../preview/public-api';\nimport type { SolidRuntimeCreateComponent } from './render-to-canvas';\n\n/** Default render for meta/stories with `component` + `args` and no custom `render` (CSF 3+). */\nexport function createDefaultRender(createComponent: SolidRuntimeCreateComponent): ArgsStoryFn<SolidRenderer> {\n    return (_, context) => {\n        if (!context.component) {\n            throw new Error(\n                `Unable to render story ${ context.id } as the component annotation is missing from the default export`\n            );\n        }\n\n        return createComponent(context.component, context.args);\n    };\n}\n","import { getStoryId } from './story-store';\n\nimport type { Args } from 'storybook/internal/types';\nimport type { StoryContext, StoryFnReturnType } from '../../preview/public-api';\nimport type { StoryStateStore } from './story-store';\n\n/** Play/mount API: sync reactive args and globals, then render via `renderToCanvas`. */\nexport function createMount({\n    storyStore,\n    flush,\n}: {\n    storyStore: StoryStateStore;\n    /**\n     * Solid 2 commits store writes on `flush`. Call it once, after both args\n     * and globals are updated, so a new reader does not observe the empty store.\n     */\n    flush?: () => void;\n}) {\n    return (context: StoryContext<Args>) => {\n        const storyId = getStoryId(context);\n        const { forceRemount } = context;\n\n        if (!storyId) {\n            throw new Error('Story ID is required');\n        }\n\n        return async(ui?: StoryFnReturnType) => {\n            if (ui != null) {\n                context.originalStoryFn = () => ui;\n            }\n\n            if (forceRemount) {\n                storyStore.disposeStory(storyId);\n            }\n\n            if (!storyStore.isStoryRendered(storyId) || forceRemount) {\n                storyStore.resetStory(storyId);\n            }\n\n            storyStore.makeContextReactive(context);\n            flush?.();\n\n            await context.renderToCanvas();\n\n            return context.canvas;\n        };\n    };\n}\n","import { getStoryId } from './story-store';\n\nimport type { RenderContext, SolidComponent, SolidRenderer } from '../../preview/public-api';\nimport type { StoryStateStore } from './story-store';\n\nexport type SolidRuntimeCreateComponent = (\n    component: SolidComponent,\n    props: object\n) => SolidRenderer['storyResult'];\n\nexport interface SolidRendererRuntime {\n    storyStore: StoryStateStore;\n    createComponent: SolidRuntimeCreateComponent;\n    render: (\n        renderFn: () => SolidRenderer['storyResult'],\n        canvasElement: SolidRenderer['canvasElement']\n    ) => () => void;\n}\n\nexport type StoryThunk = () => SolidRenderer['storyResult'];\n\nexport interface StoryAppContext {\n    Story: StoryThunk;\n    storyContext: RenderContext['storyContext'];\n    showMain: RenderContext['showMain'];\n    showException: RenderContext['showException'];\n    storyId: string;\n}\n\ntype RenderToCanvasOptions = SolidRendererRuntime & {\n    createStoryApp: (context: StoryAppContext) => SolidComponent;\n};\n\n/** Mounts or updates the story in the preview canvas. Returns cleanup when the story changes. */\nexport function createRenderToCanvas(options: RenderToCanvasOptions) {\n    const { storyStore, createComponent, render, createStoryApp } = options;\n\n    return async(\n        renderContext: RenderContext,\n        canvasElement: SolidRenderer['canvasElement']\n    ) => {\n        const storyId = getStoryId({ ...renderContext, canvasElement });\n\n        if (!storyId) {\n            throw new Error('Story ID is required');\n        }\n\n        const { storyContext, storyFn: StoryFn, showMain, showException } = renderContext;\n\n        if (!storyStore.isStoryRendered(storyId)) {\n            const App = createStoryApp({\n                Story: StoryFn,\n                storyContext,\n                showMain,\n                showException,\n                storyId,\n            });\n\n            const disposeFn = render(() => createComponent(App, {}), canvasElement);\n\n            storyStore.setDisposeFn(storyId, disposeFn);\n        }\n        else {\n            StoryFn();\n        }\n\n        return () => {\n            storyStore.disposeStory(storyId);\n            storyStore.resetStory(storyId);\n        };\n    };\n}\n"],"mappings":"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"}

package/dist/renderer/solid-legacy.js

@@ -1,4 +1,4 @@
-import { a as createApplyDecorators, i as beforeAll, n as createMount, o as createStoryState, r as createDefaultRender, t as createRenderToCanvas } from "../render-to-canvas-5L3YXi18.js";
+import { a as createApplyDecorators, i as beforeAll, n as createMount, o as createStoryState, r as createDefaultRender, t as createRenderToCanvas } from "../render-to-canvas-CUzXHGXU.js";
 import { definePreviewAddon } from "storybook/internal/csf";
 import { ErrorBoundary, createComponent, onCleanup, onMount } from "solid-js";
 import { global } from "@storybook/global";

package/dist/renderer/solid-next.js

@@ -1,8 +1,8 @@
-import { a as createApplyDecorators, i as beforeAll, n as createMount, o as createStoryState, r as createDefaultRender, t as createRenderToCanvas } from "../render-to-canvas-5L3YXi18.js";
+import { a as createApplyDecorators, i as beforeAll, n as createMount, o as createStoryState, r as createDefaultRender, t as createRenderToCanvas } from "../render-to-canvas-CUzXHGXU.js";
 import { definePreviewAddon } from "storybook/internal/csf";
 import { global } from "@storybook/global";
 import { render as render$1 } from "@solidjs/web";
-import { Errored, createComponent, createMemo, createStore, onSettled } from "solid-js";
+import { Errored, createComponent, createMemo, createStore, flush, onSettled } from "solid-js";
 //#region src/renderer/solid-next.ts
 const SOLID_RENDERER_ID = "solid-next";
 if (global.window) global.window.STORYBOOK_ENV = SOLID_RENDERER_ID;
@@ -23,7 +23,10 @@ const runtime = {
 	createComponent
 };
 const applyDecorators = createApplyDecorators({ storyStore });
-const mount = createMount(runtime);
+const mount = createMount({
+	storyStore,
+	flush
+});
 const render = createDefaultRender(runtime.createComponent);
 const renderToCanvas = createRenderToCanvas({
 	...runtime,

package/dist/renderer/solid-next.js.map

@@ -1 +1 @@
-{"version":3,"file":"solid-next.js","names":["solidRender"],"sources":["../../src/renderer/solid-next.ts"],"sourcesContent":["import { render as solidRender } from '@solidjs/web';\nimport { global } from '@storybook/global';\nimport {\n    createComponent,\n    createMemo,\n    createStore,\n    Errored,\n    onSettled,\n} from 'solid-js-next';\nimport { definePreviewAddon } from 'storybook/internal/csf';\n\nimport { createApplyDecorators } from './shared/apply-decorators';\nimport { beforeAll } from './shared/before-all';\nimport { createDefaultRender } from './shared/default-render';\nimport { createMount } from './shared/mount';\nimport { createRenderToCanvas } from './shared/render-to-canvas';\nimport { createStoryState } from './shared/story-store';\n\nimport type { ProjectAnnotations, Renderer } from 'storybook/internal/types';\nimport type { SolidComponent, SolidRenderer } from '../preview/public-api';\nimport type { SolidRendererRuntime, StoryThunk } from './shared/render-to-canvas';\n\nconst SOLID_RENDERER_ID = 'solid-next' as const;\n\nif (global.window) {\n    global.window.STORYBOOK_ENV = SOLID_RENDERER_ID;\n}\n\nconst parameters = {\n    renderer: SOLID_RENDERER_ID,\n};\n\nfunction trackStory(story: StoryThunk): SolidRenderer['storyResult'] {\n    return createMemo(story) as unknown as SolidRenderer['storyResult'];\n}\n\nconst storyStore = createStoryState((initial: any) => {\n    const [state, setStore] = createStore(initial);\n\n    const setState = (update: (prev: any) => any) => {\n        setStore(() => update(state));\n    };\n\n    return [state, setState];\n});\n\nconst runtime: SolidRendererRuntime = {\n    storyStore,\n    render: solidRender,\n    createComponent: createComponent as SolidRendererRuntime['createComponent'],\n};\n\nconst applyDecorators = createApplyDecorators({ storyStore });\nconst mount = createMount(runtime);\nconst render = createDefaultRender(runtime.createComponent);\nconst renderToCanvas = createRenderToCanvas({\n    ...runtime,\n    createStoryApp: ({ Story, storyContext, showMain, showException, storyId }) => {\n        const renderStory = () => createComponent(() => trackStory(Story), {});\n\n        return (() => {\n            onSettled(() => {\n                showMain();\n                storyStore.setRendered(storyId, true);\n\n                return () => {\n                    storyStore.setRendered(storyId, false);\n                };\n            });\n\n\n            if (storyContext?.parameters?.['__isPortableStory']) {\n                return renderStory();\n            }\n\n            return createComponent(Errored, {\n                fallback: (err: () => unknown, _reset: () => void) => {\n                    const error = err() as Error;\n\n                    showException(error);\n\n                    return error as any;\n                },\n                children: renderStory(),\n            });\n        }) as SolidComponent;\n    },\n});\n\nconst previewAddon = definePreviewAddon({\n    applyDecorators,\n    beforeAll,\n    mount,\n    parameters,\n    render,\n    renderToCanvas,\n} as unknown as ProjectAnnotations<Renderer>);\n\nexport {\n    applyDecorators,\n    beforeAll,\n    mount,\n    parameters,\n    previewAddon,\n    render,\n    renderToCanvas,\n};\n"],"mappings":";;;;;;AAsBA,MAAM,oBAAoB;AAE1B,IAAI,OAAO,QACP,OAAO,OAAO,gBAAgB;AAGlC,MAAM,aAAa,EACf,UAAU,kBACd;AAEA,SAAS,WAAW,OAAiD;CACjE,OAAO,WAAW,KAAK;AAC3B;AAEA,MAAM,aAAa,kBAAkB,YAAiB;CAClD,MAAM,CAAC,OAAO,YAAY,YAAY,OAAO;CAE7C,MAAM,YAAY,WAA+B;EAC7C,eAAe,OAAO,KAAK,CAAC;CAChC;CAEA,OAAO,CAAC,OAAO,QAAQ;AAC3B,CAAC;AAED,MAAM,UAAgC;CAClC;CACA,QAAQA;CACS;AACrB;AAEA,MAAM,kBAAkB,sBAAsB,EAAE,WAAW,CAAC;AAC5D,MAAM,QAAQ,YAAY,OAAO;AACjC,MAAM,SAAS,oBAAoB,QAAQ,eAAe;AAC1D,MAAM,iBAAiB,qBAAqB;CACxC,GAAG;CACH,iBAAiB,EAAE,OAAO,cAAc,UAAU,eAAe,cAAc;EAC3E,MAAM,oBAAoB,sBAAsB,WAAW,KAAK,GAAG,CAAC,CAAC;EAErE,cAAc;GACV,gBAAgB;IACZ,SAAS;IACT,WAAW,YAAY,SAAS,IAAI;IAEpC,aAAa;KACT,WAAW,YAAY,SAAS,KAAK;IACzC;GACJ,CAAC;GAGD,IAAI,cAAc,aAAa,sBAC3B,OAAO,YAAY;GAGvB,OAAO,gBAAgB,SAAS;IAC5B,WAAW,KAAoB,WAAuB;KAClD,MAAM,QAAQ,IAAI;KAElB,cAAc,KAAK;KAEnB,OAAO;IACX;IACA,UAAU,YAAY;GAC1B,CAAC;EACL;CACJ;AACJ,CAAC;AAED,MAAM,eAAe,mBAAmB;CACpC;CACA;CACA;CACA;CACA;CACA;AACJ,CAA4C"}
+{"version":3,"file":"solid-next.js","names":["solidRender"],"sources":["../../src/renderer/solid-next.ts"],"sourcesContent":["import { render as solidRender } from '@solidjs/web';\nimport { global } from '@storybook/global';\nimport {\n    createComponent,\n    createMemo,\n    createStore,\n    Errored,\n    flush,\n    onSettled,\n} from 'solid-js-next';\nimport { definePreviewAddon } from 'storybook/internal/csf';\n\nimport { createApplyDecorators } from './shared/apply-decorators';\nimport { beforeAll } from './shared/before-all';\nimport { createDefaultRender } from './shared/default-render';\nimport { createMount } from './shared/mount';\nimport { createRenderToCanvas } from './shared/render-to-canvas';\nimport { createStoryState } from './shared/story-store';\n\nimport type { ProjectAnnotations, Renderer } from 'storybook/internal/types';\nimport type { SolidComponent, SolidRenderer } from '../preview/public-api';\nimport type { SolidRendererRuntime, StoryThunk } from './shared/render-to-canvas';\n\nconst SOLID_RENDERER_ID = 'solid-next' as const;\n\nif (global.window) {\n    global.window.STORYBOOK_ENV = SOLID_RENDERER_ID;\n}\n\nconst parameters = {\n    renderer: SOLID_RENDERER_ID,\n};\n\nfunction trackStory(story: StoryThunk): SolidRenderer['storyResult'] {\n    return createMemo(story) as unknown as SolidRenderer['storyResult'];\n}\n\nconst storyStore = createStoryState((initial: any) => {\n    const [state, setStore] = createStore(initial);\n\n    const setState = (update: (prev: any) => any) => {\n        setStore(() => update(state));\n    };\n\n    return [state, setState];\n});\n\nconst runtime: SolidRendererRuntime = {\n    storyStore,\n    render: solidRender,\n    createComponent: createComponent as SolidRendererRuntime['createComponent'],\n};\n\nconst applyDecorators = createApplyDecorators({ storyStore });\nconst mount = createMount({ storyStore, flush });\nconst render = createDefaultRender(runtime.createComponent);\nconst renderToCanvas = createRenderToCanvas({\n    ...runtime,\n    createStoryApp: ({ Story, storyContext, showMain, showException, storyId }) => {\n        const renderStory = () => createComponent(() => trackStory(Story), {});\n\n        return (() => {\n            onSettled(() => {\n                showMain();\n                storyStore.setRendered(storyId, true);\n\n                return () => {\n                    storyStore.setRendered(storyId, false);\n                };\n            });\n\n\n            if (storyContext?.parameters?.['__isPortableStory']) {\n                return renderStory();\n            }\n\n            return createComponent(Errored, {\n                fallback: (err: () => unknown, _reset: () => void) => {\n                    const error = err() as Error;\n\n                    showException(error);\n\n                    return error as any;\n                },\n                children: renderStory(),\n            });\n        }) as SolidComponent;\n    },\n});\n\nconst previewAddon = definePreviewAddon({\n    applyDecorators,\n    beforeAll,\n    mount,\n    parameters,\n    render,\n    renderToCanvas,\n} as unknown as ProjectAnnotations<Renderer>);\n\nexport {\n    applyDecorators,\n    beforeAll,\n    mount,\n    parameters,\n    previewAddon,\n    render,\n    renderToCanvas,\n};\n"],"mappings":";;;;;;AAuBA,MAAM,oBAAoB;AAE1B,IAAI,OAAO,QACP,OAAO,OAAO,gBAAgB;AAGlC,MAAM,aAAa,EACf,UAAU,kBACd;AAEA,SAAS,WAAW,OAAiD;CACjE,OAAO,WAAW,KAAK;AAC3B;AAEA,MAAM,aAAa,kBAAkB,YAAiB;CAClD,MAAM,CAAC,OAAO,YAAY,YAAY,OAAO;CAE7C,MAAM,YAAY,WAA+B;EAC7C,eAAe,OAAO,KAAK,CAAC;CAChC;CAEA,OAAO,CAAC,OAAO,QAAQ;AAC3B,CAAC;AAED,MAAM,UAAgC;CAClC;CACA,QAAQA;CACS;AACrB;AAEA,MAAM,kBAAkB,sBAAsB,EAAE,WAAW,CAAC;AAC5D,MAAM,QAAQ,YAAY;CAAE;CAAY;AAAM,CAAC;AAC/C,MAAM,SAAS,oBAAoB,QAAQ,eAAe;AAC1D,MAAM,iBAAiB,qBAAqB;CACxC,GAAG;CACH,iBAAiB,EAAE,OAAO,cAAc,UAAU,eAAe,cAAc;EAC3E,MAAM,oBAAoB,sBAAsB,WAAW,KAAK,GAAG,CAAC,CAAC;EAErE,cAAc;GACV,gBAAgB;IACZ,SAAS;IACT,WAAW,YAAY,SAAS,IAAI;IAEpC,aAAa;KACT,WAAW,YAAY,SAAS,KAAK;IACzC;GACJ,CAAC;GAGD,IAAI,cAAc,aAAa,sBAC3B,OAAO,YAAY;GAGvB,OAAO,gBAAgB,SAAS;IAC5B,WAAW,KAAoB,WAAuB;KAClD,MAAM,QAAQ,IAAI;KAElB,cAAc,KAAK;KAEnB,OAAO;IACX;IACA,UAAU,YAAY;GAC1B,CAAC;EACL;CACJ;AACJ,CAAC;AAED,MAAM,eAAe,mBAAmB;CACpC;CACA;CACA;CACA;CACA;CACA;AACJ,CAA4C"}

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "storybook-solidjs-vite",
     "type": "module",
-    "version": "10.7.3",
+    "version": "10.7.4",
     "private": false,
     "packageManager": "bun@1.3.14",
     "description": "SolidJS integration with Storybook",
@@ -133,7 +133,7 @@
         "@changesets/cli": "^3.0.1",
         "@commitlint/cli": "^21.2.2",
         "@commitlint/config-conventional": "^21.2.2",
-        "@solidjs/web": "2.0.0-rc.6",
+        "@solidjs/web": "2.0.0-rc.15",
         "@tsconfig/strictest": "^2.0.8",
         "@types/node": "^25.9.5",
         "@types/semver": "^7.8.0",
@@ -144,7 +144,7 @@
         "lint-staged": "^16.4.0",
         "simple-git-hooks": "^2.13.1",
         "solid-js": "^1.9.15",
-        "solid-js-next": "npm:solid-js@2.0.0-rc.6",
+        "solid-js-next": "npm:solid-js@2.0.0-rc.15",
         "storybook": "^10.6.0",
         "tsdown": "^0.23.0",
         "type-fest": "^5.8.0",

package/src/renderer/shared/mount.ts

@@ -5,7 +5,17 @@ import type { StoryContext, StoryFnReturnType } from '../../preview/public-api';
 import type { StoryStateStore } from './story-store';
 
 /** Play/mount API: sync reactive args and globals, then render via `renderToCanvas`. */
-export function createMount({ storyStore }: { storyStore: StoryStateStore }) {
+export function createMount({
+    storyStore,
+    flush,
+}: {
+    storyStore: StoryStateStore;
+    /**
+     * Solid 2 commits store writes on `flush`. Call it once, after both args
+     * and globals are updated, so a new reader does not observe the empty store.
+     */
+    flush?: () => void;
+}) {
     return (context: StoryContext<Args>) => {
         const storyId = getStoryId(context);
         const { forceRemount } = context;
@@ -28,6 +38,7 @@ export function createMount({ storyStore }: { storyStore: StoryStateStore }) {
             }
 
             storyStore.makeContextReactive(context);
+            flush?.();
 
             await context.renderToCanvas();
 

package/src/renderer/solid-next.ts

@@ -5,6 +5,7 @@ import {
     createMemo,
     createStore,
     Errored,
+    flush,
     onSettled,
 } from 'solid-js-next';
 import { definePreviewAddon } from 'storybook/internal/csf';
@@ -51,7 +52,7 @@ const runtime: SolidRendererRuntime = {
 };
 
 const applyDecorators = createApplyDecorators({ storyStore });
-const mount = createMount(runtime);
+const mount = createMount({ storyStore, flush });
 const render = createDefaultRender(runtime.createComponent);
 const renderToCanvas = createRenderToCanvas({
     ...runtime,

package/src/spec/renderer/solid-next-mount.test.ts

@@ -0,0 +1,37 @@
+import { createMemo, createRoot } from 'solid-js-next';
+import { describe, expect, it, vi } from 'vitest';
+
+import { mount } from '../../renderer/solid-next';
+
+// `@solidjs/web` imports `solid-js`, which is Solid 1 in this package.
+vi.mock('@solidjs/web', () => ({
+    render: () => () => {},
+}));
+
+describe('Solid 2 mount', () => {
+    it('shows story args and globals to a reactive reader on first render', async() => {
+        let seen = '';
+        const context = {
+            id: 'repro-args--basic',
+            args: { user: { name: 'Ada' } },
+            globals: { theme: 'dark' },
+            forceRemount: false,
+            canvas: 'canvas',
+            renderToCanvas: async() => {
+                createRoot((dispose) => {
+                    try {
+                        const label = createMemo(() => `${context.args.user.name}/${context.globals.theme}`);
+
+                        seen = label();
+                    }
+                    finally {
+                        dispose();
+                    }
+                });
+            },
+        } as any;
+
+        await expect(mount(context)()).resolves.toBe('canvas');
+        expect(seen).toBe('Ada/dark');
+    });
+});