remove event handler, fix types

allozaur · Nov 29, 2023 · 7abeedf · 7abeedf
1 parent e1475b7
commit 7abeedf
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 36 deletions.
diff --git a/code/frameworks/svelte-vite/package.json b/code/frameworks/svelte-vite/package.json
@@ -52,7 +52,7 @@
     "@storybook/svelte": "workspace:*",
     "@sveltejs/vite-plugin-svelte": "^2.4.2",
     "magic-string": "^0.30.0",
-    "svelte-preprocess": "^5.0.4",
+    "svelte-preprocess": "^5.1.1",
     "sveltedoc-parser": "^4.2.1",
     "ts-dedent": "^2.2.0"
   },

diff --git a/code/renderers/svelte/src/render.ts b/code/renderers/svelte/src/render.ts
@@ -1,6 +1,5 @@
 /* eslint-disable no-param-reassign */
 import type { RenderContext, ArgsStoryFn } from '@storybook/types';
-import type { SvelteComponentTyped } from 'svelte';
 import { RESET_STORY_ARGS } from '@storybook/core-events';
 // ! DO NOT change this PreviewRender import to a relative path, it will break it.
 // ! A relative import will be compiled at build time, and Svelte will be unable to
@@ -14,7 +13,10 @@ import { createRoot } from 'svelte';
 
 import type { SvelteRenderer } from './types';
 
-const componentsByDomElement = new Map<SvelteRenderer['canvasElement'], SvelteComponentTyped>();
+const componentsByDomElement = new Map<
+  SvelteRenderer['canvasElement'],
+  ReturnType<typeof createRoot>
+>();
 
 function teardown(canvasElement: SvelteRenderer['canvasElement']) {
   if (!componentsByDomElement.has(canvasElement)) {

diff --git a/code/renderers/svelte/templates/PreviewRender.svelte b/code/renderers/svelte/templates/PreviewRender.svelte
@@ -6,15 +6,12 @@
   export let kind;
   export let storyFn;
   export let showError;
-  export let storyContext;
 
   let {
     /** @type {SvelteComponent} */
     Component,
     /** @type {any} */
     props = {},
-    /** @type {{[string]: () => {}}} Attach svelte event handlers */
-    on,
   } = storyFn();
 
 	let firstTime = true;
@@ -28,7 +25,6 @@
 			return {
 				Component,
 				props,
-				on,
 			}
 		}
 		return storyFn();
@@ -37,12 +33,6 @@
   // reactive, re-render on storyFn change
   $: ({ Component, props = {}, on } = getStoryFnValue(storyFn));
 
-  const eventsFromArgTypes = Object.fromEntries(
-    Object.entries(storyContext.argTypes)
-      .filter(([k, v]) => v.action && props[k] != null)
-      .map(([k, v]) => [v.action, props[k]])
-  );
-
   if (!Component) {
     showError({
       title: `Expecting a Svelte component from the story: "${name}" of "${kind}".`,
@@ -55,4 +45,4 @@
   }
 </script>
 
-<SlotDecorator {Component} {props} on={{ ...eventsFromArgTypes, ...on }} />
+<SlotDecorator {Component} {props} />
diff --git a/code/renderers/svelte/templates/SlotDecorator.svelte b/code/renderers/svelte/templates/SlotDecorator.svelte
@@ -4,21 +4,12 @@
   export let decorator = undefined;
   export let Component;
   export let props = {};
-  export let on = undefined;
-
-  let instance;
-  let decoratorInstance;
-
-  function getInstance() {
-    // instance can be undefined if a decorator doesn't have <slot/>
-    return instance || decoratorInstance;
-  }
 </script>
 
 {#if decorator}
-  <svelte:component this={decorator.Component} {...decorator.props} bind:this={decoratorInstance}>
-    <svelte:component this={Component} {...props} bind:this={instance} />
+  <svelte:component this={decorator.Component} {...decorator.props}>
+    <svelte:component this={Component} {...props} />
   </svelte:component>
 {:else}
-  <svelte:component this={Component} {...props} bind:this={instance} />
+  <svelte:component this={Component} {...props} />
 {/if}
diff --git a/code/yarn.lock b/code/yarn.lock
@@ -7216,7 +7216,7 @@ __metadata:
     "@types/node": "npm:^18.0.0"
     magic-string: "npm:^0.30.0"
     svelte: "npm:^5.0.0-next.15"
-    svelte-preprocess: "npm:^5.0.4"
+    svelte-preprocess: "npm:^5.1.1"
     sveltedoc-parser: "npm:^4.2.1"
     ts-dedent: "npm:^2.2.0"
     typescript: "npm:^5.3.2"
@@ -27582,9 +27582,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"svelte-preprocess@npm:^5.0.4":
-  version: 5.0.4
-  resolution: "svelte-preprocess@npm:5.0.4"
+"svelte-preprocess@npm:^5.1.0":
+  version: 5.1.0
+  resolution: "svelte-preprocess@npm:5.1.0"
   dependencies:
     "@types/pug": "npm:^2.0.6"
     detect-indent: "npm:^6.1.0"
@@ -27601,7 +27601,7 @@ __metadata:
     sass: ^1.26.8
     stylus: ^0.55.0
     sugarss: ^2.0.0 || ^3.0.0 || ^4.0.0
-    svelte: ^3.23.0 || ^4.0.0-next.0 || ^4.0.0
+    svelte: ^3.23.0 || ^4.0.0-next.0 || ^4.0.0 || ^5.0.0-next.0
     typescript: ">=3.9.5 || ^4.0.0 || ^5.0.0"
   peerDependenciesMeta:
     "@babel/core":
@@ -27624,13 +27624,13 @@ __metadata:
       optional: true
     typescript:
       optional: true
-  checksum: 1ed64b96a91327a47992df0b82df708b5cda92e1da211edbedaf411e633a0be5a8425d19f996abc8dcef52dadd26b5474924dd9eeb30a7b409bf60c33b689d6c
+  checksum: fb40153aa282edadad68221fcf82db1b7c67a208941b136c529fd843d1e8b595d79e9d39e5f252672e11a8b62c621ccf2078de4a57e5adbb89e13046998ae597
   languageName: node
   linkType: hard
 
-"svelte-preprocess@npm:^5.1.0":
-  version: 5.1.0
-  resolution: "svelte-preprocess@npm:5.1.0"
+"svelte-preprocess@npm:^5.1.1":
+  version: 5.1.1
+  resolution: "svelte-preprocess@npm:5.1.1"
   dependencies:
     "@types/pug": "npm:^2.0.6"
     detect-indent: "npm:^6.1.0"
@@ -27670,7 +27670,7 @@ __metadata:
       optional: true
     typescript:
       optional: true
-  checksum: fb40153aa282edadad68221fcf82db1b7c67a208941b136c529fd843d1e8b595d79e9d39e5f252672e11a8b62c621ccf2078de4a57e5adbb89e13046998ae597
+  checksum: 8de6571ddca032dc7a33c37a6cd7caa72eeabf6acbe81924e26f14e9f5de8bbf2806c86d1ac3cb435923c3953d0d9365dfbe2a8c94cd3b383ecfe50957e1b8f9
   languageName: node
   linkType: hard