jbrowse-plugin-graphgenomeviewer 8.3.8 → 8.3.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/dist/chunks/{GraphGenomeView-SIOAXXAX.js → GraphGenomeView-GDZY3NRF.js} +2 -2
  2. package/dist/chunks/{LinearGraphDisplay-56NPMGFE.js → LinearGraphDisplay-VPKAF7RL.js} +2 -2
  3. package/dist/chunks/chunk-3TGEST7X.js +4 -0
  4. package/dist/chunks/{chunk-LYJ4FZFC.js.map → chunk-3TGEST7X.js.map} +3 -3
  5. package/dist/chunks/chunk-CFW2JQMT.js +4 -0
  6. package/dist/chunks/{chunk-JHUQMHCO.js.map → chunk-CFW2JQMT.js.map} +3 -3
  7. package/dist/chunks/{chunk-LVRR7SZH.js → chunk-OFUX4PZY.js} +3 -3
  8. package/dist/chunks/{chunk-LVRR7SZH.js.map → chunk-OFUX4PZY.js.map} +3 -3
  9. package/dist/chunks/chunk-PXIHCJUD.js +2 -0
  10. package/dist/chunks/{chunk-LAOGU5VK.js.map → chunk-PXIHCJUD.js.map} +3 -3
  11. package/dist/chunks/{renderSvg-IZZ2QBWS.js → renderSvg-XIBZTOXX.js} +2 -2
  12. package/dist/jbrowse-plugin-graphgenomeviewer.esm.js +2 -2
  13. package/dist/jbrowse-plugin-graphgenomeviewer.esm.js.map +1 -1
  14. package/package.json +1 -1
  15. package/src/GraphGenomeView/components/WalkRowsOverlay.tsx +9 -20
  16. package/src/GraphGenomeView/components/usePaneGestures.ts +2 -3
  17. package/src/GraphGenomeView/model.test.ts +56 -1
  18. package/src/GraphGenomeView/pane/fitViews.ts +8 -7
  19. package/src/GraphGenomeView/pane/graphViews.ts +26 -15
  20. package/src/GraphGenomeView/pane/walkRowViews.ts +16 -28
  21. package/src/GraphGenomeView/walkRowGroups.test.ts +28 -0
  22. package/src/GraphGenomeView/walkRowGroups.ts +64 -54
  23. package/src/GraphGenomeView/walkRowSpans.test.ts +16 -0
  24. package/src/GraphGenomeView/walkRowSpans.ts +61 -40
  25. package/src/version.ts +1 -1
  26. package/dist/chunks/chunk-JHUQMHCO.js +0 -4
  27. package/dist/chunks/chunk-LAOGU5VK.js +0 -2
  28. package/dist/chunks/chunk-LYJ4FZFC.js +0 -4
  29. /package/dist/chunks/{GraphGenomeView-SIOAXXAX.js.map → GraphGenomeView-GDZY3NRF.js.map} +0 -0
  30. /package/dist/chunks/{LinearGraphDisplay-56NPMGFE.js.map → LinearGraphDisplay-VPKAF7RL.js.map} +0 -0
  31. /package/dist/chunks/{renderSvg-IZZ2QBWS.js.map → renderSvg-XIBZTOXX.js.map} +0 -0
