@storybook/vue3 6.5.9 → 7.0.0-alpha.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (107) hide show
  1. package/README.md +1 -43
  2. package/dist/chunk-5QBITULU.mjs +4 -0
  3. package/dist/config.d.ts +23 -0
  4. package/dist/config.js +4 -0
  5. package/dist/config.mjs +1 -0
  6. package/dist/index.d.ts +61 -0
  7. package/dist/index.js +4 -0
  8. package/dist/index.mjs +1 -0
  9. package/dist/render-ea26216d.d.ts +23 -0
  10. package/package.json +35 -39
  11. package/preview.js +1 -0
  12. package/bin/build.js +0 -4
  13. package/bin/index.js +0 -3
  14. package/dist/cjs/client/docs/config.js +0 -24
  15. package/dist/cjs/client/docs/extractArgTypes.js +0 -62
  16. package/dist/cjs/client/docs/prepareForInline.js +0 -61
  17. package/dist/cjs/client/index.js +0 -103
  18. package/dist/cjs/client/preview/config.js +0 -33
  19. package/dist/cjs/client/preview/decorateStory.js +0 -75
  20. package/dist/cjs/client/preview/globals.js +0 -9
  21. package/dist/cjs/client/preview/index.js +0 -62
  22. package/dist/cjs/client/preview/render.js +0 -82
  23. package/dist/cjs/client/preview/types-6-0.js +0 -5
  24. package/dist/cjs/client/preview/types-7-0.js +0 -5
  25. package/dist/cjs/client/preview/types.js +0 -5
  26. package/dist/cjs/server/build.js +0 -9
  27. package/dist/cjs/server/framework-preset-vue3-docs.js +0 -50
  28. package/dist/cjs/server/framework-preset-vue3.js +0 -66
  29. package/dist/cjs/server/index.js +0 -9
  30. package/dist/cjs/server/options.js +0 -17
  31. package/dist/cjs/server/preset.js +0 -8
  32. package/dist/esm/client/docs/config.js +0 -12
  33. package/dist/esm/client/docs/extractArgTypes.js +0 -45
  34. package/dist/esm/client/docs/prepareForInline.js +0 -22
  35. package/dist/esm/client/index.js +0 -6
  36. package/dist/esm/client/preview/config.js +0 -5
  37. package/dist/esm/client/preview/decorateStory.js +0 -64
  38. package/dist/esm/client/preview/globals.js +0 -4
  39. package/dist/esm/client/preview/index.js +0 -38
  40. package/dist/esm/client/preview/render.js +0 -60
  41. package/dist/esm/client/preview/types-6-0.js +0 -1
  42. package/dist/esm/client/preview/types-7-0.js +0 -1
  43. package/dist/esm/client/preview/types.js +0 -1
  44. package/dist/esm/server/build.js +0 -3
  45. package/dist/esm/server/framework-preset-vue3-docs.js +0 -37
  46. package/dist/esm/server/framework-preset-vue3.js +0 -52
  47. package/dist/esm/server/index.js +0 -3
  48. package/dist/esm/server/options.js +0 -8
  49. package/dist/esm/server/preset.js +0 -1
  50. package/dist/modern/client/docs/config.js +0 -12
  51. package/dist/modern/client/docs/extractArgTypes.js +0 -42
  52. package/dist/modern/client/docs/prepareForInline.js +0 -22
  53. package/dist/modern/client/index.js +0 -6
  54. package/dist/modern/client/preview/config.js +0 -5
  55. package/dist/modern/client/preview/decorateStory.js +0 -59
  56. package/dist/modern/client/preview/globals.js +0 -6
  57. package/dist/modern/client/preview/index.js +0 -38
  58. package/dist/modern/client/preview/render.js +0 -60
  59. package/dist/modern/client/preview/types-6-0.js +0 -1
  60. package/dist/modern/client/preview/types-7-0.js +0 -1
  61. package/dist/modern/client/preview/types.js +0 -1
  62. package/dist/modern/server/build.js +0 -3
  63. package/dist/modern/server/framework-preset-vue3-docs.js +0 -37
  64. package/dist/modern/server/framework-preset-vue3.js +0 -52
  65. package/dist/modern/server/index.js +0 -3
  66. package/dist/modern/server/options.js +0 -8
  67. package/dist/modern/server/preset.js +0 -1
  68. package/dist/ts3.4/client/docs/config.d.ts +0 -10
  69. package/dist/ts3.4/client/docs/extractArgTypes.d.ts +0 -2
  70. package/dist/ts3.4/client/docs/prepareForInline.d.ts +0 -4
  71. package/dist/ts3.4/client/index.d.ts +0 -2
  72. package/dist/ts3.4/client/preview/config.d.ts +0 -5
  73. package/dist/ts3.4/client/preview/decorateStory.d.ts +0 -3
  74. package/dist/ts3.4/client/preview/globals.d.ts +0 -1
  75. package/dist/ts3.4/client/preview/index.d.ts +0 -31
  76. package/dist/ts3.4/client/preview/render.d.ts +0 -7
  77. package/dist/ts3.4/client/preview/types-6-0.d.ts +0 -35
  78. package/dist/ts3.4/client/preview/types-7-0.d.ts +0 -9
  79. package/dist/ts3.4/client/preview/types.d.ts +0 -15
  80. package/dist/ts3.4/server/build.d.ts +0 -1
  81. package/dist/ts3.4/server/framework-preset-vue3-docs.d.ts +0 -3
  82. package/dist/ts3.4/server/framework-preset-vue3.d.ts +0 -4
  83. package/dist/ts3.4/server/index.d.ts +0 -1
  84. package/dist/ts3.4/server/options.d.ts +0 -3
  85. package/dist/ts3.4/server/preset.d.ts +0 -2
  86. package/dist/ts3.9/client/docs/config.d.ts +0 -10
  87. package/dist/ts3.9/client/docs/extractArgTypes.d.ts +0 -2
  88. package/dist/ts3.9/client/docs/prepareForInline.d.ts +0 -4
  89. package/dist/ts3.9/client/index.d.ts +0 -2
  90. package/dist/ts3.9/client/preview/config.d.ts +0 -5
  91. package/dist/ts3.9/client/preview/decorateStory.d.ts +0 -3
  92. package/dist/ts3.9/client/preview/globals.d.ts +0 -1
  93. package/dist/ts3.9/client/preview/index.d.ts +0 -31
  94. package/dist/ts3.9/client/preview/render.d.ts +0 -7
  95. package/dist/ts3.9/client/preview/types-6-0.d.ts +0 -35
  96. package/dist/ts3.9/client/preview/types-7-0.d.ts +0 -9
  97. package/dist/ts3.9/client/preview/types.d.ts +0 -15
  98. package/dist/ts3.9/server/build.d.ts +0 -1
  99. package/dist/ts3.9/server/framework-preset-vue3-docs.d.ts +0 -3
  100. package/dist/ts3.9/server/framework-preset-vue3.d.ts +0 -4
  101. package/dist/ts3.9/server/index.d.ts +0 -1
  102. package/dist/ts3.9/server/options.d.ts +0 -3
  103. package/dist/ts3.9/server/preset.d.ts +0 -2
  104. package/preset.js +0 -1
  105. package/standalone.js +0 -8
  106. package/types-6-0.d.ts +0 -1
  107. package/types-7-0.d.ts +0 -1
