@storybook/vue3 7.0.0-alpha.1 → 7.0.0-alpha.4

package/dist/cjs/config.js

@@ -1,11 +1,5 @@
 "use strict";
 
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/web.dom-collections.for-each.js");
-
-require("core-js/modules/es.object.keys.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -15,14 +9,12 @@ var _exportNames = {
 };
 Object.defineProperty(exports, "argTypesEnhancers", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _config.argTypesEnhancers;
   }
 });
 exports.parameters = void 0;
 
-require("core-js/modules/es.object.assign.js");
-
 var _config = require("./docs/config");
 
 var _config2 = require("./preview/config");
@@ -33,12 +25,12 @@ Object.keys(_config2).forEach(function (key) {
   if (key in exports && exports[key] === _config2[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _config2[key];
     }
   });
 });
-var parameters = Object.assign({
+const parameters = Object.assign({
   framework: 'vue3'
 }, _config.parameters);
 exports.parameters = parameters;

package/dist/cjs/docs/config.js

@@ -9,16 +9,13 @@ var _docsTools = require("@storybook/docs-tools");
 
 var _extractArgTypes = require("./extractArgTypes");
 
-var _prepareForInline = require("./prepareForInline");
-
-var parameters = {
+const parameters = {
   docs: {
     inlineStories: true,
-    prepareForInline: _prepareForInline.prepareForInline,
     extractArgTypes: _extractArgTypes.extractArgTypes,
     extractComponentDescription: _docsTools.extractComponentDescription
   }
 };
 exports.parameters = parameters;
-var argTypesEnhancers = [_docsTools.enhanceArgTypes];
+const argTypesEnhancers = [_docsTools.enhanceArgTypes];
 exports.argTypesEnhancers = argTypesEnhancers;

package/dist/cjs/docs/extractArgTypes.js

@@ -5,51 +5,42 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.extractArgTypes = void 0;
 
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/web.dom-collections.for-each.js");
-
-require("core-js/modules/es.function.name.js");
-
-require("core-js/modules/es.symbol.js");
-
-require("core-js/modules/es.symbol.description.js");
-
-require("core-js/modules/es.object.assign.js");
-
 var _docsTools = require("@storybook/docs-tools");
 
-var SECTIONS = ['props', 'events', 'slots'];
+const SECTIONS = ['props', 'events', 'slots'];
 
-var extractArgTypes = function extractArgTypes(component) {
+const extractArgTypes = component => {
   if (!(0, _docsTools.hasDocgen)(component)) {
     return null;
   }
 
-  var results = {};
-  SECTIONS.forEach(function (section) {
-    var props = (0, _docsTools.extractComponentProps)(component, section);
-    props.forEach(function (_ref) {
-      var propDef = _ref.propDef,
-          docgenInfo = _ref.docgenInfo,
-          jsDocTags = _ref.jsDocTags;
-      var name = propDef.name,
-          type = propDef.type,
-          description = propDef.description,
-          defaultSummary = propDef.defaultValue,
-          required = propDef.required;
-      var sbType = section === 'props' ? (0, _docsTools.convert)(docgenInfo) : {
+  const results = {};
+  SECTIONS.forEach(section => {
+    const props = (0, _docsTools.extractComponentProps)(component, section);
+    props.forEach(({
+      propDef,
+      docgenInfo,
+      jsDocTags
+    }) => {
+      const {
+        name,
+        type,
+        description,
+        defaultValue: defaultSummary,
+        required
+      } = propDef;
+      const sbType = section === 'props' ? (0, _docsTools.convert)(docgenInfo) : {
         name: 'void'
       };
       results[name] = {
-        name: name,
-        description: description,
+        name,
+        description,
         type: Object.assign({
-          required: required
+          required
         }, sbType),
         table: {
-          type: type,
-          jsDocTags: jsDocTags,
+          type,
+          jsDocTags,
           defaultValue: defaultSummary,
           category: section
         }

package/dist/cjs/index.js

@@ -1,11 +1,5 @@
 "use strict";
 
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/web.dom-collections.for-each.js");
-
-require("core-js/modules/es.object.keys.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -18,66 +12,59 @@ var _exportNames = {
   getStorybook: true,
   forceReRender: true,
   raw: true,
-  app: true,
-  activeStoryComponent: true
+  setup: true
 };
-Object.defineProperty(exports, "activeStoryComponent", {
-  enumerable: true,
-  get: function get() {
-    return _preview.activeStoryComponent;
-  }
-});
 Object.defineProperty(exports, "addDecorator", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.addDecorator;
   }
 });
 Object.defineProperty(exports, "addParameters", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.addParameters;
   }
 });
-Object.defineProperty(exports, "app", {
-  enumerable: true,
-  get: function get() {
-    return _preview.app;
-  }
-});
 Object.defineProperty(exports, "configure", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.configure;
   }
 });
 Object.defineProperty(exports, "forceReRender", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.forceReRender;
   }
 });
 Object.defineProperty(exports, "getStorybook", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.getStorybook;
   }
 });
 Object.defineProperty(exports, "raw", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.raw;
   }
 });
 Object.defineProperty(exports, "setAddon", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.setAddon;
   }
 });
+Object.defineProperty(exports, "setup", {
+  enumerable: true,
+  get: function () {
+    return _preview.setup;
+  }
+});
 Object.defineProperty(exports, "storiesOf", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _preview.storiesOf;
   }
 });
