storybook-addon-source-link/dist/manager.js

Add a button to the Storybook toolbar that opens the file containing the Story in an IDE like VSCode.

import { useStorybookApi, useChannel, addons, types } from '@storybook/manager-api';
import { WithTooltip, TooltipLinkList, IconButton } from '@storybook/components';
import { STORY_CHANGED } from '@storybook/core-events';
import * as T from '@storybook/icons';
import { CopyIcon, CheckIcon, JumpToIcon } from '@storybook/icons';
import { styled } from '@storybook/theming';
import r, { memo, useState, useCallback, useMemo } from 'react';

var s="storybook-addon-source-link",u=`${s}/tool`,l={REQUEST_RESOLVABLE_PARAM:`${s}/request-resolve`,RESPONSE_RESOLVABLE_PARAM:`${s}/response-resolve`};var E=Object.fromEntries(Object.entries(T).filter(t=>t[0][0]===t[0][0].toUpperCase()).map(([t,e])=>[t,e])),a=t=>Object.keys(E).includes(t),d=({name:t})=>{let e=E[t];return e?r.createElement(e,null):null};var O=async t=>{let e=addons.getChannel();return new Promise(c=>{e.on(l.RESPONSE_RESOLVABLE_PARAM,m=>{c(m);}),e.emit(l.REQUEST_RESOLVABLE_PARAM,t);})};var j=styled(CopyIcon)`
	fill: ${({theme:t})=>t.color.dark};
`,w=styled(CheckIcon)`
	fill: ${({theme:t})=>t.color.dark};
`,I=memo(function(){let e=process.env.SOURCE_LINK_PROJECT_ROOT_PATH??"",c=!0,n=useStorybookApi().getCurrentStoryData(),[p,f]=useState(),[y,k]=useState();useChannel({[STORY_CHANGED]:()=>{f(void 0);}});let _=useCallback(()=>{k(void 0),n&&(p||O({rootPath:e,isStaticBuild:c,type:n.type,importPath:n.importPath,id:n.id,title:n.title,name:n.name,tags:n.tags}).then(o=>{f(o);}));},[e,c,n,p]),A=useMemo(()=>p?.map(o=>{if(o.type==="copy"){let i=!!y;return {id:o.id,title:o.label,onClick:()=>{navigator.clipboard.writeText(o.href),i||k(o.id);},icon:o.icon&&a(o.icon)&&r.createElement(d,{name:o.icon}),right:i?r.createElement(w,null):r.createElement(j,null),order:o.order??0}}return {id:o.id,title:o.label,href:o.href,target:(o.type??"linkBlank")==="linkBlank"?"_blank":void 0,icon:o.icon&&a(o.icon)&&r.createElement(d,{name:o.icon}),order:o.order??0}}).sort((o,i)=>o.order===i.order?o.title.localeCompare(i.title):o.order-i.order),[p,y]);return r.createElement(WithTooltip,{placement:"top",closeOnOutsideClick:!0,onVisibleChange:o=>{o&&_();},tooltip:()=>r.createElement(TooltipLinkList,{links:A??[]})},r.createElement(IconButton,{key:"open-source-file",title:"Open source file"},r.createElement(JumpToIcon,null)))});addons.register(s,()=>{addons.add(u,{type:types.TOOL,title:"Source Link",match:({viewMode:t})=>!!t?.match(/^(story|docs)$/),render:I});});
//# sourceMappingURL=out.js.map
//# sourceMappingURL=manager.js.map