@storybook/vue3 6.4.0-beta.24 → 6.4.0-beta.25

package/dist/esm/server/index.js

@@ -0,0 +1,3 @@
+import { buildDev } from '@storybook/core/server';
+import options from './options';
+buildDev(options);

package/dist/esm/server/options.js

@@ -0,0 +1,8 @@
+import { sync } from 'read-pkg-up';
+export default {
+  packageJson: sync({
+    cwd: __dirname
+  }).packageJson,
+  framework: 'vue3',
+  frameworkPresets: [require.resolve('./framework-preset-vue3')]
+};

package/dist/modern/client/index.js

@@ -0,0 +1,6 @@
+export { storiesOf, setAddon, addDecorator, addParameters, configure, getStorybook, forceReRender, raw, app, activeStoryComponent } from './preview';
+export * from './preview/types-6-0';
+
+if (module && module.hot && module.hot.decline) {
+  module.hot.decline();
+}

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

@@ -0,0 +1,5 @@
+export { renderToDOM } from './render';
+export { decorateStory } from './decorateStory';
+export const parameters = {
+  framework: 'vue3'
+};

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

@@ -0,0 +1,59 @@
+import "core-js/modules/es.array.reduce.js";
+import { h } from 'vue';
+import { sanitizeStoryContextUpdate } from '@storybook/store';
+
+/*
+  This normalizes a functional component into a render method in ComponentOptions.
+
+  The concept is taken from Vue 3's `defineComponent` but changed from creating a `setup`
+  method on the ComponentOptions so end-users don't need to specify a "thunk" as a decorator.
+ */
+function normalizeFunctionalComponent(options) {
+  return typeof options === 'function' ? {
+    render: options,
+    name: options.name
+  } : options;
+}
+
+function prepare(rawStory, innerStory) {
+  const story = rawStory;
+
+  if (story == null) {
+    return null;
+  }
+
+  if (innerStory) {
+    return Object.assign({}, normalizeFunctionalComponent(story), {
+      components: Object.assign({}, story.components || {}, {
+        story: innerStory
+      })
+    });
+  }
+
+  return {
+    render() {
+      return h(story);
+    }
+
+  };
+}
+
+export function decorateStory(storyFn, decorators) {
+  return decorators.reduce((decorated, decorator) => context => {
+    let story;
+    const decoratedStory = decorator(update => {
+      story = decorated(Object.assign({}, context, sanitizeStoryContextUpdate(update)));
+      return story;
+    }, context);
+
+    if (!story) {
+      story = decorated(context);
+    }
+
+    if (decoratedStory === story) {
+      return story;
+    }
+
+    return prepare(decoratedStory, story);
+  }, context => prepare(storyFn(context)));
+}

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

@@ -0,0 +1,6 @@
+import global from 'global';
+const {
+  window: globalWindow
+} = global;
+globalWindow.STORYBOOK_REACT_CLASSES = {};
+globalWindow.STORYBOOK_ENV = 'vue3';

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

@@ -0,0 +1,37 @@
+import { start } from '@storybook/core/client';
+import './globals';
+import { decorateStory } from './decorateStory';
+import { renderToDOM, storybookApp } from './render';
+const framework = 'vue3';
+const api = start(renderToDOM, {
+  decorateStory
+});
+export const storiesOf = (kind, m) => {
+  return api.clientApi.storiesOf(kind, m).addParameters({
+    framework
+  });
+};
+export const configure = (...args) => api.configure(framework, ...args);
+export const {
+  addDecorator
+} = api.clientApi;
+export const {
+  addParameters
+} = api.clientApi;
+export const {
+  clearDecorators
+} = api.clientApi;
+export const {
+  setAddon
+} = api.clientApi;
+export const {
+  forceReRender
+} = api;
+export const {
+  getStorybook
+} = api.clientApi;
+export const {
+  raw
+} = api.clientApi;
+export const app = storybookApp;
+export { activeStoryComponent } from './render';

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

