@storybook/vue 5.2.1 → 5.2.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue",
-  "version": "5.2.1",
+  "version": "5.2.5",
   "description": "Storybook for Vue: Develop Vue Component in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -15,6 +15,13 @@
     "directory": "app/vue"
   },
   "license": "MIT",
+  "files": [
+    "bin/**/*",
+    "dist/**/*",
+    "README.md",
+    "*.js",
+    "*.d.ts"
+  ],
   "main": "dist/client/index.js",
   "types": "dist/client/index.d.ts",
   "bin": {
@@ -26,8 +33,9 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "5.2.1",
-    "@storybook/core": "5.2.1",
+    "@storybook/addons": "5.2.5",
+    "@storybook/core": "5.2.5",
+    "@types/webpack-env": "^1.13.9",
     "common-tags": "^1.8.0",
     "core-js": "^3.0.1",
     "global": "^4.3.2",
@@ -55,5 +63,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "5497d2ea8d47c4573d245126e6f3f45bc176c12d"
+  "gitHead": "6e80db697f865f833cf3e250573a7ce36e0ee02a"
 }

package/src/client/index.ts

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

package/src/client/preview/globals.ts

@@ -1,14 +0,0 @@
-/* eslint-disable no-underscore-dangle */
-import { window } from 'global';
-
-if (window.parent !== window) {
-  try {
-    window.__VUE_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__VUE_DEVTOOLS_GLOBAL_HOOK__;
-    window.parent.__VUE_DEVTOOLS_CONTEXT__ = window.document;
-  } catch (error) {
-    // The above lines can throw if we do not have access to the parent frame -- i.e. cross origin
-  }
-}
-
-window.STORYBOOK_REACT_CLASSES = {};
-window.STORYBOOK_ENV = 'vue';

package/src/client/preview/index.ts