@@ -0,0 +1,2 @@
1
+ import{a as z,b as vt}from"./chunk-BDBFDFIM.js";import{B as St,C as xt,a as tt,b as nt,c as Q,d as ot,e as rt,f as ee,h as at,i as it,j as st,k as lt,l as ct,m as pt,o as te,p as ut,q as ne,r as dt,t as ue,u as ft,v as ht,w as yt,x as bt,z as wt}from"./chunk-3TGEST7X.js";import{N as Je,O as Qe,R as pe,T as et,U as mt,V as gt,a as P,c as He,f as U,g as Ae,h as _e,q as ze,r as Oe,t as $e,u as je,v as Ke,w as qe}from"./chunk-CFW2JQMT.js";import{p as _}from"./chunk-4NUDB5AY.js";import{Ea as Ye,Jb as H,K as se,La as Ze,Nb as le,O as J,Pb as ce,Rb as B,S as Xe,U as Be,a as D,b as be,da as Fe,lc as Ue,r as We,s as Ne,wa as Ve}from"./chunk-OFUX4PZY.js";import{n as De}from"./chunk-QX7UU3CV.js";import{e as G}from"./chunk-3WG3GF2A.js";import{j}from"./chunk-J5RMHLFJ.js";import{a as Ie,e as T,f as Ge,g as Te,h as k,i as C}from"./chunk-NIEZKWQV.js";import{D as Ee,G as q,H as X,b as we,c as Se,e as ie,k as xe,o as Pe,p as Me,s as ke,v as K,w as Re,y as Ce,z as Le}from"./chunk-5Z4VIKXZ.js";import{a as I,b as n,c as f,d as h}from"./chunk-JMBDTNUR.js";function Pt(t){return Promise.resolve(new H(t))}var A=JBrowseExports["@jbrowse/render-core/useRenderingBackend"],hn=t=>A!=null&&t in Object(A)?A[t]:Object.assign(function(){throw new Error("This JBrowse does not provide '"+t+"' from '@jbrowse/render-core/useRenderingBackend' to plugins: GraphGenomeView was built for a different JBrowse version, so update the plugin or JBrowse")},{jbrowseHostMissing:t});var Mt=hn("useRenderingBackend"),bo=A&&A.__esModule?A.default:A;var de=nt(1);function fe({model:t}){let[e,o]=C(null);return T(()=>{if(!e)return;let i=new H(e),r=D(()=>{Fe(Ue()),i.resize(t.paneWidth,t.canvasHeight),t.paintHover(i,t.drawnBatch)});return()=>{r(),i.dispose()}},[e,t]),n("canvas",{ref:o,"data-testid":"graph-hover-layer",style:de})}function oe({row:t,at:e,hint:o,after:i,column:r}){let c=r===void 0?void 0:{paddingLeft:r+5};return t.swatch?f("div",{title:[t.title,o].filter(Boolean).join(" \xB7 ")||void 0,children:[f("div",{style:ne,children:[n("span",{style:{display:"flex",flex:"none",justifyContent:"center",width:r},children:n(te,{swatch:t.swatch})}),f("span",{children:[t.strong?n("strong",{children:t.strong}):null,t.label]}),i]}),e?n("div",{style:c,"data-testid":"graph-walk-at",children:e}):t.under?n("div",{style:c,children:t.under}):null]}):n("div",{style:dt,children:t.label})}var mn={pointerEvents:"auto",cursor:"pointer",border:"none",background:"none",padding:"0 2px",font:"inherit",textDecoration:"underline"},kt=h(function({model:e}){let o=pt(e);if(o.length===0)return null;let i=o.flatMap(l=>l.rows),r=it(i),c=at(i);return n("div",{style:{...ut,lineHeight:`${r}px`},children:o.map(({testid:l,rows:p,heading:s,spaced:u},m)=>f(Ie,{children:[s?n("div",{style:{...ft,paddingTop:m===0?0:ue},children:s}):null,n("div",{"data-testid":l,style:u?{paddingTop:ue}:void 0,children:p.map(w=>n(oe,{row:w,column:c,at:w.walk?e.hoveredOn(w.walk):void 0,after:w.closesBubble?n("button",{type:"button",style:mn,"data-testid":"graph-close-bubble",onClick:()=>{e.closeBubbles()},children:"close"}):null},w.key))})]},l))})});var gn={position:"absolute",left:0,top:0,zIndex:4,display:"grid",gap:We,lineHeight:"normal"},vn={height:Ne,padding:"2px 6px",boxSizing:"border-box",fontFamily:"inherit",fontSize:11,color:"inherit",cursor:"pointer",border:"none",background:"none",textAlign:"left",display:"block"},yn={position:"relative"},bn={gridColumn:"1 / -1",height:Qe,padding:"2px 6px",boxSizing:"border-box",display:"flex",gap:14,fontSize:11,lineHeight:"15px"},wn=h(function({model:e,lift:o,width:i,height:r,cell:c,handlers:l,canvasStyle:p}){let[s,u]=C(null),[m,w]=C(null),x=o.walks[0];T(()=>{if(!s||!m)return;let E=new H(s),N=new H(m),O=be(()=>e.buildDrawing(o,!1)),Y,Z=[D(()=>{let R=e.facetGrid;R&&E.resize(R.width,R.height);let L=O.get();L&&(L!==Y&&(E.uploadGeometry(L.batch),Y=L),e.applySelection(E),e.paint(E))}),D(()=>{let R=e.facetGrid;R&&N.resize(R.width,R.height);let L=O.get();L&&e.paintHover(N,L.batch)})];return()=>{for(let R of Z)R();E.dispose(),N.dispose()}},[s,m,e,o]);let W=e.walkLabel(x.name);return f("div",{style:c,children:[n("button",{type:"button",style:vn,"data-testid":"graph-facet-title",onClick:()=>{e.liftWalks([x.name]),e.setFacet("")},children:n(oe,{row:lt(e,x),hint:`click to lift ${W} alone`,at:e.hoveredOn(x)})}),f("div",{style:yn,children:[n("canvas",{ref:u,"data-testid":"graph-facet-canvas",style:{...p,width:i,height:r,display:"block"},...l}),n("canvas",{ref:w,style:de})]})]})}),Sn=h(function({model:e,handlers:o,canvasStyle:i}){let r=e.facetPanels,c=e.facetGrid,l=e.facetPlacement;if(!r||!c||!l)return null;let{columns:p,width:s,height:u}=c;return f("div",{"data-testid":"graph-facet-panels",style:{...gn,width:e.paneWidth,minHeight:e.canvasHeight,gridTemplateColumns:`repeat(${p}, ${s}px)`,background:J},children:[r.map((m,w)=>n(wn,{model:e,lift:m,width:s,height:u,cell:{gridRow:Math.floor(l.cells[w]/p)+1,gridColumn:l.cells[w]%p+1},handlers:o,canvasStyle:i},m.walks[0].name)),n("div",{style:{...bn,gridRow:Math.floor(l.cells.reduce((m,w)=>Math.max(m,w),-1/0)/p)+2},"data-testid":"graph-facet-key",children:ct(e).map(m=>n(oe,{row:m},m.key))})]})}),Rt=Sn;var Ct=P(n("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 Lt=P([n("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"),n("path",{d:"M12 10h-2v2H9v-2H7V9h2V7h1v2h2z"},"1")],"ZoomIn");var Et=P(n("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 xn=h(function({model:e}){let o=e.colorSchemeLock;return n(z,{label:"Color",size:"small",sx:{minWidth:100},disabled:o!==void 0,title:o?.why,shown:o?.value,value:e.chosenColorScheme,options:ze.map(({value:i})=>({value:i,label:e.colorSchemeLabel(i)})),testId:"graph-color-select",onChange:i=>{e.setColorScheme(i)}})}),It=xn;var Gt=_()({stats:{marginLeft:"auto"},perf:{color:"#888",fontVariantNumeric:"tabular-nums"}});function he(t){return t===void 0?"\u2013":`${Math.round(t)}ms`}var Pn=h(function({model:e}){let{classes:o}=Gt(),{lastFetchMs:i,lastLayoutMs:r,lastGeometryMs:c}=e,l=i!==void 0||r!==void 0||c!==void 0;return e.showPerf&&l?f(X,{variant:"caption",className:o.perf,"data-testid":"graph-perf-stats",children:["fetch ",he(i)," \xB7 layout ",he(r)," \xB7 geom"," ",he(c)]}):null}),Mn=h(function({model:e}){let{classes:o}=Gt();return f("div",{className:o.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:[f(X,{variant:"body2",component:"span",children:[e.nodeCount," nodes, ",e.edgeCount," edges",e.pathCount>0?`, ${e.pathCount} paths`:""]})," ",n(Pn,{model:e})]})}),Tt=Mn;var kn=h(function({model:e}){let{graph:o}=e;return n(z,{label:"Layout",size:"small",sx:{minWidth:140},testId:"graph-layout-select",value:e.chosenLayoutMode,options:He.map(({value:i,label:r,description:c,available:l})=>({value:i,label:r,description:c,disabled:o?!l(o):!1})),onChange:i=>{e.switchLayout(i)}})}),Ht=kn;var Rn=h(function({model:e}){return e.chosenLayoutMode!=="walkrows"||e.repeatChoices.length===0?null:n(z,{label:"Repeat",size:"small",sx:{minWidth:130,maxWidth:260},testId:"graph-repeat-select",value:e.selectedRepeat?.key??"",options:e.repeatOptions,onChange:o=>{e.setRepeatKey(o)}})}),At=Rn;var _t=P(n("path",{d:"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"}),"Close");var zt=P(n("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 Cn=h(function({model:e}){let o=e.highlightMenuItems({picks:!1});return n(we,{size:"small",tooltip:"Graph options",menuItems:[...o.length>0?[{label:"Haplotypes",icon:mt,subMenu:o}]:[],...e.layoutOptionMenuItems({repeat:!1}),{label:"Show",icon:Oe,subMenu:[...e.showMenuItems(),...e.modeDrawsNodes&&e.walkChoices.length>1?[{type:"checkbox",label:"Show walk rows under the graph",checked:e.walkStrip,onClick:()=>{e.setWalkStrip(!e.walkStrip)}}]:[],{type:"checkbox",label:"Show timings",checked:e.showPerf,onClick:()=>{e.setShowPerf(!e.showPerf)}}]},{type:"divider"},{label:"Graph settings...",icon:gt,helpText:"Subgraph node limit; node width and path colors; the force-directed layout engine",onClick:()=>{j(e).queueDialog(i=>[vt,{model:e,onClose:i}])}},{type:"divider"},{label:"Close graph",icon:_t,onClick:()=>{e.clearGraph()}}],children:n(zt,{})})}),Wt=Cn;var Ln=_()({formControl:{minWidth:130,maxWidth:260}}),En=h(function({model:e}){let{classes:o}=Ln(),i=Ge(),{walkChoices:r}=e;if(r.length===0||!e.liftsWalks)return null;let c=new Set(r.map(s=>s.name)),l=new Map(r.map(s=>[s.name,s.label])),p=e.walkLayers.map(s=>s.walk).filter(s=>c.has(s));return r.length>Be?n(Pe,{size:"small",variant:"outlined",color:"inherit","data-testid":"graph-walk-choose",onClick:()=>{j(e).queueDialog(s=>[Xe,{model:e,onClose:s}])},children:p.length>0?`${p.length} of ${r.length} haplotypes`:"Highlight haplotypes..."}):f(ke,{size:"small",className:o.formControl,children:[n(Re,{id:i,children:"Highlight"}),n(Ee,{labelId:i,multiple:!0,value:p,label:"Highlight","data-testid":"graph-walk-select",renderValue:s=>s.map(u=>l.get(u)).join(", "),onChange:s=>{let{value:u}=s.target;e.liftAmongChoices(typeof u=="string"?u.split(","):u)},children:r.map(({name:s,label:u})=>f(Le,{value:s,dense:!0,children:[n(Me,{size:"small",checked:p.includes(s)}),n(Ce,{primary:u})]},s))})]})}),Nt=En;var In=_()({toolbar:{display:"flex",flexWrap:"wrap",alignItems:"center",gap:4,padding:"2px 4px",borderBottom:"1px solid #ddd"}}),Gn=h(function({model:e}){return n(X,{variant:"body2",children:e.zoomPercent})}),Tn=h(function({model:e}){let{classes:o}=In(),i=r=>{e.zoom(r,e.viewBox.width/2,e.viewBox.height/2)};return f("div",{className:o.toolbar,children:[n(Ht,{model:e}),n(It,{model:e}),n(Nt,{model:e}),n(At,{model:e}),n(q,{title:"Zoom in",children:n(K,{size:"small",onClick:()=>{i(1.5)},children:n(Lt,{})})}),n(q,{title:"Zoom out",children:n(K,{size:"small",onClick:()=>{i(1/1.5)},children:n(Et,{})})}),n(q,{title:"Zoom to fit",children:n(K,{size:"small",onClick:()=>{e.refitView()},children:n(Ct,{})})}),n(Gn,{model:e}),n(Tt,{model:e}),n(Wt,{model:e})]})}),Ot=Tn;var Hn={position:"absolute",bottom:Je,lineHeight:"normal",background:"rgba(0,0,0,0.75)",color:"white",padding:"4px 8px",borderRadius:4,fontSize:12,pointerEvents:"none",zIndex:6};function me({label:t,readout:e}){return f(I,{children:[n("strong",{children:t})," \u2014 ",e]})}function An(t,e){if(e)return{testId:"graph-chip-tooltip",body:me(e)};let o=t.hoveredNode?t.hoverNodeById?.get(t.hoveredNode):void 0;if(o){let l=t.hoverDrawing?.members.get(o.id),p=_e(o);return{body:f(I,{children:[n("strong",{children:o.name}),l?` and ${l.length-1} more`:""," \u2014"," ",o.length.toLocaleString()," bp, depth ",o.depth.toFixed(1),p?f(I,{children:[n("br",{}),p.sample," ",U(p)," (rank ",o.stable?.rank,")"]}):null,o.moved?f(I,{children:[n("br",{}),"End of a component too large to draw here"]}):null]})}}let i=t.hoveredEdge===null?void 0:t.graph?.edges[t.hoveredEdge];if(i){let l=Ae(i,t.deletions.find(p=>p.edgeIndex===t.hoveredEdge),p=>t.nodeById?.get(p)?.name??p);return{body:l.deletion?f(I,{children:[n("strong",{children:"Deletion"})," ",l.deletion.bp,n("br",{}),l.deletion.where]}):f(I,{children:["Edge: ",l.ends]})}}let r=t.hoveredWalkRowText;if(r)return{testId:"graph-walk-row-tooltip",body:me(r)};let c=t.hoveredTubeText;return c?{testId:"graph-tube-tooltip",body:me(c)}:void 0}var _n=h(function({model:e,chip:o}){let i=An(e,o);return i?n("div",{style:{...Hn,right:e.tooltipRightPx},"data-testid":i.testId,children:i.body}):null}),Dt=_n;var Xt=P(n("path",{d:"M10 18h4v-2h-4zM3 6v2h18V6zm3 7h12v-2H6z"}),"FilterList");var Bt=P(n("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 Ft=P(n("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 zn={x:0,y:0};function Wn(t,e){let{own:o,reference:i,highlight:r}=t.nodeLaunchTargets(e);return[{label:"Node details",icon:Ft,onClick:()=>{t.showNodeDetails(e)}},...et({own:o,reference:i,highlight:r,onShowLinear:c=>{t.showInLinearView(c)},onHighlight:t.canHighlightInLinearView?c=>{t.highlightInLinearView(c)}:void 0})]}function Nn(t){return t>=1e3?`${Math.round(t/1e3)} k`:`${t}`}function On(t,e,o){let i=o??t.walkRowBars,r=t.walkRowLaunchTarget(e,i),c=r?.assembly,l=e>0?i?.rows[e-1]:void 0,p=l?.sample,s=!o&&t.walkRowBars,u=t.walkRowSamples;return[r&&c?{label:`Linear genome view \u2014 ${c} ${U(r.location)}`,icon:pe,onClick:()=>{t.showInLinearView({location:r.location,assembly:c})}}:{label:"Linear genome view",icon:pe,disabled:!0,disabledHelpText:r?`No assembly in this session is ${r.location.haplotype??r.label}`:"This walk states no contig coordinates",onClick:()=>{}},...l?.abridgedSteps?[{label:`Load the ${Nn(l.abridgedSteps)} abridged steps`,onClick:()=>{t.expandWalk(l.name)}}]:[],...l&&t.liftsWalks&&t.modeDrawsNodes?[{type:"checkbox",label:`Highlight ${l.label}`,checked:t.walkLayers.some(m=>m.walk===l.name),onClick:()=>{t.toggleWalk(l.name)}}]:[],...s&&p&&!(u?.length===1&&u[0]===p)?[{label:`Show only ${p}`,icon:Xt,onClick:()=>{t.setWalkRowSamples([p])}}]:[],...s&&u?[{label:"Show every sample",icon:Bt,onClick:()=>{t.setWalkRowSamples(void 0)}}]:[]]}function F({model:t,at:e,onClose:o}){return n(Se,{anchor:e,offset:zn,onClose:o,menuItems:()=>e===void 0?[]:"nodeId"in e?Wn(t,e.nodeId):On(t,e.row,e.bars)})}var Dn={display:"flex",flexWrap:"wrap",gap:"2px 14px",padding:"2px 8px 6px",fontSize:11,color:"#333"},Xn={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},Bn=h(function({bars:e,frame:o,ramp:i,rowGenes:r}){let c=rt(),l=Te(()=>Ze(e,o,{ramp:i,rowGenes:r,idPrefix:c}),[e,o,i,r,c]);return n(ee,{el:l})}),Fn=h(function({model:e}){let o=e.walkStripRows,i=e.walkStripFrame,r=e.stripHover,c=o?[o.reference,...o.rows]:[],l=r?c.findIndex(m=>m.name===r.row):-1,p=c[l];if(!o||!i||i.labelled||!r||!p)return null;let s=(o.origin+r.offset)*i.scaleX+i.translateX,u=s>i.width/2?{right:i.width-s+12}:{left:s+12};return f("div",{"data-testid":"graph-walk-strip-tip",style:{...Xn,...u,top:l*i.rowPx+i.translateY-18},children:[p.label," \xB7"," ",Ve(p,l===0?void 0:o.reference)]})}),Vn=h(function({model:e,bars:o,frame:i}){return n(ee,{el:je(o,i,e.walkStripMarks)})}),Yn=h(function({model:e}){let o=e.walkStripRows,i=e.walkStripFrame,[r,c]=C();if(!o||!i)return null;let l=s=>{let u=s.currentTarget.getBoundingClientRect();return $e(o,i,s.clientX-u.left,s.clientY-u.top)},p=Ye(o,{ramp:e.referenceRampDomain,rampCss:De,genes:qe(i,e.walkRowGenes,e.walkRowGeneGaps),annotation:e.walkRowAnnotation});return f("div",{"data-testid":"graph-walk-strip",style:{position:"relative",borderTop:"1px solid #ddd"},onMouseEnter:()=>{e.setPointerInPane(!0)},onMouseLeave:()=>{G(e)&&(e.setPointerInPane(!1),e.setStripHover(null))},children:[f("svg",{width:i.width,height:i.height,style:{display:"block"},onMouseMove:s=>{let u=l(s);s.currentTarget.style.cursor=u&&u.index>0?"pointer":"",e.setStripHover(u?{row:u.row.name,offset:u.offset}:null)},onClick:s=>{let u=l(s);u&&u.index>0&&e.toggleWalk(u.row.name)},onContextMenu:s=>{let u=l(s);u&&(s.preventDefault(),c({clientX:s.clientX,clientY:s.clientY,row:u.index}))},children:[n(Bn,{bars:o,frame:i,ramp:e.referenceRampDomain,rowGenes:e.walkRowGenes}),n(Vn,{model:e,bars:o,frame:i}),n(ee,{el:Ke(o,i,new Set(e.walkLayers.map(s=>s.walk)))})]}),n(Fn,{model:e}),f("div",{style:Dn,"data-testid":"graph-walk-strip-key",children:[p.map(s=>f("div",{style:ne,children:[n(te,{swatch:st(s.swatch)}),n("span",{children:s.label})]},s.label)),n("span",{style:{color:"#777"},children:"Ticks mark where each walk passes the node under the pointer; click a haplotype's bar to lift its walk"})]}),n(F,{model:e,at:r&&{...r,bars:o},onClose:()=>{c(void 0)}})]})}),Vt=Yn;var Zn=h(function({model:e}){let o=e.walkStripLocator;return o?f(Q,{model:e,zIndex:4,overflow:"visible",testId:"graph-walk-strip-locator",children:[n("circle",{cx:o.x,cy:o.y,r:11,fill:"none",stroke:"white",strokeWidth:4}),n("circle",{cx:o.x,cy:o.y,r:11,fill:"none",stroke:"#111",strokeWidth:1.75})]}):null}),Yt=Zn;var $n=1.1,jn=100,Kn=40,qn=800,Un=10,Zt=2;function ge(t){let e=t.deltaY*(t.deltaMode===1?Kn:t.deltaMode===2?qn:1),o=(t.ctrlKey?Un:1)*e/jn;return $n**-Math.max(-Zt,Math.min(Zt,o))}var Jn=40,Qn=100,eo=24,$t=Math.log(16);function to(t,e){let o=t*Math.exp(-Math.max(0,e)/eo);return Math.abs(o)<.001?t:t-o}function no(t,e){let o=Math.abs(t.deltaX)>Math.abs(t.deltaY);return t.ctrlKey||t.metaKey||!o&&(!e||e.scrollZoom)?"zoom":o?"pan":"page"}function qt(t,e,o){T(()=>{if(!t)return;let i=-1/0,r={backlog:0,x:0,y:0,frame:0,last:0},c=p=>{let s=to(r.backlog,Math.min(100,p-r.last));r.backlog-=s,r.last=p,r.frame=r.backlog?requestAnimationFrame(c):0,G(o)&&o.zoom(Math.exp(s),r.x,r.y)},l=p=>{if(o.hostPlacesX||o.followsHostView)return;let m=((p.target instanceof Element?p.target.closest("canvas"):null)??(o.facetPanels?null:e))?.getBoundingClientRect();if(m&&p.clientY-m.top<o.referenceStripZonePx)return;let w=no(p,o.host);if(w!=="page"){if(o.host&&p.stopPropagation(),p.preventDefault(),w==="pan"){if(p.timeStamp-i>Qn){let x=p.deltaMode===1?Jn:1;o.setTransform(o.scale,o.translateX-p.deltaX*x,o.translateY)}return}i=p.timeStamp,m&&(r.x=p.clientX-m.left,r.y=p.clientY-m.top,r.backlog=Math.max(-$t,Math.min($t,r.backlog+Math.log(ge(p)))),r.frame||(r.last=performance.now()-1e3/60,r.frame=requestAnimationFrame(c)))}};return t.addEventListener("wheel",l,{passive:!1}),()=>{cancelAnimationFrame(r.frame),t.removeEventListener("wheel",l)}},[t,e,o])}var jt=3,ve="data-gesture-owner",V=t=>({x:t.clientX,y:t.clientY});function Kt(t){let[e,o]=[...t.values()];return{spread:Math.hypot(e.x-o.x,e.y-o.y),mid:{x:(e.x+o.x)/2,y:(e.y+o.y)/2}}}function Ut(t){let e=k({x:0,y:0}),o=k({x:0,y:0}),i=k(!1),r=k(void 0),c=a=>r.current!==void 0&&a.pointerId!==r.current,l=k(new Map),p=k(null),s=k(null),u=k(!1),m=k(null),w=k(!1),x=k({frame:0,pan:null,hover:null,pinch:!1});T(()=>()=>{cancelAnimationFrame(x.current.frame)},[]);let[W,E]=C(),[N,O]=C(!1),[Y,Z]=C(void 0);function R(a){let d=a.currentTarget.getBoundingClientRect();return{x:a.clientX-d.left,y:a.clientY-d.top}}function L(a,d){if(t.layoutResult?.tubeMap)return t.tubeMapNodeAt(a,d);let g=t.referenceStripNodeAt(a,d);if(g)return g;let{nodePositions:v}=t;if(!v)return null;let{x:y,y:b}=se(a,d,t,t.axisScale);return le(v,y,b,t.axisScale,t.positionsVersion,t.nodeInk)}function en(a,d){let{nodePositions:g,graph:v}=t;if(!g||!v)return null;let{x:y,y:b}=se(a,d,t,t.axisScale);return ce(g,v,y,b,t.axisScale,t.effectiveDrawPaths&&!t.facetPanels,t.positionsVersion,t.deletionEdgeIndexes,t.hiddenEdgeIndexes,t.deletionRoutes,t.layoutResult?.stranded)}function tn(a){a.button===0&&a.preventDefault()}function nn(a){if(a.button!==0)return;let d=l.current;if(c(a)){t.isPanning&&!w.current&&a.pointerType==="touch"&&d.size===1&&(a.currentTarget.setPointerCapture(a.pointerId),d.set(a.pointerId,V(a)),s.current=Kt(d),i.current=!0);return}i.current=!1,o.current={x:a.clientX,y:a.clientY},a.currentTarget.removeAttribute(ve);let g=t.followsHostView;if(t.hostPlacesX||g&&a.shiftKey)return;a.currentTarget.setPointerCapture(a.pointerId),r.current=a.pointerId,p.current=a.currentTarget,d.clear(),d.set(a.pointerId,V(a));let{x:v,y}=R(a),b=y<t.referenceStripZonePx,M=t.layoutResult?.tubeMap||b?null:L(v,y);g&&M&&a.currentTarget.setAttribute(ve,""),w.current=g,u.current=b&&!g,M?t.setDraggingNode(M):t.setPanning(!0),e.current={x:a.clientX,y:a.clientY}}function ye(){let a=s.current,d=p.current;if(!a||!d)return;let g=Kt(l.current),v=d.getBoundingClientRect();a.spread>0&&g.spread>0&&t.zoom(g.spread/a.spread,a.mid.x-v.left,a.mid.y-v.top),t.setTransform(t.scale,t.translateX+g.mid.x-a.mid.x,t.translateY+g.mid.y-a.mid.y),s.current=g}function on(){let a=x.current,{pan:d,hover:g,pinch:v}=a;if(a.frame=0,a.pan=null,a.hover=null,a.pinch=!1,v&&ye(),d&&u.current?t.host?.horizontalScroll(-d.dx):d&&w.current?t.setTransform(t.scale,t.translateX,t.translateY+d.dy):d&&t.setTransform(t.scale,t.translateX+d.dx,t.translateY+d.dy),!g)return;let{x:y,y:b}=g,M=t.facetPanels?void 0:yt(t.overlayLabels,y,b);if(Z(S=>S?.label===M?.label&&S?.readout===M?.readout?S:M),t.walkRowBars){let S=t.walkRowAt(y,b);t.setHoveredWalkRow(S===void 0?null:t.walkRowList[S].name)}if(t.nodePositions&&t.graph){let S=L(y,b);t.setHoveredPanel(t.tubeMapPanelAt(b)),t.setHoveredNode(S,{x:y,y:b}),O(S!==null&&!t.hostPlacesX&&!t.layoutResult?.tubeMap&&b>=t.referenceStripZonePx),t.setHoveredTube(S===null&&t.layoutResult?.tubeMap?t.tubeAt(y,b):null),t.setHoveredEdge(S||t.layoutResult?.tubeMap||!t.hoverLightsEverything?null:en(y,b))}}function $(){x.current.frame||(x.current.frame=requestAnimationFrame(on))}function rn(){let a=x.current;cancelAnimationFrame(a.frame),a.frame=0,a.pan=null,a.hover=null,a.pinch=!1}function an(a){let d=l.current;if(s.current&&d.has(a.pointerId)){d.set(a.pointerId,V(a)),x.current.pinch=!0,$();return}if(c(a)||m.current)return;let g=a.clientX-e.current.x,v=a.clientY-e.current.y;e.current={x:a.clientX,y:a.clientY},Math.hypot(a.clientX-o.current.x,a.clientY-o.current.y)>jt&&(i.current=!0);let y=x.current;if(t.draggingNode)t.moveNode(t.draggingNode,g/t.scaleX,v/t.scaleY);else if(t.isPanning)y.pan={dx:(y.pan?.dx??0)+g,dy:(y.pan?.dy??0)+v},$();else{let b=a.currentTarget.getBoundingClientRect();y.hover={x:a.clientX-b.left,y:a.clientY-b.top},$()}}function re(a){let d=l.current;if(s.current&&d.has(a.pointerId)){x.current.pinch&&(x.current.pinch=!1,ye()),d.delete(a.pointerId),s.current=null;let[[g,v]]=[...d];r.current=g,e.current=v;return}c(a)||(r.current=void 0,d.clear(),G(t)&&t.stopDragging())}function sn(a){c(a)||(r.current=void 0,l.current.clear(),s.current=null,rn(),Z(void 0),O(!1),G(t)&&(t.stopDragging(),t.clearHover()))}function ln(a){let{x:d,y:g}=R(a),v=L(d,g),{clientX:y,clientY:b}=a;if(v){a.preventDefault(),E({clientX:y,clientY:b,nodeId:v});return}let M=t.walkRowAt(d,g);M!==void 0&&(a.preventDefault(),E({clientX:y,clientY:b,row:M}))}function cn(a){if(!i.current){let{x:d,y:g}=R(a),v=L(d,g);t.setSelectedNode(v),v&&t.showNodeDetails(v)}}T(()=>()=>{m.current?.end()},[]);function pn(a){if(a.button!==0||t.hostPlacesX||t.followsHostView||!(a.target instanceof Element)||!a.target.closest(`[${tt}]`))return;m.current?.end(),u.current=!1,w.current=!1;let d=a.pointerId,g=V(a),v=g,y={moved:!1,end:()=>{window.removeEventListener("pointermove",b,!0),window.removeEventListener("pointerup",M,!0),window.removeEventListener("pointercancel",M,!0),y.moved&&G(t)&&t.stopDragging()}};function b(S){if(S.pointerId!==d)return;if(!y.moved){if(Math.hypot(S.clientX-g.x,S.clientY-g.y)<=jt)return;y.moved=!0,t.setPanning(!0)}let ae=x.current;ae.pan={dx:(ae.pan?.dx??0)+S.clientX-v.x,dy:(ae.pan?.dy??0)+S.clientY-v.y},v=V(S),$()}function M(S){S.pointerId===d&&(y.end(),setTimeout(()=>{m.current===y&&(m.current=null)},0))}m.current=y,window.addEventListener("pointermove",b,!0),window.addEventListener("pointerup",M,!0),window.addEventListener("pointercancel",M,!0)}function un(a){m.current?.moved&&(m.current=null,a.stopPropagation())}let dn={cursor:t.isPanning||t.draggingNode?"grabbing":N?"move":"grab",touchAction:t.hostPlacesX?"auto":"none",overscrollBehavior:"contain"},fn=t.host!==void 0&&!t.hostPlacesX&&!t.followsHostView?{[ve]:"",onMouseDown:a=>{a.stopPropagation()}}:{};return{canvasStyle:dn,surfaceProps:fn,handlers:{onMouseDown:tn,onPointerDown:nn,onPointerMove:an,onPointerUp:re,onPointerCancel:re,onLostPointerCapture:re,onPointerLeave:sn,onClick:cn,onContextMenu:ln},contextMenu:W,hoveredChip:Y,labelHandlers:{onPointerDown:pn,onClickCapture:un},closeContextMenu:()=>{E(void 0)}}}var oo={position:"relative"},ro={position:"relative",lineHeight:0,isolation:"isolate"},ao={position:"absolute",left:0,right:0,bottom:0,zIndex:0},io={position:"absolute",inset:0,zIndex:10,lineHeight:"normal",pointerEvents:"none"},so={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},lo=h(function({model:e}){return n(I,{children:e.visibleRowLabels.map(({label:o,y:i,top:r})=>n("div",{"data-testid":"graph-row-label",style:{...so,top:r},children:o},i))})}),co={position:"absolute",top:B,right:B,display:"flex",flexDirection:"column",borderRadius:3,overflowX:"hidden",overflowY:"auto",zIndex:4},Jt={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},po={...Jt,color:"#18181c",fontWeight:600},uo=h(function({model:e}){let o=k(null),i=e.legendAtRest;return T(()=>{let r=o.current;if(!r||!i)return;let c=()=>{G(e)&&e.legendAtRest&&e.setLegendSize({width:r.offsetWidth,height:r.scrollHeight})};c();let l=new ResizeObserver(c);return l.observe(r),r.firstElementChild&&l.observe(r.firstElementChild),()=>{l.disconnect()}},[e,i]),n("div",{ref:o,style:{...co,top:B+e.referenceStripZonePx,maxHeight:e.canvasHeight-2*B-e.referenceStripZonePx},children:n(kt,{model:e})})}),fo=h(function({model:e}){let o=e.overlayLabels.sizes,i=o.flatMap(({key:r,leader:c})=>c?[{key:r,...c}]:[]);return f(I,{children:[i.length>0?n(Q,{model:e,zIndex:2,overflow:"visible",children:i.map(({key:r,arcX:c,arcY:l,labelX:p,labelY:s})=>n("line",{"data-testid":"graph-label-leader",x1:c,y1:l,x2:p,y2:s,stroke:"#18181c",strokeWidth:1},r))}):null,o.map(({key:r,text:c,x:l,y:p,kind:s})=>n("div",{"data-testid":"graph-size-label",style:{...s==="deletion"?po:Jt,left:l,top:p},children:c},r))]})}),Qt=h(function({model:e,handle:{canvasRef:o,canvas:i},ownChrome:r}){let{handlers:c,canvasStyle:l,surfaceProps:p,labelHandlers:s,contextMenu:u,closeContextMenu:m,hoveredChip:w}=Ut(e),[x,W]=C(null);qt(x,i,e);let E=e.facetPanels!==void 0;return f("div",{style:oo,...p,children:[r?n(Ot,{model:e}):null,f("div",{ref:W,style:ro,...s,onMouseEnter:()=>{e.setPointerInPane(!0)},onMouseLeave:()=>{G(e)&&e.setPointerInPane(!1)},children:[e.referenceStripShown?n("div",{style:{...ao,top:e.referenceStripZonePx,background:J}}):null,n("canvas",{ref:o,"data-testid":"graph-genome-canvas",style:{...l,width:e.paneWidth,height:e.canvasHeight,display:"block",position:"relative",zIndex:1},...c}),E?n(Rt,{model:e,handlers:c,canvasStyle:l}):f(I,{children:[n(St,{model:e}),n(fe,{model:e}),n(wt,{model:e}),n(lo,{model:e}),n(fo,{model:e}),n(ot,{model:e}),n(ht,{model:e}),n(bt,{model:e}),n(xt,{model:e}),n(Yt,{model:e}),n(uo,{model:e})]}),r?n("div",{style:io,children:n(xe,{isVisible:e.isLoading,immediate:!e.layoutResult,statusMessage:e.statusMessage,onCancel:e.canCancelLoad?()=>{e.cancelLoad()}:void 0})}):null,n(Dt,{model:e,chip:w})]}),e.walkStripShown?n(Vt,{model:e}):null,n(F,{model:e,at:u,onClose:m}),r?.renderError?n(ie,{error:r.renderError,onReset:r.retryRender}):null,r&&e.error?n(ie,{error:e.error,onReset:e.canRetryLoad?()=>{e.retryLoad()}:void 0}):null]})}),ho=h(function({model:e}){let{canvasRef:o,canvas:i,error:r,retry:c}=Mt(Pt,e);return n(Qt,{model:e,handle:{canvasRef:o,canvas:i},ownChrome:{renderError:r,retryRender:c}})}),mo=h(function({model:e,handle:o}){return o?n(Qt,{model:e,handle:o}):n(ho,{model:e})}),$i=mo;export{Pt as a,$i as b};
2
+ //# sourceMappingURL=chunk-PXIHCJUD.js.map