@@ -0,0 +1,47 @@
+import dedent from 'ts-dedent';
+import { createApp, h, shallowRef } from 'vue';
+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);
+    };
+  }
+
+});
+export function renderToDOM({
+  title,
+  name,
+  storyFn,
+  showMain,
+  showError,
+  showException
+}, domElement) {
+  storybookApp.config.errorHandler = showException;
+  const 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.
+      `
+    });
+    return;
+  }
+
+  showMain();
+  activeStoryComponent.value = element;
+
+  if (!root) {
+    root = storybookApp.mount(domElement);
+  }
+}

package/dist/modern/server/build.js

@@ -0,0 +1,3 @@
+import { buildStatic } from '@storybook/core/server';
+import options from './options';
+buildStatic(options);

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

@@ -0,0 +1,42 @@
+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 _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 _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; }
+
+import { VueLoaderPlugin } from 'vue-loader';
+import { DefinePlugin } from 'webpack';
+import { findDistEsm } from '@storybook/core-common';
+export function webpack(config) {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    plugins: [...config.plugins, new VueLoaderPlugin(), new DefinePlugin({
+      __VUE_OPTIONS_API__: JSON.stringify(true),
+      __VUE_PROD_DEVTOOLS__: JSON.stringify(true)
+    })],
+    module: _objectSpread(_objectSpread({}, config.module), {}, {
+      rules: [...config.module.rules, {
+        test: /\.vue$/,
+        loader: require.resolve('vue-loader'),
+        options: {}
+      }, {
+        test: /\.tsx?$/,
+        use: [{
+          loader: require.resolve('ts-loader'),
+          options: {
+            transpileOnly: true,
+            appendTsSuffixTo: [/\.vue$/]
+          }
+        }]
+      }]
+    }),
+    resolve: _objectSpread(_objectSpread({}, config.resolve), {}, {
+      extensions: [...config.resolve.extensions, '.vue'],
+      alias: _objectSpread(_objectSpread({}, config.resolve.alias), {}, {
+        vue$: require.resolve('vue/dist/vue.esm-bundler.js')
+      })
+    })
+  });
+}
+export var config = function (entry = []) {
+  return [...entry, findDistEsm(__dirname, 'client/preview/config')];
+};

package/dist/modern/server/index.js

@@ -0,0 +1,3 @@
+import { buildDev } from '@storybook/core/server';
+import options from './options';
+buildDev(options);

package/dist/modern/server/options.js

@@ -0,0 +1,8 @@
+import { sync } from 'read-pkg-up';
+export default {
+  packageJson: sync({
+    cwd: __dirname
+  }).packageJson,
+  framework: 'vue3',
+  frameworkPresets: [require.resolve('./framework-preset-vue3')]
+};

package/dist/ts3.4/client/index.d.ts

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

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

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

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

@@ -0,0 +1,3 @@
+import { DecoratorFunction, LegacyStoryFn } from '@storybook/csf';
+import { VueFramework } from './types-6-0';
+export declare function decorateStory(storyFn: LegacyStoryFn<VueFramework>, decorators: DecoratorFunction<VueFramework>[]): LegacyStoryFn<VueFramework>;

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,31 @@
+/// <reference types="webpack-env" />
+/// <reference types="node" />
+import { App } from 'vue';
+import { ClientStoryApi, Loadable } from '@storybook/addons';
+import './globals';
+import { IStorybookSection } from './types';
+import { VueFramework } from './types-6-0';
+interface ClientApi extends ClientStoryApi<VueFramework['storyResult']> {
+    setAddon(addon: any): void;
+    configure(loader: Loadable, module: NodeModule): void;
+    getStorybook(): IStorybookSection[];
+    clearDecorators(): void;
+    forceReRender(): void;
+    raw: () => any;
+    load: (...args: any[]) => void;
+    app: App;
+}
+export declare const storiesOf: ClientApi['storiesOf'];
+export declare const configure: ClientApi['configure'];
+export declare const addDecorator: (() => never) | ((decorator: import("@storybook/csf").DecoratorFunction<VueFramework, import("@storybook/addons").Args>) => void);
+export declare const addParameters: (() => never) | (({ globals, globalTypes, ...parameters }: import("@storybook/csf/dist/story").Parameters & {
+    globals?: import("@storybook/csf").Globals;
+    globalTypes?: import("@storybook/csf").GlobalTypes;
+}) => void);
+export declare const clearDecorators: (() => never) | (() => void);
+export declare const setAddon: (() => never) | ((addon: any) => void);
+export declare const forceReRender: (() => never) | (() => void);
+export declare const getStorybook: (() => never) | (() => import("@storybook/client-api/dist/ts3.9/ClientApi").GetStorybookKind<VueFramework>[]);
+export declare const raw: (() => never) | (() => import("@storybook/store").BoundStory<VueFramework>[]);
+export declare const app: ClientApi['app'];
+export { activeStoryComponent } from './render';

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

@@ -0,0 +1,5 @@
+import { RenderContext } from '@storybook/store';
+import { VueFramework } from './types-6-0';
+export declare const activeStoryComponent: import("vue").Ref<import("vue").ComponentOptions<any, any, any, Record<string, import("@vue/reactivity").ComputedGetter<any> | import("vue").WritableComputedOptions<any>>, 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;

package/dist/ts3.4/client/preview/types-6-0.d.ts

@@ -0,0 +1,35 @@
+import { ConcreteComponent } from 'vue';
+import { Args, ComponentAnnotations, StoryAnnotations, AnnotatedStoryFn } from '@storybook/csf';
+import { StoryFnVueReturnType } from './types';
+export { Args, ArgTypes, Parameters, StoryContext } from '@storybook/csf';
+export declare type VueFramework = {
+    component: ConcreteComponent<any>;
+    storyResult: StoryFnVueReturnType;
+};
+/**
+ * Metadata to configure the stories for a component.
+ *
+ * @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
+ */
+export declare type Meta<TArgs = Args> = ComponentAnnotations<VueFramework, TArgs>;
+/**
+ * Story function that represents a CSFv2 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ */
+export declare type StoryFn<TArgs = Args> = AnnotatedStoryFn<VueFramework, TArgs>;
+/**
+ * Story function that represents a CSFv3 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ */
+export declare type StoryObj<TArgs = Args> = StoryAnnotations<VueFramework, TArgs>;
+/**
+ * Story function that represents a CSFv2 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ *
+ * NOTE that in Storybook 7.0, this type will be renamed to `StoryFn` and replaced by the current `StoryObj` type.
+ *
+ */
+export declare type Story<TArgs = Args> = StoryFn<TArgs>;

package/dist/ts3.4/client/preview/types-7-0.d.ts

@@ -0,0 +1,9 @@
+import { Args } from '@storybook/csf';
+import { StoryObj } from './types-6-0';
+export { StoryFn, StoryObj, Meta } from './types-6-0';
+/**
+ * Story function that represents a CSFv3 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ */
+export declare type Story<TArgs = Args> = StoryObj<TArgs>;

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

@@ -0,0 +1,15 @@
+import { ConcreteComponent } from 'vue';
+export { RenderContext } from '@storybook/core';
+export interface ShowErrorArgs {
+    title: string;
+    description: string;
+}
+export declare type StoryFnVueReturnType = ConcreteComponent<any>;
+export interface IStorybookStory {
+    name: string;
+    render: (context: any) => any;
+}
+export interface IStorybookSection {
+    kind: string;
+    stories: IStorybookStory[];
+}

package/dist/ts3.4/server/build.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ts3.4/server/framework-preset-vue3.d.ts

@@ -0,0 +1,4 @@
+import { Configuration } from 'webpack';
+import { StorybookConfig } from '@storybook/core-common';
+export declare function webpack(config: Configuration): Configuration;
+export declare const config: StorybookConfig['config'];

package/dist/ts3.4/server/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ts3.4/server/options.d.ts

@@ -0,0 +1,3 @@
+import { LoadOptions } from '@storybook/core-common';
+declare const _default: LoadOptions;
+export default _default;

package/dist/ts3.9/client/index.d.ts

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

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

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

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

@@ -0,0 +1,3 @@
+import { DecoratorFunction, LegacyStoryFn } from '@storybook/csf';
+import { VueFramework } from './types-6-0';
+export declare function decorateStory(storyFn: LegacyStoryFn<VueFramework>, decorators: DecoratorFunction<VueFramework>[]): LegacyStoryFn<VueFramework>;

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,31 @@
+/// <reference types="webpack-env" />
+/// <reference types="node" />
+import type { App } from 'vue';
+import { ClientStoryApi, Loadable } from '@storybook/addons';
+import './globals';
+import { IStorybookSection } from './types';
+import { VueFramework } from './types-6-0';
+interface ClientApi extends ClientStoryApi<VueFramework['storyResult']> {
+    setAddon(addon: any): void;
+    configure(loader: Loadable, module: NodeModule): void;
+    getStorybook(): IStorybookSection[];
+    clearDecorators(): void;
+    forceReRender(): void;
+    raw: () => any;
+    load: (...args: any[]) => void;
+    app: App;
+}
+export declare const storiesOf: ClientApi['storiesOf'];
+export declare const configure: ClientApi['configure'];
+export declare const addDecorator: (() => never) | ((decorator: import("@storybook/csf").DecoratorFunction<VueFramework, import("@storybook/addons").Args>) => void);
+export declare const addParameters: (() => never) | (({ globals, globalTypes, ...parameters }: import("@storybook/csf/dist/story").Parameters & {
+    globals?: import("@storybook/csf").Globals;
+    globalTypes?: import("@storybook/csf").GlobalTypes;
+}) => void);
+export declare const clearDecorators: (() => never) | (() => void);
+export declare const setAddon: (() => never) | ((addon: any) => void);
+export declare const forceReRender: (() => never) | (() => void);
+export declare const getStorybook: (() => never) | (() => import("@storybook/client-api/dist/ts3.9/ClientApi").GetStorybookKind<VueFramework>[]);
+export declare const raw: (() => never) | (() => import("@storybook/store").BoundStory<VueFramework>[]);
+export declare const app: ClientApi['app'];
+export { activeStoryComponent } from './render';

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

@@ -0,0 +1,5 @@
+import { RenderContext } from '@storybook/store';
+import { VueFramework } from './types-6-0';
+export declare const activeStoryComponent: import("vue").Ref<import("vue").ComponentOptions<any, any, any, Record<string, import("@vue/reactivity").ComputedGetter<any> | import("vue").WritableComputedOptions<any>>, 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;

package/dist/ts3.9/client/preview/types-6-0.d.ts

@@ -0,0 +1,35 @@
+import { ConcreteComponent } from 'vue';
+import { Args, ComponentAnnotations, StoryAnnotations, AnnotatedStoryFn } from '@storybook/csf';
+import { StoryFnVueReturnType } from './types';
+export type { Args, ArgTypes, Parameters, StoryContext } from '@storybook/csf';
+export declare type VueFramework = {
+    component: ConcreteComponent<any>;
+    storyResult: StoryFnVueReturnType;
+};
+/**
+ * Metadata to configure the stories for a component.
+ *
+ * @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
+ */
+export declare type Meta<TArgs = Args> = ComponentAnnotations<VueFramework, TArgs>;
+/**
+ * Story function that represents a CSFv2 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ */
+export declare type StoryFn<TArgs = Args> = AnnotatedStoryFn<VueFramework, TArgs>;
+/**
+ * Story function that represents a CSFv3 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ */
+export declare type StoryObj<TArgs = Args> = StoryAnnotations<VueFramework, TArgs>;
+/**
+ * Story function that represents a CSFv2 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ *
+ * NOTE that in Storybook 7.0, this type will be renamed to `StoryFn` and replaced by the current `StoryObj` type.
+ *
+ */
+export declare type Story<TArgs = Args> = StoryFn<TArgs>;

package/dist/ts3.9/client/preview/types-7-0.d.ts

@@ -0,0 +1,9 @@
+import { Args } from '@storybook/csf';
+import type { StoryObj } from './types-6-0';
+export type { StoryFn, StoryObj, Meta } from './types-6-0';
+/**
+ * Story function that represents a CSFv3 component example.
+ *
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ */
+export declare type Story<TArgs = Args> = StoryObj<TArgs>;

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

@@ -0,0 +1,15 @@
+import { ConcreteComponent } from 'vue';
+export type { RenderContext } from '@storybook/core';
+export interface ShowErrorArgs {
+    title: string;
+    description: string;
+}
+export declare type StoryFnVueReturnType = ConcreteComponent<any>;
+export interface IStorybookStory {
+    name: string;
+    render: (context: any) => any;
+}
+export interface IStorybookSection {
+    kind: string;
+    stories: IStorybookStory[];
+}

package/dist/ts3.9/server/build.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ts3.9/server/framework-preset-vue3.d.ts

@@ -0,0 +1,4 @@
+import { Configuration } from 'webpack';
+import { StorybookConfig } from '@storybook/core-common';
+export declare function webpack(config: Configuration): Configuration;
+export declare const config: StorybookConfig['config'];

package/dist/ts3.9/server/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ts3.9/server/options.d.ts

@@ -0,0 +1,3 @@
+import { LoadOptions } from '@storybook/core-common';
+declare const _default: LoadOptions;
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue3",
-  "version": "6.4.0-beta.24",
+  "version": "6.4.0-beta.25",
   "description": "Storybook for Vue 3: Develop Vue 3 Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -45,11 +45,11 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "6.4.0-beta.24",
-    "@storybook/core": "6.4.0-beta.24",
-    "@storybook/core-common": "6.4.0-beta.24",
+    "@storybook/addons": "6.4.0-beta.25",
+    "@storybook/core": "6.4.0-beta.25",
+    "@storybook/core-common": "6.4.0-beta.25",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/store": "6.4.0-beta.24",
+    "@storybook/store": "6.4.0-beta.25",
     "@types/webpack-env": "^1.16.0",
     "core-js": "^3.8.2",
     "global": "^4.4.0",
@@ -81,6 +81,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "f53ba4d7210b5c4809d57c74d7a42314172aa63e",
+  "gitHead": "5bf101067e5b9387ce092301bea6ab4ee432f777",
   "sbmodern": "dist/modern/client/index.js"
 }