UNPKG

@storybook/svelte

Version:
13 lines (10 loc) 4.54 kB
import { __export } from './chunk-CEH6MNVV.mjs'; import { RESET_STORY_ARGS } from 'storybook/internal/core-events'; import { addons, sanitizeStoryContextUpdate } from 'storybook/internal/preview-api'; import PreviewRender from '@storybook/svelte/internal/PreviewRender.svelte'; import { createSvelte5Props } from '@storybook/svelte/internal/createSvelte5Props'; import * as svelte from 'svelte'; import { VERSION } from 'svelte/compiler'; import SlotDecorator from '@storybook/svelte/internal/SlotDecorator.svelte'; var entry_preview_exports={};__export(entry_preview_exports,{applyDecorators:()=>decorateStory,mount:()=>mount2,parameters:()=>parameters,render:()=>render,renderToCanvas:()=>renderToCanvas});var IS_SVELTE_V4=Number(VERSION[0])<=4;function renderToCanvas(renderContext,canvasElement){return IS_SVELTE_V4?renderToCanvasV4(renderContext,canvasElement):renderToCanvasV5(renderContext,canvasElement)}var storyIdsToRemountFromResetArgsEvent=new Set;addons.getChannel().on(RESET_STORY_ARGS,({storyId})=>{storyIdsToRemountFromResetArgsEvent.add(storyId);});var componentsByDomElementV4=new Map;function renderToCanvasV4({storyFn,title,name,showMain,showError,storyContext,forceRemount},canvasElement){function unmount2(canvasElementToUnmount){componentsByDomElementV4.has(canvasElementToUnmount)&&(componentsByDomElementV4.get(canvasElementToUnmount).$destroy(),componentsByDomElementV4.delete(canvasElementToUnmount),canvasElementToUnmount.innerHTML="");}let existingComponent=componentsByDomElementV4.get(canvasElement),remount=forceRemount;if(storyIdsToRemountFromResetArgsEvent.has(storyContext.id)&&(remount=!0,storyIdsToRemountFromResetArgsEvent.delete(storyContext.id)),remount&&unmount2(canvasElement),!existingComponent||remount){let mountedComponent=new PreviewRender({target:canvasElement,props:{storyFn,storyContext,name,title,showError}});componentsByDomElementV4.set(canvasElement,mountedComponent);}else existingComponent.$set({storyFn,storyContext,name,title,showError});return showMain(),()=>{unmount2(canvasElement);}}var componentsByDomElementV5=new Map;function renderToCanvasV5({storyFn,title,name,showMain,showError,storyContext,forceRemount},canvasElement){function unmount2(canvasElementToUnmount){let{mountedComponent}=componentsByDomElementV5.get(canvasElementToUnmount)??{};mountedComponent&&(svelte.unmount(mountedComponent),componentsByDomElementV5.delete(canvasElementToUnmount));}let existingComponent=componentsByDomElementV5.get(canvasElement),remount=forceRemount;if(storyIdsToRemountFromResetArgsEvent.has(storyContext.id)&&(remount=!0,storyIdsToRemountFromResetArgsEvent.delete(storyContext.id)),remount&&unmount2(canvasElement),!existingComponent||remount){let props=createSvelte5Props({storyFn,storyContext,name,title,showError}),mountedComponent=svelte.mount(PreviewRender,{target:canvasElement,props});componentsByDomElementV5.set(canvasElement,{mountedComponent,props});}else Object.assign(existingComponent.props,{storyFn,storyContext,name,title,showError});return showMain(),()=>{unmount2(canvasElement);}}var render=(args,context)=>{let{id,component:Component}=context;if(!Component)throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);return {Component,props:args}};function unWrap(obj){return obj&&typeof obj=="object"&&"default"in obj?obj.default:obj}function prepareStory(context,rawStory,rawInnerStory){let story=unWrap(rawStory),innerStory=rawInnerStory&&unWrap(rawInnerStory),preparedStory;return !story||Object.keys(story).length===0?preparedStory={Component:context.component}:story.Component?preparedStory=story:preparedStory={Component:story},innerStory?{Component:SlotDecorator,props:{...innerStory,decorator:preparedStory}}:{...preparedStory,argTypes:context.argTypes}}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:prepareStory(context,decoratedStory,story)},context=>prepareStory(context,storyFn(context)))}var mount2=context=>async(Component,options)=>(Component&&(context.originalStoryFn=()=>({Component,props:options&&"props"in options?options?.props:options})),await context.renderToCanvas(),context.canvas);var parameters={renderer:"svelte"}; export { IS_SVELTE_V4, decorateStory, entry_preview_exports, mount2 as mount, parameters, render, renderToCanvas };