@storybook/vue3 7.0.0-alpha.50 → 7.0.0-alpha.51

package/dist/config.d.ts

@@ -1,7 +1,7 @@
 import * as lib_docs_tools_dist from 'lib/docs-tools/dist';
 import * as lib_types_dist from 'lib/types/dist';
-import { V as VueRenderer } from './render-52740da1.js';
-export { r as render, a as renderToCanvas } from './render-52740da1.js';
+import { V as VueRenderer } from './render-913dae32.js';
+export { r as render, a as renderToCanvas } from './render-913dae32.js';
 import { LegacyStoryFn, DecoratorFunction } from '@storybook/types';
 import 'vue';
 

package/dist/index.d.ts

@@ -2,8 +2,8 @@ import * as _storybook_types from '@storybook/types';
 import { Addon_ClientStoryApi, Addon_Loadable, Args, ComponentAnnotations, AnnotatedStoryFn, ArgsStoryFn, ArgsFromMeta, StoryAnnotations, StrictArgs, DecoratorFunction, LoaderFunction, StoryContext as StoryContext$1 } from '@storybook/types';
 export { ArgTypes, Args, Parameters, StrictArgs } from '@storybook/types';
 import { App, ComponentOptions, FunctionalComponent, ConcreteComponent } from 'vue';
