jbrowse-plugin-graphgenomeviewer 4.0.12 → 4.0.13

package/dist/chunks/{chunk-WETM2CD7.js → chunk-LA7MQS33.js}

@@ -1,2 +1,2 @@
-import{C as g,H as M,k as m,n as u,y as c}from"./chunk-ADEBM7AA.js";import{a as d,b as N,c as I,d as G}from"./chunk-XEJ47DLD.js";import{a as T,b as l}from"./chunk-FY3BTKY4.js";var b=T((D,y)=>{y.exports=JBrowseExports["@mui/material/Button"]});var C=l(G(),1),t=l(I(),1),f=l(b(),1),h=l(N(),1),k=l(M(),1),e=l(d(),1),B=(0,k.makeStyles)()({section:{marginBottom:24},formControl:{minWidth:200}}),R=["Lowest","Low","Medium","High","Highest"],v=(0,h.observer)(function({model:s}){return s.hasGraph&&!s.usesLayoutEngine?(0,e.jsx)(t.Typography,{variant:"caption",color:"warning.main",children:"No effect on this layout: only the force-directed layout is drawn by the engine that reads this."}):null}),x=(0,h.observer)(function(s){let{model:o,open:S,onClose:p,children:L}=s,{classes:n}=B();return(0,e.jsxs)(C.Dialog,{open:S,onClose:p,title:"Graph settings",children:[(0,e.jsxs)(t.DialogContent,{children:[(0,e.jsx)("div",{className:n.section,children:(0,e.jsxs)(t.FormControl,{fullWidth:!0,children:[(0,e.jsx)(t.FormLabel,{component:"legend",children:"Layout quality"}),(0,e.jsx)(t.RadioGroup,{value:o.layoutQuality,onChange:a=>{let r=parseInt(a.target.value);o.setLayoutQuality(r),o.recomputeLayout()},children:R.map((a,r)=>(0,e.jsx)(t.FormControlLabel,{value:r,control:(0,e.jsx)(t.Radio,{}),label:a},a))}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"FMMM's iteration budget, the same scale Bandage exposes. Higher is slower: on a thousand-node cut the top setting is seconds rather than tenths."}),(0,e.jsx)(v,{model:o})]})}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsx)(t.FormControlLabel,{control:(0,e.jsx)(t.Switch,{checked:o.drawPaths,onChange:a=>{o.setDrawPaths(a.target.checked)}}),label:"Draw paths"}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Color each node and connector by the paths through it, one lane per path in legend order, so a path that skips a node leaves its lane empty"}),o.drawPaths&&!o.effectiveDrawPaths?(0,e.jsx)(t.Typography,{variant:"caption",color:"warning.main",children:o.pathCount>c?`Off: ${o.pathCount.toLocaleString()} paths is past the ${c} this can tell apart`:"Off: this graph states no paths"}):null]}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsx)(t.FormControlLabel,{control:(0,e.jsx)(t.Switch,{checked:o.showBubbles,onChange:a=>{o.setShowBubbles(a.target.checked)}}),label:"Mark bubbles"}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"A halo along the nodes of each bubble, labelled by what it is, with the label opening the bubble on its own"})]}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsx)(t.FormControlLabel,{control:(0,e.jsx)(t.Switch,{checked:o.showGenes,onChange:a=>{o.setShowGenes(a.target.checked)}}),label:"Genes on the backbone"}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Exons along the reference nodes that carry them and each gene's name at its midpoint, from the assembly's annotation track"}),o.geneTrackChoices.length>1?(0,e.jsxs)(t.FormControl,{className:n.formControl,sx:{mt:1},children:[(0,e.jsx)(t.InputLabel,{children:"Gene track"}),(0,e.jsx)(t.Select,{value:o.geneTrack?.trackId??"",label:"Gene track","data-testid":"graph-gene-track-select",onChange:a=>{o.setGeneTrackId(a.target.value),o.reloadGenes()},children:o.geneTrackChoices.map(({trackId:a,name:r})=>(0,e.jsx)(t.MenuItem,{value:a,children:r},a))})]}):null,o.repeatTrackChoices.length>1?(0,e.jsxs)(t.FormControl,{className:n.formControl,sx:{mt:1},children:[(0,e.jsx)(t.InputLabel,{children:"Repeat track"}),(0,e.jsx)(t.Select,{value:o.repeatTrack?.trackId??"",label:"Repeat track","data-testid":"graph-repeat-track-select",onChange:a=>{o.setRepeatTrackId(a.target.value),o.reloadRepeats()},children:o.repeatTrackChoices.map(({trackId:a,name:r})=>(0,e.jsx)(t.MenuItem,{value:a,children:r},a))})]}):null]}),o.anchorPaths.length>1?(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Reference path"}),(0,e.jsx)(t.Select,{value:o.activeReferencePath??"",label:"Reference path","data-testid":"graph-reference-path-select",onChange:a=>{o.setReferencePath(a.target.value),o.recomputeLayout()},children:o.anchorPaths.map(({name:a})=>(0,e.jsx)(t.MenuItem,{value:a,children:a},a))})]}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Which path the anchored layouts draw x against. A GFA with no rGFA tags states its coordinates only in its paths, and marks none of them as the reference."})]}):null,(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Bubble spread"}),(0,e.jsx)(t.Select,{value:o.bubbleSpread,label:"Bubble spread","data-testid":"graph-bubble-spread-select",onChange:a=>{o.setBubbleSpread(a.target.value),o.recomputeLayout()},children:m.map(({value:a,label:r,description:i})=>(0,e.jsx)(t.MenuItem,{value:a,children:(0,e.jsx)(t.Tooltip,{title:i,placement:"right",children:(0,e.jsx)("span",{children:r})})},a))})]}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"How far the force layout opens a bubble. A pangenome allele is a few bp, so at Bandage's own scale both arms land inside one node thickness and the graph draws as a rope."}),(0,e.jsx)(v,{model:o})]}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Node width"}),(0,e.jsx)(t.Select,{value:o.nodeWidth,label:"Node width","data-testid":"graph-node-width-select",onChange:a=>{o.setNodeWidth(a.target.value)},children:g.map(({value:a,label:r,description:i})=>(0,e.jsx)(t.MenuItem,{value:a,children:(0,e.jsx)(t.Tooltip,{title:i,placement:"right",children:(0,e.jsx)("span",{children:r})})},a))})]}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Bandage's depth as width. In a cut with walks, depth is how many haplotypes carry the node."})]}),L,(0,e.jsx)("div",{className:n.section,children:(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Color scheme"}),(0,e.jsx)(t.Select,{value:o.chosenColorScheme,label:"Color scheme",onChange:a=>{o.setColorScheme(a.target.value)},children:u.map(({value:a,label:r})=>(0,e.jsx)(t.MenuItem,{value:a,children:r},a))})]})})]}),(0,e.jsx)(t.DialogActions,{children:(0,e.jsx)(f.default,{variant:"contained",color:"primary",onClick:p,children:"Close"})})]})}),O=x;export{O as a};
-//# sourceMappingURL=chunk-WETM2CD7.js.map
+import{A as M,c as m,f as u,r as c,v as g}from"./chunk-M4YEAXSR.js";import{a as d,b as N,c as I,d as G}from"./chunk-XEJ47DLD.js";import{a as T,b as l}from"./chunk-FY3BTKY4.js";var b=T((D,y)=>{y.exports=JBrowseExports["@mui/material/Button"]});var C=l(G(),1),t=l(I(),1),f=l(b(),1),h=l(N(),1),k=l(M(),1),e=l(d(),1),B=(0,k.makeStyles)()({section:{marginBottom:24},formControl:{minWidth:200}}),R=["Lowest","Low","Medium","High","Highest"],v=(0,h.observer)(function({model:s}){return s.hasGraph&&!s.usesLayoutEngine?(0,e.jsx)(t.Typography,{variant:"caption",color:"warning.main",children:"No effect on this layout: only the force-directed layout is drawn by the engine that reads this."}):null}),x=(0,h.observer)(function(s){let{model:o,open:S,onClose:p,children:L}=s,{classes:n}=B();return(0,e.jsxs)(C.Dialog,{open:S,onClose:p,title:"Graph settings",children:[(0,e.jsxs)(t.DialogContent,{children:[(0,e.jsx)("div",{className:n.section,children:(0,e.jsxs)(t.FormControl,{fullWidth:!0,children:[(0,e.jsx)(t.FormLabel,{component:"legend",children:"Layout quality"}),(0,e.jsx)(t.RadioGroup,{value:o.layoutQuality,onChange:a=>{let r=parseInt(a.target.value);o.setLayoutQuality(r),o.recomputeLayout()},children:R.map((a,r)=>(0,e.jsx)(t.FormControlLabel,{value:r,control:(0,e.jsx)(t.Radio,{}),label:a},a))}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"FMMM's iteration budget, the same scale Bandage exposes. Higher is slower: on a thousand-node cut the top setting is seconds rather than tenths."}),(0,e.jsx)(v,{model:o})]})}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsx)(t.FormControlLabel,{control:(0,e.jsx)(t.Switch,{checked:o.drawPaths,onChange:a=>{o.setDrawPaths(a.target.checked)}}),label:"Draw paths"}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Color each node and connector by the paths through it, one lane per path in legend order, so a path that skips a node leaves its lane empty"}),o.drawPaths&&!o.effectiveDrawPaths?(0,e.jsx)(t.Typography,{variant:"caption",color:"warning.main",children:o.pathCount>c?`Off: ${o.pathCount.toLocaleString()} paths is past the ${c} this can tell apart`:"Off: this graph states no paths"}):null]}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsx)(t.FormControlLabel,{control:(0,e.jsx)(t.Switch,{checked:o.showBubbles,onChange:a=>{o.setShowBubbles(a.target.checked)}}),label:"Mark bubbles"}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"A halo along the nodes of each bubble, labelled by what it is, with the label opening the bubble on its own"})]}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsx)(t.FormControlLabel,{control:(0,e.jsx)(t.Switch,{checked:o.showGenes,onChange:a=>{o.setShowGenes(a.target.checked)}}),label:"Genes on the backbone"}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Exons along the reference nodes that carry them and each gene's name at its midpoint, from the assembly's annotation track"}),o.geneTrackChoices.length>1?(0,e.jsxs)(t.FormControl,{className:n.formControl,sx:{mt:1},children:[(0,e.jsx)(t.InputLabel,{children:"Gene track"}),(0,e.jsx)(t.Select,{value:o.geneTrack?.trackId??"",label:"Gene track","data-testid":"graph-gene-track-select",onChange:a=>{o.setGeneTrackId(a.target.value),o.reloadGenes()},children:o.geneTrackChoices.map(({trackId:a,name:r})=>(0,e.jsx)(t.MenuItem,{value:a,children:r},a))})]}):null,o.repeatTrackChoices.length>1?(0,e.jsxs)(t.FormControl,{className:n.formControl,sx:{mt:1},children:[(0,e.jsx)(t.InputLabel,{children:"Repeat track"}),(0,e.jsx)(t.Select,{value:o.repeatTrack?.trackId??"",label:"Repeat track","data-testid":"graph-repeat-track-select",onChange:a=>{o.setRepeatTrackId(a.target.value),o.reloadRepeats()},children:o.repeatTrackChoices.map(({trackId:a,name:r})=>(0,e.jsx)(t.MenuItem,{value:a,children:r},a))})]}):null]}),o.anchorPaths.length>1?(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Reference path"}),(0,e.jsx)(t.Select,{value:o.activeReferencePath??"",label:"Reference path","data-testid":"graph-reference-path-select",onChange:a=>{o.setReferencePath(a.target.value),o.recomputeLayout()},children:o.anchorPaths.map(({name:a})=>(0,e.jsx)(t.MenuItem,{value:a,children:a},a))})]}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Which path the anchored layouts draw x against. A GFA with no rGFA tags states its coordinates only in its paths, and marks none of them as the reference."})]}):null,(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Bubble spread"}),(0,e.jsx)(t.Select,{value:o.bubbleSpread,label:"Bubble spread","data-testid":"graph-bubble-spread-select",onChange:a=>{o.setBubbleSpread(a.target.value),o.recomputeLayout()},children:m.map(({value:a,label:r,description:i})=>(0,e.jsx)(t.MenuItem,{value:a,children:(0,e.jsx)(t.Tooltip,{title:i,placement:"right",children:(0,e.jsx)("span",{children:r})})},a))})]}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"How far the force layout opens a bubble. A pangenome allele is a few bp, so at Bandage's own scale both arms land inside one node thickness and the graph draws as a rope."}),(0,e.jsx)(v,{model:o})]}),(0,e.jsxs)("div",{className:n.section,children:[(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Node width"}),(0,e.jsx)(t.Select,{value:o.nodeWidth,label:"Node width","data-testid":"graph-node-width-select",onChange:a=>{o.setNodeWidth(a.target.value)},children:g.map(({value:a,label:r,description:i})=>(0,e.jsx)(t.MenuItem,{value:a,children:(0,e.jsx)(t.Tooltip,{title:i,placement:"right",children:(0,e.jsx)("span",{children:r})})},a))})]}),(0,e.jsx)(t.Typography,{variant:"caption",color:"text.secondary",children:"Bandage's depth as width. In a cut with walks, depth is how many haplotypes carry the node."})]}),L,(0,e.jsx)("div",{className:n.section,children:(0,e.jsxs)(t.FormControl,{className:n.formControl,children:[(0,e.jsx)(t.InputLabel,{children:"Color scheme"}),(0,e.jsx)(t.Select,{value:o.chosenColorScheme,label:"Color scheme",onChange:a=>{o.setColorScheme(a.target.value)},children:u.map(({value:a,label:r})=>(0,e.jsx)(t.MenuItem,{value:a,children:r},a))})]})})]}),(0,e.jsx)(t.DialogActions,{children:(0,e.jsx)(f.default,{variant:"contained",color:"primary",onClick:p,children:"Close"})})]})}),O=x;export{O as a};
+//# sourceMappingURL=chunk-LA7MQS33.js.map

package/dist/chunks/chunk-M4YEAXSR.js

@@ -0,0 +1,2 @@
+import{a as c}from"./chunk-MUK3KYB4.js";import{a as N}from"./chunk-FY3BTKY4.js";var $=N((me,g)=>{g.exports=JBrowseExports["tss-react/mui"]});function X(e,t){return Math.max(e.nodeLengthPerMegabase*t/1e6,e.minimumNodeLength)}function L(e,t=5){let r=e.nodes.reduce((a,s)=>a+s.length,0)/1e6,o=Math.max(e.nodes.length*40,500);return{nodeLengthPerMegabase:r>0?o/r:1e4,minimumNodeLength:Math.max(5,t),edgeLength:5,nodeSegmentLength:20}}var p={power:1,effect:1};function b(e){return e.power===1&&e.effect===1}function E(e,t){let n=e.nodes.length,r=e.nodes.reduce((s,i)=>s+i.length,0),o=n>0?r/n:0,a=n>0?Math.max(n*40,500)/n:40;return s=>{if(o<=0)return a;let i=(s/o)**t.power;return Math.max(a*((i-1)*t.effect+1),5)}}var u=1e3,_={law:p,minNodeLength:0};function j(e,t=_){let{law:n,minNodeLength:r}=t,o=L(e,r);if(b(n))return{nodes:e.nodes,opts:o};let a=E(e,n);return{nodes:e.nodes.map(s=>({...s,length:Math.round(a(s.length)*u)})),opts:{...o,nodeLengthPerMegabase:1e6/u,minimumNodeLength:5}}}var m=[{value:"auto",label:"Proportional",description:"Bandage's own scale: a node draws proportional to its length, so a 1 bp allele is a speck.",law:p,minNodeFactor:0},{value:"open",label:"Open bubbles",description:"Give every allele a drawn length, so a bubble reads as two arms rather than a knot.",law:p,minNodeFactor:2.5},{value:"wide",label:"Wide bubbles",description:"As open, spread further. Best on a window of a dozen bubbles.",law:p,minNodeFactor:10},{value:"compress",label:"Compress lengths",description:"Pull the longest and shortest nodes towards the graph\u2019s mean, so a cut spanning kb and bp fits one pane.",law:{power:.5,effect:.5},minNodeFactor:0}],K=m.map(e=>e.value);function J(e){let t=m.find(n=>n.value===e);return{law:t?.law??p,minNodeLength:(t?.minNodeFactor??0)*40}}var G=[{value:"auto",label:"Auto"},{value:"uniform",label:"Uniform"},{value:"random",label:"Random"},{value:"rainbow",label:"Rainbow"},{value:"depth",label:"Depth"},{value:"node-length",label:"Node Length"},{value:"stable-rank",label:"Stable rank"},{value:"reference-position",label:"Reference position"},{value:"grey",label:"Grey"}],Q=G.map(e=>e.value);function Z(e,t){return e!=="auto"?e:t?.anchoredBy?"reference-position":"uniform"}var A=/:(\d+)-\d+$/;function d(e){let t=A.exec(e);return t?{name:e.slice(0,t.index),start:+t[1]}:{name:e,start:0}}function re(e,t){let n=[],r=new Map;for(let o of e){let a=c(o.name),s=o.start;for(let i of o.steps){let h={path:o.name,sample:a,start:s,strand:i.strand},l=r.get(i.id);l?l.push(h):r.set(i.id,[h]),s+=t(i.id)}n.push({name:o.name,sample:a,start:o.start,length:s-o.start})}return{anchorPaths:n,pathVisits:r}}function O(e,t){return e.find(r=>r.sample===t||r.name===t)??e[0]}var M=1;function w(e,t,n){let r=e;if(t&&t.length>0){let o=t.find(a=>a.path===n)??t[0];r={...e,stable:{refName:o.path,start:o.start,rank:o.path===n?0:M,strand:o.strand},samples:[...new Set(t.map(a=>a.sample))].sort()}}return r}function P(e,t){let{anchorPaths:n,pathVisits:r}=e,o=n&&r?O(n,t):void 0;return o&&r?{...e,nodes:e.nodes.map(a=>w(a,r.get(a.name),o.name)),anchoredBy:"paths",referencePath:o.name}:e}function oe(e,t){return e.anchoredBy==="tags"?e:P(e,t)}function ie(e){let t=0;for(let n=0;n<e.length;n++)t=e.charCodeAt(n)+((t<<5)-t);return Math.abs(t%360)}function y(e,t){return e*360/t}var T=.7,D=.5,R=16;function pe(e){return e>0&&e<=R}function H(e,t){return`hsl(${y(e,t)}, ${T*100}%, ${D*100}%)`}function I(e){let t=d(e).name.split("#");return[t[0],t.slice(0,2).join("#"),t.join("#")]}function v(e){return String(e).replace(/\B(?=(\d{3})+$)/g,",")}function B(e,t){let{start:n}=d(e);return t.map(r=>`${r} @${v(n)}`)}function de(e){let t=e.map(a=>I(a.name)),n=[0,1,2].flatMap(a=>[e.map((s,i)=>t[i][a]),e.map((s,i)=>B(s.name,t[i])[a])]),o=n.find(a=>new Set(a).size===e.length)??n.at(-1);return e.map((a,s)=>({name:a.name,label:o[s],color:H(s,e.length)}))}var C=[{value:"depth",label:"By depth",description:"Thicker the more paths carry a node, on the square root of its depth against the mean. A graph with one depth everywhere draws uniform."},{value:"uniform",label:"Uniform",description:"Every node the same thickness."}],le=C.map(e=>e.value),F=.3,f=3;function U(e){let t=0,n=0;for(let r of e.nodes)t+=r.depth*r.length,n+=r.length;return n>0?t/n:0}function W(e,t){return!(t>0)||!(e.depth>0)?1:Math.min(f,Math.max(F,Math.sqrt(e.depth/t)))}function k(e,t,n,r){return t*(n==="depth"?W(e,r):1)}function V(e,t){return e*(t==="depth"?f:1)}function ce(e,t,n,r){let o=e?U(e):0;return{maxHalfWidthPx:V(n,r)/2,halfWidthPx:a=>{let s=t?.get(a);return s?k(s,n,r,o)/2:n/2}}}export{X as a,j as b,m as c,K as d,J as e,G as f,Q as g,Z as h,d as i,re as j,O as k,P as l,oe as m,ie as n,y as o,T as p,D as q,R as r,pe as s,H as t,de as u,C as v,le as w,U as x,k as y,ce as z,$ as A};
+//# sourceMappingURL=chunk-M4YEAXSR.js.map

package/dist/chunks/chunk-M4YEAXSR.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["global-externals:tss-react/mui", "../../packages/core/src/layout/drawnScale.ts", "../../packages/core/src/bubbleSpreads.ts", "../../packages/core/src/colorSchemes.ts", "../../packages/core/src/pathAnchoring.ts", "../../packages/core/src/pathColors.ts", "../../packages/core/src/nodeWidths.ts"],
+  "sourcesContent": ["module.exports = JBrowseExports[\"tss-react/mui\"];", "import type { Graph, GraphNode } from '../types'\n\nexport interface BandageScaleOpts {\n  nodeLengthPerMegabase: number\n  minimumNodeLength: number\n  nodeSegmentLength: number\n  edgeLength: number\n}\n\n// Node drawn length, in FMMM units, as a function of bp. Used both by the layouts\n// that run here and by the options handed to the WASM engine, so a graph is drawn\n// at the same scale whichever one draws it. Bandage's own auto rule\n// (`AssemblyGraph::determineGraphInfo`):\n// pick units-per-megabase so the *mean* drawn node length lands on 40, with a\n// floor on total drawn length so a small graph doesn't collapse to a speck.\n//\n// This has to be derived per graph, not fixed. The scale that suits a bacterial\n// assembly's 10-100 kb contigs is wrong by orders of magnitude for a minigraph\n// pangenome window, whose nodes run 300 bp to a few kb: a fixed 1000 units/Mbp\n// makes every node shorter than the edges between them and the graph reads as\n// beads on a string, while 1 unit/bp makes each node a long sweeping curve and\n// the graph sprawls. For the 53-node E. coli window this lands near 35,000.\n//\n// It matters most at the small end. The WASM wrapper's own default of 1000\n// units/Mbp puts *every* node in a 400 bp pggb window below minimumNodeLength,\n// so all 31 clamp to the floor and a 1 bp SNP allele draws the same size as the\n// 164 bp backbone segment beside it \u2014 which is what made that figure read as a\n// chain of same-sized two-node bubbles. Bandage draws the same file with a 75:1\n// length ratio, the SNP alleles as specks.\n//\n// The remaining three are upstream Bandage's shipped defaults\n// (`program/settings.cpp`), which the WASM wrapper's own header does not match \u2014\n// it defaults all of them to 1.0, so they have to be passed explicitly.\nconst MEAN_NODE_LENGTH = 40\nconst MIN_TOTAL_GRAPH_LENGTH = 500\n\n// Bandage's own floor on a node's drawn length. Right for an assembly graph,\n// whose nodes are kb to Mb, and the reason a variation graph draws as a rope:\n// see BUBBLE_SPREADS, which is how a view asks for more.\nconst BANDAGE_MINIMUM_NODE_LENGTH = 5\n\n// The engine's own rule (`settings.h`, `getDrawnNodeLength`), so a seed computed\n// here spans exactly the chain the engine builds from the same numbers.\nexport function drawnNodeLength(opts: BandageScaleOpts, length: number) {\n  return Math.max(\n    (opts.nodeLengthPerMegabase * length) / 1_000_000,\n    opts.minimumNodeLength,\n  )\n}\n\nexport function bandageAutoScale(\n  graph: Graph,\n  // Floor on a node's drawn length, in the same FMMM units as the scale below.\n  // Anything at or under Bandage's own floor leaves the drawing exactly as it\n  // was, which is what keeps `'auto'` byte-identical to the shipped behaviour.\n  minNodeLength = BANDAGE_MINIMUM_NODE_LENGTH,\n): BandageScaleOpts {\n  const totalLength = graph.nodes.reduce((sum, n) => sum + n.length, 0)\n  const megabases = totalLength / 1_000_000\n  const target = Math.max(\n    graph.nodes.length * MEAN_NODE_LENGTH,\n    MIN_TOTAL_GRAPH_LENGTH,\n  )\n  return {\n    nodeLengthPerMegabase: megabases > 0 ? target / megabases : 10_000,\n    minimumNodeLength: Math.max(BANDAGE_MINIMUM_NODE_LENGTH, minNodeLength),\n    edgeLength: 5,\n    nodeSegmentLength: 20,\n  }\n}\n\n// How a node's bp becomes its drawn length, as a power law against the graph's\n// own mean. The idiom is Bandage's, moved onto the axis a pangenome needs it on:\n// upstream derives a node's *width* from its depth exactly this way\n// (`graph/graphicsitemnode.cpp`, `getNodeWidth`), at a `depthPower` of 0.5 and a\n// `depthEffectOnWidth` of 0.5, because depth in an assembly graph spans orders\n// of magnitude and drawing it linearly is unreadable.\n//\n//   drawn = meanDrawn * (((bp / meanBp) ^ power - 1) * effect + 1)\n//\n// Length in a *variation* graph spans those same orders of magnitude \u2014 a 1 bp\n// allele beside a 16 kb backbone segment \u2014 and upstream still maps it linearly,\n// because its own nodes are assembled contigs where that range does not arise.\n// That linear map is what draws a pggb window as one rope: past the small end\n// every allele falls under `minimumNodeLength` and clamps, so both arms of a\n// bubble land inside one node thickness of each other.\n//\n// power 1 with effect 1 is exactly proportional, so Bandage's shipped behaviour\n// is a point in this family rather than a mechanism sitting beside it. See\n// BUBBLE_SPREADS for the points a view can ask for.\nexport interface DrawnLengthLaw {\n  // exponent applied to a node's length relative to the graph's mean\n  power: number\n  // how much of that relative length survives. 0 draws every node at the mean,\n  // 1 applies the power law undamped.\n  effect: number\n}\n\nexport const PROPORTIONAL_LENGTH: DrawnLengthLaw = { power: 1, effect: 1 }\n\nexport function isProportional(law: DrawnLengthLaw) {\n  return law.power === 1 && law.effect === 1\n}\n\n// Drawn length in FMMM units for one node of `graph`, under `law`.\nexport function drawnLengthFor(graph: Graph, law: DrawnLengthLaw) {\n  const count = graph.nodes.length\n  const totalLength = graph.nodes.reduce((sum, n) => sum + n.length, 0)\n  const meanBp = count > 0 ? totalLength / count : 0\n  // The mean drawn length `bandageAutoScale` already targets, small-graph floor\n  // included, so a compressed drawing comes out the same overall size as the\n  // proportional one it replaces. That is the property a per-node floor does\n  // not have, and the reason raising one is unusable at scale: it lifts the\n  // hundreds of non-branching chain nodes along with the alleles, which on a\n  // 521-node cut inflates the drawing past what zoom-to-fit can frame.\n  const meanDrawn =\n    count > 0\n      ? Math.max(count * MEAN_NODE_LENGTH, MIN_TOTAL_GRAPH_LENGTH) / count\n      : MEAN_NODE_LENGTH\n  return (bp: number) => {\n    if (meanBp <= 0) {\n      return meanDrawn\n    }\n    const relative = (bp / meanBp) ** law.power\n    return Math.max(\n      meanDrawn * ((relative - 1) * law.effect + 1),\n      BANDAGE_MINIMUM_NODE_LENGTH,\n    )\n  }\n}\n\n// The engine's own length rule is linear with a floor and takes two numbers\n// (`settings.h`, `getDrawnNodeLength`), so a non-linear law cannot be expressed\n// through them. It can be expressed in the lengths themselves: node length\n// crosses the RPC boundary only to become a drawn length \u2014 `getLength()` has\n// exactly two call sites upstream, both inside that rule \u2014 so handing the engine\n// pre-transformed lengths and a 1:1 scale draws the law without touching the\n// WASM build. Scaled by this factor first because the binding reads a node's\n// length as an `unsigned`, and rounding drawn units straight to integers would\n// quantise the small end where the whole point is legibility.\nconst LAYOUT_LENGTH_PRECISION = 1000\n\n// How a view asks for its node lengths: a law, plus Bandage's own per-node\n// floor. Orthogonal on purpose \u2014 see BUBBLE_SPREADS for which does what.\nexport interface NodeLengthSpread {\n  law: DrawnLengthLaw\n  // in the same FMMM units as the drawn lengths. At or under Bandage's own\n  // floor this leaves the drawing exactly as it was.\n  minNodeLength: number\n}\n\nexport const PROPORTIONAL_SPREAD: NodeLengthSpread = {\n  law: PROPORTIONAL_LENGTH,\n  minNodeLength: 0,\n}\n\nexport interface LayoutScaling {\n  // the nodes to hand the engine. Under any law but the proportional one their\n  // `length` is a scaled drawn length rather than a bp count, which is why this\n  // is a separate array and never the graph's own nodes.\n  nodes: GraphNode[]\n  opts: BandageScaleOpts\n}\n\nexport function layoutScaling(\n  graph: Graph,\n  spread: NodeLengthSpread = PROPORTIONAL_SPREAD,\n): LayoutScaling {\n  const { law, minNodeLength } = spread\n  const opts = bandageAutoScale(graph, minNodeLength)\n  // The proportional law is what every committed force figure was drawn\n  // against, and it is already exactly what `bandageAutoScale` expresses, so it\n  // keeps the untransformed path rather than round-tripping through a rounding\n  // step FMMM would be free to amplify. Every floor-based spread comes through\n  // here too, unchanged.\n  if (isProportional(law)) {\n    return { nodes: graph.nodes, opts }\n  }\n  const drawn = drawnLengthFor(graph, law)\n  return {\n    nodes: graph.nodes.map(node => ({\n      ...node,\n      length: Math.round(drawn(node.length) * LAYOUT_LENGTH_PRECISION),\n    })),\n    opts: {\n      ...opts,\n      nodeLengthPerMegabase: 1_000_000 / LAYOUT_LENGTH_PRECISION,\n      // Bandage's own floor only. A law and a raised floor are alternatives\n      // rather than a stack: the law has already lifted the small end, and a\n      // floor on top of it would flatten exactly what it just spread.\n      minimumNodeLength: BANDAGE_MINIMUM_NODE_LENGTH,\n    },\n  }\n}\n\n// The mean drawn node length `bandageAutoScale` targets, exported so\n// BUBBLE_SPREADS can state its laws against it rather than against unanchored\n// constants.\nexport { MEAN_NODE_LENGTH }\n", "import { MEAN_NODE_LENGTH, PROPORTIONAL_LENGTH } from './layout/drawnScale'\n\nimport type { NodeLengthSpread } from './layout/drawnScale'\n\n// How far apart the force layout draws the two arms of a bubble, as the law\n// turning a node's bp into its drawn length. One table drives the persisted\n// enum, the dropdown and the value handed to the engine, the same way\n// LAYOUT_MODES and COLOR_SCHEMES do.\n//\n// Why this needs to be a control rather than a better default: the drawn-length\n// law is the one thing standing between a variation graph and a legible force\n// layout, and compressing it costs the property that node length is proportional\n// to bp. Bandage maps length linearly, which suits an assembly graph whose nodes\n// are kb to Mb. In a pangenome an allele is 1-50 bp against a backbone segment\n// of several kb, so on that map every alt clamps to the engine's 5-unit floor,\n// both arms of a bubble land inside one node thickness of each other, and FMMM\n// has nothing to spread \u2014 zoom-to-fit then delivers a single rope with the\n// variation invisible inside it. Compressing the law opens the bubbles and\n// flattens the length ratio, and which of those a reader wants depends on the\n// figure, so the view asks rather than assumes.\n//\n// The compression is Bandage's own, taken off the axis upstream uses it on: it\n// draws node *width* from depth as a power law against the mean, at power 0.5\n// and effect 0.5, for the same reason. 'open' is those two numbers. See\n// DrawnLengthLaw.\n//\n// Measured on an odgi extract of GRCh38#0#chrM:8,200-8,400 from HPRC release 2's\n// chrM pggb graph (61 nodes, 84 edges, 234 haplotype paths), fitted to a 900x560\n// pane: proportional is one squiggle with a single knot in it, and the bubbles\n// come apart into legible lenses once the law compresses.\n//\n// The floor and the law are different instruments and both are kept, because\n// neither does the other's job:\n//\n// - a FLOOR lifts the small end and leaves everything above it proportional. It\n//   is what a figure wants when one long node has to stay long \u2014 the ribbons in\n//   `pangenome/pggb_haplotype_paths` separate along a 1.2 kb deletion arc, and\n//   shortening that arc towards the mean piles them up. Its cost is that it is a\n//   per-node minimum, so it lifts a graph's non-branching chain nodes along with\n//   its alleles and the drawing inflates with node count: on the 521-node pggb\n//   cut in `pangenome/graph_resolution` it reached ~52,000 units and a 1.4% fit,\n//   which is why that figure could once afford a spread on its 7-node half only.\n// - the LAW compresses both ends towards the mean, so the drawing stays the size\n//   it already was whatever the node count, and a cut spanning 6 bp to 16 kb\n//   fits one pane. Its cost is the top end: a node that has to read as long no\n//   longer does.\n//\n// So a figure about bubble shape at scale takes 'compress', and a figure about\n// what is drawn along one long edge takes 'open'.\n//\n// 'auto' is the proportional map, unchanged, so every existing figure and the\n// `bandageAutoScale` length-proportionality test are untouched by this existing.\nexport const BUBBLE_SPREADS = [\n  {\n    value: 'auto',\n    label: 'Proportional',\n    description:\n      \"Bandage's own scale: a node draws proportional to its length, so a 1 bp allele is a speck.\",\n    law: PROPORTIONAL_LENGTH,\n    minNodeFactor: 0,\n  },\n  {\n    value: 'open',\n    label: 'Open bubbles',\n    description:\n      'Give every allele a drawn length, so a bubble reads as two arms rather than a knot.',\n    law: PROPORTIONAL_LENGTH,\n    minNodeFactor: 2.5,\n  },\n  {\n    value: 'wide',\n    label: 'Wide bubbles',\n    description:\n      'As open, spread further. Best on a window of a dozen bubbles.',\n    law: PROPORTIONAL_LENGTH,\n    minNodeFactor: 10,\n  },\n  {\n    value: 'compress',\n    label: 'Compress lengths',\n    description:\n      'Pull the longest and shortest nodes towards the graph\\u2019s mean, so a cut spanning kb and bp fits one pane.',\n    law: { power: 0.5, effect: 0.5 },\n    minNodeFactor: 0,\n  },\n] as const\n\nexport type BubbleSpread = (typeof BUBBLE_SPREADS)[number]['value']\n\nexport const BUBBLE_SPREAD_VALUES = BUBBLE_SPREADS.map(s => s.value)\n\n// The law and floor behind a spread, resolved so the model has one place that\n// knows how a spread becomes numbers. An unknown value draws proportionally\n// rather than throwing, which is what a session persisted by a newer build\n// degrades to.\nexport function spreadFor(spread: string): NodeLengthSpread {\n  const entry = BUBBLE_SPREADS.find(s => s.value === spread)\n  return {\n    law: entry?.law ?? PROPORTIONAL_LENGTH,\n    minNodeLength: (entry?.minNodeFactor ?? 0) * MEAN_NODE_LENGTH,\n  }\n}\n", "import type { Graph } from './types'\n\n// One table drives the persisted enum and both colour dropdowns, the same way\n// LAYOUT_MODES drives the layout enum and its menu. The values and their labels\n// used to live in two lists in two directories, so adding a scheme meant editing\n// both and a mismatch showed up as a dropdown entry that selected nothing.\n//\n// Kept out of the components directory because the model needs it too.\nexport const COLOR_SCHEMES = [\n  // Mirrors `layoutModes`' 'auto': a value the model resolves rather than a\n  // colour of its own. It exists because 'uniform' was the default, so a\n  // launched graph opened flat grey and both tutorials spent a step saying \"now\n  // pick a colour\" \u2014 one figure literally drives that click. A graph with\n  // reference coordinates resolves to 'reference-position', which is the one\n  // ramp a linear track beside it can be painted with too; a graph with none\n  // keeps 'uniform', because there the ramp would be a hue nothing earned.\n  //\n  // Resolve through `effectiveColorScheme`; the dropdown reads the raw prop, so\n  // \"Auto\" stays selectable and visible as what it is.\n  { value: 'auto', label: 'Auto' },\n  { value: 'uniform', label: 'Uniform' },\n  { value: 'random', label: 'Random' },\n  { value: 'rainbow', label: 'Rainbow' },\n  { value: 'depth', label: 'Depth' },\n  { value: 'node-length', label: 'Node Length' },\n  { value: 'stable-rank', label: 'Stable rank' },\n  { value: 'reference-position', label: 'Reference position' },\n  { value: 'grey', label: 'Grey' },\n] as const\n\nexport type ColorScheme = (typeof COLOR_SCHEMES)[number]['value']\n\n// What the renderer can actually paint with: every scheme except the one that\n// stands for \"work it out\". Stated as its own type so `getNodeColor`'s switch\n// has no 'auto' arm to forget.\nexport type ResolvedColorScheme = Exclude<ColorScheme, 'auto'>\n\nexport const COLOR_SCHEME_VALUES = COLOR_SCHEMES.map(s => s.value)\n\n// 'auto' asks the GRAPH, not the layout: a hue along the reference means\n// something whenever the segments have reference coordinates, force-directed\n// drawings included.\nexport function resolveColorScheme(\n  scheme: ColorScheme,\n  graph: Graph | undefined,\n): ResolvedColorScheme {\n  return scheme !== 'auto'\n    ? scheme\n    : graph?.anchoredBy\n      ? 'reference-position'\n      : 'uniform'\n}\n", "import { REFERENCE_RANK } from './anchoredNodes'\nimport { panSNSample } from './pansn'\n\nimport type { Graph, GraphNode, PathOrigin, PathVisit } from './types'\n\n// Reference coordinates for a GFA that tags none of its segments with one.\n//\n// rGFA writes the fact per segment (SN/SO/SR). A pggb / odgi / Minigraph-Cactus\n// graph writes the same fact once per path and leaves the arithmetic to the\n// reader: walking a path's steps in order, accumulating segment lengths,\n// assigns every segment that path visits an interval on the path's own\n// sequence. Same information, different encoding \u2014 so a general GFA is not a\n// degraded rGFA, and the anchored layouts work on it once the walk is done.\n//\n// It carries one thing rGFA cannot: a segment's *carriage*, the set of\n// assemblies that actually traverse it. rGFA's SR is build order, so there the\n// most a segment can say is which assembly first contributed it.\n\n// `odgi extract` names an extracted path for the interval it covers on its own\n// sequence: `K12#1#chr:1004500-1004961`. That suffix is the only place a cut\n// subgraph states where in the genome it sits, so it is split off here rather\n// than carried around as part of the name \u2014 no assembly has a sequence called\n// `K12#1#chr:1004500-1004961`, and PanSN parsing of it yields a contig no\n// linear view can open.\n//\n// Anchored on the digits rather than on a trailing colon, because a stable name\n// may legitimately contain one (the same hazard gfaParser's tag splitting has).\nconst RANGE_SUFFIX = /:(\\d+)-\\d+$/\n\nexport function pathOrigin(pathName: string) {\n  const match = RANGE_SUFFIX.exec(pathName)\n  return match\n    ? { name: pathName.slice(0, match.index), start: +match[1]! }\n    : { name: pathName, start: 0 }\n}\n\nexport interface PathSteps {\n  name: string\n  start: number\n  steps: { id: string; strand: '+' | '-' }[]\n}\n\n// The single walk. Every segment visit lands in `pathVisits` at the bp its own\n// path reaches it at; `anchorPaths` is what the walk learned about the paths\n// themselves, which is what a reference-path picker lists.\nexport function surveyPaths(\n  paths: PathSteps[],\n  lengthOf: (segmentId: string) => number,\n) {\n  const anchorPaths: PathOrigin[] = []\n  const pathVisits = new Map<string, PathVisit[]>()\n  for (const path of paths) {\n    const sample = panSNSample(path.name)\n    let pos = path.start\n    for (const step of path.steps) {\n      const visit = {\n        path: path.name,\n        sample,\n        start: pos,\n        strand: step.strand,\n      }\n      const existing = pathVisits.get(step.id)\n      if (existing) {\n        existing.push(visit)\n      } else {\n        pathVisits.set(step.id, [visit])\n      }\n      pos += lengthOf(step.id)\n    }\n    anchorPaths.push({\n      name: path.name,\n      sample,\n      start: path.start,\n      length: pos - path.start,\n    })\n  }\n  return { anchorPaths, pathVisits }\n}\n\n// Which path x is drawn on. This is a choice, not a fact: a general GFA's path\n// names are arbitrary and nothing in the file marks one of them as the\n// reference, so a preference is matched against a path's PanSN sample name (the\n// assembly a subgraph was cut against, which is how the launch path knows) and\n// then against its full name. With no preference the first path in the file\n// wins, which is where pggb and odgi leave the reference.\nexport function chooseReferencePath(\n  anchorPaths: PathOrigin[],\n  preferred: string | undefined,\n) {\n  const named = anchorPaths.find(\n    p => p.sample === preferred || p.name === preferred,\n  )\n  return named ?? anchorPaths[0]\n}\n\n// Rank on a path-derived graph is the one distinction the paths support: on the\n// reference path or off it. rGFA's higher ranks are minigraph's build order,\n// which a path GFA has no equivalent of, so drawing more rows than this would\n// be drawing structure the file does not state.\nconst OFF_REFERENCE_RANK = 1\n\n// A segment the reference path visits sits on the backbone at the offset that\n// visit reaches it. One it never visits is an alternate allele, placed on the\n// coordinates of the first path that does carry it \u2014 the same asymmetry rGFA\n// has, where a rank>0 segment's SO is an offset on the assembly that\n// contributed the sequence rather than on the reference.\n//\n// **First visit wins** when a path reaches the same segment more than once, and\n// collapsed repeats make that real rather than hypothetical: pggb folds the\n// E. coli rRNA operons into shared segments, so every strain's path walks them\n// twice (`odgi depth` reaches 10 over a five-strain graph at chr:4,167,000 and\n// chr:3,942,000). A node draws as one tube at one x, so the alternative to\n// picking a copy is one tube spanning both, claiming reference the segment does\n// not occupy. The repeat stays visible as depth: such a node's traversal count\n// is a multiple of the path count.\nfunction anchorNode(\n  node: GraphNode,\n  visits: PathVisit[] | undefined,\n  reference: string,\n): GraphNode {\n  let anchored = node\n  if (visits && visits.length > 0) {\n    const anchor = visits.find(v => v.path === reference) ?? visits[0]!\n    anchored = {\n      ...node,\n      stable: {\n        refName: anchor.path,\n        start: anchor.start,\n        rank: anchor.path === reference ? REFERENCE_RANK : OFF_REFERENCE_RANK,\n        strand: anchor.strand,\n      },\n      samples: [...new Set(visits.map(v => v.sample))].sort(),\n    }\n  }\n  return anchored\n}\n\n// Re-runnable against a different reference path at no parsing cost, which is\n// what the picker needs: the walk is already recorded in `pathVisits`, and only\n// which path counts as rank 0 changes.\nexport function anchorFromPaths(graph: Graph, preferred: string | undefined) {\n  const { anchorPaths, pathVisits } = graph\n  const reference =\n    anchorPaths && pathVisits\n      ? chooseReferencePath(anchorPaths, preferred)\n      : undefined\n  return reference && pathVisits\n    ? ({\n        ...graph,\n        nodes: graph.nodes.map(node =>\n          anchorNode(node, pathVisits.get(node.name), reference.name),\n        ),\n        anchoredBy: 'paths',\n        referencePath: reference.name,\n      } satisfies Graph)\n    : graph\n}\n\n// rGFA states coordinates on every segment, so only a graph that states none\n// has to derive them. A GFA with neither tags nor paths comes back untouched\n// and falls through to the force layout, which is the honest answer for it.\nexport function anchorGraph(graph: Graph, preferred: string | undefined) {\n  return graph.anchoredBy === 'tags' ? graph : anchorFromPaths(graph, preferred)\n}\n", "import { pathOrigin } from './pathAnchoring'\n\nimport type { GraphPath } from './types'\n\n// Deterministic colour from a string (djb2-style hash to an HSL hue). Fine for\n// the `random` node scheme, where a collision between two of thousands of nodes\n// means nothing. NOT what the path ribbons use: see pathHueAt.\nexport function nameHue(name: string) {\n  let hash = 0\n  for (let i = 0; i < name.length; i++) {\n    hash = name.charCodeAt(i) + ((hash << 5) - hash)\n  }\n  return Math.abs(hash % 360)\n}\n\n// Ribbon hues are spread evenly over the wheel by position in the path list,\n// not hashed from the path name. A hash draws from the wheel at random, and at\n// five paths two of them landing on the same hue is common rather than\n// unlucky: `Sakai#1#chr:1983339-1983535` and `NCTC86#1#chr:1709109-1710286`\n// hash 26 degrees apart, which is two purples and a legend that cannot be read\n// off the drawing. Evenly spaced, the worst case is the best available.\n//\n// The cost is that a path's colour depends on how many paths there are, so it\n// moves when the cut changes. That is what the legend is for, and it is the\n// same trade the Bandage demo this was ported from made.\nexport function pathHueAt(index: number, count: number) {\n  return (index * 360) / count\n}\n\nexport const PATH_SATURATION = 0.7\nexport const PATH_LIGHTNESS = 0.5\n\n// Past this many paths a graph cannot be drawn per path at all, and the WHOLE\n// of `drawPaths` goes off with it: the node stripes, the edge ribbons and the\n// key naming them.\n//\n// One number for all three because they are one statement, and they used to\n// disagree. Only the stripes were capped. So a Minigraph-Cactus cut, which\n// writes one W record per haplotype and walks every backbone link with all of\n// them, drew: no stripes at all, a key hundreds of rows tall, and one bezier\n// stroke per path per edge \u2014 measured at 99,800 strokes and 64 ms of geometry\n// for 200 paths over 499 links, against 2,495 strokes for the five-path pggb\n// cut the figures use. Every one of those is its own `beginPath`/`stroke` on\n// the Canvas2D backend, every frame.\n//\n// 16 is where the drawing stops SAYING anything, not where it stops being fast.\n// `pathHueAt` spreads the wheel evenly, so 16 hues are 22 degrees apart and\n// still tellable and 200 are one degree; the ribbon fan is PATH_RIBBON_SPACING\n// per path, so 16 of them is a legible fan and 200 is a band wider than the\n// nodes; and a key past about 16 rows is taller than the drawing beside it.\n// Above the cap the honest picture is the plain one \u2014 which is exactly what a\n// graph carrying no paths at all already draws.\nexport const MAX_PATH_COLORS = 16\n\n// Whether this graph's paths can be drawn as colours. Resolve it once and hand\n// the answer down: the geometry, the hit index and the key each used to decide\n// for themselves, which is how they came to disagree.\nexport function pathColorsLegible(pathCount: number) {\n  return pathCount > 0 && pathCount <= MAX_PATH_COLORS\n}\n\nexport function pathCssColor(index: number, count: number) {\n  return `hsl(${pathHueAt(index, count)}, ${PATH_SATURATION * 100}%, ${\n    PATH_LIGHTNESS * 100\n  }%)`\n}\n\n// A path is named the way its file names it \u2014 `K12#1#chr:1004500-1004961` for a\n// P record `odgi extract` wrote, `HG00738#1` for a W record \u2014 and neither is a\n// legend entry. The label is the least of that name which still tells the paths\n// apart: the sample where samples are unique, the haplotype too where they are\n// not, the whole stable name where even that repeats. Widening it for every row\n// rather than only for the colliding ones, because a legend where one entry is\n// `HG00738#1` and its neighbour is `HG01071` reads as two kinds of thing.\nfunction labelTiers(name: string) {\n  const parts = pathOrigin(name).name.split('#')\n  return [parts[0]!, parts.slice(0, 2).join('#'), parts.join('#')]\n}\n\n// Locale-independent, unlike toLocaleString: a figure regenerated on a machine\n// with a different locale would otherwise differ from the committed one.\nfunction groupDigits(n: number) {\n  return String(n).replace(/\\B(?=(\\d{3})+$)/g, ',')\n}\n\n// A collapsed repeat puts one sequence through the same segments more than\n// once, and `odgi extract` emits one path per visit \u2014 nine visits over five\n// E. coli chromosomes at the rRNA operons, where every name tier above collides\n// because the sequence really is the same one. What separates those is the\n// offset each name carried, which is the one thing pathOrigin strips off.\nfunction offsetTiers(name: string, tiers: string[]) {\n  const { start } = pathOrigin(name)\n  return tiers.map(t => `${t} @${groupDigits(start)}`)\n}\n\nexport interface PathLegendEntry {\n  name: string\n  label: string\n  color: string\n}\n\nexport function pathLegend(paths: GraphPath[]): PathLegendEntry[] {\n  const named = paths.map(p => labelTiers(p.name))\n  // narrowest first, and the offset is tried before the next name tier: two\n  // copies of one operon are told apart by where they are, not by widening a\n  // name that is genuinely identical\n  const candidates = [0, 1, 2].flatMap(t => [\n    paths.map((_, i) => named[i]![t]!),\n    paths.map((p, i) => offsetTiers(p.name, named[i]!)[t]!),\n  ])\n  const distinct = candidates.find(\n    labels => new Set(labels).size === paths.length,\n  )\n  // Nothing separates two paths with the same name and the same offset, so the\n  // widest labelling is as close as any can get.\n  const labels = distinct ?? candidates.at(-1)!\n  return paths.map((path, i) => ({\n    name: path.name,\n    label: labels[i]!,\n    color: pathCssColor(i, paths.length),\n  }))\n}\n", "import type { Graph, GraphNode } from './types'\nimport type { NodeInk } from './util/hitDetection'\n\n// How thick a node draws. Bandage widens a node by its depth, the square root\n// of its depth against the graph's mean, so a contig every read covers is fat\n// and a spurious one is a hair. In a pangenome cut depth is carriage, how many\n// walks go through the node, and the same rule makes the reference thick and a\n// private allele thin. One table drives the persisted enum and the dropdown,\n// the way BUBBLE_SPREADS does.\nexport const NODE_WIDTHS = [\n  {\n    value: 'depth',\n    label: 'By depth',\n    description:\n      'Thicker the more paths carry a node, on the square root of its depth against the mean. A graph with one depth everywhere draws uniform.',\n  },\n  {\n    value: 'uniform',\n    label: 'Uniform',\n    description: 'Every node the same thickness.',\n  },\n] as const\n\nexport type NodeWidth = (typeof NODE_WIDTHS)[number]['value']\n\nexport const NODE_WIDTH_VALUES = NODE_WIDTHS.map(w => w.value)\n\nconst MIN_FACTOR = 0.3\nconst MAX_FACTOR = 3\n\n// Length-weighted, as Bandage's mean depth is, so a cut's long reference nodes\n// set the norm and the alleles read against it.\nexport function meanDepth(graph: Graph) {\n  let weighted = 0\n  let length = 0\n  for (const node of graph.nodes) {\n    weighted += node.depth * node.length\n    length += node.length\n  }\n  return length > 0 ? weighted / length : 0\n}\n\nexport function depthWidthFactor(node: GraphNode, mean: number) {\n  if (!(mean > 0) || !(node.depth > 0)) {\n    return 1\n  }\n  return Math.min(\n    MAX_FACTOR,\n    Math.max(MIN_FACTOR, Math.sqrt(node.depth / mean)),\n  )\n}\n\n// How wide a node is drawn, in screen px. One function for the geometry and\n// for the hit test, so the pointer finds a node exactly where its ink is.\nexport function nodeWidthPx(\n  node: GraphNode,\n  contigThickness: number,\n  nodeWidth: NodeWidth,\n  mean: number,\n) {\n  return (\n    contigThickness * (nodeWidth === 'depth' ? depthWidthFactor(node, mean) : 1)\n  )\n}\n\nexport function maxNodeWidthPx(contigThickness: number, nodeWidth: NodeWidth) {\n  return contigThickness * (nodeWidth === 'depth' ? MAX_FACTOR : 1)\n}\n\n// How far each node's ink reaches from its centreline, for the hit test: the\n// widths the geometry draws with, from the same function.\nexport function nodeInk(\n  graph: Graph | undefined,\n  nodeById: ReadonlyMap<string, GraphNode> | undefined,\n  contigThickness: number,\n  nodeWidth: NodeWidth,\n): NodeInk {\n  const mean = graph ? meanDepth(graph) : 0\n  return {\n    maxHalfWidthPx: maxNodeWidthPx(contigThickness, nodeWidth) / 2,\n    halfWidthPx: id => {\n      const node = nodeById?.get(id)\n      return node\n        ? nodeWidthPx(node, contigThickness, nodeWidth, mean) / 2\n        : contigThickness / 2\n    },\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["require_mui", "__commonJSMin", "exports", "module", "drawnNodeLength", "opts", "length", "bandageAutoScale", "graph", "minNodeLength", "megabases", "sum", "n", "target", "PROPORTIONAL_LENGTH", "isProportional", "law", "drawnLengthFor", "count", "totalLength", "meanBp", "meanDrawn", "bp", "relative", "LAYOUT_LENGTH_PRECISION", "PROPORTIONAL_SPREAD", "layoutScaling", "spread", "drawn", "node", "BUBBLE_SPREADS", "PROPORTIONAL_LENGTH", "BUBBLE_SPREAD_VALUES", "s", "spreadFor", "spread", "entry", "COLOR_SCHEMES", "COLOR_SCHEME_VALUES", "s", "resolveColorScheme", "scheme", "graph", "RANGE_SUFFIX", "pathOrigin", "pathName", "match", "surveyPaths", "paths", "lengthOf", "anchorPaths", "pathVisits", "path", "sample", "panSNSample", "pos", "step", "visit", "existing", "chooseReferencePath", "preferred", "p", "OFF_REFERENCE_RANK", "anchorNode", "node", "visits", "reference", "anchored", "anchor", "v", "anchorFromPaths", "graph", "anchorGraph", "nameHue", "name", "hash", "i", "pathHueAt", "index", "count", "PATH_SATURATION", "PATH_LIGHTNESS", "MAX_PATH_COLORS", "pathColorsLegible", "pathCount", "pathCssColor", "labelTiers", "parts", "pathOrigin", "groupDigits", "n", "offsetTiers", "tiers", "start", "t", "pathLegend", "paths", "named", "p", "candidates", "_", "labels", "path", "NODE_WIDTHS", "NODE_WIDTH_VALUES", "w", "MIN_FACTOR", "MAX_FACTOR", "meanDepth", "graph", "weighted", "length", "node", "depthWidthFactor", "mean", "nodeWidthPx", "contigThickness", "nodeWidth", "maxNodeWidthPx", "nodeInk", "nodeById", "id"]
+}

package/dist/chunks/chunk-XDOIZTY6.js

@@ -0,0 +1,4 @@
+import{D as Ve,H as he,I as Ke,J as Ie,K as Pe,P as je,Q as Te,R as Je,T as Qe,X as et,Z as tt,_ as nt,a as X,aa as ot,b as Wn,c as Dn,ea as rt,f as Z,fa as st,ha as at,j as Fe,k as Ze,l as Le,m as pe,ma as it,oa as lt,pa as ct,t as me,u as qe,v as Ee}from"./chunk-CJ56O2VG.js";import{a as On}from"./chunk-FCWXYIFC.js";import{a as ut}from"./chunk-LA7MQS33.js";import{A as ne,f as Ue}from"./chunk-M4YEAXSR.js";import{a as C,b as B,c as Q,d as De,e as de}from"./chunk-XEJ47DLD.js";import{a as We,b as m}from"./chunk-FY3BTKY4.js";var kt=We((Mr,St)=>{St.exports=JBrowseExports["@jbrowse/render-core/useRenderingBackend"]});var Nn=We((Ts,Gn)=>{Gn.exports=JBrowseExports["@jbrowse/render-core/renderingBackendBase"]});var Y=m(de(),1);var Fn=50;function dt(r,e){return e>0?Math.max(1,r/e):Fn}function Zn(r){let e=new Set,t=1/0,n=-1/0;for(let o of r)e.add(o.minY),t=Math.min(t,o.minY),n=Math.max(n,o.minY);return e.size>1?(n-t)/(e.size-1):void 0}function Un(r,e,t){let n=dt(e,r.length);return{x:n,y:t>0?dt(t,r.length):Zn(r)??n}}function pt(r,e,t,n){return r===void 0?Un(e,t,n):typeof r=="number"?{x:r,y:r}:r}function qn(r,e,t){let n=r.get(e);n||(n=new Map,r.set(e,n));let o=n.get(t);return o||(o=[],n.set(t,o)),o}function mt(r,e,t,n,o,s,a){let i=Math.floor(t/e.x),l=Math.floor(o/e.x),c=Math.floor(n/e.y),u=Math.floor(s/e.y);for(let d=i;d<=l;d++)for(let h=c;h<=u;h++)qn(r,d,h).push(a)}function ht(r,e,t,n,o,s){let a=Math.floor((t-o)/e.x),i=Math.floor((t+o)/e.x),l=Math.floor((n-s)/e.y),c=Math.floor((n+s)/e.y),u=[],d=new Set;for(let h=a;h<=i;h++){let b=r.get(h);if(b)for(let M=l;M<=c;M++){let y=b.get(M);if(y)for(let g of y)d.has(g)||(d.add(g),u.push(g))}}return u}var fe=class{constructor(e,t){this.cells=new Map;let n=[],o=0,s=0;for(let[a,i]of Object.entries(e))for(let l=0;l<i.length-1;l++){let c=i[l],u=i[l+1],d=Math.min(c.x,u.x),h=Math.min(c.y,u.y),b=Math.max(c.x,u.x),M=Math.max(c.y,u.y);o+=b-d,s+=M-h,n.push({entry:{nodeId:a,segmentIdx:l},minX:d,minY:h,maxX:b,maxY:M})}this.cellSize=pt(t,n,o,s);for(let a of n)mt(this.cells,this.cellSize,a.minX,a.minY,a.maxX,a.maxY,a.entry)}query(e,t,n,o=n){return ht(this.cells,this.cellSize,e,t,n,o)}},ge=class{constructor(e,t,n,o,s,a,i=0){this.cells=new Map;this.edgeCurves=Ke(e,t,o,a,i);let l=[],c=0,u=0;for(let d=0;d<t.edges.length;d++){let h=t.edges[d],b=e[h.from],M=e[h.to],y=this.edgeCurves.get(d);if(b?.length&&M?.length&&y){let{minX:g,minY:w,maxX:P,maxY:G}=Fe(y),T=h.pathIds?.length??0;if(n&&T>0){let R=0,L=0;for(let N of pe(b,M,T,o))R=Math.max(R,Math.abs(N.x)),L=Math.max(L,Math.abs(N.y));g-=R,w-=L,P+=R,G+=L}c+=P-g,u+=G-w,l.push({ei:d,minX:g,minY:w,maxX:P,maxY:G})}}this.cellSize=pt(s,l,c,u);for(let d of l)mt(this.cells,this.cellSize,d.minX,d.minY,d.maxX,d.maxY,d.ei)}getCurves(e){return this.edgeCurves.get(e)}query(e,t,n,o=n){return ht(this.cells,this.cellSize,e,t,n,o)}};function yt(r,e,t,n,o,s){let a=o-t,i=s-n,l=a*a+i*i;if(l===0)return Math.hypot(r-t,e-n);let c=Math.max(0,Math.min(1,((r-t)*a+(e-n)*i)/l));return Math.hypot(r-(t+c*a),e-(n+c*i))}function Vn(r,e,t,n,o,s,a,i,l,c){let u=1/0,d=20,h=t,b=n;for(let M=1;M<=d;M++){let y=M/d,g=1-y,w=g*g*g*t+3*g*g*y*o+3*g*y*y*a+y*y*y*l,P=g*g*g*n+3*g*g*y*s+3*g*y*y*i+y*y*y*c;u=Math.min(u,yt(r,e,h,b,w,P)),h=w,b=P}return u}function Kn(r,e,t){return Vn(r,e,t.x0,t.y0,t.cx0,t.cy0,t.cx1,t.cy1,t.x1,t.y1)}function ft(r,e,t,n=1){let o=1/0;for(let s of t){let a=Kn(r,e,n===1?s:{x0:s.x0,y0:s.y0*n,cx0:s.cx0,cy0:s.cy0*n,cx1:s.cx1,cy1:s.cy1*n,x1:s.x1,y1:s.y1*n});a<o&&(o=a)}return o}var gt=new WeakMap;function jn(r,e){let t=gt.get(r);if(t?.version===e)return t.index;let n=new fe(r);return gt.set(r,{version:e,index:n}),n}var bt=new WeakMap;function Jn(r,e,t,n,o,s){let a=bt.get(r);if(a?.graph===e&&a.drawPaths===t&&a.scaleX===n.scaleX&&a.scaleY===n.scaleY&&a.version===o&&a.deletions===s)return a.index;let i=new ge(r,e,t,n,void 0,s,o);return bt.set(r,{graph:e,drawPaths:t,scaleX:n.scaleX,scaleY:n.scaleY,version:o,index:i,deletions:s}),i}var Qn=5;function vt(r,e,t,n,o=0,s){let a=Le(n),i=jn(r,o),l=b=>Math.max(Qn,b)/n.scaleX,c=l(s?.maxHalfWidthPx??0),u=i.query(e,t,c,c/a),d=null,h=1/0;for(let{nodeId:b,segmentIdx:M}of u){let y=r[b],g=yt(e,t*a,y[M].x,y[M].y*a,y[M+1].x,y[M+1].y*a);g<h&&g<l(s?.halfWidthPx(b)??0)&&(h=g,d=b)}return d}function xt(r,e,t,n,o,s,a=0,i,l){let c=Le(o),u=10/o.scaleX,d=Jn(r,e,s,o,a,i),h=d.query(t,n,u,u/c),b=null,M=u;for(let y of h){let g=e.edges[y],w=r[g.from],P=r[g.to];if(!w?.length||!P?.length||l?.has(y))continue;let G=g.pathIds?.length??0,T=d.getCurves(y);if(!T)continue;let R;if(!s||G===0)R=ft(t,n*c,T,c);else{let L=1/0;for(let N of pe(w,P,G,o)){let p=N.x===0&&N.y===0?T:Ze(T,N.x,N.y),S=ft(t,n*c,p,c);S<L&&(L=S)}R=L}R<M&&(M=R,b=y)}return b}function Mt(r){let e=r.deltaY*(r.deltaMode===1?40:r.deltaMode===2?800:1),t=(r.ctrlKey?10:1)*e/100;return 1.1**-Math.max(-2,Math.min(2,t))}var te=m(De(),1),zn=m(On(),1),Xn=m(kt(),1);var Ct=m(C(),1),wt=(0,X.createSvgIcon)((0,Ct.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 W=m(B(),1);var Rt=m(B(),1),be=m(C(),1),eo={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"hidden",zIndex:2},to=(0,Rt.observer)(function({model:e}){let{bubbleHalos:t,walkHighlight:n}=e;if(t.length===0)return null;let{scaleX:o,scaleY:s,translateX:a,translateY:i,paneWidth:l,canvasHeight:c}=e,u=e.contigThickness*qe,d=h=>n!==void 0&&!h.nodeIds.some(b=>n.nodeIds.has(b));return(0,be.jsx)("svg",{style:eo,width:l,height:c,"data-testid":"graph-bubble-halos",children:(0,be.jsx)("g",{transform:`translate(${a} ${i}) scale(${o} ${s})`,children:t.filter(h=>!h.whole).map(h=>(0,be.jsx)("path",{d:h.path,fill:"none",stroke:Z[h.kind],strokeOpacity:d(h)?.06:.22,strokeWidth:u,strokeLinecap:"round",strokeLinejoin:"round",vectorEffect:"non-scaling-stroke"},`${h.bubble.start}-${h.bubble.end}`))})})}),Lt=to;var It=m(Q(),1),Pt=m(B(),1),_=m(C(),1),no={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"visible",zIndex:3},oo={position:"absolute",left:8,top:8,zIndex:5,background:"rgba(255,255,255,0.9)",textTransform:"none"},ro=10;function Et(r,e){let t=12+26*Math.log10(1+r);return Math.min(t,e)}var so=(0,Pt.observer)(function({model:e}){let{bubbleGlyphs:t,poppedFrom:n}=e,o=n?(0,_.jsxs)(It.Button,{size:"small",variant:"outlined",style:oo,"data-testid":"graph-unpop-bubble",onClick:()=>{e.unpopBubble()},children:["\u25C0 Back to ",n.label]}):null;if(t.length===0)return o;let{scaleX:s,translateX:a,translateY:i,paneWidth:l,canvasHeight:c}=e,u=i,d=g=>g*s+a,h=e.overlayLabels.glyphs,b=Math.max(0,...h.map(g=>g.y+4)),M=Math.max(24,u-b-14),y=[...t].sort((g,w)=>w.bubble.end-w.bubble.start-(g.bubble.end-g.bubble.start));return(0,_.jsxs)(_.Fragment,{children:[o,(0,_.jsxs)("svg",{style:no,width:l,height:c,"data-testid":"graph-bubble-overlay",children:[y.map(({bubble:g,kind:w,label:P})=>{let G=d(g.start),T=d(g.end),R=Math.max(T-G,ro),L=(G+T)/2,N=Et(g.longestAlleleLength,M),p=Z[w],k=g.end-g.start-g.shortestAlleleLength,v=k>0?6+10*Math.log10(1+k):0,E=`${g.start}-${g.end}`;return(0,_.jsxs)("g",{children:[(0,_.jsx)("path",{d:`M${L-R/2},${u} C${L-R/2},${u-N} ${L+R/2},${u-N} ${L+R/2},${u} Z`,fill:p,fillOpacity:.18,stroke:p,strokeWidth:2,style:{pointerEvents:"auto",cursor:"pointer"},onClick:()=>{e.popBubble(g)},children:(0,_.jsx)("title",{children:`${P}
+${g.segmentCount} segments \xB7 click to open`})}),v>0?(0,_.jsx)("path",{d:`M${L-R/2},${u} C${L-R/2},${u+v} ${L+R/2},${u+v} ${L+R/2},${u}`,fill:"none",stroke:p,strokeWidth:2,strokeDasharray:"4 3"}):null]},E)}),h.map(({item:{glyph:g,glyphX:w},x:P,y:G})=>{let T=Z[g.kind],R=u-Et(g.bubble.longestAlleleLength,M);return(0,_.jsxs)("g",{children:[(0,_.jsx)("line",{x1:w,x2:w,y1:G+4,y2:R-2,stroke:T,strokeWidth:.7,strokeOpacity:.5}),(0,_.jsx)("text",{x:P,y:G,fontSize:11,fontFamily:"sans-serif",fill:T,textAnchor:"middle",children:g.label})]},`${g.bubble.start}-${g.bubble.end}-label`)})]})]})}),Tt=so;var Gt=m(B(),1),ve=m(C(),1),ao={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"hidden",zIndex:2},xe="#1c1c22",io=(0,Gt.observer)(function({model:e}){let{genePins:t}=e;if(t.length===0)return null;let{scaleX:n,scaleY:o,translateX:s,translateY:a,paneWidth:i,canvasHeight:l,contigThickness:c}=e;return(0,ve.jsx)("svg",{style:ao,width:i,height:l,"data-testid":"graph-gene-pins",children:(0,ve.jsx)("g",{transform:`translate(${s} ${a}) scale(${n} ${o})`,children:t.map(u=>u.exons?(0,ve.jsx)("path",{d:u.exons,fill:"none",stroke:xe,strokeOpacity:.9,strokeWidth:c*.55,strokeLinecap:"round",vectorEffect:"non-scaling-stroke"},`${u.gene.name}-${u.gene.start}`):null)})})}),Nt=io;var Ht=m(C(),1),Bt=(0,X.createSvgIcon)((0,Ht.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 Ge=m(C(),1),_t=(0,X.createSvgIcon)([(0,Ge.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,Ge.jsx)("path",{d:"M12 10h-2v2H9v-2H7V9h2V7h1v2h2z"},"1")],"ZoomIn");var $t=m(C(),1),zt=(0,X.createSvgIcon)((0,$t.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 O=m(Q(),1),_e=m(B(),1),cn=m(ne(),1);var U=m(Q(),1),Xt=m(B(),1),Yt=m(ne(),1),oe=m(C(),1),lo=(0,Yt.makeStyles)()({formControl:{minWidth:100}}),co=(0,Xt.observer)(function({model:e}){let{classes:t}=lo();return(0,oe.jsxs)(U.FormControl,{size:"small",className:t.formControl,children:[(0,oe.jsx)(U.InputLabel,{children:"Color"}),(0,oe.jsx)(U.Select,{value:e.chosenColorScheme,label:"Color",onChange:n=>{e.setColorScheme(n.target.value)},children:Ue.map(({value:n,label:o})=>(0,oe.jsx)(U.MenuItem,{value:n,children:o},n))})]})}),At=co;var He=m(Q(),1),Be=m(B(),1),Ot=m(ne(),1),re=m(C(),1),Wt=(0,Ot.makeStyles)()({stats:{marginLeft:"auto"},perf:{color:"#888",fontVariantNumeric:"tabular-nums"}});function Ne(r){return r===void 0?"\u2013":`${Math.round(r)}ms`}var uo=(0,Be.observer)(function({model:e}){let{classes:t}=Wt(),{lastFetchMs:n,lastLayoutMs:o,lastGeometryMs:s}=e,a=n!==void 0||o!==void 0||s!==void 0;return e.showPerf&&a?(0,re.jsxs)(He.Typography,{variant:"caption",className:t.perf,"data-testid":"graph-perf-stats",children:["fetch ",Ne(n)," \xB7 layout ",Ne(o)," \xB7 geom"," ",Ne(s)]}):null}),po=(0,Be.observer)(function({model:e}){let{classes:t}=Wt();return(0,re.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,re.jsxs)(He.Typography,{variant:"body2",component:"span",children:[e.nodeCount," nodes, ",e.edgeCount," edges",e.pathCount>0?`, ${e.pathCount} paths`:""]})," ",(0,re.jsx)(uo,{model:e})]})}),Dt=po;var A=m(Q(),1),Ft=m(B(),1),Zt=m(ne(),1),q=m(C(),1),mo=(0,Zt.makeStyles)()({formControl:{minWidth:150}}),ho=(0,Ft.observer)(function({model:e}){let{classes:t}=mo(),{graph:n}=e;return(0,q.jsxs)(A.FormControl,{size:"small",className:t.formControl,children:[(0,q.jsx)(A.InputLabel,{children:"Layout"}),(0,q.jsx)(A.Select,{value:e.chosenLayoutMode,label:"Layout","data-testid":"graph-layout-select",onChange:o=>{e.switchLayout(o.target.value)},children:Ve.map(({value:o,label:s,description:a,available:i})=>(0,q.jsx)(A.MenuItem,{value:o,disabled:n?!i(n):!1,children:(0,q.jsx)(A.Tooltip,{title:a,placement:"right",children:(0,q.jsx)("span",{children:s})})},o))})]})}),Ut=ho;var D=m(Q(),1),qt=m(B(),1),Vt=m(ne(),1),V=m(C(),1),fo=(0,Vt.makeStyles)()({formControl:{minWidth:130,maxWidth:240}}),go=(0,qt.observer)(function({model:e}){let{classes:t}=fo(),{repeatChoices:n}=e;if(e.chosenLayoutMode!=="walkrows"||n.length===0)return null;let o=new Set(n.map(s=>s.key));return(0,V.jsxs)(D.FormControl,{size:"small",className:t.formControl,children:[(0,V.jsx)(D.InputLabel,{children:"Repeat"}),(0,V.jsxs)(D.Select,{value:o.has(e.repeatKey)?e.repeatKey:"",label:"Repeat","data-testid":"graph-repeat-select",onChange:s=>{e.setRepeatKey(s.target.value)},children:[(0,V.jsx)(D.MenuItem,{value:"",children:(0,V.jsx)("em",{children:"Whole window"})}),n.map(({key:s,name:a,unit:i})=>(0,V.jsxs)(D.MenuItem,{value:s,children:[a," \xB7 ",i.toLocaleString()," bp unit"]},s))]})]})}),Kt=go;var tn=m(de(),1),nn=m(De(),1);var jt=m(C(),1),Jt=(0,X.createSvgIcon)((0,jt.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 Qt=m(C(),1),en=(0,X.createSvgIcon)((0,Qt.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 on=m(B(),1);var K=m(C(),1),bo=(0,on.observer)(function({model:e}){let[t,n]=(0,tn.useState)(!1);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)(nn.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:ct,onClick:()=>{n(!0)}},{type:"divider"},{label:"Return to import form",icon:Jt,onClick:()=>{e.clearGraph()}}],children:(0,K.jsx)(en,{})}),(0,K.jsx)(ut,{model:e,open:t,onClose:()=>{n(!1)}})]})}),rn=bo;var F=m(Q(),1),sn=m(B(),1),an=m(ne(),1),j=m(C(),1),yo=(0,an.makeStyles)()({formControl:{minWidth:130,maxWidth:220}}),vo=(0,sn.observer)(function({model:e}){let{classes:t}=yo(),{walkChoices:n}=e;if(n.length===0)return null;let o=new Set(n.map(s=>s.name));return(0,j.jsxs)(F.FormControl,{size:"small",className:t.formControl,children:[(0,j.jsx)(F.InputLabel,{children:"Walk"}),(0,j.jsxs)(F.Select,{value:o.has(e.highlightedPath)?e.highlightedPath:"",label:"Walk","data-testid":"graph-walk-select",onChange:s=>{e.setHighlightedPath(s.target.value)},children:[(0,j.jsx)(F.MenuItem,{value:"",children:(0,j.jsx)("em",{children:"None"})}),n.map(({name:s,label:a})=>(0,j.jsx)(F.MenuItem,{value:s,children:a},s))]})]})}),ln=vo;var I=m(C(),1),xo=(0,cn.makeStyles)()({toolbar:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",borderBottom:"1px solid #ddd"}}),Mo=(0,_e.observer)(function({model:e}){return(0,I.jsx)(O.Typography,{variant:"body2",children:e.zoomPercent})}),So=(0,_e.observer)(function({model:e}){let{classes:t}=xo();return(0,I.jsxs)("div",{className:t.toolbar,children:[(0,I.jsx)(Ut,{model:e}),(0,I.jsx)(At,{model:e}),(0,I.jsx)(ln,{model:e}),(0,I.jsx)(Kt,{model:e}),(0,I.jsx)(O.Tooltip,{title:"Zoom in",children:(0,I.jsx)(O.IconButton,{size:"small",onClick:()=>{e.zoom(1.5,e.paneWidth/2,e.canvasHeight/2)},children:(0,I.jsx)(_t,{})})}),(0,I.jsx)(O.Tooltip,{title:"Zoom out",children:(0,I.jsx)(O.IconButton,{size:"small",onClick:()=>{e.zoom(1/1.5,e.paneWidth/2,e.canvasHeight/2)},children:(0,I.jsx)(zt,{})})}),(0,I.jsx)(O.Tooltip,{title:"Zoom to fit",children:(0,I.jsx)(O.IconButton,{size:"small",onClick:()=>{e.zoomToFit()},children:(0,I.jsx)(Bt,{})})}),(0,I.jsx)(Mo,{model:e}),(0,I.jsx)(Dt,{model:e}),(0,I.jsx)(rn,{model:e})]})}),un=So;var dn=m(B(),1);var ae=m(C(),1);function ce({x:r,y:e,w:t,text:n,color:o,italic:s,small:a,dimmed:i,title:l,testId:c,onClick:u}){return(0,ae.jsxs)("g",{style:{pointerEvents:u?"auto":"none",cursor:u?"pointer":void 0,opacity:i?.35:1},"data-testid":c,onClick:u,children:[l?(0,ae.jsx)("title",{children:l}):null,(0,ae.jsx)("rect",{x:r-t/2,y:e-11-4+2,width:t,height:17,rx:3,fill:"rgba(255,255,255,0.85)",stroke:o,strokeWidth:a?.6:1}),(0,ae.jsx)("text",{x:r,y:e,fontSize:a?10:11,fontFamily:"sans-serif",fontStyle:s?"italic":void 0,fontWeight:s?600:void 0,fill:o,textAnchor:"middle",children:n})]})}var J=m(C(),1),ko={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"hidden",zIndex:3},Co=(0,dn.observer)(function({model:e}){let{bubbles:t,genes:n,routes:o}=e.overlayLabels;if(t.length+n.length+o.length===0)return null;let{walkHighlight:s,scaleY:a,translateY:i,contigThickness:l}=e,c=d=>s!==void 0&&!d.nodeIds.some(h=>s.nodeIds.has(h)),u=d=>s!==void 0&&!d.route.walks.includes(s.name);return(0,J.jsxs)("svg",{style:ko,width:e.paneWidth,height:e.canvasHeight,"data-testid":"graph-label-layer",children:[n.map(({item:d,x:h,y:b,w:M,text:y})=>(0,J.jsxs)("g",{children:[(0,J.jsx)("line",{x1:h,x2:h,y1:b-11-2,y2:d.at.y*a+i+l/2,stroke:xe,strokeWidth:.8,strokeOpacity:.6}),(0,J.jsx)(ce,{x:h,y:b,w:M,text:y,color:xe,italic:!0,title:`${d.gene.name} ${d.gene.refName}:${d.gene.start.toLocaleString()}-${d.gene.end.toLocaleString()}${d.covered<.98?", runs past the cut":""}`,testId:"graph-gene-pin-label"})]},`${d.gene.name}-${d.gene.start}`)),o.map(({item:{halo:d,route:h},x:b,y:M,w:y,text:g})=>(0,J.jsx)(ce,{x:b,y:M,w:y,text:g,color:Z[d.kind],small:!0,dimmed:u(h),title:`${h.route.walks.length} walk(s): ${h.route.walks.join(", ")}`,testId:"graph-route-label"},`${d.bubble.start}-${d.bubble.end}-${h.route.steps.join(",")}`)),t.map(({item:d,x:h,y:b,w:M,text:y})=>(0,J.jsx)(ce,{x:h,y:b,w:M,text:y,color:Z[d.kind],dimmed:c(d),title:`${d.label}
+${d.bubble.segmentCount} segments \xB7 click to open`,testId:"graph-bubble-halo-label",onClick:()=>{e.popBubble(d.bubble)}},`${d.bubble.start}-${d.bubble.end}`))]})}),pn=Co;var Me=m(de(),1);var hn=m(st(),1),fn=m(Wn(),1),$e=m(B(),1),$=m(C(),1),wo={position:"absolute",left:0,top:0,pointerEvents:"none",zIndex:1},Ro=(0,$e.observer)(function({model:e}){let t=(0,Me.useRef)(null),{tubeMapPicture:n,paneWidth:o,canvasHeight:s}=e;return(0,Me.useEffect)(()=>(0,fn.autorun)(()=>{let a=t.current,i=e.tubeMapPicture,l=e.tubeMapFrame,c=a?.getContext("2d");if(a&&c&&i&&l){let u=(0,hn.getDpr)(),d=e.paneWidth,h=e.canvasHeight;a.width=Math.round(d*u),a.height=Math.round(h*u),c.setTransform(u,0,0,u,0,0),c.clearRect(0,0,d,h);let b={...l,width:d,highlightNode:e.hoveredNode??e.selectedNode,darkMode:e.darkMode};ot(c,i,b),nt(c,e.tubeMapDeviations,b),et(c,e.tubeMapConnectors,e.connectorZoneBottom,b);let{bounds:M}=i;rt(c,e.tubeMapGenes,b,l.y(M.minY)-2);let y=e.tubeMapRulerBoxes;y&&Qe(c,y,b,l.y(M.maxY)+4)}}),[e]),(0,$.jsx)("canvas",{ref:t,"data-testid":n?"graph-tube-map":void 0,style:{...wo,width:o,height:s,display:n?"block":"none"}})}),gn=Ro,Lo={background:"rgba(255,255,255,0.82)",padding:"4px 6px",borderRadius:3,fontSize:11,lineHeight:"15px",whiteSpace:"nowrap"},mn={display:"flex",alignItems:"center",gap:5},ue=18;function Eo(){let r=Math.round(ue/je),e=ue/r,t=Te+1,n=[`0,${t}`];for(let o=0;o<r;o++)n.push(`${(o+.5)*e},${t+(o%2?1:-1)*Te}`);return n.push(`${ue},${t}`),(0,$.jsx)("svg",{width:ue,height:t*2,style:{flex:"none"},children:(0,$.jsx)("polyline",{points:n.join(" "),fill:"none",stroke:Je(),strokeWidth:1})})}var Io={width:ue,height:7,flex:"none",display:"flex",justifyContent:"center",backgroundColor:"#b8b8c0"};function Po(){return(0,$.jsx)("div",{style:Io,children:(0,$.jsx)("div",{style:{width:2,backgroundColor:tt()}})})}var bn=(0,$e.observer)(function({model:e}){let{squeezed:t,foldBp:n}=e.tubeMapKeys;return t||n!==void 0?(0,$.jsxs)("div",{style:Lo,"data-testid":"graph-tube-map-legend",children:[n!==void 0?(0,$.jsxs)("div",{style:mn,children:[(0,$.jsx)(Po,{}),(0,$.jsxs)("span",{children:["a haplotype's variant under ",me(n)]})]}):null,t?(0,$.jsxs)("div",{style:mn,children:[(0,$.jsx)(Eo,{}),(0,$.jsx)("span",{children:"ruler not to scale, box length below"})]}):null]}):null});var Mn=m(de(),1);var Xe=m(B(),1);function Se(r){return`hsl(${r}, 70%, 50%)`}function ze(r,e){let t=(r-e.start)/(e.end-e.start);return Math.max(0,Math.min(1,t))*Ie}var To=30;function yn({start:r,bp:e,reversed:t},n){let o=ze(r,n),s=ze(r+e,n);if(s-o<1)return[(o+s)/2];let a=Math.ceil((s-o)/To);return Array.from({length:a+1},(i,l)=>ze(r+e*(t?a-l:l)/a,n))}var ke=`linear-gradient(to right, ${Array.from({length:7},(r,e)=>`${Se(e/6*Ie)} ${e/6*100}%`).join(", ")})`;var x=m(C(),1),Bo={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"visible",zIndex:3},Sn="#2f8fd6",kn="#111",Cn="#9e9e9e",wn="#c62828",Rn="#8e3fbf",z=12,vn=["#4e79a7","#f28e2b","#59a14f","#e15759","#76b7b2","#edc948","#b07aa1","#ff9da7","#9c755f","#bab0ac"],Ye="#d0d0d0",_o="rgb(160, 160, 160)";function Ln(r,e){let t=r.findIndex(n=>n.unit===e);return t<0?Ye:vn[t%vn.length]}var $o={background:"rgba(255,255,255,0.82)",padding:"4px 6px",borderRadius:3,fontSize:11,lineHeight:"15px",whiteSpace:"nowrap"},ee={display:"flex",alignItems:"center",gap:5},ie={width:18,height:z-4,borderRadius:2},zo={...ie,display:"flex",justifyContent:"center"};function xn({color:r}){return(0,x.jsx)("div",{style:zo,children:(0,x.jsx)("div",{style:{width:2,backgroundColor:r}})})}var En=(0,Xe.observer)(function({model:e}){let t=e.walkRowBars;if(!t)return null;let n=e.referenceRampDomain,o=e.walkRowUnits,s=[t.reference,...t.rows],a=s.flatMap(i=>i.call&&!i.call.sequences?i.call:[]);return(0,x.jsxs)("div",{style:$o,"data-testid":"graph-walk-rows-legend",children:[o?(0,x.jsxs)(x.Fragment,{children:[o.map((i,l)=>(0,x.jsxs)("div",{style:ee,children:[(0,x.jsx)("div",{style:{...ie,backgroundColor:Ln(o,i.unit)}}),(0,x.jsxs)("span",{children:["unit ",l+1," \xB7 ",i.unitLength.toLocaleString()," bp"]})]},i.unit)),s.some(i=>!i.call?.sequences)?(0,x.jsxs)("div",{style:ee,children:[(0,x.jsx)("div",{style:{...ie,backgroundColor:Ye}}),(0,x.jsx)("span",{children:"no allele in the repeat track"})]}):null]}):(0,x.jsxs)(x.Fragment,{children:[(0,x.jsxs)("div",{style:ee,children:[(0,x.jsx)("div",{style:{...ie,background:n?ke:Sn}}),(0,x.jsxs)("span",{children:["shared with ",t.reference.label]})]}),(0,x.jsxs)("div",{style:ee,children:[(0,x.jsx)("div",{style:{...ie,backgroundColor:n?Pe:Rn}}),(0,x.jsx)("span",{children:"carried by haplotypes only"})]})]}),a.some(i=>i.spanningReads!==0)?(0,x.jsxs)("div",{style:ee,children:[(0,x.jsx)(xn,{color:kn}),(0,x.jsx)("span",{children:"allele length called for this walk"})]}):null,a.some(i=>i.spanningReads===0)?(0,x.jsxs)("div",{style:ee,children:[(0,x.jsx)(xn,{color:Cn}),(0,x.jsx)("span",{children:"called with no read spanning it"})]}):null,a.some(i=>i.agrees===!1)?(0,x.jsxs)("div",{style:ee,children:[(0,x.jsx)("div",{style:ie}),(0,x.jsxs)("span",{style:{color:wn},children:["walk and call over ",Math.round(.1*100),"% apart"]})]}):null]})});function Ce(r){return`${(r/1e3).toFixed(r<1e4?1:0)} kb`}function Xo(r,e){return e?` \u2248 ${Math.round(r/e)} units`:""}function In(r,e,t){if(!t?.sequences)return Xo(r,e);let n=t.sequences.reduce((o,s)=>o+s.count,0);return` \xB7 ${Number.isInteger(n)?n:n.toFixed(1)} copies`}function Yo(r,e,t){let{bp:n,complete:o,call:s}=r,a=n-e,i=a===0?"":` (${a>0?"+":"\u2212"}${Ce(Math.abs(a))})`,l=s&&!s.sequences?Ao(s):"";return`${Ce(n)}${In(n,t,s)}${i}${o?"":" \xB7 partial walk"}${l}`}function Ao(r){let e=r.spanningReads===0?" \xB7 no spanning read":"";return` \xB7 called ${Ce(r.bp)}${e}`}function Oo(r){let e=0;return r.map(t=>{let n=e,o=t.copyBp??Array.from({length:Math.ceil(t.count)},()=>t.unitLength),s=[],a=n;for(let i of o)s.push(a),a+=i;return e+=t.bp,{start:n,bp:t.bp,unit:t.unit,copyStarts:s}})}var Pn=3;function Wo(r,e,t){if(t(e)-t(0)<Pn)return[];let n=[];for(let o=e;o<r;o+=e)n.push(o);return n}function Do(r,e,t){if(!e)return{fill:r.onReference?Sn:Rn};if(r.referenceStart===void 0)return{fill:Pe};let n=yn({...r,start:r.referenceStart},e);return n.length===1?{fill:Se(n[0])}:{fill:`url(#${t})`,gradient:(0,x.jsx)("linearGradient",{id:t,children:n.map((o,s)=>(0,x.jsx)("stop",{offset:s/(n.length-1),stopColor:Se(o)},s))})}}var Fo=(0,Xe.observer)(function({model:e}){let t=(0,Mn.useId)().replace(/[^\w-]/g,""),{walkRowBars:n,referenceRampDomain:o}=e;if(!n)return null;let{scaleX:s,scaleY:a,translateX:i,translateY:l,paneWidth:c,canvasHeight:u}=e,d=p=>p*s+i,h=p=>p*20*a+l,{origin:b,unit:M,reference:y,rows:g}=n,w=e.walkRowUnits,P=Math.min(b,e.graphRegion?.start??b),G=Math.max(b+y.bp,e.graphRegion?.end??0),T=(p,S,k,v="#333")=>{let E=d(S)+6,H=E+p.length*6.2<c;return(0,x.jsx)("text",{x:H?E:d(S)-6,y:k+4,fontSize:11,fontFamily:"sans-serif",fill:v,stroke:H?void 0:"white",strokeWidth:H?void 0:3,paintOrder:"stroke",textAnchor:H?"start":"end",children:p})},R=(p,S,k)=>p.filter(v=>v>0&&v<S).map(v=>(0,x.jsx)("line",{x1:d(b+v),x2:d(b+v),y1:k-z/2,y2:k+z/2,stroke:"white",strokeWidth:1},v)),L=(p,S,k,v)=>(0,x.jsx)("rect",{x:d(b+p),y:k-z/2,width:Math.max(1,S*s),height:z,fill:v},p),N=(p,S,k)=>{let v=p.call?.sequences?Oo(p.call.sequences):[],E=M!==void 0&&M*s>=Pn;return(0,x.jsxs)(x.Fragment,{children:[L(0,p.bp,S,Ye),v.filter(H=>H.start<p.bp).map(H=>L(H.start,Math.min(H.bp,p.bp-H.start),S,Ln(k,H.unit))),E?R(v.flatMap(H=>H.copyStarts),p.bp,S):null]})};return(0,x.jsxs)("svg",{style:Bo,width:c,height:u,"data-testid":"graph-walk-rows",children:[w?(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)("rect",{x:d(P)-z/2,y:h(0)-z/2,width:(G-P)*s+z,height:z,rx:z/2,fill:_o}),N(y,h(0),w)]}):null,T(`${Ce(y.bp)}${In(y.bp,M,y.call)}`,G,h(0)),g.map((p,S)=>{let k=h(S+1);if(k<-z||k>u+z)return null;let{call:v}=p;return(0,x.jsxs)("g",{"data-testid":"graph-walk-row",children:[w?N(p,k,w):(0,x.jsxs)(x.Fragment,{children:[p.runs.map(E=>{let{fill:H,gradient:An}=Do(E,o,`${t}-${S}-${E.start}`);return(0,x.jsxs)("g",{children:[An,L(E.start,E.bp,k,H)]},E.start)}),M?R(Wo(p.bp,M,E=>E*s),p.bp,k):null]}),v&&!v.sequences?(0,x.jsx)("rect",{"data-testid":"graph-walk-call",x:d(b+v.bp)-1,y:k-z/2-3,width:2,height:z+6,fill:v.spanningReads===0?Cn:kn}):null,T(Yo(p,y.bp,M),b+p.bp,k,v?.agrees===!1?wn:void 0)]},p.name)})]})}),Tn=Fo;var le=m(Dn(),1),Hn=m(st(),1),Bn=m(Nn(),1);var Re=class extends Bn.Canvas2DRenderingBackendBase{constructor(){super(...arguments);this.transform=null;this.batch=null;this.nodeHighlights=new Map;this.highlightedEdge=null;this.highlightFactor=1}resize(t,n){(0,Hn.syncCanvasSize)(this.ctx.canvas,t,n)}uploadGeometry(t){this.batch=t,this.highlightedEdge=null}setNodeHighlights(t){this.nodeHighlights=t}setEdgeHighlight(t,n){this.highlightedEdge=t,this.highlightFactor=n}updateTransform(t){this.transform=t}render(t){if(!this.transform)return;let o=this.ctx,{width:s,height:a}=o.canvas;o.fillStyle=(0,le.normalizedRgbToCssRgba)([t[0],t[1],t[2]],t[3]),o.fillRect(0,0,s,a);let i=this.batch;i&&(o.lineCap="round",o.lineJoin="round",this.renderEdges(i),this.renderNodes(i),this.renderArrows(i))}renderEdges(t){let n=this.transform,o=this.ctx,s=this.highlightedEdge===null?void 0:t.edgeCurveRuns.get(this.highlightedEdge);for(let{color:a,items:i}of Ae(t.edgeCurves,(l,c)=>({color:we(s,c)?he(l.color,this.highlightFactor):l.color,weight:l.thickness,last:we(s,c)}))){o.strokeStyle=(0,le.abgrToCssRgba)(a),o.lineWidth=i[0].thickness*2*n.dpr,o.beginPath();for(let l of i){let c=l.curves[0];o.moveTo(c.x0*n.scaleX+n.translateX,c.y0*n.scaleY+n.translateY);for(let u of l.curves)o.bezierCurveTo(u.cx0*n.scaleX+n.translateX,u.cy0*n.scaleY+n.translateY,u.cx1*n.scaleX+n.translateX,u.cy1*n.scaleY+n.translateY,u.x1*n.scaleX+n.translateX,u.y1*n.scaleY+n.translateY)}o.stroke()}}renderNodes(t){let n=this.transform,o=this.ctx,s=new Map;for(let[a,i]of this.nodeHighlights){let l=t.nodeStrokeRuns.get(a);if(l)for(let c=l.start;c<l.start+l.count;c++)s.set(c,i)}for(let{color:a,items:i}of Ae(t.nodeStrokes,(l,c)=>{let u=s.get(c);return{color:u===void 0?l.color:he(l.color,u),weight:l.thickness,last:u!==void 0}})){o.strokeStyle=(0,le.abgrToCssRgba)(a),o.lineWidth=i[0].thickness*2*n.dpr,o.beginPath();for(let l of i){let c=l.points[0];o.moveTo(c.x*n.scaleX+n.translateX,c.y*n.scaleY+n.translateY);for(let u=1,d=l.points.length;u<d;u++){let h=l.points[u];o.lineTo(h.x*n.scaleX+n.translateX,h.y*n.scaleY+n.translateY)}}o.stroke()}}renderArrows(t){let n=this.transform,o=this.ctx,s=this.highlightedEdge===null?void 0:t.arrowRuns.get(this.highlightedEdge);for(let{color:a,items:i}of Ae(t.arrows,(l,c)=>({color:we(s,c)?he(l.color,this.highlightFactor):l.color,weight:0,last:we(s,c)}))){o.fillStyle=(0,le.abgrToCssRgba)(a),o.beginPath();for(let l of i){let[c,u,d,h]=Uo(l,n);o.moveTo(c.x,c.y),o.lineTo(u.x,u.y),o.lineTo(d.x,d.y),o.lineTo(h.x,h.y),o.closePath()}o.fill()}}dispose(){super.dispose(),this.batch=null,this.nodeHighlights=new Map,this.highlightedEdge=null}},Zo=.25;function Uo(r,e){let t=Math.cos(r.angle),n=Math.sin(r.angle),o=r.x*e.scaleX+e.translateX,s=r.y*e.scaleY+e.translateY,a=r.length*e.dpr,i=r.halfWidth*e.dpr,l=o-t*a,c=s-n*a,u=a*(1-Zo);return[{x:o,y:s},{x:l-n*i,y:c+t*i},{x:o-t*u,y:s-n*u},{x:l+n*i,y:c-t*i}]}function we(r,e){return r!==void 0&&e>=r.start&&e<r.start+r.count}function Ae(r,e){let t=new Map,n=new Map;for(let o=0,s=r.length;o<s;o++){let a=r[o],{color:i,weight:l,last:c}=e(a,o),u=c?n:t,d=`${i}:${l}`,h=u.get(d);h?h.items.push(a):u.set(d,{color:i,items:[a]})}return[...t.values(),...n.values()]}function _n(r){return Promise.resolve(new Re(r))}var f=m(C(),1),$n={position:"absolute",bottom:8,right:8,background:"rgba(0,0,0,0.75)",color:"white",padding:"4px 8px",borderRadius:4,fontSize:12,pointerEvents:"none"},qo={position:"relative"},Vo={position:"relative",lineHeight:0},Ko={position:"absolute",inset:0,zIndex:10,lineHeight:"normal",pointerEvents:"none"},jo={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},Jo=(0,W.observer)(function({model:e}){let t=e.drawnRowLabels;return(0,f.jsx)(f.Fragment,{children:t.map(({label:n,y:o})=>{let s=o*e.scaleY+e.translateY;return s>=0&&s<=e.canvasHeight?(0,f.jsx)("div",{"data-testid":"graph-row-label",style:{...jo,top:s},children:n},o):null})})}),Qo={position:"absolute",top:Ee,right:Ee,display:"flex",flexDirection:"column",alignItems:"flex-end",gap:4,pointerEvents:"none",zIndex:4},Oe={background:"rgba(255,255,255,0.82)",padding:"4px 6px",borderRadius:3,fontSize:11,lineHeight:"15px",whiteSpace:"nowrap"},er={display:"flex",alignItems:"center",gap:5},tr={width:18,height:3,borderRadius:2},nr=(0,W.observer)(function({model:e}){let{pathLegend:t}=e;return t.length>0?(0,f.jsx)("div",{style:Oe,"data-testid":"graph-path-legend",children:t.map(({name:n,label:o,color:s})=>(0,f.jsxs)("div",{style:er,children:[(0,f.jsx)("div",{style:{...tr,backgroundColor:s}}),(0,f.jsx)("span",{children:o})]},n))}):null}),or=(0,W.observer)(function({model:e}){let t=e.walkHighlight;if(!t)return null;let n=e.walkChoices.find(s=>s.name===t.name)?.label??t.name,o=t.referenceBp===void 0?"":t.bp===t.referenceBp?", the reference length":`, ${t.bp>t.referenceBp?"+":"\u2212"}${Math.abs(t.bp-t.referenceBp).toLocaleString()} bp against the reference`;return(0,f.jsxs)("div",{style:Oe,"data-testid":"graph-walk-readout",children:[(0,f.jsx)("strong",{children:n}),": ",t.steps.toLocaleString()," steps,"," ",t.bp.toLocaleString()," bp",o]})}),rr={minWidth:90,height:8,borderRadius:2,background:ke},sr={display:"flex",justifyContent:"space-between",gap:8},ar=(0,W.observer)(function({model:e}){let t=e.referenceRampDomain;return t?(0,f.jsxs)("div",{style:Oe,"data-testid":"graph-ramp-legend",children:[(0,f.jsx)("div",{style:rr}),(0,f.jsxs)("div",{style:sr,children:[(0,f.jsx)("span",{children:t.start.toLocaleString()}),(0,f.jsxs)("span",{children:["(",me(t.end-t.start),")"]}),(0,f.jsx)("span",{children:t.end.toLocaleString()})]})]}):null}),Yn={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},ir={...Yn,color:"#18181c",fontWeight:600},lr={position:"absolute",left:0,top:0,pointerEvents:"none",overflow:"visible",zIndex:2},cr=(0,W.observer)(function({model:e}){let t=(0,Y.useRef)(null);return(0,Y.useEffect)(()=>{let n=t.current;if(!n)return;let o=new ResizeObserver(()=>{(0,zn.isAlive)(e)&&e.setLegendSize({width:n.offsetWidth,height:n.offsetHeight})});return o.observe(n),()=>{o.disconnect()}},[e]),(0,f.jsxs)("div",{ref:t,style:Qo,children:[(0,f.jsx)(ar,{model:e}),(0,f.jsx)(nr,{model:e}),(0,f.jsx)(bn,{model:e}),(0,f.jsx)(En,{model:e}),(0,f.jsx)(or,{model:e})]})}),ur=(0,W.observer)(function({model:e}){let t=e.overlayLabels.sizes,n=t.flatMap(({key:o,leader:s})=>s?[{key:o,...s}]:[]);return(0,f.jsxs)(f.Fragment,{children:[n.length>0?(0,f.jsx)("svg",{style:lr,width:e.paneWidth,height:e.canvasHeight,children:n.map(({key:o,arcX:s,arcY:a,labelX:i,labelY:l})=>(0,f.jsx)("line",{"data-testid":"graph-label-leader",x1:s,y1:a,x2:i,y2:l,stroke:"#18181c",strokeWidth:1},o))}):null,t.map(({key:o,text:s,x:a,y:i,kind:l})=>(0,f.jsx)("div",{"data-testid":"graph-size-label",style:{...l==="deletion"?ir:Yn,left:a,top:i},children:s},o))]})}),dr=(0,W.observer)(function({model:e}){let t=e.hoveredNode?e.nodeById?.get(e.hoveredNode):null,n=e.hoveredEdge!==null&&e.graph?e.graph.edges[e.hoveredEdge]:null,o=t?at(t):void 0,s=e.hoveredEdge===null?void 0:e.deletions.find(a=>a.edgeIndex===e.hoveredEdge);return(0,f.jsxs)(f.Fragment,{children:[t?(0,f.jsxs)("div",{style:$n,children:[(0,f.jsx)("strong",{children:t.name})," \u2014 length:"," ",t.length.toLocaleString(),", depth:"," ",t.depth.toFixed(1),o?(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)("br",{}),o.sample," ",it(o)," (rank"," ",t.stable?.rank,")"]}):null]}):null,n?(0,f.jsx)("div",{style:$n,children:s?(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)("strong",{children:"Deletion"})," ",s.bp.toLocaleString()," bp",(0,f.jsx)("br",{}),s.refName,":",s.start.toLocaleString(),"-",s.end.toLocaleString()]}):(0,f.jsxs)(f.Fragment,{children:["Edge: ",n.from," \u2192 ",n.to]})}):null]})}),pr=(0,W.observer)(function({model:e,nodeId:t,top:n,left:o,onClose:s}){let{own:a,reference:i,highlight:l}=e.nodeLaunchTargets(t);return(0,f.jsx)(te.Menu,{open:!0,anchorReference:"anchorPosition",anchorPosition:{top:n,left:o},onClose:()=>{s()},onMenuItemClick:c=>{c()},menuItems:[{label:"Node details",icon:wt,onClick:()=>{e.showNodeDetails(t)}},...lt({own:a,reference:i,highlight:l,onShowLinear:c=>{e.showInLinearView(c)},onHighlight:e.canHighlightInLinearView?c=>{e.highlightInLinearView(c)}:void 0})]})}),mr=(0,W.observer)(function({model:e,ownChrome:t=!0}){let{canvasRef:n,canvas:o,error:s,retry:a}=(0,Xn.useRenderingBackend)(_n,e),i=(0,Y.useRef)({x:0,y:0}),l=(0,Y.useRef)(!1),c=(0,Y.useRef)({frame:0,pan:null,hover:null});(0,Y.useEffect)(()=>()=>{cancelAnimationFrame(c.current.frame)},[]);let[u,d]=(0,Y.useState)(void 0);(0,Y.useEffect)(()=>{if(o){let k=function(v){if(e.hostPlacesX)return;e.host&&v.stopPropagation(),v.preventDefault();let E=S.getBoundingClientRect();e.zoom(Mt(v),v.clientX-E.left,v.clientY-E.top)};var p=k;let S=o;return S.addEventListener("wheel",k,{passive:!1}),()=>{S.removeEventListener("wheel",k)}}},[o,e]);function h(p,S){return{x:(p-e.translateX)/e.scaleX,y:(S-e.translateY)/e.scaleY}}function b(p){let S=p.currentTarget.getBoundingClientRect();return h(p.clientX-S.left,p.clientY-S.top)}function M(p,S){let{nodePositions:k}=e;return e.layoutResult?.tubeMap?e.tubeMapNodeAt(p*e.scaleX+e.translateX,S*e.scaleY+e.translateY):k?vt(k,p,S,e.axisScale,e.positionsVersion,e.nodeInk):null}function y(p){if(p.button===0){if(l.current=!1,e.hostPlacesX)return;e.host&&p.stopPropagation();let{x:S,y:k}=b(p),v=e.layoutResult?.tubeMap?null:M(S,k);v?e.setDraggingNode(v):e.setPanning(!0),i.current={x:p.clientX,y:p.clientY}}}function g(){let p=c.current;if(p.frame=0,p.pan&&(e.setTransform(e.scale,e.translateX+p.pan.dx,e.translateY+p.pan.dy),p.pan=null),p.hover&&e.nodePositions&&e.graph){let{x:S,y:k}=h(p.hover.x,p.hover.y);p.hover=null;let v=M(S,k);e.setHoveredNode(v),e.setHoveredEdge(v||e.layoutResult?.tubeMap?null:xt(e.nodePositions,e.graph,S,k,e.axisScale,e.effectiveDrawPaths,e.positionsVersion,e.deletionEdgeIndexes,e.hiddenEdgeIndexes))}}function w(){c.current.frame||(c.current.frame=requestAnimationFrame(g))}function P(){let p=c.current;cancelAnimationFrame(p.frame),p.frame=0,p.pan=null,p.hover=null}function G(p){let S=p.clientX-i.current.x,k=p.clientY-i.current.y;i.current={x:p.clientX,y:p.clientY},(Math.abs(S)>1||Math.abs(k)>1)&&(l.current=!0);let v=c.current;if(e.draggingNode)e.moveNode(e.draggingNode,S/e.scaleX,k/e.scaleY);else if(e.isPanning)v.pan={dx:(v.pan?.dx??0)+S,dy:(v.pan?.dy??0)+k},w();else{let E=p.currentTarget.getBoundingClientRect();v.hover={x:p.clientX-E.left,y:p.clientY-E.top},w()}}function T(){e.stopDragging()}function R(){P(),e.stopDragging(),e.setHoveredNode(null),e.setHoveredEdge(null)}function L(p){let{x:S,y:k}=b(p),v=M(S,k);v&&(p.preventDefault(),d({nodeId:v,top:p.clientY,left:p.clientX}))}function N(p){if(!l.current){let{x:S,y:k}=b(p),v=M(S,k);e.setSelectedNode(v),v&&e.showNodeDetails(v)}}return(0,f.jsxs)("div",{style:qo,children:[t?(0,f.jsx)(un,{model:e}):null,(0,f.jsxs)("div",{style:Vo,children:[(0,f.jsx)("canvas",{ref:n,"data-testid":"graph-genome-canvas",style:{width:e.paneWidth,height:e.canvasHeight,cursor:e.isPanning||e.draggingNode?"grabbing":"grab",display:"block"},onMouseDown:y,onMouseMove:G,onMouseUp:T,onMouseLeave:R,onClick:N,onContextMenu:L}),(0,f.jsx)(gn,{model:e}),(0,f.jsx)(Jo,{model:e}),(0,f.jsx)(ur,{model:e}),(0,f.jsx)(Lt,{model:e}),(0,f.jsx)(Nt,{model:e}),(0,f.jsx)(pn,{model:e}),(0,f.jsx)(Tt,{model:e}),(0,f.jsx)(Tn,{model:e}),(0,f.jsx)(cr,{model:e}),t?(0,f.jsx)("div",{style:Ko,children:(0,f.jsx)(te.LoadingOverlay,{isVisible:e.isLoading,immediate:!e.layoutResult,statusMessage:e.statusMessage,onCancel:e.canCancelLoad?()=>{e.cancelLoad()}:void 0})}):null]}),(0,f.jsx)(dr,{model:e}),u?(0,f.jsx)(pr,{model:e,nodeId:u.nodeId,top:u.top,left:u.left,onClose:()=>{d(void 0)}}):null,s?(0,f.jsx)(te.ErrorBanner,{error:s,onReset:a}):null,t&&e.error?(0,f.jsx)(te.ErrorBanner,{error:e.error,onReset:e.canRetryLoad?()=>{e.retryLoad()}:void 0}):null]})}),Js=mr;export{Js as a};
+//# sourceMappingURL=chunk-XDOIZTY6.js.map