@etchteam/storybook-addon-marker/dist/manager.js

Add a Marker.io feedback button to the storybook UI

import {addons,types,useGlobals,useChannel}from'storybook/manager-api';import b from'@marker.io/browser';import {IconButton}from'storybook/internal/components';import {CommentIcon}from'@storybook/icons';import {styled}from'storybook/theming';import d,{useState,useCallback,useEffect}from'react';var t="marker",r=`${t}/tool`,n={LOADED:`${t}/loaded`,CAPTURE:`${t}/capture`};var i=()=>{[...document.querySelectorAll(".marker-app #feedback-button")].forEach(o=>o.style.display="none");};var I=styled(IconButton)(()=>({display:"inline-flex",alignItems:"center"})),L=styled.div(({theme:e})=>({display:"inline-block",textDecoration:"none",padding:"10px 5px",fontWeight:e.typography.weight.bold,fontSize:e.typography.size.s2-1,lineHeight:"1",height:37,border:"none",borderTop:"3px solid transparent",borderBottom:"3px solid transparent",background:"transparent"}));function m(){let[e,o]=useState(false),[p]=useGlobals(),{project:a,mode:u,...k}=p.marker??{},l=useChannel({[n.LOADED]:()=>{window.Marker&&window.Marker.unload(),o(true);},[n.CAPTURE]:()=>{window.Marker?.capture(u)?.then(()=>{i();});}}),f=useCallback(()=>{l(n.CAPTURE);},[l]);return useEffect(()=>{clearTimeout(window.markerTimer),a&&!e&&!window.Marker&&(window.markerTimer=setTimeout(()=>{b.loadWidget({project:a,...k}).then(()=>{i(),o(true);});},3e3));},[a,e]),e?d.createElement(I,{key:r,onClick:f},d.createElement(CommentIcon,null),d.createElement(L,null,"Feedback")):null}addons.register(t,()=>{addons.add(r,{type:types.TOOL,title:"Marker",match:({viewMode:e})=>!!(e&&e.match(/^(story|docs)$/)),render:m});});//# sourceMappingURL=manager.js.map
//# sourceMappingURL=manager.js.map