-import { V as VueRenderer } from './render-52740da1.js';
-export { V as VueRenderer, s as setup } from './render-52740da1.js';
+import { V as VueRenderer } from './render-913dae32.js';
+export { V as VueRenderer, s as setup } from './render-913dae32.js';
 import { Simplify, SetOptional } from 'type-fest';
 
 interface ClientApi extends Addon_ClientStoryApi<VueRenderer['storyResult']> {
@@ -23,25 +23,25 @@ declare const raw: ((...args: any[]) => never) | (() => _storybook_types.Store_B
  *
  * @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
  */
-declare type Meta<TCmpOrArgs = Args> = ComponentAnnotations<VueRenderer, ComponentPropsOrProps<TCmpOrArgs>>;
+type Meta<TCmpOrArgs = Args> = ComponentAnnotations<VueRenderer, ComponentPropsOrProps<TCmpOrArgs>>;
 /**
  * Story function that represents a CSFv2 component example.
  *
  * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
  */
-declare type StoryFn<TCmpOrArgs = Args> = AnnotatedStoryFn<VueRenderer, ComponentPropsOrProps<TCmpOrArgs>>;
+type StoryFn<TCmpOrArgs = Args> = AnnotatedStoryFn<VueRenderer, ComponentPropsOrProps<TCmpOrArgs>>;
 /**
  * Story function that represents a CSFv3 component example.
  *
  * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
  */
-declare type StoryObj<TMetaOrCmpOrArgs = Args> = TMetaOrCmpOrArgs extends {
+type StoryObj<TMetaOrCmpOrArgs = Args> = TMetaOrCmpOrArgs extends {
     render?: ArgsStoryFn<VueRenderer, any>;
     component?: infer Component;
     args?: infer DefaultArgs;
 } ? Simplify<ComponentProps<Component> & ArgsFromMeta<VueRenderer, TMetaOrCmpOrArgs>> extends infer TArgs ? StoryAnnotations<VueRenderer, TArgs, SetOptional<TArgs, Extract<keyof TArgs, keyof DefaultArgs>>> : never : StoryAnnotations<VueRenderer, ComponentPropsOrProps<TMetaOrCmpOrArgs>>;
-declare type ComponentProps<C> = C extends ComponentOptions<infer P> ? P : C extends FunctionalComponent<infer P> ? P : unknown;
-declare type ComponentPropsOrProps<TCmpOrArgs> = TCmpOrArgs extends ConcreteComponent<any> ? unknown extends ComponentProps<TCmpOrArgs> ? TCmpOrArgs : ComponentProps<TCmpOrArgs> : TCmpOrArgs;
+type ComponentProps<C> = C extends ComponentOptions<infer P> ? P : C extends FunctionalComponent<infer P> ? P : unknown;
+type ComponentPropsOrProps<TCmpOrArgs> = TCmpOrArgs extends ConcreteComponent<any> ? unknown extends ComponentProps<TCmpOrArgs> ? TCmpOrArgs : ComponentProps<TCmpOrArgs> : TCmpOrArgs;
 /**
  * @deprecated Use `StoryFn` instead.
  * Use `StoryObj` if you want to migrate to CSF3, which uses objects instead of functions to represent stories.
@@ -51,9 +51,9 @@ declare type ComponentPropsOrProps<TCmpOrArgs> = TCmpOrArgs extends ConcreteComp
  *
  * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
  */
-declare type Story<TArgs = Args> = StoryFn<TArgs>;
-declare type Decorator<TArgs = StrictArgs> = DecoratorFunction<VueRenderer, TArgs>;
-declare type Loader<TArgs = StrictArgs> = LoaderFunction<VueRenderer, TArgs>;
-declare type StoryContext<TArgs = StrictArgs> = StoryContext$1<VueRenderer, TArgs>;
+type Story<TArgs = Args> = StoryFn<TArgs>;
+type Decorator<TArgs = StrictArgs> = DecoratorFunction<VueRenderer, TArgs>;
+type Loader<TArgs = StrictArgs> = LoaderFunction<VueRenderer, TArgs>;
+type StoryContext<TArgs = StrictArgs> = StoryContext$1<VueRenderer, TArgs>;
 
 export { Decorator, Loader, Meta, Story, StoryContext, StoryFn, StoryObj, configure, forceReRender, raw, storiesOf };

package/dist/{render-52740da1.d.ts → render-913dae32.d.ts}

@@ -1,7 +1,7 @@
 import { WebRenderer, ArgsStoryFn, Store_RenderContext } from '@storybook/types';
 import { ConcreteComponent } from 'vue';
 
-declare type StoryFnVueReturnType = ConcreteComponent<any>;
+type StoryFnVueReturnType = ConcreteComponent<any>;
 interface VueRenderer extends WebRenderer {
     component: Omit<ConcreteComponent<this['T']>, 'props'>;
     storyResult: StoryFnVueReturnType;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/vue3",
-  "version": "7.0.0-alpha.50",
+  "version": "7.0.0-alpha.51",
   "description": "Storybook Vue 3 renderer",
   "keywords": [
     "storybook"
@@ -51,11 +51,11 @@
     "prep": "../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
-    "@storybook/addons": "7.0.0-alpha.50",
-    "@storybook/core-client": "7.0.0-alpha.50",
-    "@storybook/docs-tools": "7.0.0-alpha.50",
-    "@storybook/store": "7.0.0-alpha.50",
-    "@storybook/types": "7.0.0-alpha.50",
+    "@storybook/addons": "7.0.0-alpha.51",
+    "@storybook/core-client": "7.0.0-alpha.51",
+    "@storybook/docs-tools": "7.0.0-alpha.51",
+    "@storybook/store": "7.0.0-alpha.51",
+    "@storybook/types": "7.0.0-alpha.51",
     "global": "^4.4.0",
     "react": "16.14.0",
     "react-dom": "16.14.0",
@@ -64,8 +64,8 @@
   },
   "devDependencies": {
     "@digitak/esrun": "^3.2.2",
-    "@vue/vue3-jest": "28",
-    "typescript": "~4.6.3",
+    "@vue/vue3-jest": "29",
+    "typescript": "^4.9.3",
     "vue": "^3.2.41",
     "vue-tsc": "^1.0.8"
   },
@@ -92,5 +92,5 @@
     ],
     "platform": "browser"
   },
-  "gitHead": "77184d039091f4782dc4540df6d271a24fb3e242"
+  "gitHead": "4fec76c3f5135854d9834ebc1cf2f1f325696ded"
 }

package/template/cli/Button.stories.js

@@ -1,27 +1,10 @@
 import MyButton from './Button.vue';
 
-// More on default export: https://storybook.js.org/docs/vue/writing-stories/introduction#default-export
+// More on how to set up stories at: https://storybook.js.org/docs/7.0/vue/writing-stories/introduction
 export default {
   title: 'Example/Button',
   component: MyButton,
-  // This component will have an automatically generated docsPage entry: https://storybook.js.org/docs/vue/writing-docs/docs-page
   tags: ['docsPage'],
-  // More on component templates: https://storybook.js.org/docs/vue/writing-stories/introduction#using-args
-  render: (args) => ({
-    // Components used in your story `template` are defined in the `components` object
-    components: {
-      MyButton,
-    },
-    // The story's `args` need to be mapped into the template through the `setup()` method
-    setup() {
-      return {
-        args,
-      };
-    },
-    // And then the `args` are bound to your component with `v-bind="args"`
-    template: '<my-button v-bind="args" />',
-  }),
-  // More on argTypes: https://storybook.js.org/docs/vue/api/argtypes
   argTypes: {
     backgroundColor: {
       control: 'color',
@@ -36,6 +19,7 @@ export default {
   },
 };
 
+// More on writing stories with args: https://storybook.js.org/docs/7.0/vue/writing-stories/args
 export const Primary = {
   args: {
     primary: true,

package/template/cli/Header.stories.js

@@ -3,7 +3,7 @@ import MyHeader from './Header.vue';
 export default {
   title: 'Example/Header',
   component: MyHeader,
-  // This component will have an automatically generated docsPage entry: https://storybook.js.org/docs/vue/writing-docs/docs-page
+  // This component will have an automatically generated docsPage entry: https://storybook.js.org/docs/7.0/vue/writing-docs/docs-page
   tags: ['docsPage'],
   render: (args) => ({
     // Components used in your story `template` are defined in the `components` object
@@ -21,7 +21,7 @@ export default {
     template: '<my-header :user="user" />',
   }),
   parameters: {
-    // More on Story layout: https://storybook.js.org/docs/vue/configure/story-layout
+    // More on how to position stories at: https://storybook.js.org/docs/7.0/vue/configure/story-layout
     layout: 'fullscreen',
   },
 };

package/template/cli/Page.stories.js

@@ -4,21 +4,15 @@ import MyPage from './Page.vue';
 export default {
   title: 'Example/Page',
   component: MyPage,
-  render: () => ({
-    // Components used in your story `template` are defined in the `components` object
-    components: { MyPage },
-    // Here we define the `template`
-    template: '<my-page />',
-  }),
   parameters: {
-    // More on Story layout: https://storybook.js.org/docs/vue/configure/story-layout
+    // More on how to position stories at: https://storybook.js.org/docs/7.0/vue/configure/story-layout
     layout: 'fullscreen',
   },
 };
 
 export const LoggedOut = {};
 
-// More on interaction testing: https://storybook.js.org/docs/vue/writing-tests/interaction-testing
+// More on interaction testing: https://storybook.js.org/docs/7.0/vue/writing-tests/interaction-testing
 export const LoggedIn = {
   render: () => ({
     components: {