@techdocs/cli
Version:
Utility CLI for managing TechDocs sites in Backstage.
2 lines • 6.9 kB
JavaScript
;(self.webpackChunktechdocs_cli_embedded_app=self.webpackChunktechdocs_cli_embedded_app||[]).push([["7632"],{6659(e,t,r){r.d(t,{DependencyGraph:()=>z});var n=r(31085),a=r(14041),l=r(37238),s=r(53373),i=r.n(s),d=r(45250),o=r(68510),c=r(67566),u=r(41809),h=r(57586),f=r.n(h),m=r(12784),g=r.n(m),x=r(6033),p=r(22249),k=r(58837);let w=(0,k.A)(e=>({node:{fill:e.palette.primary.light,stroke:e.palette.primary.light},text:{fill:e.palette.primary.contrastText}}),{name:"BackstageDependencyGraphDefaultNode"});function b({node:{id:e}}){let t=w(),[r,l]=(0,a.useState)(0),[s,i]=(0,a.useState)(0),d=(0,a.useRef)(null);(0,a.useLayoutEffect)(()=>{if(d.current){let{height:e,width:t}=d.current.getBBox();e=Math.round(e),t=Math.round(t),(e!==s||t!==r)&&(l(t),i(e))}},[r,s]);let o=r+20,c=s+20;return(0,n.jsxs)("g",{children:[(0,n.jsx)("rect",{className:t.node,width:o,height:c,rx:10}),(0,n.jsx)("text",{ref:d,className:t.text,y:c/2,x:o/2,textAnchor:"middle",alignmentBaseline:"middle",children:e})]})}let y=(0,p.default)(e=>({node:{transition:`${e.transitions.duration.shortest}ms`}}),{name:"BackstageDependencyGraphNode"}),j=e=>(0,n.jsx)(b,{...e});function v({render:e=j,setNode:t,node:r}){let{width:l,height:s,x:i=0,y:d=0}=r,o=y(),c=(0,a.useRef)(null);return(0,a.useLayoutEffect)(()=>{if(c.current){let{height:e,width:n}=c.current.getBBox();e=Math.round(e),n=Math.round(n),(e!==s||n!==l)&&t(r.id,{...r,height:e,width:n})}},[r,l,s,t]),(0,n.jsx)("g",{ref:c,"data-testid":"node",className:o.node,transform:`translate(${i-l/2},${d-s/2})`,children:e({node:r})})}var M=r(1121),B=r(12895),E=r(20644),N=r.n(E);let $="arrow-marker",S=(0,p.default)(e=>({text:{fill:e.palette.textContrast}}),{name:"BackstageDependencyGraphDefaultLabel"});function A({edge:{label:e}}){let t=S();return(0,n.jsx)("text",{className:t.text,textAnchor:"middle",children:e})}let D=(0,p.default)(e=>({path:{strokeWidth:1.3,stroke:e.palette.textSubtle,fill:"none",transition:`${e.transitions.duration.shortest}ms`},label:{transition:`${e.transitions.duration.shortest}ms`}}),{name:"BackstageDependencyGraphEdge"}),C=e=>(0,n.jsx)(A,{...e});function G({render:e=C,setEdge:t,id:r,edge:l,curve:s,showArrowHeads:i}){let{x:d=0,y:o=0,width:c,height:u,points:h}=l,f=D(),m=(0,a.useRef)(null);(0,a.useLayoutEffect)(()=>{if(m.current){let{height:e,width:n}=m.current.getBBox();e=Math.round(e),n=Math.round(n),(e!==u||n!==c)&&t(r,{...l,height:e,width:n})}},[l,u,c,t,r]);let g="",x=(0,a.useMemo)(()=>M.A().x(e=>e.x).y(e=>e.y).curve(B[s]),[s]);return h&&(g=x(h.filter(e=>N()(e.x)&&N()(e.y)))||""),(0,n.jsxs)(n.Fragment,{children:[g&&(0,n.jsx)("path",{"data-testid":"edge",className:f.path,markerEnd:i?`url(#${$})`:void 0,d:g}),l.label?(0,n.jsx)("g",{ref:m,"data-testid":"label",className:f.label,transform:`translate(${d},${o})`,children:e({edge:l})}):null]})}var _=r(29365),R=r(25828),L=r(63988),T=r(14112),H=r(71677),O=r(89595),W=r(89332);let I=(0,k.A)(e=>({fullscreenButton:{position:"absolute",right:0},root:{overflow:"hidden",minHeight:"100%",minWidth:"100%"},fixedHeight:{maxHeight:"100%"},fullscreen:{backgroundColor:e.palette.background.paper}})),P="workspace",X="dependency-graph";function z(e){let{edges:t,nodes:r,renderNode:s,direction:h=x.D.Direction.TOP_BOTTOM,align:m,nodeMargin:p=50,edgeMargin:k=10,rankMargin:w=50,paddingX:b=0,paddingY:y=0,acyclicer:j,ranker:M=x.D.Ranker.NETWORK_SIMPLEX,labelPosition:B=x.D.LabelPosition.RIGHT,labelOffset:E=10,edgeRanks:N=1,edgeWeight:S=1,renderEdge:A,renderLabel:D,defs:C,zoom:z="enabled",curve:q="curveMonotoneX",showArrowHeads:F=!1,fit:K="grow",allowFullscreen:U=!0,...V}=e,Y=(0,u.default)(),[J,Q]=(0,a.useState)(100),[Z,ee]=(0,a.useState)(100),et=(0,T.V)(),er=I(),{t:en}=(0,O.i)(W.O),ea=(0,a.useRef)(new(f()).graphlib.Graph),[el,es]=(0,a.useState)(ea.current.graph()?.width||0),[ei,ed]=(0,a.useState)(ea.current.graph()?.height||0),[eo,ec]=(0,a.useState)([]),[eu,eh]=(0,a.useState)([]),ef=Math.max(el,J),em=Math.max(ei,Z),[eg]=(0,l.A)(),ex=(0,d.once)(eg),ep="grow"!==K||et.active?"100%":em,ek=(0,a.useMemo)(()=>g()(e=>{if(!e)return;ex(e);let t=e.querySelector(`svg#${X}`);if(!t)return;let r=c.A(t),n=c.A(t.getElementById(P));function a(){r.call(o.s_().scaleExtent([1,1/0]).on("zoom",e=>{e.transform.x=Math.min(0,Math.max(e.transform.x,ef-ef*e.transform.k)),e.transform.y=Math.min(0,Math.max(e.transform.y,em-em*e.transform.k)),n.attr("transform",e.transform)}))}"enabled"===z?a():"enable-on-click"===z&&r.on("click",()=>a());let{width:l,height:s}=e.getBoundingClientRect();J!==l&&l<=ef&&Q(l),Z!==s&&s<=em&&ee(s)},100),[ex,Z,J,ef,em,z]),ew=(0,a.useCallback)(()=>{let e=ea.current.nodes(),n=ea.current.edges();e.forEach(e=>{r.some(t=>t.id===e)||ea.current.removeNode(e)}),n.forEach(e=>{t.some(t=>t.from===e.v&&t.to===e.w)||ea.current.removeEdge(e.v,e.w)}),r.forEach(e=>{let t=ea.current.nodes().find(t=>e.id===t);if(t&&ea.current.node(t)){let{width:r,height:n,x:a,y:l}=ea.current.node(t);ea.current.setNode(t,{...e,width:r,height:n,x:a,y:l})}else ea.current.setNode(e.id,{...e,width:0,height:0})}),t.forEach(e=>{ea.current.setEdge(e.from,e.to,{...e,label:e.label,width:0,height:0,labelpos:B,labeloffset:E,weight:S,minlen:N})})},[t,r,B,E,S,N]),eb=(0,a.useMemo)(()=>g()(()=>{f().layout(ea.current);let{height:e,width:t}=ea.current.graph(),r=Math.max(0,e||0);es(Math.max(0,t||0)),ed(r),ec(ea.current.nodes()),eh(ea.current.edges())},250,{leading:!0}),[]);(0,a.useEffect)(()=>(ea.current.setGraph({rankdir:h,align:m,nodesep:p,edgesep:k,ranksep:w,marginx:b,marginy:y,acyclicer:j,ranker:M}),ew(),eb(),eb.cancel),[j,m,h,k,b,y,p,w,M,ew,eb]);let ey=(0,a.useCallback)((e,t)=>(ea.current.setNode(e,t),eb(),ea.current),[eb]),ej=(0,a.useCallback)((e,t)=>(ea.current.setEdge(e,t),eb(),ea.current),[eb]);return(0,n.jsxs)(T.m,{handle:et,className:i()(et.active?er.fullscreen:er.root),children:[U&&(0,n.jsx)(H.Ay,{title:en("dependencyGraph.fullscreenTooltip"),children:(0,n.jsx)(_.A,{className:er.fullscreenButton,onClick:et.active?et.exit:et.enter,children:et.active?(0,n.jsx)(L.default,{}):(0,n.jsx)(R.default,{})})}),(0,n.jsx)("div",{ref:ek,style:{width:"100%",height:"100%"},children:(0,n.jsxs)("svg",{...V,width:"100%",height:ep,viewBox:`0 0 ${ef} ${em}`,id:X,children:[(0,n.jsxs)("defs",{children:[(0,n.jsx)("marker",{id:$,viewBox:"0 0 24 24",markerWidth:"14",markerHeight:"14",refX:"16",refY:"12",orient:"auto",markerUnits:"strokeWidth",children:(0,n.jsx)("path",{fill:Y.palette.textSubtle,d:"M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"})}),C]}),(0,n.jsx)("g",{id:P,children:(0,n.jsxs)("svg",{width:el,height:ei,y:em/2-ei/2,x:ef/2-el/2,viewBox:`0 0 ${el} ${ei}`,children:[eu.map(e=>{let t=ea.current.edge(e);return t?A?A({edge:t,id:e}):(0,n.jsx)(G,{id:e,setEdge:ej,render:D,edge:t,curve:q,showArrowHeads:F},`${e.v}-${e.w}`):null}),eo.map(e=>{let t=ea.current.node(e);return t?(0,n.jsx)(v,{setNode:ey,render:s,node:t},e):null})]})})]})})]})}}}]);
//# sourceMappingURL=7632.d2fd37a3ce88.chunk.js.map