@storybook/vue 7.0.7 → 7.0.9
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.
- package/dist/chunk-DOPQCPG5.mjs +8 -2
- package/dist/config.d.ts +6 -18
- package/dist/config.mjs +8 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.mjs +7 -1
- package/dist/{types-47445781.d.ts → types-317e5359.d.ts} +2 -3
- package/package.json +13 -13
package/dist/chunk-DOPQCPG5.mjs
CHANGED
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { dedent } from 'ts-dedent';
|
|
2
|
+
import Vue from 'vue';
|
|
3
|
+
import { sanitizeStoryContextUpdate } from '@storybook/preview-api';
|
|
4
|
+
|
|
5
|
+
var COMPONENT="STORYBOOK_COMPONENT",VALUES="STORYBOOK_VALUES",map=new Map,getRoot=canvasElement=>{let cachedInstance=map.get(canvasElement);if(cachedInstance!=null)return cachedInstance;let target=document.createElement("div");canvasElement.appendChild(target);let instance=new Vue({beforeDestroy(){map.delete(canvasElement);},data(){return {[COMPONENT]:void 0,[VALUES]:{}}},render(h){return map.set(canvasElement,instance),this[COMPONENT]?[h(this[COMPONENT])]:void 0}});return instance},render=(args,context)=>{let{id,component:Component,argTypes}=context,component=Component;if(!component)throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);let componentName="component";component.name?componentName=Vue.config.isReservedTag&&Vue.config.isReservedTag(component.name)?`sb-${component.name}`:component.name:component.__docgenInfo?.displayName&&(componentName=component.__docgenInfo?.displayName);let eventsBinding="",eventProps=Object.values(argTypes).filter(argType=>argType?.table?.category==="events").map(argType=>argType.name),camelCase=str=>str.replace(/-([a-z])/g,g=>g[1].toUpperCase());return eventProps.length&&(eventsBinding=eventProps.map(name=>`@${name}="$props['${camelCase(name)}']"`).join(" ")),{props:Object.keys(argTypes),components:{[componentName]:component},template:`<${componentName} ${eventsBinding} v-bind="filterOutEventProps($props)" />`,methods:{filterOutEventProps(props){return Object.fromEntries(Object.entries(props).filter(([key])=>!eventProps.includes(key)))}}}};function renderToCanvas({title,name,storyFn,showMain,showError,showException,forceRemount},canvasElement){let root=getRoot(canvasElement);Vue.config.errorHandler=showException;let element=storyFn(),mountTarget;if(canvasElement.hasChildNodes()?mountTarget=canvasElement.firstElementChild:(mountTarget=document.createElement("div"),canvasElement.appendChild(mountTarget)),!element){showError({title:`Expecting a Vue component from the story: "${name}" of "${title}".`,description:dedent`
|
|
2
6
|
Did you forget to return the Vue component from the story?
|
|
3
7
|
Use "() => ({ template: '<my-comp></my-comp>' })" or "() => ({ components: MyComp, template: '<my-comp></my-comp>' })" when defining the story.
|
|
4
|
-
`});return}(!root[COMPONENT]||forceRemount)&&(root[COMPONENT]=element),root[VALUES]={...element.options[VALUES]},map.has(canvasElement)||root.$mount(mountTarget??void 0),showMain()
|
|
8
|
+
`});return}(!root[COMPONENT]||forceRemount)&&(root[COMPONENT]=element),root[VALUES]={...element.options[VALUES]},map.has(canvasElement)||root.$mount(mountTarget??void 0),showMain();}function getType(fn){let match=fn&&fn.toString().match(/^\s*function (\w+)/);return match?match[1]:""}function resolveDefault({type,default:def}){return typeof def=="function"&&getType(type)!=="Function"?def.call():def}function extractProps(component){return Object.entries(component.options.props||{}).map(([name,prop])=>({[name]:resolveDefault(prop)})).reduce((wrap,prop)=>({...wrap,...prop}),{})}var WRAPS="STORYBOOK_WRAPS";function prepare(rawStory,innerStory,context){let story;if(typeof rawStory=="string")story={template:rawStory};else if(rawStory!=null)story=rawStory;else return null;if(!story._isVue)innerStory&&(story.components={...story.components||{},story:innerStory}),story=Vue.extend(story);else if(story.options[WRAPS])return story;return Vue.extend({[WRAPS]:story,[VALUES]:{...innerStory?innerStory.options[VALUES]:{},...extractProps(story),...context?.args||{}},functional:!0,render(h,{data,parent,children}){return h(story,{...data,props:{...data.props||{},...parent.$root[VALUES]}},children)}})}function decorateStory(storyFn,decorators){return decorators.reduce((decorated,decorator)=>context=>{let story,decoratedStory=decorator(update=>(story=decorated({...context,...sanitizeStoryContextUpdate(update)}),story),context);return story||(story=decorated(context)),decoratedStory===story?story:prepare(decoratedStory,story)},context=>prepare(storyFn(context),void 0,context))}
|
|
9
|
+
|
|
10
|
+
export { decorateStory, render, renderToCanvas };
|
package/dist/config.d.ts
CHANGED
|
@@ -1,28 +1,16 @@
|
|
|
1
|
-
import * as lib_docs_tools_dist from 'lib/docs-tools/dist';
|
|
2
|
-
import * as lib_types_dist from 'lib/types/dist';
|
|
3
|
-
import { S as StoryContext, V as VueRenderer, a as StoryFnVueReturnType } from './types-47445781.js';
|
|
4
1
|
import * as _storybook_types from '@storybook/types';
|
|
5
|
-
import { ArgsStoryFn, RenderContext, LegacyStoryFn, DecoratorFunction, StoryContext
|
|
2
|
+
import { Addon_DecoratorFunction, ArgTypesEnhancer, ArgsStoryFn, RenderContext, LegacyStoryFn, DecoratorFunction, StoryContext } from '@storybook/types';
|
|
3
|
+
import { V as VueRenderer, S as StoryFnVueReturnType } from './types-317e5359.js';
|
|
6
4
|
import 'vue';
|
|
7
5
|
|
|
8
|
-
declare const decorators:
|
|
9
|
-
declare const argTypesEnhancers:
|
|
6
|
+
declare const decorators: Addon_DecoratorFunction<any>[];
|
|
7
|
+
declare const argTypesEnhancers: ArgTypesEnhancer[];
|
|
10
8
|
|
|
11
9
|
declare const render: ArgsStoryFn<VueRenderer>;
|
|
12
10
|
declare function renderToCanvas({ title, name, storyFn, showMain, showError, showException, forceRemount, }: RenderContext<VueRenderer>, canvasElement: VueRenderer['canvasElement']): void;
|
|
13
11
|
|
|
14
|
-
declare function decorateStory(storyFn: LegacyStoryFn<VueRenderer>, decorators: DecoratorFunction<VueRenderer>[]): (context: StoryContext
|
|
12
|
+
declare function decorateStory(storyFn: LegacyStoryFn<VueRenderer>, decorators: DecoratorFunction<VueRenderer>[]): (context: StoryContext<VueRenderer, _storybook_types.Args>) => StoryFnVueReturnType;
|
|
15
13
|
|
|
16
|
-
declare const parameters: {
|
|
17
|
-
docs: {
|
|
18
|
-
story: {
|
|
19
|
-
inline: boolean;
|
|
20
|
-
iframeHeight: string;
|
|
21
|
-
};
|
|
22
|
-
extractArgTypes: lib_docs_tools_dist.ArgTypesExtractor;
|
|
23
|
-
extractComponentDescription: typeof lib_docs_tools_dist.extractComponentDescription;
|
|
24
|
-
};
|
|
25
|
-
renderer: "vue";
|
|
26
|
-
};
|
|
14
|
+
declare const parameters: {};
|
|
27
15
|
|
|
28
16
|
export { decorateStory as applyDecorators, argTypesEnhancers, decorators, parameters, render, renderToCanvas };
|
package/dist/config.mjs
CHANGED
|
@@ -1 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
export { decorateStory as applyDecorators, render, renderToCanvas } from './chunk-DOPQCPG5.mjs';
|
|
2
|
+
import { enhanceArgTypes, SNIPPET_RENDERED, extractComponentDescription, hasDocgen, extractComponentProps, convert, SourceType } from '@storybook/docs-tools';
|
|
3
|
+
import { addons } from '@storybook/preview-api';
|
|
4
|
+
import { logger } from '@storybook/client-logger';
|
|
5
|
+
|
|
6
|
+
var SECTIONS=["props","events","slots","methods"];function inferEnum(propDef,docgenInfo){let{type,values}=docgenInfo;if(!(Array.isArray(values)&&values.length&&type&&type.name!=="enum"))return !1;let enumString=values.join(", "),{summary}=propDef.type;return summary=summary?`${summary}: ${enumString}`:enumString,Object.assign(propDef.type,{...propDef.type,name:"enum",value:values,summary}),propDef}function verifyPropDef(propDef,docgenInfo){let def=propDef,isChanged=!1,callbacks=[inferEnum];for(let i=0,len=callbacks.length;i<len;i+=1){let matched=callbacks[i](propDef,docgenInfo);matched&&(def=matched,isChanged=!0);}return [def,isChanged]}var extractArgTypes=component=>{if(!hasDocgen(component))return null;let results={};return SECTIONS.forEach(section=>{extractComponentProps(component,section).forEach(({propDef,docgenInfo,jsDocTags})=>{let[result,isPropDefChanged]=verifyPropDef(propDef,docgenInfo),{name,type,description,defaultValue:defaultSummary,required}=result,sbType;isPropDefChanged?sbType=type:sbType=section==="props"?convert(docgenInfo):{name:"void"},results[name]={name,description,type:{required,...sbType},table:{type,jsDocTags,defaultValue:defaultSummary,category:section}};});}),results};var skipSourceRender=context=>{let sourceParams=context?.parameters.docs?.source,isArgsStory=context?.parameters.__isArgsStory;return sourceParams?.type===SourceType.DYNAMIC?!1:!isArgsStory||sourceParams?.code||sourceParams?.type===SourceType.CODE},sourceDecorator=(storyFn,context)=>{let story=storyFn();if(skipSourceRender(context))return story;let channel=addons.getChannel(),storyComponent=getStoryComponent(story.options.STORYBOOK_WRAPS);return {components:{Story:story},mounted(){if(this._vnode)try{let storyNode=lookupStoryInstance(this,storyComponent),code=vnodeToString(storyNode._vnode),{id,args}=context;channel.emit(SNIPPET_RENDERED,{id,args,source:`<template>${code}</template>`,format:"vue"});}catch(e){logger.warn(`Failed to generate dynamic story source: ${e}`);}},template:"<story />"}};function vnodeToString(vnode){let attrString=[...vnode.data?.slot?[["slot",vnode.data.slot]]:[],["class",stringifyClassAttribute(vnode)],...vnode.componentOptions?.propsData?Object.entries(vnode.componentOptions.propsData):[],...vnode.data?.attrs?Object.entries(vnode.data.attrs):[]].filter(([name],index,list)=>list.findIndex(item=>item[0]===name)===index).map(([name,value])=>stringifyAttr(name,value)).filter(Boolean).join(" ");if(!vnode.componentOptions)return vnode.tag?vnode.children?`<${vnode.tag} ${attrString}>${vnode.children.map(vnodeToString).join("")}</${vnode.tag}>`:`<${vnode.tag} ${attrString}/>`:vnode.text?/[<>"&]/.test(vnode.text)?`{{\`${vnode.text.replace(/`/g,"\\`")}\`}}`:vnode.text:"";let tag=vnode.componentOptions.tag||vnode.tag||"unknown-component";return vnode.componentOptions.children?`<${tag} ${attrString}>${vnode.componentOptions.children.map(vnodeToString).join("")}</${tag}>`:`<${tag} ${attrString}/>`}function stringifyClassAttribute(vnode){if(!(!vnode.data||!vnode.data.staticClass&&!vnode.data.class))return [...vnode.data.staticClass?.split(" ")??[],...normalizeClassBinding(vnode.data.class)].filter(Boolean).join(" ")||void 0}function normalizeClassBinding(binding){return binding?typeof binding=="string"?[binding]:binding instanceof Array?binding.map(normalizeClassBinding).reduce((a,b)=>[...a,...b],[]):typeof binding=="object"?Object.entries(binding).filter(([,active])=>!!active).map(([className])=>className):[]:[]}function stringifyAttr(attrName,value){return typeof value>"u"||typeof value=="function"?null:value===!0?attrName:typeof value=="string"?`${attrName}=${quote(value)}`:`:${attrName}=${quote(JSON.stringify(value))}`}function quote(value){return value.includes('"')&&!value.includes("'")?`'${value}'`:`"${value.replace(/"/g,""")}"`}function getStoryComponent(w){let matched=w;for(;matched&&matched.options&&matched.options.components&&matched.options.components.story&&matched.options.components.story.options&&matched.options.components.story.options.STORYBOOK_WRAPS;)matched=matched.options.components.story.options.STORYBOOK_WRAPS;return matched}function lookupStoryInstance(instance,storyComponent){if(instance.$vnode&&instance.$vnode.componentOptions&&instance.$vnode.componentOptions.Ctor===storyComponent)return instance;for(let i=0,l=instance.$children.length;i<l;i+=1){let found=lookupStoryInstance(instance.$children[i],storyComponent);if(found)return found}return null}var parameters={docs:{story:{inline:!0,iframeHeight:"120px"},extractArgTypes,extractComponentDescription}},decorators=[sourceDecorator],argTypesEnhancers=[enhanceArgTypes];var parameters2={renderer:"vue",...parameters};
|
|
7
|
+
|
|
8
|
+
export { argTypesEnhancers, decorators, parameters2 as parameters };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Addon_ClientStoryApi, Addon_Loadable, Args, ComponentAnnotations, AnnotatedStoryFn, ArgsStoryFn, StoryAnnotations, ArgsFromMeta, StrictArgs, DecoratorFunction, LoaderFunction, StoryContext as StoryContext$1, ProjectAnnotations } from '@storybook/types';
|
|
2
2
|
export { ArgTypes, Args, Parameters, StrictArgs } from '@storybook/types';
|
|
3
|
-
import { V as VueRenderer } from './types-
|
|
3
|
+
import { V as VueRenderer } from './types-317e5359.js';
|
|
4
4
|
import { Simplify, SetOptional } from 'type-fest';
|
|
5
5
|
import { Component } from 'vue';
|
|
6
6
|
import { ExtendedVue } from 'vue/types/vue';
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1,7 @@
|
|
|
1
|
-
import{decorateStory,render
|
|
1
|
+
import { renderToCanvas, decorateStory, render } from './chunk-DOPQCPG5.mjs';
|
|
2
|
+
import { global } from '@storybook/global';
|
|
3
|
+
import { start } from '@storybook/preview-api';
|
|
4
|
+
|
|
5
|
+
var{window:globalWindow}=global;globalWindow.STORYBOOK_ENV="vue";var RENDERER="vue",api=start(renderToCanvas,{decorateStory,render}),storiesOf=(kind,m)=>api.clientApi.storiesOf(kind,m).addParameters({renderer:RENDERER}),configure=(...args)=>api.configure(RENDERER,...args),forceReRender=api.forceReRender,raw=api.clientApi.raw;typeof module<"u"&&module?.hot?.decline();
|
|
6
|
+
|
|
7
|
+
export { configure, forceReRender, raw, storiesOf };
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import { WebRenderer
|
|
1
|
+
import { WebRenderer } from '@storybook/types';
|
|
2
2
|
import { Component, AsyncComponent } from 'vue';
|
|
3
3
|
|
|
4
4
|
type StoryFnVueReturnType = Component<any, any, any, any> | AsyncComponent<any, any, any, any>;
|
|
5
|
-
type StoryContext = StoryContext$1<VueRenderer>;
|
|
6
5
|
interface VueRenderer extends WebRenderer {
|
|
7
6
|
component: Component<any, any, any, any> | AsyncComponent<any, any, any, any>;
|
|
8
7
|
storyResult: StoryFnVueReturnType;
|
|
9
8
|
}
|
|
10
9
|
|
|
11
|
-
export {
|
|
10
|
+
export { StoryFnVueReturnType as S, VueRenderer as V };
|
package/package.json
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/vue",
|
|
3
|
-
"version": "7.0.
|
|
3
|
+
"version": "7.0.9",
|
|
4
4
|
"description": "Storybook Vue renderer",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"storybook"
|
|
7
7
|
],
|
|
8
|
-
"homepage": "https://github.com/storybookjs/storybook/tree/
|
|
8
|
+
"homepage": "https://github.com/storybookjs/storybook/tree/next/code/renderers/vue",
|
|
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": "renderers/vue"
|
|
15
|
+
"directory": "code/renderers/vue"
|
|
16
16
|
},
|
|
17
17
|
"funding": {
|
|
18
18
|
"type": "opencollective",
|
|
@@ -21,15 +21,15 @@
|
|
|
21
21
|
"license": "MIT",
|
|
22
22
|
"exports": {
|
|
23
23
|
".": {
|
|
24
|
+
"types": "./dist/index.d.ts",
|
|
24
25
|
"node": "./dist/index.js",
|
|
25
26
|
"require": "./dist/index.js",
|
|
26
|
-
"import": "./dist/index.mjs"
|
|
27
|
-
"types": "./dist/index.d.ts"
|
|
27
|
+
"import": "./dist/index.mjs"
|
|
28
28
|
},
|
|
29
29
|
"./preview": {
|
|
30
|
+
"types": "./dist/config.d.ts",
|
|
30
31
|
"require": "./dist/config.js",
|
|
31
|
-
"import": "./dist/config.mjs"
|
|
32
|
-
"types": "./dist/config.d.ts"
|
|
32
|
+
"import": "./dist/config.mjs"
|
|
33
33
|
},
|
|
34
34
|
"./package.json": "./package.json"
|
|
35
35
|
},
|
|
@@ -48,12 +48,12 @@
|
|
|
48
48
|
"prep": "../../../scripts/prepare/bundle.ts"
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
|
-
"@storybook/client-logger": "7.0.
|
|
52
|
-
"@storybook/core-client": "7.0.
|
|
53
|
-
"@storybook/docs-tools": "7.0.
|
|
51
|
+
"@storybook/client-logger": "7.0.9",
|
|
52
|
+
"@storybook/core-client": "7.0.9",
|
|
53
|
+
"@storybook/docs-tools": "7.0.9",
|
|
54
54
|
"@storybook/global": "^5.0.0",
|
|
55
|
-
"@storybook/preview-api": "7.0.
|
|
56
|
-
"@storybook/types": "7.0.
|
|
55
|
+
"@storybook/preview-api": "7.0.9",
|
|
56
|
+
"@storybook/types": "7.0.9",
|
|
57
57
|
"ts-dedent": "^2.0.0",
|
|
58
58
|
"type-fest": "2.19.0"
|
|
59
59
|
},
|
|
@@ -86,5 +86,5 @@
|
|
|
86
86
|
],
|
|
87
87
|
"platform": "browser"
|
|
88
88
|
},
|
|
89
|
-
"gitHead": "
|
|
89
|
+
"gitHead": "797cfd6f12f94a65617c65f25b2d6546a689bf1b"
|
|
90
90
|
}
|