@@ -1,138 +0,0 @@
-/* eslint-disable prefer-destructuring */
-import Vue, { VueConstructor, ComponentOptions } from 'vue';
-import { start } from '@storybook/core/client';
-import {
-  ClientStoryApi,
-  StoryFn,
-  DecoratorFunction,
-  StoryContext,
-  Loadable,
-} from '@storybook/addons';
-
-import './globals';
-import { IStorybookSection, StoryFnVueReturnType } from './types';
-
-import render, { VALUES } from './render';
-import { extractProps } from './util';
-
-export const WRAPS = 'STORYBOOK_WRAPS';
-
-function prepare(
-  rawStory: StoryFnVueReturnType,
-  innerStory?: VueConstructor
-): VueConstructor | null {
-  let story: ComponentOptions<Vue> | VueConstructor;
-
-  if (typeof rawStory === 'string') {
-    story = { template: rawStory };
-  } else if (rawStory != null) {
-    story = rawStory as ComponentOptions<Vue>;
-  } else {
-    return null;
-  }
-
-  // @ts-ignore
-  // eslint-disable-next-line no-underscore-dangle
-  if (!story._isVue) {
-    if (innerStory) {
-      story.components = { ...(story.components || {}), story: innerStory };
-    }
-    story = Vue.extend(story);
-    // @ts-ignore // https://github.com/storybookjs/storybook/pull/7578#discussion_r307984824
-  } else if (story.options[WRAPS]) {
-    return story as VueConstructor;
-  }
-
-  return Vue.extend({
-    // @ts-ignore // https://github.com/storybookjs/storybook/pull/7578#discussion_r307985279
-    [WRAPS]: story,
-    // @ts-ignore // https://github.com/storybookjs/storybook/pull/7578#discussion_r307984824
-    [VALUES]: { ...(innerStory ? innerStory.options[VALUES] : {}), ...extractProps(story) },
-    functional: true,
-    render(h, { data, parent, children }) {
-      return h(
-        story,
-        {
-          ...data,
-          // @ts-ignore // https://github.com/storybookjs/storybook/pull/7578#discussion_r307986196
-          props: { ...(data.props || {}), ...parent.$root[VALUES] },
-        },
-        children
-      );
-    },
-  });
-}
-
-const defaultContext: StoryContext = {
-  id: 'unspecified',
-  name: 'unspecified',
-  kind: 'unspecified',
-  parameters: {},
-};
-
-function decorateStory(
-  storyFn: StoryFn<StoryFnVueReturnType>,
-  decorators: DecoratorFunction<VueConstructor>[]
-): StoryFn<VueConstructor> {
-  return decorators.reduce(
-    (decorated: StoryFn<VueConstructor>, decorator) => (context: StoryContext = defaultContext) => {
-      let story;
-
-      const decoratedStory = decorator(p => {
-        story = decorated(
-          p
-            ? {
-                ...context,
-                ...p,
-                parameters: {
-                  ...context.parameters,
-                  ...p.parameters,
-                },
-              }
-            : context
-        );
-
-        return story;
-      }, context);
-
-      if (!story) {
-        story = decorated(context);
-      }
-
-      if (decoratedStory === story) {
-        return story;
-      }
-
-      return prepare(decoratedStory, story);
-    },
-    context => prepare(storyFn(context))
-  );
-}
-const framework = 'vue';
-
-interface ClientApi extends ClientStoryApi<StoryFnVueReturnType> {
-  setAddon(addon: any): void;
-  configure(loader: Loadable, module: NodeModule): void;
-  getStorybook(): IStorybookSection[];
-  clearDecorators(): void;
-  forceReRender(): void;
-  raw: () => any; // todo add type
-  load: (...args: any[]) => void;
-}
-
-const api = start(render, { decorateStory });
-
-export const storiesOf: ClientApi['storiesOf'] = (kind, m) => {
-  return (api.clientApi.storiesOf(kind, m) as ReturnType<ClientApi['storiesOf']>).addParameters({
-    framework,
-  });
-};
-
-export const configure: ClientApi['configure'] = (...args) => api.configure(...args, framework);
-export const addDecorator: ClientApi['addDecorator'] = api.clientApi.addDecorator;
-export const addParameters: ClientApi['addParameters'] = api.clientApi.addParameters;
-export const clearDecorators: ClientApi['clearDecorators'] = api.clientApi.clearDecorators;
-export const setAddon: ClientApi['setAddon'] = api.clientApi.setAddon;
-export const forceReRender: ClientApi['forceReRender'] = api.forceReRender;
-export const getStorybook: ClientApi['getStorybook'] = api.clientApi.getStorybook;
-export const raw: ClientApi['raw'] = api.clientApi.raw;

package/src/client/preview/render.ts

