storybook-addon-remix-react-router/dist/manager.js

Use Remix React Router in your stories. (Formerly storybook-addon-react-router-v6)

import {addons,types,useChannel,ManagerContext}from'storybook/manager-api';import m,{useState,useContext,useEffect,Fragment}from'react';import {ScrollArea,AddonPanel,ActionBar}from'storybook/internal/components';import {STORY_CHANGED}from'storybook/internal/core-events';import {compareVersions}from'compare-versions';import {styled,withTheme}from'storybook/theming';import {ObjectInspector}from'react-inspector';var s="storybook/react-router-v6",E=`${s}/panel`,f="reactRouter",o={CLEAR:`${s}/clear`,NAVIGATION:`${s}/navigation`,STORY_LOADED:`${s}/story-loaded`,ROUTE_MATCHES:`${s}/route-matches`,ACTION_INVOKED:`${s}/action_invoked`,ACTION_SETTLED:`${s}/action_settled`,LOADER_INVOKED:`${s}/loader_invoked`,LOADER_SETTLED:`${s}/loader_settled`};function d(){let[e,r]=useState(),[a,i]=useState();useEffect(()=>{let t=new AbortController;return fetch("https://registry.npmjs.org/storybook-addon-remix-react-router/latest",{signal:t.signal}).then(p=>p.json()).then(p=>i(p.version)).catch(()=>{}),()=>t.abort()},[]),useEffect(()=>{L().then(t=>r(t));},[]);let n=!a||!e?void 0:compareVersions(a,e)===1;return {currentAddonVersion:e,latestAddonVersion:a,addonUpdateAvailable:n}}async function L(){try{return (await import('../package.json',{assert:{type:'json'}})).version}catch{return (await import('../package.json',{assert:{type:'json'}})).version}}var T=styled.p`
  background: #ffebba;
  padding: 5px;
  margin-top: 0;
`;var C=styled.div({flex:1,padding:"0 0 0 5px"});var h=styled.div({display:"flex",padding:0,borderLeft:"5px solid transparent",borderBottom:"1px solid transparent",transition:"all 0.1s",alignItems:"flex-start",whiteSpace:"pre"});var N=withTheme(({theme:e,...r})=>m.createElement(ObjectInspector,{theme:e.addonActionsTheme||"chromeLight",...r}));var H=ScrollArea,O=({routerEvents:e,onClear:r})=>m.createElement(Fragment,null,m.createElement(D,{title:"reactRouterLogger"},e.map((a,i)=>m.createElement(h,{key:i},m.createElement(C,null,m.createElement(N,{name:U[a.type],data:a.data,showNonenumerable:!1,sortObjectKeys:!1,expandPaths:["$.routeParams","$.searchParams","$.routeMatches.*","$.routeMatches.*.*","$.matches","$.matches.*","$.matches.*.*"]}))))),m.createElement(ActionBar,{actionItems:[{title:"Clear",onClick:r}]})),U={[o.NAVIGATION]:"Navigate",[o.STORY_LOADED]:"Story rendered",[o.ROUTE_MATCHES]:"New route matches",[o.ACTION_INVOKED]:"Action invoked",[o.ACTION_SETTLED]:"Action settled",[o.LOADER_INVOKED]:"Loader invoked",[o.LOADER_SETTLED]:"Loader settled"},D=styled(({children:e,title:r})=>m.createElement(H,{horizontal:!0,vertical:!0,title:r},e))({margin:0,padding:"10px 5px 20px"});D.displayName="Wrapper";var I=e=>{let[r,a]=useState([]),{latestAddonVersion:i,addonUpdateAvailable:n}=d(),t=c=>{a(P=>[...P,c]);};useChannel({[o.ROUTE_MATCHES]:t,[o.NAVIGATION]:t,[o.STORY_LOADED]:t,[o.ACTION_INVOKED]:t,[o.ACTION_SETTLED]:t,[o.LOADER_INVOKED]:t,[o.LOADER_SETTLED]:t,[STORY_CHANGED]:()=>a([])});let p=()=>{e.api.emit(o.CLEAR),a([]);};return m.createElement(AddonPanel,{...e},m.createElement(m.Fragment,null,n&&m.createElement(T,null,"Version ",i," is now available !"," ",m.createElement("a",{href:`https://github.com/JesusTheHun/storybook-addon-remix-react-router/releases/tag/v${i}`},"Changelog"),"."),m.createElement(O,{routerEvents:r,onClear:p})))};function S(){let{api:e}=useContext(ManagerContext),{addonUpdateAvailable:r}=d(),[a,i]=useState(0),n=()=>i(c=>c+1),t=()=>i(0);useEffect(()=>(e.on(STORY_CHANGED,t),e.on(o.ROUTE_MATCHES,n),e.on(o.NAVIGATION,n),e.on(o.ACTION_INVOKED,n),e.on(o.ACTION_SETTLED,n),e.on(o.LOADER_INVOKED,n),e.on(o.LOADER_SETTLED,n),e.on(o.CLEAR,t),()=>{e.off(STORY_CHANGED,t),e.off(o.ROUTE_MATCHES,n),e.off(o.NAVIGATION,n),e.off(o.ACTION_INVOKED,n),e.off(o.ACTION_SETTLED,n),e.off(o.LOADER_INVOKED,n),e.off(o.LOADER_SETTLED,n),e.off(o.CLEAR,t);}),[e]);let p=[];return r&&p.push("\u26A1\uFE0F"),a&&p.push(`(${a})`),m.createElement(m.Fragment,null,"React Router ",p.join(" "))}addons.register(s,e=>{addons.add(E,{type:types.PANEL,paramKey:f,title:m.createElement(S,null),match:({viewMode:r})=>r==="story",render:({active:r})=>m.createElement(I,{active:r||!1,api:e,key:s})});});//# sourceMappingURL=manager.js.map
//# sourceMappingURL=manager.js.map