@storybook/svelte 10.0.0-beta.6 → 10.0.0-beta.7

package/dist/_browser-chunks/{chunk-6F5NZ26N.js → chunk-4ZGG6PUN.js}

@@ -131,7 +131,7 @@ addons.getChannel().on(RESET_STORY_ARGS, ({ storyId }) => {
   storyIdsToRemountFromResetArgsEvent.add(storyId);
 });
 var componentsByDomElement = /* @__PURE__ */ new Map();
-function renderToCanvas({
+async function renderToCanvas({
   storyFn,
   title,
   name,
@@ -171,6 +171,7 @@ function renderToCanvas({
       props
     });
     componentsByDomElement.set(canvasElement, { mountedComponent, props });
+    await svelte.tick();
   } else {
     Object.assign(existingComponent.props, {
       storyFn,
@@ -179,6 +180,7 @@ function renderToCanvas({
       title,
       showError
     });
+    await svelte.tick();
   }
   showMain();
   return () => {

package/dist/entry-preview.js

@@ -5,7 +5,7 @@ import {
   parameters,
   render,
   renderToCanvas
-} from "./_browser-chunks/chunk-6F5NZ26N.js";
+} from "./_browser-chunks/chunk-4ZGG6PUN.js";
 import "./_browser-chunks/chunk-JFJ5UJ7Q.js";
 export {
   decorateStory as applyDecorators,

package/dist/index.js

@@ -1,7 +1,7 @@
 import {
   entry_preview_exports,
   renderToCanvas
-} from "./_browser-chunks/chunk-6F5NZ26N.js";
+} from "./_browser-chunks/chunk-4ZGG6PUN.js";
 import {
   __name
 } from "./_browser-chunks/chunk-JFJ5UJ7Q.js";

package/dist/preset.js

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_r9ursbg89q from 'node:url';
-import CJS_COMPAT_NODE_PATH_r9ursbg89q from 'node:path';
-import CJS_COMPAT_NODE_MODULE_r9ursbg89q from "node:module";
+import CJS_COMPAT_NODE_URL_rauelpbxqq from 'node:url';
+import CJS_COMPAT_NODE_PATH_rauelpbxqq from 'node:path';
+import CJS_COMPAT_NODE_MODULE_rauelpbxqq from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_r9ursbg89q.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_r9ursbg89q.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_r9ursbg89q.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_rauelpbxqq.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_rauelpbxqq.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_rauelpbxqq.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "10.0.0-beta.6",
+  "version": "10.0.0-beta.7",
   "description": "Storybook Svelte renderer: Develop, document, and test UI components in isolation.",
   "keywords": [
     "storybook",
@@ -59,17 +59,17 @@
     "type-fest": "~2.19"
   },
   "devDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^5.0.3",
+    "@sveltejs/vite-plugin-svelte": "^6.2.0",
     "@testing-library/svelte": "^5.2.4",
     "expect-type": "^1.1.0",
-    "svelte": "^5.20.5",
-    "svelte-check": "^4.1.4",
+    "svelte": "^5.39.5",
+    "svelte-check": "^4.3.2",
     "sveltedoc-parser": "^4.2.1",
     "typescript": "^5.8.3",
     "vite": "^7.0.4"
   },
   "peerDependencies": {
-    "storybook": "^10.0.0-beta.6",
+    "storybook": "^10.0.0-beta.7",
     "svelte": "^5.0.0"
   },
   "publishConfig": {

package/static/PreviewRender.svelte

@@ -26,4 +26,9 @@
   });
 </script>
 
-<DecoratorHandler {Component} {props} />
+<svelte:boundary>
+  {#snippet pending()}
+    <div id="sb-pending-async-component-notice">Pending async component...</div>
+  {/snippet}
+  <DecoratorHandler {Component} {props} />
+</svelte:boundary>

package/svelte.config.js

@@ -0,0 +1,16 @@
+//! this config isn't actually used, it's just here to tell svelte-check that we have async enabled
+
+const config = {
+  kit: {
+    experimental: {
+      remoteFunctions: true,
+    },
+  },
+  compilerOptions: {
+    experimental: {
+      async: true,
+    },
+  },
+};
+
+export default config;