@@ -1,58 +0,0 @@
-import { stripIndents } from 'common-tags';
-import Vue from 'vue';
-import { RenderMainArgs } from './types';
-
-export const COMPONENT = 'STORYBOOK_COMPONENT';
-export const VALUES = 'STORYBOOK_VALUES';
-
-const root = new Vue({
-  data() {
-    return {
-      [COMPONENT]: undefined,
-      [VALUES]: {},
-    };
-  },
-  render(h) {
-    const children = this[COMPONENT] ? [h(this[COMPONENT])] : undefined;
-    return h('div', { attrs: { id: 'root' } }, children);
-  },
-});
-
-export default function render({
-  storyFn,
-  selectedKind,
-  selectedStory,
-  showMain,
-  showError,
-  showException,
-  forceRender,
-}: RenderMainArgs) {
-  Vue.config.errorHandler = showException;
-
-  const element = storyFn();
-
-  if (!element) {
-    showError({
-      title: `Expecting a Vue component from the story: "${selectedStory}" of "${selectedKind}".`,
-      description: stripIndents`
-        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();
-
-  // at component creation || refresh by HMR
-  if (!root[COMPONENT] || !forceRender) {
-    root[COMPONENT] = element;
-  }
-
-  // @ts-ignore https://github.com/storybookjs/storybook/pull/7578#discussion_r307986139
-  root[VALUES] = element.options[VALUES];
-
-  if (!root.$el) {
-    root.$mount('#root');
-  }
-}

package/src/client/preview/types.ts

@@ -1,31 +0,0 @@
-import { Component, VueConstructor } from 'vue';
-import { StoryFn } from '@storybook/addons';
-// TODO, 'any' should be what is actually expected from a storyFn
-
-export interface ShowErrorArgs {
-  title: string;
-  description: string;
-}
-
-export interface RenderMainArgs {
-  storyFn: StoryFn<VueConstructor>;
-  selectedKind: string;
-  selectedStory: string;
-  showMain: () => void;
-  showError: (args: ShowErrorArgs) => void;
-  showException: (...args: any[]) => void;
-  forceRender: boolean;
-}
-
-// TODO: some vue expert needs to look at this
-export type StoryFnVueReturnType = string | Component;
-
-export interface IStorybookStory {
-  name: string;
-  render: () => any;
-}
-
-export interface IStorybookSection {
-  kind: string;
-  stories: IStorybookStory[];
-}

package/src/client/preview/util.ts

@@ -1,23 +0,0 @@
-import { VueConstructor } from 'vue';
-
-function getType(fn: Function) {
-  const match = fn && fn.toString().match(/^\s*function (\w+)/);
-  return match ? match[1] : '';
-}
-
-// https://github.com/vuejs/vue/blob/dev/src/core/util/props.js#L92
-function resolveDefault({ type, default: def }: any) {
-  if (typeof def === 'function' && getType(type) !== 'Function') {
-    // known limitation: we don't have the component instance to pass
-    return def.call();
-  }
-
-  return def;
-}
-
-export function extractProps(component: VueConstructor) {
-  // @ts-ignore this options business seems not good according to the types
-  return Object.entries(component.options.props || {})
-    .map(([name, prop]) => ({ [name]: resolveDefault(prop) }))
-    .reduce((wrap, prop) => ({ ...wrap, ...prop }), {});
-}

package/src/server/build.ts

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

package/src/server/framework-preset-vue.ts

@@ -1,35 +0,0 @@
-import VueLoaderPlugin from 'vue-loader/lib/plugin';
-import { Configuration } from 'webpack';
-
-export function webpack(config: Configuration) {
-  return {
-    ...config,
-    plugins: [...config.plugins, new VueLoaderPlugin()],
-    module: {
-      ...config.module,
-      rules: [
-        ...config.module.rules,
-        {
-          test: /\.vue$/,
-          loader: require.resolve('vue-loader'),
-          options: {},
-        },
-      ],
-    },
-    resolve: {
-      ...config.resolve,
-      extensions: [...config.resolve.extensions, '.vue'],
-      alias: {
-        ...config.resolve.alias,
-        vue$: require.resolve('vue/dist/vue.esm.js'),
-      },
-    },
-  };
-}
-
-export function babelDefault(config: any) {
-  return {
-    ...config,
-    presets: [...config.presets, require.resolve('babel-preset-vue')],
-  };
-}

package/src/server/index.ts

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

package/src/server/options.ts

@@ -1,6 +0,0 @@
-const packageJson = require('../../package.json');
-
-export default {
-  packageJson,
-  frameworkPresets: [require.resolve('./framework-preset-vue.js')],
-};

package/src/typings.d.ts

@@ -1,6 +0,0 @@
-declare module '@storybook/core/*';
-declare module 'global';
-// todo check for correct types
-declare module 'webpack/lib/RuleSet';
-
-declare module 'vue-loader/lib/plugin';

package/tsconfig.json

@@ -1,14 +0,0 @@
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "rootDir": "./src",
-    "types": ["webpack-env"],
-    "resolveJsonModule": true
-  },
-  "include": [
-    "src/**/*"
-  ],
-  "exclude": [
-    "src/**/*.test.*"
-  ]
-}