package/README.md CHANGED
@@ -1,43 +1 @@
1
- # Storybook for Vue 3
2
-
3
- Storybook for Vue 3 is a UI development environment for your Vue 3 components.
4
- With it, you can visualize different states of your UI components and develop them interactively.
5
-
6
- ![Storybook Screenshot](https://github.com/storybookjs/storybook/blob/main/media/storybook-intro.gif)
7
-
8
- Storybook runs outside of your app.
9
- So you can develop UI components in isolation without worrying about app specific dependencies and requirements.
10
-
11
- ## Getting Started
12
-
13
- ```sh
14
- cd my-vue3-app
15
- npx sb init
16
- ```
17
-
18
- For more information visit: [storybook.js.org](https://storybook.js.org)
19
-
20
- ---
21
-
22
- Storybook also comes with a lot of [addons](https://storybook.js.org/addons) and a great API to customize as you wish.
23
- You can also build a [static version](https://storybook.js.org/docs/vue/sharing/publish-storybook) of your Storybook and deploy it anywhere you want.
24
-
25
- ## Extending the Vue application
26
-
27
- Storybook creates a [Vue 3 application](https://v3.vuejs.org/api/application-api.html#application-api) for your component preview which can be imported as `import { app } from '@storybook/vue3'`.
28
-
29
- When using global custom components (`app.component`), directives (`app.directive`), extensions (`app.use`), or other application methods, you will need to configure those in the `./storybook/preview.js` file.
30
-
31
- For example:
32
-
33
- ```js
34
- // .storybook/preview.js
35
-
36
- import { app } from '@storybook/vue3';
37
-
38
- app.use(MyPlugin);
39
- app.component('my-component', MyComponent);
40
- app.mixin({
41
- /* My mixin */
42
- });
43
- ```
1
+ # Storybook Vue3 renderer
@@ -0,0 +1,4 @@
1
+ var l=Object.defineProperty,w=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var y=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable;var d=(t,r,e)=>r in t?l(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,c=(t,r)=>{for(var e in r||(r={}))M.call(r,e)&&d(t,e,r[e]);if(y)for(var e of y(r))U.call(r,e)&&d(t,e,r[e]);return t},a=(t,r)=>w(t,C(r)),p=(t,r)=>l(t,"name",{value:r,configurable:!0});import{h as z}from"vue";import{sanitizeStoryContextUpdate as A}from"@storybook/store";function D(t){return typeof t=="function"?{render:t,name:t.name}:t}p(D,"normalizeFunctionalComponent");function h(t,r){let e=t;return e==null?null:r?a(c({},D(e)),{components:a(c({},e.components||{}),{story:r})}):{render(){return z(e)}}}p(h,"prepare");function O(t,r){return r.reduce((e,u)=>i=>{let n,o=u(m=>(n=e(c(c({},i),A(m))),n),i);return n||(n=e(i)),o===n?n:h(o,n)},e=>h(t(e)))}p(O,"decorateStory");import F from"ts-dedent";import{createApp as S,h as g}from"vue";var v=p((t,r)=>{let{id:e,component:u}=r;if(!u)throw new Error(`Unable to render story ${e} as the component annotation is missing from the default export`);return g(u,t)},"render"),x=p(t=>{},"setupFunction"),B=p(t=>{x=t},"setup"),f=new Map;function G({title:t,name:r,storyFn:e,showMain:u,showError:i,showException:n},o){let m,s=S({unmounted(){f.delete(o)},render(){return f.set(o,s),x(s),g(m)}});if(s.config.errorHandler=n,m=e(),!m){i({title:`Expecting a Vue component from the story: "${r}" of "${t}".`,description:F`
2
+ Did you forget to return the Vue component from the story?
3
+ Use "() => ({ template: '<my-comp></my-comp>' })" or "() => ({ components: MyComp, template: '<my-comp></my-comp>' })" when defining the story.
4
+ `});return}u(),f.has(o)&&f.get(o).unmount(o),s.mount(o)}p(G,"renderToDOM");export{c as a,p as b,O as c,v as d,B as e,G as f};
@@ -0,0 +1,23 @@
1
+ import * as lib_docs_tools_dist_types from 'lib/docs-tools/dist/types';
2
+ import * as lib_addons_dist_types from 'lib/addons/dist/types';
3
+ import * as _storybook_csf from '@storybook/csf';
4
+ import { LegacyStoryFn, DecoratorFunction } from '@storybook/csf';
5
+ import { V as VueFramework } from './render-ea26216d.js';
6
+ export { r as render, a as renderToDOM } from './render-ea26216d.js';
7
+ import '@storybook/store';
8
+ import 'vue';
9
+
10
+ declare const argTypesEnhancers: (<TFramework extends _storybook_csf.AnyFramework>(context: _storybook_csf.StoryContextForEnhancers<TFramework, _storybook_csf.Args>) => _storybook_csf.StrictArgTypes<_storybook_csf.Args> | lib_addons_dist_types.Parameters)[];
11
+
12
+ declare function decorateStory(storyFn: LegacyStoryFn<VueFramework>, decorators: DecoratorFunction<VueFramework>[]): LegacyStoryFn<VueFramework>;
13
+
14
+ declare const parameters: {
15
+ docs: {
16
+ inlineStories: boolean;
17
+ extractArgTypes: lib_docs_tools_dist_types.ArgTypesExtractor;
18
+ extractComponentDescription: typeof lib_docs_tools_dist_types.extractComponentDescription;
19
+ };
20
+ framework: "vue3";
21
+ };
22
+
23
+ export { decorateStory as applyDecorators, argTypesEnhancers, parameters };
package/dist/config.js ADDED
@@ -0,0 +1,4 @@
1
+ var P=Object.create;var i=Object.defineProperty,q=Object.defineProperties,H=Object.getOwnPropertyDescriptor,I=Object.getOwnPropertyDescriptors,N=Object.getOwnPropertyNames,g=Object.getOwnPropertySymbols,j=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty,B=Object.prototype.propertyIsEnumerable;var T=(r,e,t)=>e in r?i(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,c=(r,e)=>{for(var t in e||(e={}))C.call(e,t)&&T(r,t,e[t]);if(g)for(var t of g(e))B.call(e,t)&&T(r,t,e[t]);return r},x=(r,e)=>q(r,I(e)),a=(r,e)=>i(r,"name",{value:e,configurable:!0});var G=(r,e)=>{for(var t in e)i(r,t,{get:e[t],enumerable:!0})},S=(r,e,t,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of N(e))!C.call(r,o)&&o!==t&&i(r,o,{get:()=>e[o],enumerable:!(s=H(e,o))||s.enumerable});return r};var J=(r,e,t)=>(t=r!=null?P(j(r)):{},S(e||!r||!r.__esModule?i(t,"default",{value:r,enumerable:!0}):t,r)),K=r=>S(i({},"__esModule",{value:!0}),r);var X={};G(X,{applyDecorators:()=>$,argTypesEnhancers:()=>A,parameters:()=>W,render:()=>v,renderToDOM:()=>M});module.exports=K(X);var l=require("@storybook/docs-tools");var f=require("@storybook/docs-tools"),L=["props","events","slots","methods"],D=a(r=>{if(!(0,f.hasDocgen)(r))return null;let e={};return L.forEach(t=>{(0,f.extractComponentProps)(r,t).forEach(({propDef:o,docgenInfo:n,jsDocTags:p})=>{let{name:m,type:u,description:k,defaultValue:z,required:E}=o,F=t==="props"?(0,f.convert)(n):{name:"void"};e[m]={name:m,description:k,type:c({required:E},F),table:{type:u,jsDocTags:p,defaultValue:z,category:t}}})}),e},"extractArgTypes");var w={docs:{inlineStories:!0,extractArgTypes:D,extractComponentDescription:l.extractComponentDescription}},A=[l.enhanceArgTypes];var b=J(require("ts-dedent")),y=require("vue"),v=a((r,e)=>{let{id:t,component:s}=e;if(!s)throw new Error(`Unable to render story ${t} as the component annotation is missing from the default export`);return(0,y.h)(s,r)},"render"),Q=a(r=>{},"setupFunction");var h=new Map;function M({title:r,name:e,storyFn:t,showMain:s,showError:o,showException:n},p){let m,u=(0,y.createApp)({unmounted(){h.delete(p)},render(){return h.set(p,u),Q(u),(0,y.h)(m)}});if(u.config.errorHandler=n,m=t(),!m){o({title:`Expecting a Vue component from the story: "${e}" of "${r}".`,description:b.default`
2
+ Did you forget to return the Vue component from the story?
3
+ Use "() => ({ template: '<my-comp></my-comp>' })" or "() => ({ components: MyComp, template: '<my-comp></my-comp>' })" when defining the story.
4
+ `});return}s(),h.has(p)&&h.get(p).unmount(p),u.mount(p)}a(M,"renderToDOM");var O=require("vue"),U=require("@storybook/store");function R(r){return typeof r=="function"?{render:r,name:r.name}:r}a(R,"normalizeFunctionalComponent");function V(r,e){let t=r;return t==null?null:e?x(c({},R(t)),{components:x(c({},t.components||{}),{story:e})}):{render(){return(0,O.h)(t)}}}a(V,"prepare");function $(r,e){return e.reduce((t,s)=>o=>{let n,p=s(m=>(n=t(c(c({},o),(0,U.sanitizeStoryContextUpdate)(m))),n),o);return n||(n=t(o)),p===n?n:V(p,n)},t=>V(r(t)))}a($,"decorateStory");var W=c({framework:"vue3"},w);0&&(module.exports={applyDecorators,argTypesEnhancers,parameters,render,renderToDOM});
@@ -0,0 +1 @@
1
+ import{a as r,b as a,c as g,d as h,f as E}from"./chunk-5QBITULU.mjs";import{extractComponentDescription as C,enhanceArgTypes as b}from"@storybook/docs-tools";import{hasDocgen as S,extractComponentProps as v,convert as D}from"@storybook/docs-tools";var A=["props","events","slots","methods"],c=a(o=>{if(!S(o))return null;let t={};return A.forEach(e=>{v(o,e).forEach(({propDef:f,docgenInfo:u,jsDocTags:d})=>{let{name:s,type:i,description:l,defaultValue:y,required:x}=f,T=e==="props"?D(u):{name:"void"};t[s]={name:s,description:l,type:r({required:x},T),table:{type:i,jsDocTags:d,defaultValue:y,category:e}}})}),t},"extractArgTypes");var m={docs:{inlineStories:!0,extractArgTypes:c,extractComponentDescription:C}},O=[b];var N=r({framework:"vue3"},m);export{g as applyDecorators,O as argTypesEnhancers,N as parameters,h as render,E as renderToDOM};
@@ -0,0 +1,61 @@
1
+ import * as lib_store_dist_types from 'lib/store/dist/types';
2
+ import * as lib_client_api_dist_types_ClientApi from 'lib/client-api/dist/types/ClientApi';
3
+ import * as _storybook_csf from '@storybook/csf';
4
+ import { Args, ComponentAnnotations, AnnotatedStoryFn, StoryAnnotations } from '@storybook/csf';
5
+ export { ArgTypes, Args, Parameters, StoryContext } from '@storybook/csf';
6
+ import * as _storybook_addons from '@storybook/addons';
7
+ import { ClientStoryApi, Loadable } from '@storybook/addons';
8
+ import { App } from 'vue';
9
+ import { V as VueFramework, I as IStorybookSection } from './render-ea26216d.js';
10
+ export { s as setup } from './render-ea26216d.js';
11
+ import '@storybook/store';
12
+
13
+ interface ClientApi extends ClientStoryApi<VueFramework['storyResult']> {
14
+ setAddon(addon: any): void;
15
+ configure(loader: Loadable, module: NodeModule): void;
16
+ getStorybook(): IStorybookSection[];
17
+ clearDecorators(): void;
18
+ forceReRender(): void;
19
+ raw: () => any;
20
+ load: (...args: any[]) => void;
21
+ app: App;
22
+ }
23
+ declare const storiesOf: ClientApi['storiesOf'];
24
+ declare const configure: ClientApi['configure'];
25
+ declare const addDecorator: (() => never) | ((decorator: _storybook_csf.DecoratorFunction<VueFramework, _storybook_addons.Args>) => void);
26
+ declare const addParameters: (() => never) | (({ globals, globalTypes, ...parameters }: _storybook_csf.Parameters & {
27
+ globals?: _storybook_csf.Globals;
28
+ globalTypes?: _storybook_csf.GlobalTypes;
29
+ }) => void);
30
+ declare const clearDecorators: (() => never) | (() => void);
31
+ declare const setAddon: (() => never) | ((addon: any) => void);
32
+ declare const forceReRender: (() => never) | (() => void);
33
+ declare const getStorybook: (() => never) | (() => lib_client_api_dist_types_ClientApi.GetStorybookKind<VueFramework>[]);
34
+ declare const raw: (() => never) | (() => lib_store_dist_types.BoundStory<VueFramework>[]);
35
+
36
+ /**
37
+ * Metadata to configure the stories for a component.
38
+ *
39
+ * @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
40
+ */
41
+ declare type Meta<TArgs = Args> = ComponentAnnotations<VueFramework, TArgs>;
42
+ /**
43
+ * Story function that represents a CSFv2 component example.
44
+ *
45
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
46
+ */
47
+ declare type StoryFn<TArgs = Args> = AnnotatedStoryFn<VueFramework, TArgs>;
48
+ /**
49
+ * Story function that represents a CSFv3 component example.
50
+ *
51
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
52
+ */
53
+ declare type StoryObj<TArgs = Args> = StoryAnnotations<VueFramework, TArgs>;
54
+ /**
55
+ * Story function that represents a CSFv3 component example.
56
+ *
57
+ * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
58
+ */
59
+ declare type Story<TArgs = Args> = StoryObj<TArgs>;
60
+
61
+ export { Meta, Story, StoryFn, StoryObj, addDecorator, addParameters, clearDecorators, configure, forceReRender, getStorybook, raw, setAddon, storiesOf };
package/dist/index.js ADDED
@@ -0,0 +1,4 @@
1
+ var v=Object.create;var m=Object.defineProperty,z=Object.defineProperties,B=Object.getOwnPropertyDescriptor,P=Object.getOwnPropertyDescriptors,W=Object.getOwnPropertyNames,A=Object.getOwnPropertySymbols,Y=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var h=(t,e,o)=>e in t?m(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,a=(t,e)=>{for(var o in e||(e={}))g.call(e,o)&&h(t,o,e[o]);if(A)for(var o of A(e))E.call(e,o)&&h(t,o,e[o]);return t},x=(t,e)=>z(t,P(e)),r=(t,e)=>m(t,"name",{value:e,configurable:!0});var H=(t,e)=>{for(var o in e)m(t,o,{get:e[o],enumerable:!0})},O=(t,e,o,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of W(e))!g.call(t,n)&&n!==o&&m(t,n,{get:()=>e[n],enumerable:!(p=B(e,n))||p.enumerable});return t};var w=(t,e,o)=>(o=t!=null?v(Y(t)):{},O(e||!t||!t.__esModule?m(o,"default",{value:t,enumerable:!0}):o,t)),L=t=>O(m({},"__esModule",{value:!0}),t);var et={};H(et,{addDecorator:()=>G,addParameters:()=>I,clearDecorators:()=>J,configure:()=>q,forceReRender:()=>X,getStorybook:()=>Z,raw:()=>tt,setAddon:()=>Q,setup:()=>K,storiesOf:()=>j});module.exports=L(et);var S=w(require("global")),{window:R}=S.default;R.STORYBOOK_REACT_CLASSES={};R.STORYBOOK_ENV="vue3";var V=require("@storybook/core-client");var b=require("vue"),D=require("@storybook/store");function N(t){return typeof t=="function"?{render:t,name:t.name}:t}r(N,"normalizeFunctionalComponent");function C(t,e){let o=t;return o==null?null:e?x(a({},N(o)),{components:x(a({},o.components||{}),{story:e})}):{render(){return(0,b.h)(o)}}}r(C,"prepare");function M(t,e){return e.reduce((o,p)=>n=>{let i,c=p(u=>(i=o(a(a({},n),(0,D.sanitizeStoryContextUpdate)(u))),i),n);return i||(i=o(n)),c===i?i:C(c,i)},o=>C(t(o)))}r(M,"decorateStory");var T=w(require("ts-dedent")),d=require("vue"),k=r((t,e)=>{let{id:o,component:p}=e;if(!p)throw new Error(`Unable to render story ${o} as the component annotation is missing from the default export`);return(0,d.h)(p,t)},"render"),F=r(t=>{},"setupFunction"),K=r(t=>{F=t},"setup"),y=new Map;function U({title:t,name:e,storyFn:o,showMain:p,showError:n,showException:i},c){let u,l=(0,d.createApp)({unmounted(){y.delete(c)},render(){return y.set(c,l),F(l),(0,d.h)(u)}});if(l.config.errorHandler=i,u=o(),!u){n({title:`Expecting a Vue component from the story: "${e}" of "${t}".`,description:T.default`
2
+ Did you forget to return the Vue component from the story?
3
+ Use "() => ({ template: '<my-comp></my-comp>' })" or "() => ({ components: MyComp, template: '<my-comp></my-comp>' })" when defining the story.
4
+ `});return}p(),y.has(c)&&y.get(c).unmount(c),l.mount(c)}r(U,"renderToDOM");var _="vue3",s=(0,V.start)(U,{decorateStory:M,render:k}),j=r((t,e)=>s.clientApi.storiesOf(t,e).addParameters({framework:_}),"storiesOf"),q=r((...t)=>s.configure(_,...t),"configure"),{addDecorator:G}=s.clientApi,{addParameters:I}=s.clientApi,{clearDecorators:J}=s.clientApi,{setAddon:Q}=s.clientApi,{forceReRender:X}=s,{getStorybook:Z}=s.clientApi,{raw:tt}=s.clientApi;var $;($=module==null?void 0:module.hot)==null||$.decline();0&&(module.exports={addDecorator,addParameters,clearDecorators,configure,forceReRender,getStorybook,raw,setAddon,setup,storiesOf});
package/dist/index.mjs ADDED
@@ -0,0 +1 @@
1
+ import{b as t,c,d as i,e as l,f as p}from"./chunk-5QBITULU.mjs";import f from"global";var{window:s}=f;s.STORYBOOK_REACT_CLASSES={};s.STORYBOOK_ENV="vue3";import{start as x}from"@storybook/core-client";var a="vue3",o=x(p,{decorateStory:c,render:i}),S=t((r,m)=>o.clientApi.storiesOf(r,m).addParameters({framework:a}),"storiesOf"),g=t((...r)=>o.configure(a,...r),"configure"),{addDecorator:w}=o.clientApi,{addParameters:E}=o.clientApi,{clearDecorators:T}=o.clientApi,{setAddon:b}=o.clientApi,{forceReRender:D}=o,{getStorybook:K}=o.clientApi,{raw:_}=o.clientApi;var d;(d=module==null?void 0:module.hot)==null||d.decline();export{w as addDecorator,E as addParameters,T as clearDecorators,g as configure,D as forceReRender,K as getStorybook,_ as raw,b as setAddon,l as setup,S as storiesOf};
@@ -0,0 +1,23 @@
1
+ import { RenderContext } from '@storybook/store';
2
+ import { ArgsStoryFn } from '@storybook/csf';
3
+ import { ConcreteComponent } from 'vue';
4
+
5
+ declare type StoryFnVueReturnType = ConcreteComponent<any>;
6
+ interface IStorybookStory {
7
+ name: string;
8
+ render: (context: any) => any;
9
+ }
10
+ interface IStorybookSection {
11
+ kind: string;
12
+ stories: IStorybookStory[];
13
+ }
14
+ declare type VueFramework = {
15
+ component: ConcreteComponent<any>;
16
+ storyResult: StoryFnVueReturnType;
17
+ };
18
+
19
+ declare const render: ArgsStoryFn<VueFramework>;
20
+ declare const setup: (fn: (app: any) => void) => void;
21
+ declare function renderToDOM({ title, name, storyFn, showMain, showError, showException }: RenderContext<VueFramework>, domElement: Element): void;
22
+
23
+ export { IStorybookSection as I, VueFramework as V, renderToDOM as a, render as r, setup as s };
package/package.json CHANGED
@@ -1,39 +1,44 @@
1
1
  {
2
2
  "name": "@storybook/vue3",
3
- "version": "6.5.9",
4
- "description": "Storybook for Vue 3: Develop Vue 3 Components in isolation with Hot Reloading.",
3
+ "version": "7.0.0-alpha.10",
4
+ "description": "Storybook Vue 3 renderer",
5
5
  "keywords": [
6
6
  "storybook"
7
7
  ],
8
- "homepage": "https://github.com/storybookjs/storybook/tree/main/app/vue3",
8
+ "homepage": "https://github.com/storybookjs/storybook/tree/main/renderers/vue3",
9
9
  "bugs": {
10
10
  "url": "https://github.com/storybookjs/storybook/issues"
11
11
  },
12
12
  "repository": {
13
13
  "type": "git",
14
14
  "url": "https://github.com/storybookjs/storybook.git",
15
- "directory": "app/vue3"
15
+ "directory": "renderers/vue3"
16
16
  },
17
17
  "funding": {
18
18
  "type": "opencollective",
19
19
  "url": "https://opencollective.com/storybook"
20
20
  },
21
21
  "license": "MIT",
22
- "main": "dist/cjs/client/index.js",
23
- "module": "dist/esm/client/index.js",
24
- "types": "dist/ts3.9/client/index.d.ts",
25
- "typesVersions": {
26
- "<3.8": {
27
- "dist/ts3.9/*": [
28
- "dist/ts3.4/*"
29
- ]
22
+ "exports": {
23
+ ".": {
24
+ "require": "./dist/index.js",
25
+ "import": "./dist/index.mjs",
26
+ "types": "./dist/index.d.ts"
27
+ },
28
+ "./preview": {
29
+ "require": "./dist/config.js",
30
+ "import": "./dist/config.mjs",
31
+ "types": "./dist/config.d.ts"
32
+ },
33
+ "./package.json": {
34
+ "require": "./package.json",
35
+ "import": "./package.json",
36
+ "types": "./package.json"
30
37
  }
31
38
  },
32
- "bin": {
33
- "build-storybook": "./bin/build.js",
34
- "start-storybook": "./bin/index.js",
35
- "storybook-server": "./bin/index.js"
36
- },
39
+ "main": "dist/index.js",
40
+ "module": "dist/index.mjs",
41
+ "types": "dist/index.d.ts",
37
42
  "files": [
38
43
  "bin/**/*",
39
44
  "dist/**/*",
@@ -42,38 +47,26 @@
42
47
  "*.d.ts"
43
48
  ],
44
49
  "scripts": {
45
- "prepare": "node ../../scripts/prepare.js"
50
+ "prepare": "esrun ../../scripts/prepare/bundle.ts"
46
51
  },
47
52
  "dependencies": {
48
- "@storybook/addons": "6.5.9",
49
- "@storybook/core": "6.5.9",
50
- "@storybook/core-common": "6.5.9",
53
+ "@storybook/addons": "7.0.0-alpha.10",
54
+ "@storybook/core-client": "7.0.0-alpha.10",
51
55
  "@storybook/csf": "0.0.2--canary.4566f4d.1",
52
- "@storybook/docs-tools": "6.5.9",
53
- "@storybook/store": "6.5.9",
54
- "@types/node": "^14.14.20 || ^16.0.0",
55
- "@types/webpack-env": "^1.16.0",
56
+ "@storybook/docs-tools": "7.0.0-alpha.10",
57
+ "@storybook/store": "7.0.0-alpha.10",
56
58
  "core-js": "^3.8.2",
57
59
  "global": "^4.4.0",
58
60
  "react": "16.14.0",
59
61
  "react-dom": "16.14.0",
60
- "read-pkg-up": "^7.0.1",
61
- "regenerator-runtime": "^0.13.7",
62
- "ts-dedent": "^2.0.0",
63
- "ts-loader": "^8.0.14",
64
- "vue-docgen-api": "^4.44.15",
65
- "vue-docgen-loader": "^1.5.0",
66
- "vue-loader": "^16.4.1",
67
- "webpack": ">=4.0.0 <6.0.0"
62
+ "ts-dedent": "^2.0.0"
68
63
  },
69
64
  "devDependencies": {
70
- "@vue/compiler-sfc": "3.0.0",
71
- "vue": "3.0.0",
72
- "webpack": "4"
65
+ "@digitak/esrun": "^3.2.2",
66
+ "vue": "3.0.0"
73
67
  },
74
68
  "peerDependencies": {
75
69
  "@babel/core": "*",
76
- "@vue/compiler-sfc": "^3.0.0",
77
70
  "babel-loader": "^7.0.0 || ^8.0.0",
78
71
  "vue": "^3.0.0"
79
72
  },
@@ -83,6 +76,9 @@
83
76
  "publishConfig": {
84
77
  "access": "public"
85
78
  },
86
- "gitHead": "e2673f765722cbb542ef1b5cf8d533c8e746a127",
87
- "sbmodern": "dist/modern/client/index.js"
79
+ "bundlerEntrypoint": [
80
+ "./src/index.ts",
81
+ "./src/config.ts"
82
+ ],
83
+ "gitHead": "b13dd8fb52819d73d4983148af8ffc5d683e8b75"
88
84
  }
package/preview.js ADDED
@@ -0,0 +1 @@
1
+ export * from './dist/config';
package/bin/build.js DELETED
@@ -1,4 +0,0 @@
1
- #!/usr/bin/env node
2
-
3
- process.env.NODE_ENV = process.env.NODE_ENV || 'production';
4
- require('../dist/cjs/server/build');
package/bin/index.js DELETED
@@ -1,3 +0,0 @@
1
- #!/usr/bin/env node
2
-
3
- require('../dist/cjs/server');
@@ -1,24 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.parameters = exports.argTypesEnhancers = void 0;
7
-
8
- var _docsTools = require("@storybook/docs-tools");
9
-
10
- var _extractArgTypes = require("./extractArgTypes");
11
-
12
- var _prepareForInline = require("./prepareForInline");
13
-
14
- var parameters = {
15
- docs: {
16
- inlineStories: true,
17
- prepareForInline: _prepareForInline.prepareForInline,
18
- extractArgTypes: _extractArgTypes.extractArgTypes,
19
- extractComponentDescription: _docsTools.extractComponentDescription
20
- }
21
- };
22
- exports.parameters = parameters;
23
- var argTypesEnhancers = [_docsTools.enhanceArgTypes];
24
- exports.argTypesEnhancers = argTypesEnhancers;
@@ -1,62 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.extractArgTypes = void 0;
7
-
8
- require("core-js/modules/es.object.to-string.js");
9
-
10
- require("core-js/modules/web.dom-collections.for-each.js");
11
-
12
- require("core-js/modules/es.function.name.js");
13
-
14
- require("core-js/modules/es.symbol.js");
15
-
16
- require("core-js/modules/es.symbol.description.js");
17
-
18
- require("core-js/modules/es.object.assign.js");
19
-
20
- var _docsTools = require("@storybook/docs-tools");
21
-
22
- var SECTIONS = ['props', 'events', 'slots'];
23
-
24
- var extractArgTypes = function extractArgTypes(component) {
25
- if (!(0, _docsTools.hasDocgen)(component)) {
26
- return null;
27
- }
28
-
29
- var results = {};
30
- SECTIONS.forEach(function (section) {
31
- var props = (0, _docsTools.extractComponentProps)(component, section);
32
- props.forEach(function (_ref) {
33
- var propDef = _ref.propDef,
34
- docgenInfo = _ref.docgenInfo,
35
- jsDocTags = _ref.jsDocTags;
36
- var name = propDef.name,
37
- type = propDef.type,
38
- description = propDef.description,
39
- defaultSummary = propDef.defaultValue,
40
- required = propDef.required;
41
- var sbType = section === 'props' ? (0, _docsTools.convert)(docgenInfo) : {
42
- name: 'void'
43
- };
44
- results[name] = {
45
- name: name,
46
- description: description,
47
- type: Object.assign({
48
- required: required
49
- }, sbType),
50
- table: {
51
- type: type,
52
- jsDocTags: jsDocTags,
53
- defaultValue: defaultSummary,
54
- category: section
55
- }
56
- };
57
- });
58
- });
59
- return results;
60
- };
61
-
62
- exports.extractArgTypes = extractArgTypes;
@@ -1,61 +0,0 @@
1
- "use strict";
2
-
3
- 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); }
4
-
5
- require("core-js/modules/es.array.iterator.js");
6
-
7
- require("core-js/modules/es.object.to-string.js");
8
-
9
- require("core-js/modules/es.string.iterator.js");
10
-
11
- require("core-js/modules/es.weak-map.js");
12
-
13
- require("core-js/modules/web.dom-collections.iterator.js");
14
-
15
- require("core-js/modules/es.object.get-own-property-descriptor.js");
16
-
17
- require("core-js/modules/es.symbol.js");
18
-
19
- require("core-js/modules/es.symbol.description.js");
20
-
21
- require("core-js/modules/es.symbol.iterator.js");
22
-
23
- Object.defineProperty(exports, "__esModule", {
24
- value: true
25
- });
26
- exports.prepareForInline = void 0;
27
-
28
- var _react = _interopRequireDefault(require("react"));
29
-
30
- var Vue = _interopRequireWildcard(require("vue"));
31
-
32
- var _index = require("../index");
33
-
34
- 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); }
35
-
36
- 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; }
37
-
38
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
39
-
40
- // This is cast as `any` to workaround type errors caused by Vue 2 types
41
- var _ref = Vue,
42
- render = _ref.render,
43
- h = _ref.h;
44
-
45
- var prepareForInline = function prepareForInline(storyFn, _ref2) {
46
- var args = _ref2.args;
47
- var component = storyFn();
48
- var vnode = h(component, args); // By attaching the app context from `@storybook/vue3` to the vnode
49
- // like this, these stoeis are able to access any app config stuff
50
- // the end-user set inside `.storybook/preview.js`
51
-
52
- vnode.appContext = _index.app._context; // eslint-disable-line no-underscore-dangle
53
-
54
- return /*#__PURE__*/_react.default.createElement('div', {
55
- ref: function ref(node) {
56
- return node ? render(vnode, node) : null;
57
- }
58
- });
59
- };
60
-
61
- exports.prepareForInline = prepareForInline;
@@ -1,103 +0,0 @@
1
- "use strict";
2
-
3
- require("core-js/modules/es.object.to-string.js");
4
-
5
- require("core-js/modules/web.dom-collections.for-each.js");
6
-
7
- require("core-js/modules/es.object.keys.js");
8
-
9
- Object.defineProperty(exports, "__esModule", {
10
- value: true
11
- });
12
- var _exportNames = {
13
- storiesOf: true,
14
- setAddon: true,
15
- addDecorator: true,
16
- addParameters: true,
17
- configure: true,
18
- getStorybook: true,
19
- forceReRender: true,
20
- raw: true,
21
- app: true,
22
- activeStoryComponent: true
23
- };
24
- Object.defineProperty(exports, "activeStoryComponent", {
25
- enumerable: true,
26
- get: function get() {
27
- return _preview.activeStoryComponent;
28
- }
29
- });
30
- Object.defineProperty(exports, "addDecorator", {
31
- enumerable: true,
32
- get: function get() {
33
- return _preview.addDecorator;
34
- }
35
- });
36
- Object.defineProperty(exports, "addParameters", {
37
- enumerable: true,
38
- get: function get() {
39
- return _preview.addParameters;
40
- }
41
- });
42
- Object.defineProperty(exports, "app", {
43
- enumerable: true,
44
- get: function get() {
45
- return _preview.app;
46
- }
47
- });
48
- Object.defineProperty(exports, "configure", {
49
- enumerable: true,
50
- get: function get() {
51
- return _preview.configure;
52
- }
53
- });
54
- Object.defineProperty(exports, "forceReRender", {
55
- enumerable: true,
56
- get: function get() {
57
- return _preview.forceReRender;
58
- }
59
- });
60
- Object.defineProperty(exports, "getStorybook", {
61
- enumerable: true,
62
- get: function get() {
63
- return _preview.getStorybook;
64
- }
65
- });
66
- Object.defineProperty(exports, "raw", {
67
- enumerable: true,
68
- get: function get() {
69
- return _preview.raw;
70
- }
71
- });
72
- Object.defineProperty(exports, "setAddon", {
73
- enumerable: true,
74
- get: function get() {
75
- return _preview.setAddon;
76
- }
77
- });
78
- Object.defineProperty(exports, "storiesOf", {
79
- enumerable: true,
80
- get: function get() {
81
- return _preview.storiesOf;
82
- }
83
- });
84
-
85
- var _preview = require("./preview");
86
-
87
- var _types = require("./preview/types-6-0");
88
-
89
- Object.keys(_types).forEach(function (key) {
90
- if (key === "default" || key === "__esModule") return;
91
- if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
92
- if (key in exports && exports[key] === _types[key]) return;
93
- Object.defineProperty(exports, key, {
94
- enumerable: true,
95
- get: function get() {
96
- return _types[key];
97
- }
98
- });
99
- });
100
-
101
- if (module && module.hot && module.hot.decline) {
102
- module.hot.decline();
103
- }
@@ -1,33 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "applyDecorators", {
7
- enumerable: true,
8
- get: function get() {
9
- return _decorateStory.decorateStory;
10
- }
11
- });
12
- exports.parameters = void 0;
13
- Object.defineProperty(exports, "render", {
14
- enumerable: true,
15
- get: function get() {
16
- return _render.render;
17
- }
18
- });
19
- Object.defineProperty(exports, "renderToDOM", {
20
- enumerable: true,
21
- get: function get() {
22
- return _render.renderToDOM;
23
- }
24
- });
25
-
26
- var _render = require("./render");
27
-
28
- var _decorateStory = require("./decorateStory");
29
-
30
- var parameters = {
31
- framework: 'vue3'
32
- };
33
- exports.parameters = parameters;