@@ -92,7 +79,7 @@ Object.keys(_types).forEach(function (key) {
   if (key in exports && exports[key] === _types[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _types[key];
     }
   });

package/dist/cjs/preview/config.js

@@ -5,20 +5,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "applyDecorators", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _decorateStory.decorateStory;
   }
 });
 exports.parameters = void 0;
 Object.defineProperty(exports, "render", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _render.render;
   }
 });
 Object.defineProperty(exports, "renderToDOM", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _render.renderToDOM;
   }
 });
@@ -27,7 +27,7 @@ var _render = require("./render");
 
 var _decorateStory = require("./decorateStory");
 
-var parameters = {
+const parameters = {
   framework: 'vue3'
 };
 exports.parameters = parameters;

package/dist/cjs/preview/decorateStory.js

@@ -5,12 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.decorateStory = decorateStory;
 
-require("core-js/modules/es.function.name.js");
-
-require("core-js/modules/es.object.assign.js");
-
-require("core-js/modules/es.object.to-string.js");
-
 var _vue = require("vue");
 
 var _store = require("@storybook/store");
@@ -29,7 +23,7 @@ function normalizeFunctionalComponent(options) {
 }
 
 function prepare(rawStory, innerStory) {
-  var story = rawStory;
+  const story = rawStory;
 
   if (story == null) {
     return null;
@@ -44,32 +38,29 @@ function prepare(rawStory, innerStory) {
   }
 
   return {
-    render: function render() {
+    render() {
       return (0, _vue.h)(story);
     }
+
   };
 }
 
 function decorateStory(storyFn, decorators) {
-  return decorators.reduce(function (decorated, decorator) {
-    return function (context) {
-      var story;
-      var decoratedStory = decorator(function (update) {
-        story = decorated(Object.assign({}, context, (0, _store.sanitizeStoryContextUpdate)(update)));
-        return story;
-      }, context);
-
-      if (!story) {
-        story = decorated(context);
-      }
+  return decorators.reduce((decorated, decorator) => context => {
+    let story;
+    const decoratedStory = decorator(update => {
+      story = decorated(Object.assign({}, context, (0, _store.sanitizeStoryContextUpdate)(update)));
+      return story;
+    }, context);
+
+    if (!story) {
+      story = decorated(context);
+    }
 
-      if (decoratedStory === story) {
-        return story;
-      }
+    if (decoratedStory === story) {
+      return story;
+    }
 
-      return prepare(decoratedStory, story);
-    };
-  }, function (context) {
-    return prepare(storyFn(context));
-  });
+    return prepare(decoratedStory, story);
+  }, context => prepare(storyFn(context)));
 }

package/dist/cjs/preview/globals.js

@@ -4,6 +4,8 @@ var _global = _interopRequireDefault(require("global"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var globalWindow = _global.default.window;
+const {
+  window: globalWindow
+} = _global.default;
 globalWindow.STORYBOOK_REACT_CLASSES = {};
 globalWindow.STORYBOOK_ENV = 'vue3';

package/dist/cjs/preview/index.js

@@ -3,15 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "activeStoryComponent", {
+exports.setAddon = exports.raw = exports.getStorybook = exports.forceReRender = exports.configure = exports.clearDecorators = exports.addParameters = exports.addDecorator = void 0;
+Object.defineProperty(exports, "setup", {
   enumerable: true,
-  get: function get() {
-    return _render.activeStoryComponent;
+  get: function () {
+    return _render.setup;
   }
 });
-exports.storiesOf = exports.setAddon = exports.raw = exports.getStorybook = exports.forceReRender = exports.configure = exports.clearDecorators = exports.app = exports.addParameters = exports.addDecorator = void 0;
-
-require("core-js/modules/es.array.concat.js");
+exports.storiesOf = void 0;
 
 var _coreClient = require("@storybook/core-client");
 
@@ -21,42 +20,48 @@ var _decorateStory = require("./decorateStory");
 
 var _render = require("./render");
 
-var framework = 'vue3';
-var api = (0, _coreClient.start)(_render.renderToDOM, {
+const framework = 'vue3';
+const api = (0, _coreClient.start)(_render.renderToDOM, {
   decorateStory: _decorateStory.decorateStory,
   render: _render.render
 });
 
-var storiesOf = function storiesOf(kind, m) {
+const storiesOf = (kind, m) => {
   return api.clientApi.storiesOf(kind, m).addParameters({
-    framework: framework
+    framework
   });
 };
 
 exports.storiesOf = storiesOf;
 
-var configure = function configure() {
-  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-    args[_key] = arguments[_key];
-  }
-
-  return api.configure.apply(api, [framework].concat(args));
-};
+const configure = (...args) => api.configure(framework, ...args);
 
 exports.configure = configure;
-var addDecorator = api.clientApi.addDecorator;
+const {
+  addDecorator
+} = api.clientApi;
 exports.addDecorator = addDecorator;
-var addParameters = api.clientApi.addParameters;
+const {
+  addParameters
+} = api.clientApi;
 exports.addParameters = addParameters;
-var clearDecorators = api.clientApi.clearDecorators;
+const {
+  clearDecorators
+} = api.clientApi;
 exports.clearDecorators = clearDecorators;
-var setAddon = api.clientApi.setAddon;
+const {
+  setAddon
+} = api.clientApi;
 exports.setAddon = setAddon;
-var forceReRender = api.forceReRender;
+const {
+  forceReRender
+} = api;
 exports.forceReRender = forceReRender;
-var getStorybook = api.clientApi.getStorybook;
+const {
+  getStorybook
+} = api.clientApi;
 exports.getStorybook = getStorybook;
-var raw = api.clientApi.raw;
-exports.raw = raw;
-var app = _render.storybookApp;
-exports.app = app;
+const {
+  raw
+} = api.clientApi;
+exports.raw = raw;

package/dist/cjs/preview/render.js

@@ -1,36 +1,26 @@
 "use strict";
 
-require("core-js/modules/es.array.slice.js");
-
-require("core-js/modules/es.object.freeze.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.render = exports.activeStoryComponent = void 0;
+exports.render = void 0;
 exports.renderToDOM = renderToDOM;
-exports.storybookApp = void 0;
-
-require("core-js/modules/es.function.name.js");
-
-require("core-js/modules/es.array.concat.js");
+exports.setup = void 0;
 
 var _tsDedent = _interopRequireDefault(require("ts-dedent"));
 
 var _vue = require("vue");
 
-var _templateObject;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var render = function render(props, context) {
-  var id = context.id,
-      Component = context.component;
+const render = (props, context) => {
+  const {
+    id,
+    component: Component
+  } = context;
 
   if (!Component) {
-    throw new Error("Unable to render story ".concat(id, " as the component annotation is missing from the default export"));
+    throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);
   } // TODO remove this hack
 
 
@@ -38,45 +28,57 @@ var render = function render(props, context) {
 };
 
 exports.render = render;
-var activeStoryComponent = (0, _vue.shallowRef)(null);
-exports.activeStoryComponent = activeStoryComponent;
-var root = null;
-var storybookApp = (0, _vue.createApp)({
-  // If an end-user calls `unmount` on the app, we need to clear our root variable
-  unmounted: function unmounted() {
-    root = null;
-  },
-  setup: function setup() {
-    return function () {
-      if (!activeStoryComponent.value) throw new Error('No Vue 3 Story available. Was it set correctly?');
-      return (0, _vue.h)(activeStoryComponent.value);
-    };
-  }
-});
-exports.storybookApp = storybookApp;
-
-function renderToDOM(_ref, domElement) {
-  var title = _ref.title,
-      name = _ref.name,
-      storyFn = _ref.storyFn,
-      showMain = _ref.showMain,
-      showError = _ref.showError,
-      showException = _ref.showException;
+
+let setupFunction = app => {};
+
+const setup = fn => {
+  setupFunction = fn;
+};
+
+exports.setup = setup;
+const map = new Map();
+
+function renderToDOM({
+  title,
+  name,
+  storyFn,
+  showMain,
+  showError,
+  showException
+}, domElement) {
+  // TODO: explain cyclical nature of these app => story => mount
+  let element;
+  const storybookApp = (0, _vue.createApp)({
+    unmounted() {
+      map.delete(domElement);
+    },
+
+    render() {
+      map.set(domElement, storybookApp);
+      setupFunction(storybookApp);
+      return (0, _vue.h)(element);
+    }
+
+  });
   storybookApp.config.errorHandler = showException;
-  var element = storyFn();
+  element = storyFn();
 
   if (!element) {
     showError({
-      title: "Expecting a Vue component from the story: \"".concat(name, "\" of \"").concat(title, "\"."),
-      description: (0, _tsDedent.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        Did you forget to return the Vue component from the story?\n        Use \"() => ({ template: '<my-comp></my-comp>' })\" or \"() => ({ components: MyComp, template: '<my-comp></my-comp>' })\" when defining the story.\n      "])))
+      title: `Expecting a Vue component from the story: "${name}" of "${title}".`,
+      description: (0, _tsDedent.default)`
+      Did you forget to return the Vue component from the story?
+      Use "() => ({ template: '<my-comp></my-comp>' })" or "() => ({ components: MyComp, template: '<my-comp></my-comp>' })" when defining the story.
+      `
     });
     return;
   }
 
   showMain();
-  activeStoryComponent.value = element;
 
-  if (!root) {
-    root = storybookApp.mount(domElement);
+  if (map.has(domElement)) {
+    map.get(domElement).unmount(domElement);
   }
+
+  storybookApp.mount(domElement);
 }

package/dist/esm/docs/config.js

@@ -1,10 +1,8 @@
 import { extractComponentDescription, enhanceArgTypes } from '@storybook/docs-tools';
 import { extractArgTypes } from './extractArgTypes';
-import { prepareForInline } from './prepareForInline';
 export const parameters = {
   docs: {
     inlineStories: true,
-    prepareForInline,
     extractArgTypes,
     extractComponentDescription
   }

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-export { storiesOf, setAddon, addDecorator, addParameters, configure, getStorybook, forceReRender, raw, app, activeStoryComponent } from './preview';
+export { storiesOf, setAddon, addDecorator, addParameters, configure, getStorybook, forceReRender, raw, setup } from './preview';
 export * from './preview/types-6-0'; // optimization: stop HMR propagation in webpack
 
 module?.hot?.decline();

package/dist/esm/preview/index.js

@@ -1,7 +1,7 @@
 import { start } from '@storybook/core-client';
 import './globals';
 import { decorateStory } from './decorateStory';
-import { render, renderToDOM, storybookApp } from './render';
+import { render, renderToDOM } from './render';
 const framework = 'vue3';
 const api = start(renderToDOM, {
   decorateStory,
@@ -34,5 +34,4 @@ export const {
 export const {
   raw
 } = api.clientApi;
-export const app = storybookApp;
-export { activeStoryComponent } from './render';
+export { setup } from './render';

package/dist/esm/preview/render.js

@@ -1,5 +1,5 @@
 import dedent from 'ts-dedent';
-import { createApp, h, shallowRef } from 'vue';
+import { createApp, h } from 'vue';
 export const render = (props, context) => {
   const {
     id,
@@ -13,22 +13,13 @@ export const render = (props, context) => {
 
   return h(Component, props);
 };
-export const activeStoryComponent = shallowRef(null);
-let root = null;
-export const storybookApp = createApp({
-  // If an end-user calls `unmount` on the app, we need to clear our root variable
-  unmounted() {
-    root = null;
-  },
-
-  setup() {
-    return () => {
-      if (!activeStoryComponent.value) throw new Error('No Vue 3 Story available. Was it set correctly?');
-      return h(activeStoryComponent.value);
-    };
-  }
 
-});
+let setupFunction = app => {};
+
+export const setup = fn => {
+  setupFunction = fn;
+};
+const map = new Map();
 export function renderToDOM({
   title,
   name,
@@ -37,24 +28,39 @@ export function renderToDOM({
   showError,
   showException
 }, domElement) {
+  // TODO: explain cyclical nature of these app => story => mount
+  let element;
+  const storybookApp = createApp({
+    unmounted() {
+      map.delete(domElement);
+    },
+
+    render() {
+      map.set(domElement, storybookApp);
+      setupFunction(storybookApp);
+      return h(element);
+    }
+
+  });
   storybookApp.config.errorHandler = showException;
-  const element = storyFn();
+  element = storyFn();
 
   if (!element) {
     showError({
       title: `Expecting a Vue component from the story: "${name}" of "${title}".`,
       description: dedent`
-        Did you forget to return the Vue component from the story?
-        Use "() => ({ template: '<my-comp></my-comp>' })" or "() => ({ components: MyComp, template: '<my-comp></my-comp>' })" when defining the story.
+      Did you forget to return the Vue component from the story?
+      Use "() => ({ template: '<my-comp></my-comp>' })" or "() => ({ components: MyComp, template: '<my-comp></my-comp>' })" when defining the story.
       `
     });
     return;
   }
 
   showMain();
-  activeStoryComponent.value = element;
 
-  if (!root) {
-    root = storybookApp.mount(domElement);
+  if (map.has(domElement)) {
+    map.get(domElement).unmount(domElement);
   }
+
+  storybookApp.mount(domElement);
 }

package/dist/types/config.d.ts

@@ -1,7 +1,6 @@
 export declare const parameters: {
     docs: {
         inlineStories: boolean;
-        prepareForInline: (storyFn: import("@storybook/csf").PartialStoryFn<import(".").VueFramework, import("@storybook/csf").Args>, { args }: import("@storybook/csf").StoryContext<import(".").VueFramework, import("@storybook/csf").Args>) => import("react").DetailedReactHTMLElement<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
         extractArgTypes: import("lib/docs-tools/dist/types").ArgTypesExtractor;
         extractComponentDescription: typeof import("lib/docs-tools/dist/types").extractComponentDescription;
     };

package/dist/types/docs/config.d.ts

@@ -2,7 +2,6 @@ import { extractComponentDescription } from '@storybook/docs-tools';
 export declare const parameters: {
     docs: {
         inlineStories: boolean;
-        prepareForInline: (storyFn: import("@storybook/csf").PartialStoryFn<import("..").VueFramework, import("@storybook/csf").Args>, { args }: import("@storybook/csf").StoryContext<import("..").VueFramework, import("@storybook/csf").Args>) => import("react").DetailedReactHTMLElement<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
         extractArgTypes: import("@storybook/docs-tools").ArgTypesExtractor;
         extractComponentDescription: typeof extractComponentDescription;
     };

package/dist/types/index.d.ts

@@ -1,2 +1,2 @@
-export { storiesOf, setAddon, addDecorator, addParameters, configure, getStorybook, forceReRender, raw, app, activeStoryComponent, } from './preview';
+export { storiesOf, setAddon, addDecorator, addParameters, configure, getStorybook, forceReRender, raw, setup, } from './preview';
 export * from './preview/types-6-0';

package/dist/types/preview/index.d.ts

@@ -27,5 +27,4 @@ export declare const setAddon: (() => never) | ((addon: any) => void);
 export declare const forceReRender: (() => never) | (() => void);
 export declare const getStorybook: (() => never) | (() => import("lib/client-api/dist/types/ClientApi").GetStorybookKind<VueFramework>[]);
 export declare const raw: (() => never) | (() => import("lib/store/dist/types").BoundStory<VueFramework>[]);
-export declare const app: ClientApi['app'];
-export { activeStoryComponent } from './render';
+export { setup } from './render';

package/dist/types/preview/render.d.ts

@@ -2,6 +2,5 @@ import type { RenderContext } from '@storybook/store';
 import type { ArgsStoryFn } from '@storybook/csf';
 import { VueFramework } from './types-6-0';
 export declare const render: ArgsStoryFn<VueFramework>;
-export declare const activeStoryComponent: import("vue").Ref<import("vue").ComponentOptions<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, any, any, any>> | import("vue").Ref<import("vue").FunctionalComponent<any, any>>;
-export declare const storybookApp: import("vue").App<Element>;
-export declare function renderToDOM({ title, name, storyFn, showMain, showError, showException }: RenderContext<VueFramework>, domElement: HTMLElement): void;
+export declare const setup: (fn: (app: any) => void) => void;
+export declare function renderToDOM({ title, name, storyFn, showMain, showError, showException }: RenderContext<VueFramework>, domElement: Element): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue3",
-  "version": "7.0.0-alpha.1",
+  "version": "7.0.0-alpha.4",
   "description": "Storybook Vue 3 renderer",
   "keywords": [
     "storybook"
@@ -33,16 +33,15 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "7.0.0-alpha.1",
-    "@storybook/core-client": "7.0.0-alpha.1",
+    "@storybook/addons": "7.0.0-alpha.4",
+    "@storybook/core-client": "7.0.0-alpha.4",
     "@storybook/csf": "0.0.2--canary.4566f4d.1",
-    "@storybook/docs-tools": "7.0.0-alpha.1",
-    "@storybook/store": "7.0.0-alpha.1",
+    "@storybook/docs-tools": "7.0.0-alpha.4",
+    "@storybook/store": "7.0.0-alpha.4",
     "core-js": "^3.8.2",
     "global": "^4.4.0",
     "react": "16.14.0",
     "react-dom": "16.14.0",
-    "regenerator-runtime": "^0.13.7",
     "ts-dedent": "^2.0.0"
   },
   "devDependencies": {
@@ -59,5 +58,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b90b85210f66da59656c2ef58b0910b156256bea"
+  "gitHead": "006ed54452dd7c37a8cbe91a84f5312182f7ca00"
 }

package/dist/cjs/docs/prepareForInline.js

@@ -1,61 +0,0 @@
-"use strict";
-
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
-require("core-js/modules/es.array.iterator.js");
-
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/es.string.iterator.js");
-
-require("core-js/modules/es.weak-map.js");
-
-require("core-js/modules/web.dom-collections.iterator.js");
-
-require("core-js/modules/es.object.get-own-property-descriptor.js");
-
-require("core-js/modules/es.symbol.js");
-
-require("core-js/modules/es.symbol.description.js");
-
-require("core-js/modules/es.symbol.iterator.js");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.prepareForInline = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var Vue = _interopRequireWildcard(require("vue"));
-
-var _index = require("../index");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-// This is cast as `any` to workaround type errors caused by Vue 2 types
-var _ref = Vue,
-    render = _ref.render,
-    h = _ref.h;
-
-var prepareForInline = function prepareForInline(storyFn, _ref2) {
-  var args = _ref2.args;
-  var component = storyFn();
-  var vnode = h(component, args); // By attaching the app context from `@storybook/vue3` to the vnode
-  // like this, these stoeis are able to access any app config stuff
-  // the end-user set inside `.storybook/preview.js`
-
-  vnode.appContext = _index.app._context; // eslint-disable-line no-underscore-dangle
-
-  return /*#__PURE__*/_react.default.createElement('div', {
-    ref: function ref(node) {
-      return node ? render(vnode, node) : null;
-    }
-  });
-};
-
-exports.prepareForInline = prepareForInline;

package/dist/esm/docs/prepareForInline.js

@@ -1,22 +0,0 @@
-import React from 'react';
-import * as Vue from 'vue';
-import { app } from '../index'; // This is cast as `any` to workaround type errors caused by Vue 2 types
-
-const {
-  render,
-  h
-} = Vue;
-export const prepareForInline = (storyFn, {
-  args
-}) => {
-  const component = storyFn();
-  const vnode = h(component, args); // By attaching the app context from `@storybook/vue3` to the vnode
-  // like this, these stoeis are able to access any app config stuff
-  // the end-user set inside `.storybook/preview.js`
-
-  vnode.appContext = app._context; // eslint-disable-line no-underscore-dangle
-
-  return /*#__PURE__*/React.createElement('div', {
-    ref: node => node ? render(vnode, node) : null
-  });
-};

package/dist/types/docs/prepareForInline.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { StoryContext, PartialStoryFn } from '@storybook/csf';
-import { VueFramework } from '../index';
-export declare const prepareForInline: (storyFn: PartialStoryFn<VueFramework>, { args }: StoryContext<VueFramework>) => React.DetailedReactHTMLElement<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;