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

Add component status to the storybook UI

import L from'lodash/startCase';import p from'react';import {addons,types,useParameter}from'storybook/manager-api';import {styled,css}from'storybook/theming';var d="#2f2f2f",h="#ffffff";var r={beta:{color:"#ffffff",background:"#ec942c",description:"The interface for this component may change"},deprecated:{color:"#ffffff",background:"#f02c2c",description:"This component will be removed in the next major version"},stable:{color:"#ffffff",background:"#339902",description:"This component is stable"},releaseCandidate:{color:"#ffffff",background:"#a335ee",description:"This component is a release candidate"}};var C=styled.span`
  align-self: center;
  background-color: ${({background:n,type:e})=>n??(r[e]?r[e].background:d)};
  border-radius: 100%;
  height: 6px;
  margin-left: 0.5em;
  user-select: none;
  width: 6px;
`,x=C;var u="status";var S=css`
  align-self: center;
  border-radius: 0.25em;
  padding: 0 0.5em;
  text-decoration: none;
  user-select: none;
  font-size: 11px;
  text-transform: uppercase;
  line-height: 20px;
  font-weight: 700;
  padding: 0 0.5em;
`,N=styled.a`
  ${S}
`,w=styled.span`
  ${S}
`,B=()=>{let n=useParameter(u,null);if(n===null)return null;let{type:e,url:a,statuses:g}=n;if(!e)return null;let o={...r,...g||{}},s;return Array.isArray(e)?s=e.map(t=>typeof t=="string"?{label:t,status:o[t],url:a}:{label:t.name,status:o[t.name],url:t.url}):s=[{label:e,status:o[e],url:a}],s=s.filter(t=>t.status!=null),s?.length?p.createElement(p.Fragment,null,s.map(t=>{let{background:i,color:b,description:c}=t.status,l=t.url,f=L(t.label),k={color:b??(r[f]?r[f].color:h),backgroundColor:i??(r[f]?r[f].background:d)};return l?p.createElement(N,{key:t.label,style:k,title:c,href:l},f):p.createElement(w,{key:t.label,style:k,title:c},f)})):null},D=B;addons.register(u,n=>{addons.add(u,{title:"Status",type:types.TOOL,render:()=>p.createElement(D,null)}),addons.setConfig({sidebar:{renderLabel:e=>{let{name:a}=e,g=["root","group","story"].includes(e.type);try{let o=n.getParameters(e.id,u);if(!g||!o?.type)return a;let s={...r,...o.statuses||{}},t="";if(Array.isArray(o.type)){let l=o.type?.[0];t=typeof l=="string"?l:l.name;}else t=o.type;let i=s[t];if(!i)return a;let{background:b,description:c}=i;return p.createElement(p.Fragment,null,a,p.createElement(x,{type:t,background:b,title:`${L(t)}: ${c}`}))}catch{return a}}}});});//# sourceMappingURL=manager.js.map
//# sourceMappingURL=manager.js.map