jbrowse-plugin-graphgenomeviewer 6.2.0 → 6.3.0

package/dist/chunks/{chunk-NGQRKSHY.js → chunk-4LEFC42C.js}

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