jbrowse-plugin-graphgenomeviewer 4.7.0 → 5.0.0

package/dist/chunks/chunk-SJNG2XK7.js

@@ -0,0 +1,2 @@
+import{G as m,L as v,O as w,W as k,Z as P}from"./chunk-H54W6OQQ.js";import{a as y,b as G,c as N,d as R}from"./chunk-TYJTJGPO.js";import{b as c}from"./chunk-FY3BTKY4.js";var T=c(G(),1),o=c(R(),1),b=c(N(),1),I=c(P(),1),e=c(y(),1),C=(0,I.makeStyles)()({section:{marginBottom:24},formControl:{minWidth:200}}),D=["Lowest","Low","Medium","High","Highest"];function l({warn:s=!1,children:n}){return(0,e.jsx)(o.Typography,{variant:"caption",color:s?"warning.main":"text.secondary",children:n})}var S=(0,b.observer)(function({model:n}){return n.hasGraph&&!n.usesLayoutEngine?(0,e.jsx)(l,{warn:!0,children:"No effect on this layout: only the force-directed layout is drawn by the engine that reads this."}):null});function u({label:s,checked:n,onChange:t,children:p}){let{classes:i}=C();return(0,e.jsxs)("div",{className:i.section,children:[(0,e.jsx)(o.FormControlLabel,{control:(0,e.jsx)(o.Switch,{checked:n,onChange:d=>{t(d.target.checked)}}),label:s}),p]})}function h({label:s,value:n,options:t,testId:p,sx:i,onChange:d}){let{classes:r}=C();return(0,e.jsxs)(o.FormControl,{className:r.formControl,sx:i,children:[(0,e.jsx)(o.InputLabel,{children:s}),(0,e.jsx)(o.Select,{value:n,label:s,"data-testid":p,onChange:a=>{d(a.target.value)},children:t.map(({value:a,label:g,description:f})=>(0,e.jsx)(o.MenuItem,{value:a,children:f?(0,e.jsx)(o.Tooltip,{title:f,placement:"right",children:(0,e.jsx)("span",{children:g})}):g},a))})]})}var L=s=>s.map(({trackId:n,name:t})=>({value:n,label:t})),B=(0,b.observer)(function(n){let{model:t,open:p,onClose:i,children:d}=n,{classes:r}=C();return(0,e.jsxs)(T.Dialog,{open:p,onClose:i,title:"Graph settings",children:[(0,e.jsxs)(o.DialogContent,{children:[(0,e.jsx)("div",{className:r.section,children:(0,e.jsxs)(o.FormControl,{fullWidth:!0,children:[(0,e.jsx)(o.FormLabel,{component:"legend",children:"Layout quality"}),(0,e.jsx)(o.RadioGroup,{value:t.layoutQuality,onChange:a=>{t.setLayoutQuality(parseInt(a.target.value)),t.recomputeLayout()},children:D.map((a,g)=>(0,e.jsx)(o.FormControlLabel,{value:g,control:(0,e.jsx)(o.Radio,{}),label:a},a))}),(0,e.jsx)(l,{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)(S,{model:t})]})}),(0,e.jsxs)(u,{label:"Draw paths",checked:t.drawPaths,onChange:a=>{t.setDrawPaths(a)},children:[(0,e.jsx)(l,{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"}),t.drawPaths&&!t.effectiveDrawPaths?(0,e.jsx)(l,{warn:!0,children:t.pathCount>m?`Off: ${t.pathCount.toLocaleString()} paths is past the ${m} this can tell apart`:"Off: this graph states no paths"}):null]}),(0,e.jsx)(u,{label:"Mark bubbles",checked:t.showBubbles,onChange:a=>{t.setShowBubbles(a)},children:(0,e.jsx)(l,{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)(u,{label:"Genes on the backbone",checked:t.showGenes,onChange:a=>{t.setShowGenes(a)},children:[(0,e.jsx)(l,{children:"Exons along the reference nodes that carry them and each gene's name at its midpoint, from the assembly's annotation track"}),t.geneTrackChoices.length>1?(0,e.jsx)(h,{label:"Gene track",value:t.geneTrack?.trackId??"",options:L(t.geneTrackChoices),testId:"graph-gene-track-select",sx:{mt:1},onChange:a=>{t.setGeneTrackId(a),t.reloadGenes()}}):null,t.repeatTrackChoices.length>1?(0,e.jsx)(h,{label:"Repeat track",value:t.repeatTrack?.trackId??"",options:L(t.repeatTrackChoices),testId:"graph-repeat-track-select",sx:{mt:1},onChange:a=>{t.setRepeatTrackId(a),t.reloadRepeats()}}):null]}),t.anchorPaths.length>1?(0,e.jsxs)("div",{className:r.section,children:[(0,e.jsx)(h,{label:"Reference path",value:t.activeReferencePath??"",options:t.anchorPaths.map(({name:a})=>({value:a,label:a})),testId:"graph-reference-path-select",onChange:a=>{t.setReferencePath(a),t.recomputeLayout()}}),(0,e.jsx)(l,{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:r.section,children:[(0,e.jsx)(h,{label:"Bubble spread",value:t.bubbleSpread,options:k,testId:"graph-bubble-spread-select",onChange:a=>{t.setBubbleSpread(a),t.recomputeLayout()}}),(0,e.jsx)(l,{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)(S,{model:t})]}),(0,e.jsxs)("div",{className:r.section,children:[(0,e.jsx)(h,{label:"Node width",value:t.nodeWidth,options:w,testId:"graph-node-width-select",onChange:a=>{t.setNodeWidth(a)}}),(0,e.jsx)(l,{children:"Bandage's depth as width. In a cut with walks, depth is how many haplotypes carry the node."})]}),d,(0,e.jsxs)("div",{className:r.section,children:[(0,e.jsx)(h,{label:"Color scheme",value:t.chosenColorScheme,options:v,onChange:a=>{t.setColorScheme(a)}}),t.colorSchemeLock?(0,e.jsxs)(l,{warn:!0,children:["No effect now. ",t.colorSchemeLock.why]}):null]})]}),(0,e.jsx)(o.DialogActions,{children:(0,e.jsx)(o.Button,{variant:"contained",color:"primary",onClick:i,children:"Close"})})]})}),E=B;export{E as a};
+//# sourceMappingURL=chunk-SJNG2XK7.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/GraphGenomeView/components/GraphSettingsDialog.tsx"],
+  "sourcesContent": ["import type { ReactNode } from 'react'\n\nimport { BUBBLE_SPREADS } from '@jbrowse/bandage-core/bubbleSpreads'\nimport { COLOR_SCHEMES } from '@jbrowse/bandage-core/colorSchemes'\nimport { NODE_WIDTHS } from '@jbrowse/bandage-core/nodeWidths'\nimport { MAX_PATH_COLORS } from '@jbrowse/bandage-core/pathColors'\nimport { Dialog } from '@jbrowse/core/ui'\nimport {\n  Button,\n  DialogActions,\n  DialogContent,\n  FormControl,\n  FormControlLabel,\n  FormLabel,\n  InputLabel,\n  MenuItem,\n  Radio,\n  RadioGroup,\n  Select,\n  Switch,\n  Tooltip,\n  Typography,\n} from '@mui/material'\nimport { observer } from 'mobx-react'\nimport { makeStyles } from 'tss-react/mui'\n\nimport type { GraphPaneModel } from '../model'\nimport type { SxProps } from '@mui/material'\n\nconst useStyles = makeStyles()({\n  section: {\n    marginBottom: 24,\n  },\n  formControl: {\n    minWidth: 200,\n  },\n})\n\nconst qualityLabels = ['Lowest', 'Low', 'Medium', 'High', 'Highest'] as const\n\nfunction Caption({\n  warn = false,\n  children,\n}: {\n  warn?: boolean\n  children: ReactNode\n}) {\n  return (\n    <Typography\n      variant=\"caption\"\n      color={warn ? 'warning.main' : 'text.secondary'}\n    >\n      {children}\n    </Typography>\n  )\n}\n\n// Layout quality and bubble spread are the engine's inputs, and an anchored\n// layout places a node from its coordinates without reaching it. Left enabled\n// so the force layout can be set up before switching to it.\nconst EngineOnly = observer(function EngineOnly({\n  model,\n}: {\n  model: GraphPaneModel\n}) {\n  return model.hasGraph && !model.usesLayoutEngine ? (\n    <Caption warn>\n      No effect on this layout: only the force-directed layout is drawn by the\n      engine that reads this.\n    </Caption>\n  ) : null\n})\n\nfunction SettingSwitch({\n  label,\n  checked,\n  onChange,\n  children,\n}: {\n  label: string\n  checked: boolean\n  onChange: (checked: boolean) => void\n  children?: ReactNode\n}) {\n  const { classes } = useStyles()\n  return (\n    <div className={classes.section}>\n      <FormControlLabel\n        control={\n          <Switch\n            checked={checked}\n            onChange={e => {\n              onChange(e.target.checked)\n            }}\n          />\n        }\n        label={label}\n      />\n      {children}\n    </div>\n  )\n}\n\n// One dropdown setting; an option's description is its tooltip\nfunction SettingSelect<T extends string>({\n  label,\n  value,\n  options,\n  testId,\n  sx,\n  onChange,\n}: {\n  label: string\n  value: T\n  options: readonly { value: T; label: string; description?: string }[]\n  testId?: string\n  sx?: SxProps\n  onChange: (value: T) => void\n}) {\n  const { classes } = useStyles()\n  return (\n    <FormControl className={classes.formControl} sx={sx}>\n      <InputLabel>{label}</InputLabel>\n      <Select\n        value={value}\n        label={label}\n        data-testid={testId}\n        onChange={e => {\n          onChange(e.target.value as T)\n        }}\n      >\n        {options.map(({ value, label, description }) => (\n          <MenuItem key={value} value={value}>\n            {description ? (\n              <Tooltip title={description} placement=\"right\">\n                <span>{label}</span>\n              </Tooltip>\n            ) : (\n              label\n            )}\n          </MenuItem>\n        ))}\n      </Select>\n    </FormControl>\n  )\n}\n\nconst trackOptions = (tracks: { trackId: string; name: string }[]) =>\n  tracks.map(({ trackId, name }) => ({ value: trackId, label: name }))\n\n// `children` is the host's own section, between node width and colour\nconst GraphSettingsDialog = observer(function GraphSettingsDialog(props: {\n  model: GraphPaneModel\n  open: boolean\n  onClose: () => void\n  children?: ReactNode\n}) {\n  const { model, open, onClose, children } = props\n  const { classes } = useStyles()\n\n  return (\n    <Dialog open={open} onClose={onClose} title=\"Graph settings\">\n      <DialogContent>\n        <div className={classes.section}>\n          <FormControl fullWidth>\n            <FormLabel component=\"legend\">Layout quality</FormLabel>\n            <RadioGroup\n              value={model.layoutQuality}\n              onChange={e => {\n                model.setLayoutQuality(parseInt(e.target.value))\n                void model.recomputeLayout()\n              }}\n            >\n              {qualityLabels.map((label, i) => (\n                <FormControlLabel\n                  key={label}\n                  value={i}\n                  control={<Radio />}\n                  label={label}\n                />\n              ))}\n            </RadioGroup>\n            <Caption>\n              FMMM&apos;s iteration budget, the same scale Bandage exposes.\n              Higher is slower: on a thousand-node cut the top setting is\n              seconds rather than tenths.\n            </Caption>\n            <EngineOnly model={model} />\n          </FormControl>\n        </div>\n\n        <SettingSwitch\n          label=\"Draw paths\"\n          checked={model.drawPaths}\n          onChange={draw => {\n            model.setDrawPaths(draw)\n          }}\n        >\n          <Caption>\n            Color each node and connector by the paths through it, one lane per\n            path in legend order, so a path that skips a node leaves its lane\n            empty\n          </Caption>\n          {model.drawPaths && !model.effectiveDrawPaths ? (\n            <Caption warn>\n              {model.pathCount > MAX_PATH_COLORS\n                ? `Off: ${model.pathCount.toLocaleString()} paths is past the ${MAX_PATH_COLORS} this can tell apart`\n                : 'Off: this graph states no paths'}\n            </Caption>\n          ) : null}\n        </SettingSwitch>\n\n        <SettingSwitch\n          label=\"Mark bubbles\"\n          checked={model.showBubbles}\n          onChange={show => {\n            model.setShowBubbles(show)\n          }}\n        >\n          <Caption>\n            A halo along the nodes of each bubble, labelled by what it is, with\n            the label opening the bubble on its own\n          </Caption>\n        </SettingSwitch>\n\n        <SettingSwitch\n          label=\"Genes on the backbone\"\n          checked={model.showGenes}\n          onChange={show => {\n            model.setShowGenes(show)\n          }}\n        >\n          <Caption>\n            Exons along the reference nodes that carry them and each gene's name\n            at its midpoint, from the assembly's annotation track\n          </Caption>\n          {model.geneTrackChoices.length > 1 ? (\n            <SettingSelect\n              label=\"Gene track\"\n              value={model.geneTrack?.trackId ?? ''}\n              options={trackOptions(model.geneTrackChoices)}\n              testId=\"graph-gene-track-select\"\n              sx={{ mt: 1 }}\n              onChange={trackId => {\n                model.setGeneTrackId(trackId)\n                void model.reloadGenes()\n              }}\n            />\n          ) : null}\n          {model.repeatTrackChoices.length > 1 ? (\n            <SettingSelect\n              label=\"Repeat track\"\n              value={model.repeatTrack?.trackId ?? ''}\n              options={trackOptions(model.repeatTrackChoices)}\n              testId=\"graph-repeat-track-select\"\n              sx={{ mt: 1 }}\n              onChange={trackId => {\n                model.setRepeatTrackId(trackId)\n                void model.reloadRepeats()\n              }}\n            />\n          ) : null}\n        </SettingSwitch>\n\n        {model.anchorPaths.length > 1 ? (\n          <div className={classes.section}>\n            <SettingSelect\n              label=\"Reference path\"\n              value={model.activeReferencePath ?? ''}\n              options={model.anchorPaths.map(({ name }) => ({\n                value: name,\n                label: name,\n              }))}\n              testId=\"graph-reference-path-select\"\n              onChange={name => {\n                model.setReferencePath(name)\n                void model.recomputeLayout()\n              }}\n            />\n            <Caption>\n              Which path the anchored layouts draw x against. A GFA with no rGFA\n              tags states its coordinates only in its paths, and marks none of\n              them as the reference.\n            </Caption>\n          </div>\n        ) : null}\n\n        <div className={classes.section}>\n          <SettingSelect\n            label=\"Bubble spread\"\n            value={model.bubbleSpread}\n            options={BUBBLE_SPREADS}\n            testId=\"graph-bubble-spread-select\"\n            onChange={spread => {\n              model.setBubbleSpread(spread)\n              void model.recomputeLayout()\n            }}\n          />\n          <Caption>\n            How far the force layout opens a bubble. A pangenome allele is a few\n            bp, so at Bandage&apos;s own scale both arms land inside one node\n            thickness and the graph draws as a rope.\n          </Caption>\n          <EngineOnly model={model} />\n        </div>\n\n        <div className={classes.section}>\n          <SettingSelect\n            label=\"Node width\"\n            value={model.nodeWidth}\n            options={NODE_WIDTHS}\n            testId=\"graph-node-width-select\"\n            onChange={width => {\n              model.setNodeWidth(width)\n            }}\n          />\n          <Caption>\n            Bandage&apos;s depth as width. In a cut with walks, depth is how\n            many haplotypes carry the node.\n          </Caption>\n        </div>\n\n        {children}\n\n        <div className={classes.section}>\n          <SettingSelect\n            label=\"Color scheme\"\n            value={model.chosenColorScheme}\n            options={COLOR_SCHEMES}\n            onChange={scheme => {\n              model.setColorScheme(scheme)\n            }}\n          />\n          {model.colorSchemeLock ? (\n            <Caption warn>No effect now. {model.colorSchemeLock.why}</Caption>\n          ) : null}\n        </div>\n      </DialogContent>\n\n      <DialogActions>\n        <Button variant=\"contained\" color=\"primary\" onClick={onClose}>\n          Close\n        </Button>\n      </DialogActions>\n    </Dialog>\n  )\n})\n\nexport default GraphSettingsDialog\n"],
+  "mappings": "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",
+  "names": ["import_ui", "import_material", "import_mobx_react", "import_mui", "import_jsx_runtime", "useStyles", "qualityLabels", "Caption", "warn", "children", "EngineOnly", "model", "SettingSwitch", "label", "checked", "onChange", "classes", "e", "SettingSelect", "value", "options", "testId", "sx", "description", "trackOptions", "tracks", "trackId", "name", "GraphSettingsDialog", "props", "open", "onClose", "i", "draw", "MAX_PATH_COLORS", "show", "BUBBLE_SPREADS", "spread", "NODE_WIDTHS", "width", "COLOR_SCHEMES", "scheme", "GraphSettingsDialog_default"]
+}

package/dist/chunks/chunk-WKVVIDCS.js

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