jbrowse-plugin-graphgenomeviewer 4.5.0 → 4.6.0

package/dist/chunks/chunk-TCGFPZ4Y.js

@@ -0,0 +1,3 @@
+import{$ as St,A as ut,B as xe,Ba as It,C as ft,Da as Gt,Ea as Tt,F as mt,G as fe,Ga as Nt,H as ht,M as le,Ma as Ht,N as gt,O as bt,Oa as Wt,P as yt,Q as vt,T as Me,Ta as Pe,U as wt,Ua as De,W as Re,Wa as Bt,Xa as _t,_ as kt,a as W,aa as xt,b as Ae,ba as Mt,ca as Rt,da as Ce,h as st,i as it,ka as Le,ma as Ct,n as lt,t as ie,ta as Lt,u as pt,wa as Pt,xa as Et}from"./chunk-FNZHIZQC.js";import{b as ct}from"./chunk-UQEPPJEO.js";import{a as we}from"./chunk-FCWXYIFC.js";import{a as zt}from"./chunk-BUXVOMDL.js";import{R as dt,Z as ce,h as rt,j as at,k as Xe,l as ke,y as Se}from"./chunk-UTWFU4X6.js";import{a as A}from"./chunk-J6KYLXRD.js";import{a as y,b as Oe,c as E,d as ee}from"./chunk-TYJTJGPO.js";import{a as Ro,b as s}from"./chunk-FY3BTKY4.js";var Ot=Ro((pa,At)=>{At.exports=JBrowseExports["@jbrowse/render-core/useRenderingBackend"]});var ze=s(A(),1);var se=s(Oe(),1),nt=s(we(),1),So=s(Ot(),1);var Xt=s(y(),1),Dt=(0,W.createSvgIcon)((0,Xt.jsx)("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-6h2zm0-8h-2V7h2z"}),"Info");var z=s(E(),1);var Ye=s(E(),1);var H={background:"rgba(255,255,255,0.82)",padding:"4px 6px",borderRadius:3,fontSize:11,lineHeight:"15px",whiteSpace:"nowrap"},R={display:"flex",alignItems:"center",gap:5};var _=s(y(),1),Co={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"hidden",zIndex:2},Lo=(0,Ye.observer)(function({model:e}){let{bubbleHalos:t,walkLift:o,hoveredBubble:r}=e;if(t.length===0)return null;let{scaleX:a,scaleY:l,translateX:i,translateY:d,paneWidth:f,canvasHeight:u}=e,p=e.contigThickness*ut,m=h=>o!==void 0&&!h.nodeIds.some(w=>o.nodeIds.has(w));return(0,_.jsx)("svg",{style:Co,width:f,height:u,"data-testid":"graph-bubble-halos",children:(0,_.jsx)("g",{transform:`translate(${i} ${d}) scale(${a} ${l})`,children:t.filter(h=>!h.whole).map(h=>(0,_.jsx)("path",{d:h.path,fill:"none",stroke:ie[h.kind],strokeOpacity:r&&ct(h.bubble,r)?.45:m(h)?.06:.22,strokeWidth:p,strokeLinecap:"round",strokeLinejoin:"round",vectorEffect:"non-scaling-stroke"},`${h.bubble.start}-${h.bubble.end}`))})})}),Yt=Lo;function Po({color:n}){return(0,_.jsx)("svg",{width:18,height:10,style:{flex:"none"},children:(0,_.jsx)("line",{x1:5,y1:5,x2:13,y2:5,stroke:n,strokeOpacity:.35,strokeWidth:8,strokeLinecap:"round"})})}var $t=(0,Ye.observer)(function({model:e}){let t=new Map;for(let o of e.bubbleHalos)if(!o.whole){let r=ie[o.kind],a=t.get(r)??new Set;a.add(pt[o.kind]),t.set(r,a)}return t.size>0?(0,_.jsx)("div",{style:H,"data-testid":"graph-halo-legend",children:[...t].map(([o,r])=>(0,_.jsxs)("div",{style:R,children:[(0,_.jsx)(Po,{color:o}),(0,_.jsxs)("span",{children:["bubble: ",[...r].join(", ")]})]},o))}):null});var Te=s(A(),1);var Ne=s(Ae(),1),$e=s(E(),1);var Y=s(y(),1),te={width:18,height:8,borderRadius:2,flex:"none"},Eo={marginBottom:2},Io={...te,width:48};function me({walk:n,label:e,reference:t,hint:o,at:r}){let a=Ct(n,t);return(0,Y.jsxs)("div",{style:Eo,title:[a.hover,o].filter(Boolean).join(" \xB7 ")||void 0,children:[(0,Y.jsxs)("div",{style:R,children:[(0,Y.jsx)("div",{style:{...a.shades?Io:te,background:Le(n.encoding)}}),(0,Y.jsxs)("span",{children:[(0,Y.jsx)("strong",{children:e}),a.delta,a.outside,a.reversed]})]}),r?(0,Y.jsx)("div",{"data-testid":"graph-walk-at",children:r}):a.scale?(0,Y.jsx)("div",{children:a.scale}):null]})}var O=s(A(),1);var Go=50;function Ft(n,e){return e>0?Math.max(1,n/e):Go}function To(n){let e=new Set,t=1/0,o=-1/0;for(let r of n)e.add(r.minY),t=Math.min(t,r.minY),o=Math.max(o,r.minY);return e.size>1?(o-t)/(e.size-1):void 0}function No(n,e,t){let o=Ft(e,n.length);return{x:o,y:t>0?Ft(t,n.length):To(n)??o}}function Kt(n,e,t,o){return n===void 0?No(e,t,o):typeof n=="number"?{x:n,y:n}:n}function Ho(n,e,t){let o=n.get(e);o||(o=new Map,n.set(e,o));let r=o.get(t);return r||(r=[],o.set(t,r)),r}function Vt(n,e,t,o,r,a,l){let i=Math.floor(t/e.x),d=Math.floor(r/e.x),f=Math.floor(o/e.y),u=Math.floor(a/e.y);for(let p=i;p<=d;p++)for(let m=f;m<=u;m++)Ho(n,p,m).push(l)}function Zt(n,e,t,o,r,a){let l=Math.floor((t-r)/e.x),i=Math.floor((t+r)/e.x),d=Math.floor((o-a)/e.y),f=Math.floor((o+a)/e.y),u=[],p=new Set;for(let m=l;m<=i;m++){let h=n.get(m);if(h)for(let w=d;w<=f;w++){let v=h.get(w);if(v)for(let g of v)p.has(g)||(p.add(g),u.push(g))}}return u}var Ee=class{constructor(e,t){this.cells=new Map;let o=[],r=0,a=0;for(let[l,i]of Object.entries(e))for(let d=0;d<i.length-1;d++){let f=i[d],u=i[d+1],p=Math.min(f.x,u.x),m=Math.min(f.y,u.y),h=Math.max(f.x,u.x),w=Math.max(f.y,u.y);r+=h-p,a+=w-m,o.push({entry:{nodeId:l,segmentIdx:d},minX:p,minY:m,maxX:h,maxY:w})}this.cellSize=Kt(t,o,r,a);for(let l of o)Vt(this.cells,this.cellSize,l.minX,l.minY,l.maxX,l.maxY,l.entry)}query(e,t,o,r=o){return Zt(this.cells,this.cellSize,e,t,o,r)}},Ie=class{constructor(e,t,o,r,a,l,i=0,d){this.cells=new Map;this.edgeCurves=mt(e,t,r,l,i,d);let f=[],u=0,p=0;for(let m=0;m<t.edges.length;m++){let h=t.edges[m],w=e[h.from],v=e[h.to],g=this.edgeCurves.get(m);if(w?.length&&v?.length&&g){let{minX:L,minY:N,maxX:F,maxY:b}=rt(g),k=h.pathIds?.length??0;if(o&&k>0){let x=0,S=0;for(let G of ke(w,v,k,r))x=Math.max(x,Math.abs(G.x)),S=Math.max(S,Math.abs(G.y));L-=x,N-=S,F+=x,b+=S}u+=F-L,p+=b-N,f.push({ei:m,minX:L,minY:N,maxX:F,maxY:b})}}this.cellSize=Kt(a,f,u,p);for(let m of f)Vt(this.cells,this.cellSize,m.minX,m.minY,m.maxX,m.maxY,m.ei)}getCurves(e){return this.edgeCurves.get(e)}query(e,t,o,r=o){return Zt(this.cells,this.cellSize,e,t,o,r)}};function Jt(n,e,t,o,r,a){let l=r-t,i=a-o,d=l*l+i*i;if(d===0)return Math.hypot(n-t,e-o);let f=Math.max(0,Math.min(1,((n-t)*l+(e-o)*i)/d));return Math.hypot(n-(t+f*l),e-(o+f*i))}function Wo(n,e,t,o,r,a,l,i,d,f){let u=1/0,p=20,m=t,h=o;for(let w=1;w<=p;w++){let v=w/p,g=1-v,L=g*g*g*t+3*g*g*v*r+3*g*v*v*l+v*v*v*d,N=g*g*g*o+3*g*g*v*a+3*g*v*v*i+v*v*v*f;u=Math.min(u,Jt(n,e,m,h,L,N)),m=L,h=N}return u}function Bo(n,e,t){return Wo(n,e,t.x0,t.y0,t.cx0,t.cy0,t.cx1,t.cy1,t.x1,t.y1)}function jt(n,e,t,o=1){let r=1/0;for(let a of t){let l=Bo(n,e,o===1?a:{x0:a.x0,y0:a.y0*o,cx0:a.cx0,cy0:a.cy0*o,cx1:a.cx1,cy1:a.cy1*o,x1:a.x1,y1:a.y1*o});l<r&&(r=l)}return r}var Ut=new WeakMap;function _o(n,e){let t=Ut.get(n);if(t?.version===e)return t.index;let o=new Ee(n);return Ut.set(n,{version:e,index:o}),o}var qt=new WeakMap;function zo(n,e,t,o,r,a,l){let i=qt.get(n);if(i?.graph===e&&i.drawPaths===t&&i.scaleX===o.scaleX&&i.scaleY===o.scaleY&&i.version===r&&i.deletions===a&&i.routes===l)return i.index;let d=new Ie(n,e,t,o,void 0,a,r,l);return qt.set(n,{graph:e,drawPaths:t,scaleX:o.scaleX,scaleY:o.scaleY,version:r,index:d,deletions:a,routes:l}),d}var Ao=5;function Qt(n,e,t,o,r=0,a){let l=Xe(o),i=_o(n,r),d=h=>Math.max(Ao,h)/o.scaleX,f=d(a?.maxHalfWidthPx??0),u=i.query(e,t,f,f/l),p=null,m=1/0;for(let{nodeId:h,segmentIdx:w}of u){let v=n[h],g=Jt(e,t*l,v[w].x,v[w].y*l,v[w+1].x,v[w+1].y*l);g<m&&g<d(a?.halfWidthPx(h)??0)&&(m=g,p=h)}return p}function en(n,e,t,o,r,a,l=0,i,d,f){let u=Xe(r),p=10/r.scaleX,m=zo(n,e,a,r,l,i,f),h=m.query(t,o,p,p/u),w=null,v=p;for(let g of h){let L=e.edges[g],N=n[L.from],F=n[L.to];if(!N?.length||!F?.length||d?.has(g))continue;let b=L.pathIds?.length??0,k=m.getCurves(g);if(!k)continue;let x;if(!a||b===0)x=jt(t,o*u,k,u);else{let S=1/0;for(let G of ke(N,F,b,r)){let ve=G.x===0&&G.y===0?k:at(k,G.x,G.y),ot=jt(t,o*u,ve,u);ot<S&&(S=ot)}x=S}x<v&&(v=x,w=g)}return w}function tn(n){let e=n.deltaY*(n.deltaMode===1?40:n.deltaMode===2?800:1),t=(n.ctrlKey?10:1)*e/100;return 1.1**-Math.max(-2,Math.min(2,t))}var nn=s(we(),1);function Ge(n,e){(0,O.useEffect)(()=>{if(!n)return;let t=n;function o(r){if(e.hostPlacesX)return;e.host&&r.stopPropagation(),r.preventDefault();let a=t.getBoundingClientRect();e.zoom(tn(r),r.clientX-a.left,r.clientY-a.top)}return t.addEventListener("wheel",o,{passive:!1}),()=>{t.removeEventListener("wheel",o)}},[n,e])}function on(n){let e=(0,O.useRef)({x:0,y:0}),t=(0,O.useRef)(!1),o=(0,O.useRef)({frame:0,pan:null,hover:null});(0,O.useEffect)(()=>()=>{cancelAnimationFrame(o.current.frame)},[]);let[r,a]=(0,O.useState)(void 0),[l,i]=(0,O.useState)(void 0);function d(b,k){return{x:(b-n.translateX)/n.scaleX,y:(k-n.translateY)/n.scaleY}}function f(b){let k=b.currentTarget.getBoundingClientRect();return d(b.clientX-k.left,b.clientY-k.top)}function u(b,k){let{nodePositions:x}=n,S=b*n.scaleX+n.translateX,G=k*n.scaleY+n.translateY;if(n.layoutResult?.tubeMap)return n.tubeMapNodeAt(S,G);let ve=n.referenceStripNodeAt(S,G);return ve||(x?Qt(x,b,k,n.axisScale,n.positionsVersion,n.nodeInk):null)}function p(b){if(b.button===0){if(t.current=!1,n.hostPlacesX)return;n.host&&b.stopPropagation();let{x:k,y:x}=f(b),S=n.layoutResult?.tubeMap||b.nativeEvent.offsetY<n.referenceStripZonePx?null:u(k,x);S?n.setDraggingNode(S):n.setPanning(!0),e.current={x:b.clientX,y:b.clientY}}}function m(){let b=o.current;if(b.frame=0,b.pan&&(n.setTransform(n.scale,n.translateX+b.pan.dx,n.translateY+b.pan.dy),b.pan=null),b.hover&&n.nodePositions&&n.graph){let{x:k,y:x}=d(b.hover.x,b.hover.y);b.hover=null;let S=u(k,x);n.setHoveredNode(S),n.setHoveredEdge(S||n.layoutResult?.tubeMap?null:en(n.nodePositions,n.graph,k,x,n.axisScale,n.effectiveDrawPaths&&!n.facetPanels,n.positionsVersion,n.deletionEdgeIndexes,n.hiddenEdgeIndexes,n.deletionRoutes))}}function h(){o.current.frame||(o.current.frame=requestAnimationFrame(m))}function w(){let b=o.current;cancelAnimationFrame(b.frame),b.frame=0,b.pan=null,b.hover=null}function v(b){let k=b.clientX-e.current.x,x=b.clientY-e.current.y;e.current={x:b.clientX,y:b.clientY},(Math.abs(k)>1||Math.abs(x)>1)&&(t.current=!0);let S=o.current;if(n.draggingNode)n.moveNode(n.draggingNode,k/n.scaleX,x/n.scaleY);else if(n.isPanning)S.pan={dx:(S.pan?.dx??0)+k,dy:(S.pan?.dy??0)+x},h();else{let G=b.currentTarget.getBoundingClientRect();S.hover={x:b.clientX-G.left,y:b.clientY-G.top},h()}}function g(){n.stopDragging()}function L(){w(),(0,nn.isAlive)(n)&&(n.stopDragging(),n.setHoveredNode(null),n.setHoveredEdge(null))}function N(b){let{x:k,y:x}=f(b),S=u(k,x);if(S){b.preventDefault(),a({nodeId:S,top:b.clientY,left:b.clientX});return}let G=n.walkRowAt(k*n.scaleX+n.translateX,x*n.scaleY+n.translateY);G!==void 0&&(b.preventDefault(),i({row:G,top:b.clientY,left:b.clientX}))}function F(b){if(!t.current){let{x:k,y:x}=f(b),S=u(k,x);n.setSelectedNode(S),S&&n.showNodeDetails(S)}}return{handlers:{onMouseDown:p,onMouseMove:v,onMouseUp:g,onMouseLeave:L,onClick:F,onContextMenu:N},contextNode:r,contextRow:l,closeContextMenu:()=>{a(void 0),i(void 0)}}}var K=s(y(),1),Do={position:"absolute",left:0,top:0,zIndex:4,display:"grid",gap:8,lineHeight:"normal"},Yo={height:34,padding:"2px 6px",boxSizing:"border-box",fontFamily:"inherit",fontSize:11,color:"inherit",cursor:"pointer",border:"none",background:"none",textAlign:"left",display:"block"},$o=(0,$e.observer)(function({model:e,lift:t,width:o,height:r,cell:a,handlers:l}){let[i,d]=(0,Te.useState)(null),f=t.walks[0];Ge(i,e),(0,Te.useEffect)(()=>{if(!i)return;let p=new Ce(i);p.resize(o,r);let m=(0,Ne.computed)(()=>e.buildDrawing(t,!1)),h,w=(0,Ne.autorun)(()=>{let v=m.get();v&&(v!==h&&(p.uploadGeometry(v.batch),h=v),e.applyHighlights(p),e.paint(p))});return()=>{w(),p.dispose()}},[i,e,t,o,r]);let u=e.walkLabel(f.name);return(0,K.jsxs)("div",{style:a,children:[(0,K.jsx)("button",{type:"button",style:Yo,"data-testid":"graph-facet-title",onClick:()=>{e.liftWalks([f.name]),e.setFacet("")},children:(0,K.jsx)(me,{walk:f,label:u,reference:e.walkReference,hint:`click to lift ${u} alone`,at:e.hoveredOn(f)})}),(0,K.jsx)("canvas",{ref:d,"data-testid":"graph-facet-canvas",style:{width:o,height:r,display:"block",cursor:e.isPanning||e.draggingNode?"grabbing":"grab"},...l})]})}),Fo=(0,$e.observer)(function({model:e,handlers:t}){let o=e.facetPanels,r=e.facetGrid,a=e.facetPlacement;if(!o||!r||!a)return null;let{columns:l,width:i,height:d}=r;return(0,K.jsx)("div",{"data-testid":"graph-facet-panels",style:{...Do,width:e.paneWidth,minHeight:e.canvasHeight,gridTemplateColumns:`repeat(${l}, ${i}px)`,background:e.darkMode?"#1f1f1f":"white"},children:o.map((f,u)=>(0,K.jsx)($o,{model:e,lift:f,width:i,height:d,cell:{gridRow:Math.floor(a.cells[u]/l)+1,gridColumn:a.cells[u]%l+1},handlers:t},f.walks[0].name))})}),rn=Fo;var an=s(A(),1),sn=s(E(),1),V=s(y(),1),Ko={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"hidden",zIndex:2},he="#daa520",Vo=4,Zo=1,jo=2,Uo=(0,sn.observer)(function({model:e}){let t=`exon-outline-${(0,an.useId)().replaceAll(/[^\w-]/g,"")}`,{genePins:o,walkLift:r,nodeInk:a}=e;if(o.length===0)return null;let{scaleX:l,scaleY:i,translateX:d,translateY:f,paneWidth:u,canvasHeight:p}=e,m=g=>{let L=a.halfWidthPx(g)*2;return r?.nodeIds.has(g)?Math.max(L,r.walks.length*Vo):L},h=o.flatMap(g=>g.exonsByNode.map(({nodeId:L,d:N})=>({key:`${g.gene.name}-${g.gene.start}-${L}`,d:N,inner:m(L)+2*Zo}))),w=`translate(${d} ${f}) scale(${l} ${i})`,v={fill:"none",strokeLinecap:"round",strokeLinejoin:"round",vectorEffect:"non-scaling-stroke"};return(0,V.jsxs)("svg",{style:Ko,width:u,height:p,"data-testid":"graph-gene-pins",children:[(0,V.jsx)("mask",{id:t,maskUnits:"userSpaceOnUse",x:0,y:0,width:u,height:p,children:(0,V.jsxs)("g",{transform:w,children:[h.map(g=>(0,V.jsx)("path",{d:g.d,stroke:"#fff",strokeWidth:g.inner+2*jo,...v},g.key)),h.map(g=>(0,V.jsx)("path",{d:g.d,stroke:"#000",strokeWidth:g.inner,...v},g.key))]})}),(0,V.jsx)("rect",{width:u,height:p,fill:he,mask:`url(#${t})`})]})}),ln=Uo;var cn=s(y(),1),pn=(0,W.createSvgIcon)((0,cn.jsx)("path",{d:"M3 5v4h2V5h4V3H5c-1.1 0-2 .9-2 2m2 10H3v4c0 1.1.9 2 2 2h4v-2H5zm14 4h-4v2h4c1.1 0 2-.9 2-2v-4h-2zm0-16h-4v2h4v4h2V5c0-1.1-.9-2-2-2"}),"CropFree");var Fe=s(y(),1),dn=(0,W.createSvgIcon)([(0,Fe.jsx)("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14"},"0"),(0,Fe.jsx)("path",{d:"M12 10h-2v2H9v-2H7V9h2V7h1v2h2z"},"1")],"ZoomIn");var un=s(y(),1),fn=(0,W.createSvgIcon)((0,un.jsx)("path",{d:"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14M7 9h5v1H7z"}),"ZoomOut");var D=s(ee(),1),je=s(E(),1),_n=s(ce(),1);var Z=s(ee(),1),mn=s(E(),1),hn=s(ce(),1),pe=s(y(),1),qo=(0,hn.makeStyles)()({formControl:{minWidth:100}}),Jo=(0,mn.observer)(function({model:e}){let{classes:t}=qo(),o=e.colorSchemeLock;return(0,pe.jsxs)(Z.FormControl,{size:"small",className:t.formControl,disabled:o!==void 0,title:o?.why,children:[(0,pe.jsx)(Z.InputLabel,{children:"Color"}),(0,pe.jsx)(Z.Select,{value:e.chosenColorScheme,label:"Color",renderValue:o?()=>o.value:void 0,onChange:r=>{e.setColorScheme(r.target.value)},children:dt.map(({value:r,label:a})=>(0,pe.jsx)(Z.MenuItem,{value:r,children:a},r))})]})}),gn=Jo;var Ve=s(ee(),1),Ze=s(E(),1),bn=s(ce(),1),de=s(y(),1),yn=(0,bn.makeStyles)()({stats:{marginLeft:"auto"},perf:{color:"#888",fontVariantNumeric:"tabular-nums"}});function Ke(n){return n===void 0?"\u2013":`${Math.round(n)}ms`}var Qo=(0,Ze.observer)(function({model:e}){let{classes:t}=yn(),{lastFetchMs:o,lastLayoutMs:r,lastGeometryMs:a}=e,l=o!==void 0||r!==void 0||a!==void 0;return e.showPerf&&l?(0,de.jsxs)(Ve.Typography,{variant:"caption",className:t.perf,"data-testid":"graph-perf-stats",children:["fetch ",Ke(o)," \xB7 layout ",Ke(r)," \xB7 geom"," ",Ke(a)]}):null}),er=(0,Ze.observer)(function({model:e}){let{classes:t}=yn();return(0,de.jsxs)("div",{className:t.stats,"data-testid":"graph-stats","data-node-count":e.nodeCount,"data-edge-count":e.edgeCount,"data-path-count":e.pathCount,"data-fetch-ms":e.lastFetchMs??"","data-layout-ms":e.lastLayoutMs??"","data-geometry-ms":e.lastGeometryMs??"","data-geometry-strokes":e.lastGeometryStrokeCount??"",children:[(0,de.jsxs)(Ve.Typography,{variant:"body2",component:"span",children:[e.nodeCount," nodes, ",e.edgeCount," edges",e.pathCount>0?`, ${e.pathCount} paths`:""]})," ",(0,de.jsx)(Qo,{model:e})]})}),vn=er;var X=s(ee(),1),wn=s(E(),1),kn=s(ce(),1),j=s(y(),1),tr=(0,kn.makeStyles)()({formControl:{minWidth:150}}),nr=(0,wn.observer)(function({model:e}){let{classes:t}=tr(),{graph:o}=e;return(0,j.jsxs)(X.FormControl,{size:"small",className:t.formControl,children:[(0,j.jsx)(X.InputLabel,{children:"Layout"}),(0,j.jsx)(X.Select,{value:e.chosenLayoutMode,label:"Layout","data-testid":"graph-layout-select",onChange:r=>{e.switchLayout(r.target.value)},children:lt.map(({value:r,label:a,description:l,available:i})=>(0,j.jsx)(X.MenuItem,{value:r,disabled:o?!i(o):!1,children:(0,j.jsx)(X.Tooltip,{title:l,placement:"right",children:(0,j.jsx)("span",{children:a})})},r))})]})}),Sn=nr;var $=s(ee(),1),xn=s(E(),1),Mn=s(ce(),1),U=s(y(),1),or=(0,Mn.makeStyles)()({formControl:{minWidth:130,maxWidth:240}}),rr=(0,xn.observer)(function({model:e}){let{classes:t}=or(),{repeatChoices:o}=e;if(e.chosenLayoutMode!=="walkrows"||o.length===0)return null;let r=new Set(o.map(a=>a.key));return(0,U.jsxs)($.FormControl,{size:"small",className:t.formControl,children:[(0,U.jsx)($.InputLabel,{children:"Repeat"}),(0,U.jsxs)($.Select,{value:r.has(e.repeatKey)?e.repeatKey:"",label:"Repeat","data-testid":"graph-repeat-select",onChange:a=>{e.setRepeatKey(a.target.value)},children:[(0,U.jsx)($.MenuItem,{value:"",children:(0,U.jsx)("em",{children:"Whole window"})}),o.map(({key:a,name:l,unit:i})=>(0,U.jsxs)($.MenuItem,{value:a,children:[l," \xB7 ",i.toLocaleString()," bp unit"]},a))]})]})}),Rn=rr;var In=s(A(),1),Gn=s(Oe(),1);var Cn=s(y(),1),Ln=(0,W.createSvgIcon)((0,Cn.jsx)("path",{d:"M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"}),"Delete");var Pn=s(y(),1),En=(0,W.createSvgIcon)((0,Pn.jsx)("path",{d:"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2m0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2"}),"MoreVert");var Tn=s(E(),1);var q=s(y(),1),ar=(0,Tn.observer)(function({model:e}){let[t,o]=(0,In.useState)(!1);return(0,q.jsxs)(q.Fragment,{children:[(0,q.jsx)(Gn.CascadingMenuButton,{size:"small",menuItems:[{type:"checkbox",label:"Linear layout",checked:e.linearLayout,onClick:()=>{e.setLinearLayout(!e.linearLayout),e.recomputeLayout()}},{type:"checkbox",label:"Show deletion edges",checked:e.showDeletionEdges,onClick:()=>{e.setShowDeletionEdges(!e.showDeletionEdges)}},{type:"checkbox",label:"Show timings",checked:e.showPerf,onClick:()=>{e.setShowPerf(!e.showPerf)}},{type:"divider"},{label:"Settings",icon:_t,onClick:()=>{o(!0)}},{type:"divider"},{label:"Return to import form",icon:Ln,onClick:()=>{e.clearGraph()}}],children:(0,q.jsx)(En,{})}),(0,q.jsx)(zt,{model:e,open:t,onClose:()=>{o(!1)}})]})}),Nn=ar;var B=s(ee(),1),Hn=s(E(),1),Wn=s(ce(),1),J=s(y(),1),sr=(0,Wn.makeStyles)()({formControl:{minWidth:130,maxWidth:260}}),ir=(0,Hn.observer)(function({model:e}){let{classes:t}=sr(),{walkChoices:o}=e;if(o.length===0||!e.liftsWalks)return null;let r=new Set(o.map(i=>i.name)),a=new Map(o.map(i=>[i.name,i.label])),l=e.walkLayers.map(i=>i.walk).filter(i=>r.has(i));return(0,J.jsxs)(B.FormControl,{size:"small",className:t.formControl,children:[(0,J.jsx)(B.InputLabel,{children:"Walks"}),(0,J.jsx)(B.Select,{multiple:!0,value:l,label:"Walks","data-testid":"graph-walk-select",renderValue:i=>i.map(d=>a.get(d)).join(", "),onChange:i=>{let{value:d}=i.target;e.liftWalks(typeof d=="string"?d.split(","):d)},children:o.map(({name:i,label:d})=>(0,J.jsxs)(B.MenuItem,{value:i,dense:!0,children:[(0,J.jsx)(B.Checkbox,{size:"small",checked:l.includes(i)}),(0,J.jsx)(B.ListItemText,{primary:d})]},i))})]})}),Bn=ir;var P=s(y(),1),lr=(0,_n.makeStyles)()({toolbar:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",borderBottom:"1px solid #ddd"}}),cr=(0,je.observer)(function({model:e}){return(0,P.jsx)(D.Typography,{variant:"body2",children:e.zoomPercent})}),pr=(0,je.observer)(function({model:e}){let{classes:t}=lr();return(0,P.jsxs)("div",{className:t.toolbar,children:[(0,P.jsx)(Sn,{model:e}),(0,P.jsx)(gn,{model:e}),(0,P.jsx)(Bn,{model:e}),(0,P.jsx)(Rn,{model:e}),(0,P.jsx)(D.Tooltip,{title:"Zoom in",children:(0,P.jsx)(D.IconButton,{size:"small",onClick:()=>{e.zoom(1.5,e.viewBox.width/2,e.viewBox.height/2)},children:(0,P.jsx)(dn,{})})}),(0,P.jsx)(D.Tooltip,{title:"Zoom out",children:(0,P.jsx)(D.IconButton,{size:"small",onClick:()=>{e.zoom(1/1.5,e.viewBox.width/2,e.viewBox.height/2)},children:(0,P.jsx)(fn,{})})}),(0,P.jsx)(D.Tooltip,{title:"Zoom to fit",children:(0,P.jsx)(D.IconButton,{size:"small",onClick:()=>{e.zoomToFit()},children:(0,P.jsx)(pn,{})})}),(0,P.jsx)(cr,{model:e}),(0,P.jsx)(vn,{model:e}),(0,P.jsx)(Nn,{model:e})]})}),zn=pr;var Xn=s(we(),1),Dn=s(E(),1);var ne=s(y(),1);function ge({x:n,y:e,w:t,text:o,note:r,color:a,edge:l=a,italic:i,small:d,dimmed:f,title:u,testId:p,onClick:m,onHover:h}){return(0,ne.jsxs)("g",{style:{pointerEvents:m||h?"auto":"none",cursor:m?"pointer":void 0,opacity:f?.35:1},"data-testid":p,onClick:m,onMouseEnter:()=>{h?.(!0)},onMouseLeave:()=>{h?.(!1)},children:[u?(0,ne.jsx)("title",{children:u}):null,(0,ne.jsx)("rect",{x:n-t/2,y:e-11-4+2,width:t,height:17,rx:3,fill:"rgba(255,255,255,0.85)",stroke:l,strokeWidth:d?.6:1}),(0,ne.jsxs)("text",{x:n,y:e,fontSize:d?10:11,fontFamily:"sans-serif",fontStyle:i?"italic":void 0,fontWeight:i?600:void 0,fill:a,textAnchor:"middle",children:[o,r?(0,ne.jsx)("tspan",{fontStyle:"normal",fontWeight:"normal",children:r}):null]})]})}var Q=s(y(),1),dr={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"hidden",zIndex:3},On="#1c1c22",ur=(0,Dn.observer)(function({model:e}){let{bubbles:t,genes:o,routes:r}=e.overlayLabels;if(t.length+o.length+r.length===0)return null;let{walkLift:a,scaleY:l,translateY:i,contigThickness:d}=e,f=p=>a!==void 0&&!p.nodeIds.some(m=>a.nodeIds.has(m)),u=p=>a!==void 0&&!p.route.walks.some(m=>a.names.has(m));return(0,Q.jsxs)("svg",{style:dr,width:e.paneWidth,height:e.canvasHeight,"data-testid":"graph-label-layer",children:[o.map(({item:p,x:m,y:h,w,text:v})=>{let{gene:g}=p,L=ft(p);return(0,Q.jsxs)("g",{children:[(0,Q.jsx)("line",{x1:m,x2:m,y1:h-11-2,y2:p.at.y*l+i+d/2,stroke:On,strokeWidth:.8,strokeOpacity:.6}),(0,Q.jsx)(ge,{x:m,y:h,w,text:g.name,note:v.slice(g.name.length)||void 0,color:On,edge:he,italic:!0,title:`${g.name} ${g.refName}:${g.start.toLocaleString()}-${g.end.toLocaleString()}${L?`, ${L} in the cut`:""}`,testId:"graph-gene-pin-label"})]},`${g.name}-${g.start}`)}),r.map(({item:{halo:p,route:m},x:h,y:w,w:v,text:g})=>(0,Q.jsx)(ge,{x:h,y:w,w:v,text:g,color:ie[p.kind],small:!0,dimmed:u(m),title:`${m.route.walks.length} walk(s): ${m.route.walks.join(", ")}`,testId:"graph-route-label"},`${p.bubble.start}-${p.bubble.end}-${m.route.steps.join(",")}`)),t.map(({item:p,x:m,y:h,w,text:v})=>(0,Q.jsx)(ge,{x:m,y:h,w,text:v,color:ie[p.kind],dimmed:f(p),title:`${p.label}
+${p.bubble.segmentCount} segments \xB7 click to open`,testId:"graph-bubble-halo-label",onClick:()=>{e.popBubble(p.bubble)},onHover:g=>{(0,Xn.isAlive)(e)&&e.setHoveredBubble(g?p.bubble:null)}},`${p.bubble.start}-${p.bubble.end}`))]})}),Yn=ur;var He=s(A(),1);var Fn=s(Rt(),1),Kn=s(Ae(),1),Ue=s(E(),1);var I=s(y(),1),fr={position:"absolute",left:0,top:0,pointerEvents:"none",zIndex:5},mr=(0,Ue.observer)(function({model:e}){let t=(0,He.useRef)(null),{referenceStripShown:o,paneWidth:r,canvasHeight:a}=e;return(0,He.useEffect)(()=>(0,Kn.autorun)(()=>{let l=t.current,i=e.referenceStripFrame,d=l?.getContext("2d");if(l&&d&&i&&e.referenceStripShown){let f=(0,Fn.getDpr)(),u=e.paneWidth,p=e.canvasHeight;l.width=Math.round(u*f),l.height=Math.round(p*f),d.setTransform(f,0,0,f,0,0),d.clearRect(0,0,u,p),Lt(d,e.referenceStripBlocks,i,{width:u,lit:e.referenceStripLit,darkMode:e.darkMode,dpr:f})}}),[e]),(0,I.jsx)("canvas",{ref:t,"data-testid":o?"graph-reference-strip":void 0,style:{...fr,width:r,height:a,display:o?"block":"none"}})}),Vn=mr,Zn=18,hr="linear-gradient(to right, hsl(0, 70%, 50%) 0 33%, hsl(120, 70%, 50%) 33% 61%, hsl(240, 70%, 50%) 61%)",gr=6;function br(n){let e=n.filter((r,a)=>r!==n[a-1]),t=Math.min(gr,e.length),o=Array.from({length:t},(r,a)=>e[t>1?Math.round(a*(e.length-1)/(t-1)):0]);return o.length>1?`linear-gradient(to right, ${o.join(", ")})`:o[0]??fe}function $n({rows:n}){return(0,I.jsx)("div",{style:{width:Zn,flex:"none"},children:n.map(({key:e,background:t})=>(0,I.jsx)("div",{style:{height:n.length>1?3:4,background:t}},e))})}function yr(n){return n.walkLift?.walks.map(e=>({key:e.name,background:Le(e.encoding)}))??[{key:"scheme",background:n.effectiveColorScheme==="reference-position"?hr:br(n.referenceStripBlocks.map(e=>e.colors[0]))}]}function vr(){return(0,I.jsx)("svg",{width:Zn,height:10,style:{flex:"none"},children:(0,I.jsx)("path",{d:"M0,5 L8,0 L8,10 Z M18,5 L10,0 L10,10 Z",fill:"#18181c"})})}var jn=(0,Ue.observer)(function({model:e}){let t=(e.walkLift?.walks.length??0)>1;return e.referenceStripShown?(0,I.jsxs)("div",{style:H,"data-testid":"graph-reference-strip-legend",children:[(0,I.jsxs)("div",{style:R,children:[(0,I.jsx)($n,{rows:yr(e)}),(0,I.jsxs)("span",{children:["top strip: reference segments at their bp",t?", a row per walk":""]})]}),e.referenceStripFaded?(0,I.jsxs)("div",{style:R,children:[(0,I.jsx)($n,{rows:[{key:"pale",background:fe}]}),(0,I.jsxs)("span",{children:["reference not on"," ",t?"that row's walk":e.liftedWalksLabel]})]}):null,e.referenceStripOverhangs?(0,I.jsxs)("div",{style:R,children:[(0,I.jsx)(vr,{}),(0,I.jsx)("span",{children:"the graph draws reference past this edge"})]}):null]}):null});var Be=s(A(),1);var Jn=s(Rt(),1),Qn=s(Ae(),1),qe=s(E(),1);var M=s(y(),1),wr={position:"absolute",left:0,top:0,pointerEvents:"none",zIndex:1},kr=(0,qe.observer)(function({model:e}){let t=(0,Be.useRef)(null),{tubeMapPicture:o,paneWidth:r,canvasHeight:a}=e;return(0,Be.useEffect)(()=>(0,Qn.autorun)(()=>{let l=t.current,i=e.tubeMapPicture,d=e.tubeMapFrame,f=l?.getContext("2d");if(l&&f&&i&&d){let u=(0,Jn.getDpr)(),p=e.paneWidth,m=e.canvasHeight;l.width=Math.round(p*u),l.height=Math.round(m*u),f.setTransform(u,0,0,u,0,0),f.clearRect(0,0,p,m);let h={...d,width:p,highlightNode:e.hoveredNode??e.selectedNode,darkMode:e.darkMode,tubeColors:e.tubeMapTubeColors,nodeColors:e.tubeMapNodeColors};Nt(f,i,h),Tt(f,e.tubeMapDeviations,h),It(f,e.tubeMapConnectors,e.connectorZoneBottom,h);let{bounds:w}=i;Ht(f,e.tubeMapGenes,h,d.y(w.minY)-2);let v=e.tubeMapRulerBoxes;v&&Et(f,v,h,d.y(w.maxY)+4,e.layoutResult?.referenceAxis)}}),[e]),(0,M.jsx)("canvas",{ref:t,"data-testid":o?"graph-tube-map":void 0,style:{...wr,width:r,height:a,display:o?"block":"none"}})}),eo=kr,We=18;function Sr(){let n=[[.5,5.5],[8.5,We-.5]];return(0,M.jsx)("svg",{width:We,height:7,style:{flex:"none"},children:(0,M.jsx)("path",{d:n.map(([e,t])=>`M${e},6 V1.5 H${t} V6`).join(" "),fill:"none",stroke:Pt(),strokeWidth:1})})}var Je={width:We,height:7,flex:"none"},xr={...Je,display:"flex",justifyContent:"center",backgroundColor:"#b8b8c0"};function Mr(){return(0,M.jsx)("div",{style:xr,children:(0,M.jsx)("div",{style:{width:2,backgroundColor:Gt()}})})}function Un({colors:n}){let e=100/n.length,t=n.map((o,r)=>`${o} ${r*e}% ${(r+1)*e}%`);return(0,M.jsx)("div",{style:{...Je,background:`linear-gradient(to right, ${t.join(", ")})`}})}var qn={width:We,flex:"none",textAlign:"center",fontFamily:"monospace",fontSize:12};function Rr(){return(0,M.jsx)("div",{style:{...Je,backgroundColor:"grey"}})}function oe({swatch:n,children:e}){return(0,M.jsxs)("div",{style:R,children:[n,(0,M.jsx)("span",{children:e})]})}var to=(0,qe.observer)(function({model:e}){let{logWidths:t,foldBp:o,forwardReads:r,reverseReads:a,mismatches:l}=e.tubeMapKeys,i=[r&&(0,M.jsx)(oe,{swatch:(0,M.jsx)(Un,{colors:st}),children:"read on the forward strand"},"fwd"),a&&(0,M.jsx)(oe,{swatch:(0,M.jsx)(Un,{colors:it}),children:"read on the reverse strand"},"rev"),l.has("substitution")&&(0,M.jsx)(oe,{swatch:(0,M.jsx)("span",{style:qn,children:"A"}),children:"a read's base unlike the node's"},"sub"),l.has("insertion")&&(0,M.jsx)(oe,{swatch:(0,M.jsx)("span",{style:qn,children:"*"}),children:"bases a read inserts"},"ins"),l.has("deletion")&&(0,M.jsx)(oe,{swatch:(0,M.jsx)(Rr,{}),children:"bases a read skips"},"del"),o!==void 0&&(0,M.jsxs)(oe,{swatch:(0,M.jsx)(Mr,{}),children:["a haplotype's variant under ",Se(o)]},"fold"),t&&(0,M.jsx)(oe,{swatch:(0,M.jsx)(Sr,{}),children:"width grows with log of length"},"log")].filter(Boolean);return i.length>0?(0,M.jsx)("div",{style:H,"data-testid":"graph-tube-map-legend",children:i}):null});var no=s(ee(),1),oo=s(E(),1),ao=s(y(),1),Cr={position:"absolute",left:8,zIndex:5,background:"rgba(255,255,255,0.9)",textTransform:"none"},Lr=(0,oo.observer)(function({model:e}){let{poppedFrom:t}=e;return t?(0,ao.jsxs)(no.Button,{size:"small",variant:"outlined",style:{...Cr,...e.facetPanels?{bottom:8}:{top:8}},"data-testid":"graph-unpop-bubble",onClick:()=>{e.unpopBubble()},children:["\u25C0 Back to ",t.label]}):null}),ro=Lr;var so=s(Oe(),1);var io=s(E(),1);var lo=s(y(),1),_e=(0,io.observer)(function({model:e,row:t,bars:o,top:r,left:a,onClose:l}){let i=e.walkRowLaunchTarget(t,o??e.walkRowBars),d=i?.assembly;return(0,lo.jsx)(so.Menu,{open:!0,anchorReference:"anchorPosition",anchorPosition:{top:r,left:a},onClose:()=>{l()},onMenuItemClick:f=>{f()},menuItems:[i&&d?{label:`Linear genome view \u2014 ${d} ${Pe(i.location)}`,icon:De,onClick:()=>{e.showInLinearView({location:i.location,assembly:d})}}:{label:"Linear genome view",icon:De,disabled:!0,disabledHelpText:i?`No assembly in this session is ${i.location.haplotype??i.label}`:"This walk states no contig coordinates",onClick:()=>{}}]})});var fo=s(A(),1);var Qe=s(E(),1);var co=s(A(),1);function Pr(n){return n==="class"?"className":/^(data|aria)-/.test(n)?n:n.replace(/-([a-z])/g,(e,t)=>t.toUpperCase())}function po(n,e){if(typeof n=="string")return n;let t={key:e};for(let[o,r]of Object.entries(n.attrs))r!==void 0&&(t[Pr(o)]=r);return(0,co.createElement)(n.tag,t,...n.children.map(po))}function re({el:n}){return po(n,0)}var C=s(y(),1),Ir={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"visible",zIndex:3},Gr="#111",Tr="#9e9e9e",be={width:18,height:bt-4,borderRadius:2},Nr={...be,display:"flex",justifyContent:"center"};function uo({color:n}){return(0,C.jsx)("div",{style:Nr,children:(0,C.jsx)("div",{style:{width:2,backgroundColor:n}})})}function et({swatch:n}){return n.kind==="gene"?(0,C.jsx)("div",{style:{...be,boxSizing:"border-box",border:`1.5px solid ${gt}`,borderRadius:0}}):(0,C.jsx)("div",{style:{...be,height:n.kind==="gap"?yt:be.height,background:n.fill}})}var mo=(0,Qe.observer)(function({model:e}){let t=e.walkRowBars;if(!t)return null;let o=[t.reference,...t.rows].flatMap(a=>a.call??[]),r=Me(t,{ramp:e.referenceRampDomain,rampCss:le,genes:e.walkRowGenes?.size?e.walkRowGeneGaps:void 0});return(0,C.jsxs)("div",{style:H,"data-testid":"graph-walk-rows-legend",children:[r.map(a=>a.note?(0,C.jsx)("div",{style:{color:"#666",fontStyle:"italic"},children:a.label},a.label):(0,C.jsxs)("div",{style:R,children:[(0,C.jsx)(et,{swatch:a.swatch}),(0,C.jsx)("span",{children:a.label})]},a.label)),o.some(a=>a.spanningReads!==0)?(0,C.jsxs)("div",{style:R,children:[(0,C.jsx)(uo,{color:Gr}),(0,C.jsx)("span",{children:"allele length called for this walk"})]}):null,o.some(a=>a.spanningReads===0)?(0,C.jsxs)("div",{style:R,children:[(0,C.jsx)(uo,{color:Tr}),(0,C.jsx)("span",{children:"called with no read spanning it"})]}):null,o.some(a=>a.agrees===!1)?(0,C.jsxs)("div",{style:R,children:[(0,C.jsx)("div",{style:be}),(0,C.jsxs)("span",{style:{color:wt},children:["walk and call over ",Math.round(.1*100),"% apart"]})]}):null]})}),Hr=(0,Qe.observer)(function({model:e}){let t=(0,fo.useId)().replace(/[^\w-]/g,""),o=e.walkRowBars;if(!o)return null;let{paneWidth:r,canvasHeight:a}=e;return(0,C.jsx)("svg",{style:Ir,width:r,height:a,"data-testid":"graph-walk-rows",children:(0,C.jsx)(re,{el:Re(o,{scaleX:e.scaleX,scaleY:e.scaleY,translateX:e.translateX,translateY:e.translateY,width:r,height:a},{ramp:e.referenceRampDomain,rowGenes:e.walkRowGenes,idPrefix:t})})})}),ho=Hr;var ae=s(A(),1);var go=s(we(),1),tt=s(E(),1);var T=s(y(),1),Wr={display:"flex",flexWrap:"wrap",gap:"2px 14px",padding:"2px 8px 6px",fontSize:11,color:"#333"},Br={position:"absolute",pointerEvents:"none",background:"rgba(255,255,255,0.92)",border:"1px solid #ccc",borderRadius:3,padding:"1px 6px",fontSize:11,whiteSpace:"nowrap",zIndex:4},_r=(0,tt.observer)(function({bars:e,frame:t,ramp:o,rowGenes:r}){let a=(0,ae.useId)().replace(/[^\w-]/g,""),l=(0,ae.useMemo)(()=>Re(e,t,{ramp:o,rowGenes:r,idPrefix:a}),[e,t,o,r,a]);return(0,T.jsx)(re,{el:l})}),zr=(0,tt.observer)(function({model:e}){let t=e.walkStripRows,o=e.walkStripFrame,[r,a]=(0,ae.useState)(void 0),[l,i]=(0,ae.useState)(void 0);if(!t||!o)return null;let d=u=>{let p=u.currentTarget.getBoundingClientRect(),m=u.clientX-p.left,h=u.clientY-p.top;return{...kt(t,o,m,h),x:m,y:h}},f=Me(t,{ramp:e.referenceRampDomain,rampCss:le,genes:Mt(o,e.walkRowGenes,e.walkRowGeneGaps)});return(0,T.jsxs)("div",{"data-testid":"graph-walk-strip",style:{position:"relative",borderTop:"1px solid #ddd"},onMouseEnter:()=>{e.setPointerInPane(!0)},onMouseLeave:()=>{(0,go.isAlive)(e)&&(e.setPointerInPane(!1),e.setStripHover(null)),i(void 0)},children:[(0,T.jsxs)("svg",{width:o.width,height:o.height,style:{display:"block",cursor:"pointer"},onMouseMove:u=>{let p=d(u);p.row?(e.setStripHover({row:p.row.name,offset:p.offset}),i(o.labelled?void 0:{text:`${p.row.label} \xB7 ${vt(p.row,p.index===0?void 0:t.reference)}`,x:p.x,y:p.y})):(e.setStripHover(null),i(void 0))},onClick:u=>{let p=d(u);p.row&&p.index>0&&e.toggleWalk(p.row.name)},onContextMenu:u=>{let p=d(u);p.row&&(u.preventDefault(),a({row:p.index,top:u.clientY,left:u.clientX}))},children:[(0,T.jsx)(_r,{bars:t,frame:o,ramp:e.referenceRampDomain,rowGenes:e.walkRowGenes}),(0,T.jsx)(re,{el:St(t,o,e.walkStripMarks)}),(0,T.jsx)(re,{el:xt(t,o,new Set(e.walkLayers.map(u=>u.walk)))})]}),l?(0,T.jsx)("div",{style:{...Br,left:l.x+12,top:l.y-18},children:l.text}):null,(0,T.jsxs)("div",{style:Wr,"data-testid":"graph-walk-strip-key",children:[f.map(u=>(0,T.jsxs)("div",{style:R,children:[(0,T.jsx)(et,{swatch:u.swatch}),(0,T.jsx)("span",{children:u.label})]},u.label)),(0,T.jsx)("div",{style:R,children:(0,T.jsx)("span",{children:"\u25AE ticks: where each walk passes the node under the pointer \xB7 click a bar to lift its walk"})})]}),r?(0,T.jsx)(_e,{model:e,row:r.row,bars:t,top:r.top,left:r.left,onClose:()=>{a(void 0)}}):null]})}),bo=zr;var yo=s(E(),1),ye=s(y(),1),Ar={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"visible",zIndex:4},Or=(0,yo.observer)(function({model:e}){let t=e.walkStripLocator;return t?(0,ye.jsxs)("svg",{style:Ar,width:e.paneWidth,height:e.canvasHeight,"data-testid":"graph-walk-strip-locator",children:[(0,ye.jsx)("circle",{cx:t.x,cy:t.y,r:11,fill:"none",stroke:"white",strokeWidth:4}),(0,ye.jsx)("circle",{cx:t.x,cy:t.y,r:11,fill:"none",stroke:"#111",strokeWidth:1.75})]}):null}),vo=Or;function wo(n){return Promise.resolve(new Ce(n))}var c=s(y(),1),ko={position:"absolute",bottom:8,right:8,background:"rgba(0,0,0,0.75)",color:"white",padding:"4px 8px",borderRadius:4,fontSize:12,pointerEvents:"none",zIndex:6},Xr={position:"relative"},Dr={position:"relative",lineHeight:0,isolation:"isolate"},Yr={position:"absolute",left:0,right:0,bottom:0,zIndex:0},$r={position:"absolute",inset:0,zIndex:10,lineHeight:"normal",pointerEvents:"none"},Fr={position:"absolute",left:6,transform:"translateY(-50%)",background:"rgba(255,255,255,0.82)",padding:"0 4px",borderRadius:3,fontSize:11,lineHeight:"16px",whiteSpace:"nowrap",pointerEvents:"none",zIndex:4},Kr=(0,z.observer)(function({model:e}){let t=e.drawnRowLabels;return(0,c.jsx)(c.Fragment,{children:t.map(({label:o,y:r})=>{let a=r*e.scaleY+e.translateY;return a>=0&&a<=e.canvasHeight?(0,c.jsx)("div",{"data-testid":"graph-row-label",style:{...Fr,top:a},children:o},r):null})})}),Vr={position:"absolute",top:xe,right:xe,display:"flex",flexDirection:"column",alignItems:"flex-end",gap:4,pointerEvents:"none",zIndex:4},Zr={width:18,height:3,borderRadius:2},jr=(0,z.observer)(function({model:e}){let{pathLegend:t}=e;return t.length>0?(0,c.jsx)("div",{style:H,"data-testid":"graph-path-legend",children:t.map(({name:o,label:r,color:a})=>(0,c.jsxs)("div",{style:R,children:[(0,c.jsx)("div",{style:{...Zr,backgroundColor:a}}),(0,c.jsx)("span",{children:r})]},o))}):null}),Ur=(0,z.observer)(function({model:e}){let t=e.walkLift;return t?(0,c.jsxs)("div",{style:H,"data-testid":"graph-walk-readout",children:[t.walks.map(o=>(0,c.jsx)(me,{walk:o,label:e.walkLabel(o.name),reference:e.walkReference,at:e.hoveredOn(o)},o.name)),e.liftPaintsOffReference?(0,c.jsx)(xo,{}):null,(0,c.jsxs)("div",{style:R,children:[(0,c.jsx)("div",{style:{...te,background:fe}}),(0,c.jsxs)("span",{children:["not on ",e.liftedWalksLabel]})]})]}):null}),qr={minWidth:90,height:8,borderRadius:2,background:le},Jr={display:"flex",justifyContent:"space-between",gap:8},Qr=(0,z.observer)(function({model:e}){let t=e.walkLift?void 0:e.referenceRampDomain,{offReference:o,unplaced:r}=e.referenceRampOffKeys,a=Math.round(t?.start??0),l=Math.round(t?.end??0);return t?(0,c.jsxs)("div",{style:H,"data-testid":"graph-ramp-legend",children:[(0,c.jsx)("div",{style:qr}),(0,c.jsxs)("div",{style:Jr,children:[(0,c.jsx)("span",{children:a.toLocaleString()}),(0,c.jsxs)("span",{children:["(",Se(l-a),")"]}),(0,c.jsx)("span",{children:l.toLocaleString()})]}),o?(0,c.jsx)(xo,{}):null,r?(0,c.jsxs)("div",{style:R,children:[(0,c.jsx)("div",{style:{...te,background:ea}}),(0,c.jsx)("span",{children:"no reference position"})]}):null]}):null}),ea="rgb(160, 160, 160)";function xo(){return(0,c.jsxs)("div",{style:R,children:[(0,c.jsx)("div",{style:{...te,background:ht}}),(0,c.jsx)("span",{children:"off the reference"})]})}var ta={...te,border:`2px solid ${he}`,borderRadius:5,boxSizing:"border-box"},na=(0,z.observer)(function({model:e}){return e.genePins.some(t=>t.exonsByNode.length>0)?(0,c.jsx)("div",{style:H,"data-testid":"graph-gene-legend",children:(0,c.jsxs)("div",{style:R,children:[(0,c.jsx)("div",{style:ta}),(0,c.jsx)("span",{children:"exon"})]})}):null}),Mo={position:"absolute",transform:"translate(-50%, -50%)",background:"rgba(255,255,255,0.78)",padding:"0 3px",borderRadius:3,fontSize:10,lineHeight:"13px",whiteSpace:"nowrap",pointerEvents:"none",zIndex:3},oa={...Mo,color:"#18181c",fontWeight:600},ra={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"visible",zIndex:2},aa=(0,z.observer)(function({model:e}){let t=(0,ze.useRef)(null);return(0,ze.useEffect)(()=>{let o=t.current;if(!o)return;let r=new ResizeObserver(()=>{(0,nt.isAlive)(e)&&e.hoveredNode===null&&e.setLegendSize({width:o.offsetWidth,height:o.offsetHeight})});return r.observe(o),()=>{r.disconnect()}},[e]),(0,c.jsxs)("div",{ref:t,style:{...Vr,top:xe+e.referenceStripZonePx},children:[(0,c.jsx)(Qr,{model:e}),(0,c.jsx)(jn,{model:e}),(0,c.jsx)($t,{model:e}),(0,c.jsx)(na,{model:e}),(0,c.jsx)(jr,{model:e}),(0,c.jsx)(to,{model:e}),(0,c.jsx)(mo,{model:e}),(0,c.jsx)(Ur,{model:e})]})}),sa=(0,z.observer)(function({model:e}){let t=e.overlayLabels.sizes,o=t.flatMap(({key:r,leader:a})=>a?[{key:r,...a}]:[]);return(0,c.jsxs)(c.Fragment,{children:[o.length>0?(0,c.jsx)("svg",{style:ra,width:e.paneWidth,height:e.canvasHeight,children:o.map(({key:r,arcX:a,arcY:l,labelX:i,labelY:d})=>(0,c.jsx)("line",{"data-testid":"graph-label-leader",x1:a,y1:l,x2:i,y2:d,stroke:"#18181c",strokeWidth:1},r))}):null,t.map(({key:r,text:a,x:l,y:i,kind:d})=>(0,c.jsx)("div",{"data-testid":"graph-size-label",style:{...d==="deletion"?oa:Mo,left:l,top:i},children:a},r))]})}),ia=(0,z.observer)(function({model:e}){let t=e.hoveredNode?e.nodeById?.get(e.hoveredNode):null,o=e.hoveredEdge!==null&&e.graph?e.graph.edges[e.hoveredEdge]:null,r=t?Wt(t):void 0,a=e.hoveredEdge===null?void 0:e.deletions.find(l=>l.edgeIndex===e.hoveredEdge);return(0,c.jsxs)(c.Fragment,{children:[t?(0,c.jsxs)("div",{style:ko,children:[(0,c.jsx)("strong",{children:t.name})," \u2014"," ",t.length.toLocaleString()," bp, depth"," ",t.depth.toFixed(1),r?(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)("br",{}),r.sample," ",Pe(r)," (rank"," ",t.stable?.rank,")"]}):null]}):null,o?(0,c.jsx)("div",{style:ko,children:a?(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)("strong",{children:"Deletion"})," ",a.bp.toLocaleString()," bp",(0,c.jsx)("br",{}),a.refName,":",a.start.toLocaleString(),"-",a.end.toLocaleString()]}):(0,c.jsxs)(c.Fragment,{children:["Edge: ",o.from," \u2192 ",o.to]})}):null]})}),la=(0,z.observer)(function({model:e,nodeId:t,top:o,left:r,onClose:a}){let{own:l,reference:i,highlight:d}=e.nodeLaunchTargets(t);return(0,c.jsx)(se.Menu,{open:!0,anchorReference:"anchorPosition",anchorPosition:{top:o,left:r},onClose:()=>{a()},onMenuItemClick:f=>{f()},menuItems:[{label:"Node details",icon:Dt,onClick:()=>{e.showNodeDetails(t)}},...Bt({own:l,reference:i,highlight:d,onShowLinear:f=>{e.showInLinearView(f)},onHighlight:e.canHighlightInLinearView?f=>{e.highlightInLinearView(f)}:void 0})]})}),ca=(0,z.observer)(function({model:e,ownChrome:t=!0}){let{canvasRef:o,canvas:r,error:a,retry:l}=(0,So.useRenderingBackend)(wo,e),{handlers:i,contextNode:d,contextRow:f,closeContextMenu:u}=on(e);Ge(r,e);let p=e.facetPanels!==void 0;return(0,c.jsxs)("div",{style:Xr,children:[t?(0,c.jsx)(zn,{model:e}):null,(0,c.jsxs)("div",{style:Dr,onMouseEnter:()=>{e.setPointerInPane(!0)},onMouseLeave:()=>{(0,nt.isAlive)(e)&&e.setPointerInPane(!1)},children:[e.referenceStripShown?(0,c.jsx)("div",{style:{...Yr,top:e.referenceStripZonePx,background:e.paperCss}}):null,(0,c.jsx)("canvas",{ref:o,"data-testid":"graph-genome-canvas",style:{width:e.paneWidth,height:e.canvasHeight,cursor:e.isPanning||e.draggingNode?"grabbing":"grab",display:"block",position:"relative",zIndex:1},...i}),p?(0,c.jsx)(rn,{model:e,handlers:i}):(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(eo,{model:e}),(0,c.jsx)(Vn,{model:e}),(0,c.jsx)(Kr,{model:e}),(0,c.jsx)(sa,{model:e}),(0,c.jsx)(Yt,{model:e}),(0,c.jsx)(ln,{model:e}),(0,c.jsx)(Yn,{model:e}),(0,c.jsx)(ho,{model:e}),(0,c.jsx)(vo,{model:e}),(0,c.jsx)(aa,{model:e})]}),(0,c.jsx)(ro,{model:e}),t?(0,c.jsx)("div",{style:$r,children:(0,c.jsx)(se.LoadingOverlay,{isVisible:e.isLoading,immediate:!e.layoutResult,statusMessage:e.statusMessage,onCancel:e.canCancelLoad?()=>{e.cancelLoad()}:void 0})}):null]}),e.walkStripShown?(0,c.jsx)(bo,{model:e}):null,(0,c.jsx)(ia,{model:e}),d?(0,c.jsx)(la,{model:e,nodeId:d.nodeId,top:d.top,left:d.left,onClose:u}):null,f?(0,c.jsx)(_e,{model:e,row:f.row,top:f.top,left:f.left,onClose:u}):null,a?(0,c.jsx)(se.ErrorBanner,{error:a,onReset:l}):null,t&&e.error?(0,c.jsx)(se.ErrorBanner,{error:e.error,onReset:e.canRetryLoad?()=>{e.retryLoad()}:void 0}):null]})}),Ii=ca;export{Ii as a};
+//# sourceMappingURL=chunk-TCGFPZ4Y.js.map