@storybook/svelte 6.5.0-alpha.21 → 6.5.0-alpha.25

package/dist/cjs/client/index.js

@@ -3,18 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "storiesOf", {
-  enumerable: true,
-  get: function get() {
-    return _preview.storiesOf;
-  }
-});
-Object.defineProperty(exports, "setAddon", {
-  enumerable: true,
-  get: function get() {
-    return _preview.setAddon;
-  }
-});
 Object.defineProperty(exports, "addDecorator", {
   enumerable: true,
   get: function get() {
@@ -33,16 +21,16 @@ Object.defineProperty(exports, "configure", {
     return _preview.configure;
   }
 });
-Object.defineProperty(exports, "getStorybook", {
+Object.defineProperty(exports, "forceReRender", {
   enumerable: true,
   get: function get() {
-    return _preview.getStorybook;
+    return _preview.forceReRender;
   }
 });
-Object.defineProperty(exports, "forceReRender", {
+Object.defineProperty(exports, "getStorybook", {
   enumerable: true,
   get: function get() {
-    return _preview.forceReRender;
+    return _preview.getStorybook;
   }
 });
 Object.defineProperty(exports, "raw", {
@@ -51,6 +39,18 @@ Object.defineProperty(exports, "raw", {
     return _preview.raw;
   }
 });
+Object.defineProperty(exports, "setAddon", {
+  enumerable: true,
+  get: function get() {
+    return _preview.setAddon;
+  }
+});
+Object.defineProperty(exports, "storiesOf", {
+  enumerable: true,
+  get: function get() {
+    return _preview.storiesOf;
+  }
+});
 
 var _preview = require("./preview");
 

package/dist/cjs/client/preview/config.js

@@ -3,19 +3,25 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "renderToDOM", {
+Object.defineProperty(exports, "decorateStory", {
   enumerable: true,
   get: function get() {
-    return _render.renderToDOM;
+    return _decorators.decorateStory;
   }
 });
-Object.defineProperty(exports, "decorateStory", {
+exports.parameters = void 0;
+Object.defineProperty(exports, "render", {
   enumerable: true,
   get: function get() {
-    return _decorators.decorateStory;
+    return _render.render;
+  }
+});
+Object.defineProperty(exports, "renderToDOM", {
+  enumerable: true,
+  get: function get() {
+    return _render.renderToDOM;
   }
 });
-exports.parameters = void 0;
 
 var _render = require("./render");
 

package/dist/cjs/client/preview/decorators.js

@@ -5,14 +5,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.decorateStory = decorateStory;
 
+require("core-js/modules/es.object.to-string.js");
+
 require("core-js/modules/es.object.assign.js");
 
 var _store = require("@storybook/store");
 
-var _SlotDecorator = _interopRequireDefault(require("./SlotDecorator.svelte"));
+var _SlotDecorator = _interopRequireDefault(require("@storybook/svelte/templates/SlotDecorator.svelte"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+// eslint-disable-next-line import/no-extraneous-dependencies
+
 /**
  * Check if an object is a svelte component.
  * @param obj Object

package/dist/cjs/client/preview/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.forceReRender = exports.configure = exports.storiesOf = exports.raw = exports.getStorybook = exports.clearDecorators = exports.addParameters = exports.addDecorator = exports.setAddon = void 0;
+exports.storiesOf = exports.setAddon = exports.raw = exports.getStorybook = exports.forceReRender = exports.configure = exports.clearDecorators = exports.addParameters = exports.addDecorator = void 0;
 
 var _client = require("@storybook/core/client");
 
@@ -14,7 +14,8 @@ require("./globals");
 var _render = require("./render");
 
 var _start = (0, _client.start)(_render.renderToDOM, {
-  decorateStory: _decorators.decorateStory
+  decorateStory: _decorators.decorateStory,
+  render: _render.render
 }),
     coreConfigure = _start.configure,
     clientApi = _start.clientApi,

package/dist/cjs/client/preview/render.js

@@ -3,16 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.render = void 0;
 exports.renderToDOM = renderToDOM;
 
 require("core-js/modules/es.function.name.js");
 
 var _global = _interopRequireDefault(require("global"));
 
-var _PreviewRender = _interopRequireDefault(require("./PreviewRender.svelte"));
+var _PreviewRender = _interopRequireDefault(require("@storybook/svelte/templates/PreviewRender.svelte"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+// eslint-disable-next-line import/no-extraneous-dependencies
 var document = _global.default.document;
 var previousComponent = null;
 
@@ -44,4 +46,20 @@ function renderToDOM(_ref, domElement) {
     }
   });
   showMain();
-}
+}
+
+var render = function render(args, context) {
+  var id = context.id,
+      Component = context.component;
+
+  if (!Component) {
+    throw new Error("Unable to render story ".concat(id, " as the component annotation is missing from the default export"));
+  }
+
+  return {
+    Component: Component,
+    props: args
+  };
+};
+
+exports.render = render;

package/dist/cjs/server/framework-preset-svelte.js

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.webpack = webpack;
 exports.config = void 0;
+exports.webpack = webpack;
 
 require("core-js/modules/es.promise.js");
 
 var _coreCommon = require("@storybook/core-common");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 

package/dist/esm/client/preview/config.js

@@ -1,4 +1,4 @@
-export { renderToDOM } from './render';
+export { render, renderToDOM } from './render';
 export { decorateStory } from './decorators';
 export var parameters = {
   framework: 'svelte'

package/dist/esm/client/preview/decorators.js

@@ -1,6 +1,8 @@
+import "core-js/modules/es.object.to-string.js";
 import "core-js/modules/es.object.assign.js";
-import { sanitizeStoryContextUpdate } from '@storybook/store';
-import SlotDecorator from './SlotDecorator.svelte';
+import { sanitizeStoryContextUpdate } from '@storybook/store'; // eslint-disable-next-line import/no-extraneous-dependencies
+
+import SlotDecorator from '@storybook/svelte/templates/SlotDecorator.svelte';
 
 /**
  * Check if an object is a svelte component.

package/dist/esm/client/preview/index.js

@@ -1,10 +1,11 @@
 import { start } from '@storybook/core/client';
 import { decorateStory } from './decorators';
 import './globals';
-import { renderToDOM } from './render';
+import { render, renderToDOM } from './render';
 
 var _start = start(renderToDOM, {
-  decorateStory: decorateStory
+  decorateStory: decorateStory,
+  render: render
 }),
     coreConfigure = _start.configure,
     clientApi = _start.clientApi,

package/dist/esm/client/preview/render.js

@@ -1,6 +1,7 @@
 import "core-js/modules/es.function.name.js";
 import global from 'global';
-import PreviewRender from './PreviewRender.svelte';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import PreviewRender from '@storybook/svelte/templates/PreviewRender.svelte';
 var document = global.document;
 var previousComponent = null;
 
@@ -32,4 +33,17 @@ export function renderToDOM(_ref, domElement) {
     }
   });
   showMain();
-}
+}
+export var render = function render(args, context) {
+  var id = context.id,
+      Component = context.component;
+
+  if (!Component) {
+    throw new Error("Unable to render story ".concat(id, " as the component annotation is missing from the default export"));
+  }
+
+  return {
+    Component: Component,
+    props: args
+  };
+};

package/dist/esm/server/framework-preset-svelte.js

@@ -1,6 +1,6 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 

package/dist/modern/client/preview/config.js

@@ -1,4 +1,4 @@
-export { renderToDOM } from './render';
+export { render, renderToDOM } from './render';
 export { decorateStory } from './decorators';
 export const parameters = {
   framework: 'svelte'

package/dist/modern/client/preview/decorators.js

@@ -1,6 +1,7 @@
 import "core-js/modules/es.array.reduce.js";
-import { sanitizeStoryContextUpdate } from '@storybook/store';
-import SlotDecorator from './SlotDecorator.svelte';
+import { sanitizeStoryContextUpdate } from '@storybook/store'; // eslint-disable-next-line import/no-extraneous-dependencies
+
+import SlotDecorator from '@storybook/svelte/templates/SlotDecorator.svelte';
 
 /**
  * Check if an object is a svelte component.

package/dist/modern/client/preview/index.js

@@ -1,13 +1,14 @@
 import { start } from '@storybook/core/client';
 import { decorateStory } from './decorators';
 import './globals';
-import { renderToDOM } from './render';
+import { render, renderToDOM } from './render';
 const {
   configure: coreConfigure,
   clientApi,
   forceReRender
 } = start(renderToDOM, {
-  decorateStory
+  decorateStory,
+  render
 });
 export const {
   setAddon,

package/dist/modern/client/preview/render.js

@@ -1,5 +1,6 @@
 import global from 'global';
-import PreviewRender from './PreviewRender.svelte';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import PreviewRender from '@storybook/svelte/templates/PreviewRender.svelte';
 const {
   document
 } = global;
@@ -34,4 +35,19 @@ export function renderToDOM({
     }
   });
   showMain();
-}
+}
+export const render = (args, context) => {
+  const {
+    id,
+    component: Component
+  } = context;
+
+  if (!Component) {
+    throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);
+  }
+
+  return {
+    Component,
+    props: args
+  };
+};

package/dist/modern/server/framework-preset-svelte.js

@@ -1,6 +1,6 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 

package/dist/ts3.4/client/preview/config.d.ts

@@ -1,4 +1,4 @@
-export { renderToDOM } from './render';
+export { render, renderToDOM } from './render';
 export { decorateStory } from './decorators';
 export declare const parameters: {
     framework: string;

package/dist/ts3.4/client/preview/render.d.ts

@@ -1,3 +1,5 @@
+import { ArgsStoryFn } from '@storybook/csf';
 import { RenderContext } from '@storybook/store';
 import { SvelteFramework } from './types';
 export declare function renderToDOM({ storyFn, kind, name, showMain, showError }: RenderContext<SvelteFramework>, domElement: HTMLElement): void;
+export declare const render: ArgsStoryFn<SvelteFramework>;

package/dist/ts3.9/client/preview/config.d.ts

@@ -1,4 +1,4 @@
-export { renderToDOM } from './render';
+export { render, renderToDOM } from './render';
 export { decorateStory } from './decorators';
 export declare const parameters: {
     framework: string;

package/dist/ts3.9/client/preview/render.d.ts

@@ -1,3 +1,5 @@
-import { RenderContext } from '@storybook/store';
+import { ArgsStoryFn } from '@storybook/csf';
+import type { RenderContext } from '@storybook/store';
 import { SvelteFramework } from './types';
 export declare function renderToDOM({ storyFn, kind, name, showMain, showError }: RenderContext<SvelteFramework>, domElement: HTMLElement): void;
+export declare const render: ArgsStoryFn<SvelteFramework>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/svelte",
-  "version": "6.5.0-alpha.21",
+  "version": "6.5.0-alpha.25",
   "description": "Storybook for Svelte: Develop Svelte Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -45,11 +45,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "6.5.0-alpha.21",
-    "@storybook/core": "6.5.0-alpha.21",
-    "@storybook/core-common": "6.5.0-alpha.21",
+    "@storybook/addons": "6.5.0-alpha.25",
+    "@storybook/core": "6.5.0-alpha.25",
+    "@storybook/core-common": "6.5.0-alpha.25",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/store": "6.5.0-alpha.21",
+    "@storybook/store": "6.5.0-alpha.25",
     "core-js": "^3.8.2",
     "global": "^4.4.0",
     "react": "16.14.0",
@@ -75,6 +75,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "fc1a84084556d61fea8bcaa197f7d85f3a9a107d",
+  "gitHead": "25ed23c17e07452af0dbd34665eb9a6dfdac526c",
   "sbmodern": "dist/modern/client/index.js"
 }

package/dist/cjs/client/preview/PreviewRender.svelte

@@ -1,37 +0,0 @@
-<script>
-  import SlotDecorator from './SlotDecorator.svelte';
-  import dedent from 'ts-dedent';
-
-  export let name;
-  export let kind;
-  export let storyFn;
-  export let showError;
-
-  const {
-    /** @type {SvelteComponent} */
-    Component,
-    /** @type {any} */
-    props = {},
-    /** @type {{[string]: () => {}}} Attach svelte event handlers */
-    on,
-    Wrapper,
-    WrapperData = {},
-  } = storyFn(); 
-
-  if (!Component) {
-    showError({
-      title: `Expecting a Svelte component from the story: "${name}" of "${kind}".`,
-      description: dedent`
-        Did you forget to return the Svelte component configuration from the story?
-        Use "() => ({ Component: YourComponent, data: {} })"
-        when defining the story.
-      `,
-    });
-  }
-</script>
-<SlotDecorator
-  decorator={Wrapper}
-  decoratorProps={WrapperData}
-  component={Component}
-  props={props}
-  {on}/>

package/dist/cjs/client/preview/SlotDecorator.svelte

@@ -1,30 +0,0 @@
-<script>
-  import { onMount } from 'svelte';
-  export let decorator;
-  export let decoratorProps = {};
-  export let component;
-  export let props = {};
-  export let on;
-
-  let instance;
-  let decoratorInstance;
-
-  function getInstance() {
-    // instance can be undefined if a decorator doesn't have <slot/>
-    return instance || decoratorInstance;
-  }
-
-  if (on) {
-    // Attach svelte event listeners.
-    Object.keys(on).forEach((eventName) => {
-      onMount(() => getInstance().$on(eventName, on[eventName]));
-    });
-  }
-</script>
-{#if decorator}
-  <svelte:component this={decorator} {...decoratorProps} bind:this={decoratorInstance}>
-    <svelte:component this={component} {...props} bind:this={instance}/>
-  </svelte:component>
-{:else}
-  <svelte:component this={component} {...props} bind:this={instance}/>
-{/if}

package/dist/cjs/typings.d.js

@@ -1 +0,0 @@
-"use strict";

package/dist/esm/client/preview/PreviewRender.svelte

@@ -1,37 +0,0 @@
-<script>
-  import SlotDecorator from './SlotDecorator.svelte';
-  import dedent from 'ts-dedent';
-
-  export let name;
-  export let kind;
-  export let storyFn;
-  export let showError;
-
-  const {
-    /** @type {SvelteComponent} */
-    Component,
-    /** @type {any} */
-    props = {},
-    /** @type {{[string]: () => {}}} Attach svelte event handlers */
-    on,
-    Wrapper,
-    WrapperData = {},
-  } = storyFn(); 
-
-  if (!Component) {
-    showError({
-      title: `Expecting a Svelte component from the story: "${name}" of "${kind}".`,
-      description: dedent`
-        Did you forget to return the Svelte component configuration from the story?
-        Use "() => ({ Component: YourComponent, data: {} })"
-        when defining the story.
-      `,
-    });
-  }
-</script>
-<SlotDecorator
-  decorator={Wrapper}
-  decoratorProps={WrapperData}
-  component={Component}
-  props={props}
-  {on}/>

package/dist/esm/client/preview/SlotDecorator.svelte

@@ -1,30 +0,0 @@
-<script>
-  import { onMount } from 'svelte';
-  export let decorator;
-  export let decoratorProps = {};
-  export let component;
-  export let props = {};
-  export let on;
-
-  let instance;
-  let decoratorInstance;
-
-  function getInstance() {
-    // instance can be undefined if a decorator doesn't have <slot/>
-    return instance || decoratorInstance;
-  }
-
-  if (on) {
-    // Attach svelte event listeners.
-    Object.keys(on).forEach((eventName) => {
-      onMount(() => getInstance().$on(eventName, on[eventName]));
-    });
-  }
-</script>
-{#if decorator}
-  <svelte:component this={decorator} {...decoratorProps} bind:this={decoratorInstance}>
-    <svelte:component this={component} {...props} bind:this={instance}/>
-  </svelte:component>
-{:else}
-  <svelte:component this={component} {...props} bind:this={instance}/>
-{/if}

package/dist/modern/client/preview/PreviewRender.svelte

@@ -1,37 +0,0 @@
-<script>
-  import SlotDecorator from './SlotDecorator.svelte';
-  import dedent from 'ts-dedent';
-
-  export let name;
-  export let kind;
-  export let storyFn;
-  export let showError;
-
-  const {
-    /** @type {SvelteComponent} */
-    Component,
-    /** @type {any} */
-    props = {},
-    /** @type {{[string]: () => {}}} Attach svelte event handlers */
-    on,
-    Wrapper,
-    WrapperData = {},
-  } = storyFn(); 
-
-  if (!Component) {
-    showError({
-      title: `Expecting a Svelte component from the story: "${name}" of "${kind}".`,
-      description: dedent`
-        Did you forget to return the Svelte component configuration from the story?
-        Use "() => ({ Component: YourComponent, data: {} })"
-        when defining the story.
-      `,
-    });
-  }
-</script>
-<SlotDecorator
-  decorator={Wrapper}
-  decoratorProps={WrapperData}
-  component={Component}
-  props={props}
-  {on}/>

package/dist/modern/client/preview/SlotDecorator.svelte

@@ -1,30 +0,0 @@
-<script>
-  import { onMount } from 'svelte';
-  export let decorator;
-  export let decoratorProps = {};
-  export let component;
-  export let props = {};
-  export let on;
-
-  let instance;
-  let decoratorInstance;
-
-  function getInstance() {
-    // instance can be undefined if a decorator doesn't have <slot/>
-    return instance || decoratorInstance;
-  }
-
-  if (on) {
-    // Attach svelte event listeners.
-    Object.keys(on).forEach((eventName) => {
-      onMount(() => getInstance().$on(eventName, on[eventName]));
-    });
-  }
-</script>
-{#if decorator}
-  <svelte:component this={decorator} {...decoratorProps} bind:this={decoratorInstance}>
-    <svelte:component this={component} {...props} bind:this={instance}/>
-  </svelte:component>
-{:else}
-  <svelte:component this={component} {...props} bind:this={instance}/>
-{/if}