https://hifimap.net/assets/SystemDiagram-C7jOj7bC.js

1import{r as e,t}from"./jsx-runtime-BkSabwWG.js";import{t as n}from"./react-DHmoMYoq.js";import{S as r,T as i}from"./index-CZvRv669.js";var a=e(n(),1),o=t(),s={analog:`var(--signal-analog)`,digital:`var(--signal-digital)`,speaker:`var(--signal-speaker)`,power:`var(--signal-power)`,network:`var(--signal-network)`},c=190,l=74,u=60,d=26,f=18,p=14,m=106,h=70,g=40,_=10,v=260,y=240,b=10,x=[`digital`,`analog`,`output`,`mains`],S=[`digital`,`analog`],C={digital:`var(--signal-digital)`,analog:`var(--signal-analog)`,output:`var(--signal-speaker)`,mains:`var(--signal-power)`},w={digital:`Digital sources`,analog:`Analog sources`,output:`Output`,mains:`Mains`};function T(e){let t=new Map,n=null;for(let r of x){let i=e.filter(e=>e.lane===r);if(!i.length)continue;let a={top:Math.min(...i.map(e=>e.autoY)),bottom:Math.max(...i.map(e=>e.autoY+l))},o=n===null?g:n+(r===`mains`?h:m),s=Math.max(0,o-a.top);t.set(r,s),n=a.bottom+s}return t}function E(e,t){return e.map(e=>({...e,y:e.y+(t.get(e.lane)??0)}))}var D=new Set([`power-outlet`,`network-outlet`]);function O(e,t){if(e.category===`custom`)return e.lane??`analog`;if(e.category===`power`||e.category===`ground`||e.category===`power-supply`||D.has(e.category))return`mains`;if(e.category===`speaker`||e.category===`headphones`||e.category===`subwoofer`||e.category===`amplifier`||e.category===`stereo-amplifier`||e.category===`mono-amplifier`||e.category===`preamp`)return`output`;if(e.category===`server`||e.category===`streamer`||e.category===`streamer-dac`||e.category===`usb-reclocker`||e.category===`cd`||e.category===`switch`||e.category===`router`||e.category===`filter`||e.category===`dac`)return`digital`;let n=new Set(t.connections.filter(t=>t.fromDevice===e.id||t.toDevice===e.id).map(e=>e.signal).filter(e=>e!==`power`));return n.size===0||n.has(`analog`)||n.has(`speaker`)?`analog`:`digital`}function k(e,t){let n=new Set(e.map(e=>e.id)),r=t.connections.filter(e=>e.signal!==`power`&&n.has(e.fromDevice)&&n.has(e.toDevice)&&e.fromDevice!==e.toDevice),i=new Map(e.map(e=>[e.id,0])),a=t=>{for(let n=0;n<e.length+1;n++){let e=!1;for(let n of r){if(t?.(n))continue;let r=(i.get(n.fromDevice)??0)+1;r>(i.get(n.toDevice)??0)&&(i.set(n.toDevice,r),e=!0)}if(!e)break}};a();let o=new Set([`speaker`,`power`]),s=new Map;for(let t of e)o.has(t.category)||s.set(t.category,[...s.get(t.category)??[],t]);let c=new Map(e.map(e=>[e.id,e.category])),l=e=>{let t=c.get(e.fromDevice),n=c.get(e.toDevice);return!!t&&t===n&&!o.has(t)&&(s.get(t)?.length??0)>1};for(let e=0;e<6;e++){let e=!1;for(let t of s.values()){if(t.length<2)continue;let n=Math.max(...t.map(e=>i.get(e.id)??0));for(let r of t)(i.get(r.id)??0)!==n&&(i.set(r.id,n),e=!0)}if(!e)break;a(l)}for(let e of s.values()){if(e.length<2)continue;let t=Math.max(...e.map(e=>i.get(e.id)??0));for(let n of e)i.set(n.id,t)}let u=[...new Set(i.values())].sort((e,t)=>e-t),d=new Map(u.map((e,t)=>[e,t]));for(let[e,t]of i)i.set(e,d.get(t)??0);let f=Math.max(0,...i.values());for(let t of e)t.category===`speaker`&&i.set(t.id,f);return i}function A(e){let t=e.devices,n=new Map(t.map(t=>[t.id,O(t,e)])),r=t.filter(e=>n.get(e.id)!==`mains`),i=t.filter(e=>n.get(e.id)===`mains`),a=new Map;for(let t of S){let i=r.filter(e=>n.get(e.id)===t);i.length&&a.set(t,k(i,e))}let o=e=>a.get(n.get(e.id))?.get(e.id)??0,s=new Map(r.map((e,t)=>[e.id,t]));for(let t=0;t<3;t++)for(let t of r){let n=e.connections.filter(e=>e.signal!==`power`&&(e.fromDevice===t.id||e.toDevice===t.id)).map(e=>e.fromDevice===t.id?e.toDevice:e.fromDevice).map(e=>s.get(e)).filter(e=>e!==void 0);n.length&&s.set(t.id,n.reduce((e,t)=>e+t,0)/n.length)}let _=S.map(e=>({lane:e,items:r.filter(t=>n.get(t.id)===e)})).filter(e=>e.items.length>0),v=[],y=[],b=g;for(let e of _){let t=new Map;for(let n of e.items){let e=o(n);t.set(e,[...t.get(e)??[],n])}let n=Math.max(...[...t.values()].map(e=>e.length)),r=n*l+(n-1)*d;for(let[n,i]of t){let t=[...i].sort((e,t)=>(s.get(e.id)??0)-(s.get(t.id)??0)),a=t.length*l+(t.length-1)*d,o=b+(r-a)/2;t.forEach((t,r)=>{let i=g+n*250,a=o+r*100;v.push({...t,lane:e.lane,autoX:i,autoY:a,x:t.pos?.x??i,y:t.pos?.y??a})})}y.push({lane:e.lane,top:b-m/2+6,bottom:b+r+m/2-6}),b+=r+m}let x={preamp:0,amplifier:1,"stereo-amplifier":1,"mono-amplifier":1,speaker:2,headphones:2,subwoofer:2},C=r.filter(e=>n.get(e.id)===`output`).sort((e,t)=>

1(x[e.category]??3)-(x[t.category]??3)||(s.get(e.id)??0)-(s.get(t.id)??0));if(C.length){let e=Math.max(g,...v.map(e=>e.autoX+c)),t=Math.min(g,...v.map(e=>e.autoY)),n=Math.max(g,...v.map(e=>e.autoY+l)),r=v.length?e+m+u:g,i=[...new Set(C.map(e=>e.category))].sort((e,t)=>(x[e]??3)-(x[t]??3)),a=new Map(i.map(e=>[e,C.filter(t=>t.category===e)])),o=Math.max(...[...a.values()].map(e=>e.length)),s=o*l+(o-1)*d,h=Math.max(g,t+(n-t-s)/2);i.forEach((e,t)=>{let n=a.get(e),i=n.length*l+(n.length-1)*d,o=h+(s-i)/2;n.forEach((e,n)=>{let i=r+t*250,a=o+n*100;v.push({...e,lane:`output`,autoX:i,autoY:a,x:e.pos?.x??i,y:e.pos?.y??a})})}),y.push({lane:`output`,top:h-f-p,bottom:h+s+f})}let w=Math.max(g,...v.map(e=>e.autoY+l)),T=i.filter(e=>D.has(e.category)),E=[...T.filter(e=>e.category===`network-outlet`),...T.filter(e=>e.category!==`network-outlet`)],A=i.filter(e=>!D.has(e.category)),j=[A,E].filter(e=>e.length>0),M=e=>e.length*c+Math.max(0,e.length-1)*(u/2),N=Math.max(0,...j.map(M)),P=Math.max(80+Math.max(0,...v.map(e=>e.autoX+c-g)),80+N),F=w+h,I=A.length?(P-M(A))/2:null;return j.forEach((e,t)=>{let n=e===E&&I!==null?I:(P-M(e))/2,r=F+t*100;e.forEach((e,t)=>{let i=n+t*220;v.push({...e,lane:`mains`,autoX:i,autoY:r,x:e.pos?.x??i,y:e.pos?.y??r})})}),{placed:v,width:Math.max(P,...v.map(e=>e.x+c+g)),height:Math.max((i.length?F+j.length*l+(j.length-1)*d:w)+g,...v.map(e=>e.y+l+g)),lanes:y,railTop:i.length?F-h/2:null}}function j(e,t,n){if(n===`power`){let n=e.y>=t.y?e:t,r=e.y>=t.y?t:e,i=n.x+c/2,a=n.y,o=r.x+c/2,s=r.y+l,u=Math.max(40,(a-s)*.5);return`M ${i} ${a} C ${i} ${a-u}, ${o} ${s+u}, ${o} ${s}`}if(n===`rail`){let n=e.lane===`mains`?e:t,r=n===e?t:e,i=n.x+c/2,a=n.y,o=r.x,s=r.y+l/2,u=Math.max(60,(a-s)*.45),d=Math.max(60,Math.abs(i-o)*.5);return`M ${i} ${a} C ${i} ${a-u}, ${o-d} ${s}, ${o} ${s}`}let r=t.x>=e.x,i=r?e.x+c:e.x,a=r?t.x:t.x+c,o=e.y+l/2,s=t.y+l/2,u=Math.max(40,Math.abs(a-i)*.5)*(r?1:-1);return`M ${i} ${o} C ${i+u} ${o}, ${a-u} ${s}, ${a} ${s}`}var M=280;function N(e,t,n){let r=e.subtitle?Math.ceil(e.subtitle.length/42):0,i=e.specs?.filter(e=>e.value).length??0,a=+!!e.inputs.length+ +!!e.outputs.length,o=(e.inputs.length?Math.ceil(e.inputs.join(`, `).length/34):0)+(e.outputs.length?Math.ceil(e.outputs.join(`, `).length/34):0),s=72+r*15+(i?24+i*15:0)+(a?24+Math.max(a,o)*15:0);return{x:Math.max(4,Math.min(t-M-4,e.x+c/2-M/2)),y:Math.max(4,Math.min(n-s-4,e.y+l/2-s/2)),w:M,h:s}}var P=240;function F(e,t,n,r,i){let a=Math.ceil((e.cable||`Unnamed cable`).length/34),o=(e,t)=>Math.ceil(`${e} · ${t}`.length/32),s=78+a*15+o(t.name,e.fromPort)*14+o(n.name,e.toPort)*14,u=(t.x+c/2+n.x+c/2)/2,d=(t.y+l/2+n.y+l/2)/2;return{x:Math.max(4,Math.min(r-P-4,u-P/2)),y:Math.max(4,Math.min(i-s-4,d-s/2)),w:P,h:s}}function I({system:e,selected:t,onSelect:n,onMoveDevice:u}){let{placed:d,width:m,height:S}=A(e),D=(0,a.useRef)(null),O=(0,a.useRef)(null),[k,M]=(0,a.useState)(null),P=(0,a.useRef)(new Set(e.connections.map(e=>e.id))),I=new Set(e.connections.filter(e=>!P.current.has(e.id)).map(e=>e.id));(0,a.useEffect)(()=>{for(let t of e.connections)P.current.add(t.id)},[e.connections]);let L=d.map(e=>k&&k.id===e.id?{...e,x:k.x,y:k.y}:e),R=E(L,T(L)),z=new Map(R.map(e=>[e.id,e])),B=e=>{if(e.signal===`power`)return`power`;let t=z.get(e.fromDevice),n=z.get(e.toDevice);return t&&n&&(t.lane===`mains`||n.lane===`mains`)?`rail`:`signal`},V=e=>B(e)!==`signal`,H=R.length?Math.max(...R.map(e=>e.x+c))+g:m,U=R.length?Math.max(...R.map(e=>e.y+l))+g:S,W=x.filter(e=>e!==`mains`).map(e=>({lane:e,items:R.filter(t=>t.lane===e)})).filter(e=>e.items.length>0).map(e=>({lane:e.lane,left:Math.min(...e.items.map(e=>e.x))-f,right:Math.max(...e.items.map(e=>e.x+c))+f,top:Math.min(...e.items.map(e=>e.y))-f-p,bottom:Math.max(...e.items.map(e=>e.y+l))+f})),G=(()=>{let e=R.filter(e=>e.lane===`mains`);return e.length?Math.min(...e.map(e=>e.y))-h/2:null})(),K=e=>{let t=D.current;if(!t)return{x:0,y:0};let n=t.getBoundingClientRect(),r=H/n.width;return{x:(e.clientX-n.left)*r,y:(e.clientY-n.top)*r}},q=t=>{let n=d.find(e=>e.id===t);if(!n)return[];let r=new Set;for(let n of e.connections)n.fromDevice===t&&r.add(n.toDevice),n.toDevice===t&&r.add(n.fromDevice);let i=e=>Math.hypot(e.x-n.x,e.y-n.y),a=(e,t)=>i(e)-i(t),o=d.filter(e=>r.has(e.id)).sort(a)[0]??d.filter(e=>e.id!==t).sort(a)[0];return o?[{x:o.x,y:o.y}]:[]},J=e=>t=>{if(t.button!==0)return;let n=K(t),r=d.find(t=>

1t.id===e.id);r&&(O.current={id:e.id,dx:n.x-e.x,dy:n.y-e.y,startX:n.x,startY:n.y,offsetX:e.x-r.x,offsetY:e.y-r.y,home:{x:r.x,y:r.y},anchors:q(e.id),moved:!1,last:{x:r.x,y:r.y}},u&&t.target.setPointerCapture?.(t.pointerId))},Y=e=>{let t=O.current;if(!t||!u)return;let n=K(e);if(!t.moved&&Math.hypot(n.x-t.startX,n.y-t.startY)<8)return;t.moved=!0;let r=e=>Math.round(e/_)*_,i=Math.max(g,t.home.x-v),a=t.home.x+v,o=Math.max(g,t.home.y-y),s=t.home.y+y;if(t.anchors.length){let e=Math.max(...t.anchors.map(e=>e.x-v)),n=Math.min(...t.anchors.map(e=>e.x+v)),r=Math.max(...t.anchors.map(e=>e.y-y)),c=Math.min(...t.anchors.map(e=>e.y+y));e<=n&&(i=Math.max(g,e),a=n),r<=c&&(o=Math.max(g,r),s=c)}let f={x:Math.min(a,Math.max(i,r(n.x-t.dx-t.offsetX))),y:Math.min(s,Math.max(o,r(n.y-t.dy-t.offsetY)))},p=(e,n)=>{let r=d.map(r=>r.id===t.id?{...r,x:e,y:n}:r),i=E(r,T(r)),a=i.find(e=>e.id===t.id);return!a||i.some(e=>e.id!==t.id&&a.x<e.x+c+b&&a.x+c+b>e.x&&a.y<e.y+l+b&&a.y+l+b>e.y)};p(f.x,f.y)?p(f.x,t.last?.y??f.y)?p(t.last?.x??f.x,f.y)||(t.last={x:t.last?.x??f.x,y:f.y}):t.last={x:f.x,y:t.last?.y??f.y}:t.last=f,f=t.last??f,(Math.abs(f.x-t.home.x)>3||Math.abs(f.y-t.home.y)>3)&&(t.moved=!0),t.moved&&M({id:t.id,...f})},X=e=>r=>{let i=O.current;if(O.current=null,u&&r.target.releasePointerCapture?.(r.pointerId),!i)return;if(i.moved&&k&&u){if(Math.abs(k.x-i.home.x)<1&&Math.abs(k.y-i.home.y)<1){M(null);let r=t?.kind===`device`&&t.id===e.id;n?.(r?null:{kind:`device`,id:e.id});return}u(i.id,{x:Math.round(k.x),y:Math.round(k.y)}),M(null);return}M(null);let a=t?.kind===`device`&&t.id===e.id;n?.(a?null:{kind:`device`,id:e.id})},Z=(e,r)=>{let i=z.get(e.fromDevice),a=z.get(e.toDevice);if(!i||!a)return null;let c=t?.kind===`connection`&&t.id===e.id,l=t?.kind===`device`&&(e.fromDevice===t.id||e.toDevice===t.id),u=t&&!c&&!l,d=B(e),f=d===`power`,p=d!==`signal`,m=j(i,a,d);return(0,o.jsxs)(`g`,{children:[(0,o.jsx)(`path`,{d:m,fill:`none`,stroke:s[e.signal],strokeWidth:c?2.4:1.2,strokeOpacity:u?.15:c?1:.65,strokeDasharray:f?`5 5`:1600,style:{"--dash":f?`0`:`1600`,animation:!f&&I.has(e.id)?`draw-cable 1.2s cubic-bezier(0.16,1,0.3,1) ${.12*r}s both`:void 0}}),!p&&(0,o.jsx)(`path`,{d:m,fill:`none`,stroke:`transparent`,strokeWidth:14,className:`cursor-pointer`,onClick:t=>{t.stopPropagation(),n?.(c?null:{kind:`connection`,id:e.id})}})]},e.id)};return(0,o.jsxs)(`div`,{className:`relative overflow-hidden rounded-3xl border border-border bg-panel/30 p-6 md:p-10`,children:[(0,o.jsx)(`div`,{className:`pointer-events-none absolute inset-0 grid-dots`,"aria-hidden":`true`}),(0,o.jsx)(`div`,{className:`relative w-full overflow-x-auto`,children:(0,o.jsxs)(`svg`,{ref:D,viewBox:`0 0 ${H} ${U}`,className:`mx-auto w-full min-w-[320px] touch-none`,style:{height:`auto`,maxWidth:Math.max(H,320)},role:`img`,"aria-label":`Signal and power routing diagram for ${e.name}`,onPointerMove:Y,onClick:()=>n?.(null),children:[(0,o.jsx)(`rect`,{x:0,y:0,width:H,height:U,fill:`transparent`,pointerEvents:`all`}),e.connections.filter(V).map(Z),(0,o.jsxs)(`g`,{"aria-hidden":`true`,pointerEvents:`none`,children:[W.map(e=>(0,o.jsxs)(`g`,{children:[(0,o.jsx)(`rect`,{x:e.left,y:e.top,width:Math.max(0,e.right-e.left),height:Math.max(0,e.bottom-e.top),rx:20,fill:`color-mix(in oklab, ${C[e.lane]} 5%, color-mix(in oklab, var(--background) 82%, transparent))`,stroke:`color-mix(in oklab, ${C[e.lane]} 12%, transparent)`,style:{transition:k?`none`:`all 220ms cubic-bezier(0.16,1,0.3,1)`}}),(0,o.jsx)(`text`,{x:e.left+16,y:e.top+18,fontSize:`8.5`,letterSpacing:`1.6`,className:`uppercase`,fill:`color-mix(in oklab, ${C[e.lane]} 55%, var(--muted-foreground))`,style:{transition:k?`none`:`all 220ms cubic-bezier(0.16,1,0.3,1)`},children:w[e.lane]})]},e.lane)),G!==null&&(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(`line`,{x1:g,x2:H-g,y1:G,y2:G,stroke:`var(--border)`,strokeDasharray:`2 8`}),(0,o.jsx)(`text`,{x:g,y:G+18,fontSize:`8.5`,letterSpacing:`1.6`,className:`uppercase`,fill:`color-mix(in oklab, ${C.mains} 55%, var(--muted-foreground))`,children:w.mains})]})]}),(0,o.jsx)(`defs`,{children:W.map(e=>(0,o.jsx)(`clipPath`,{id:`lane-clip-${e.lane}`,children:(0,o.jsx)(`rect`,{x:e.left,y:e.top,width:Math.max(0,e.right-e.left),height:Math.max(0,e.bottom-e.top),rx:20})},`clip-${e.lane}`))}),(0,o.jsx)(`g`,{pointerEvents:`none`,children:e.connections.filter(V).map(e=>{let n=z.get(e.fromDevice),r=z.get(e.toDevice);if(!n||!r)return null;let i=r.lane===`mains`?n.lane===`mains`?null:n:r;if(!i)return null;let a=t?.kind===`connection`&&t.id===e.id,c=t?.kind===`device`&&(e.fromDevice===t.id||e.toDevice===t.id),l=t&&!a&&!c;return(0,o.jsx)(`path`,{d:j(n,r,B(e)),clipPath:`url(#lane-clip-${i.lane}

1)`,fill:`none`,stroke:s[e.signal],strokeWidth:a?2.4:1.2,strokeOpacity:l?.15:a?1:.65,strokeDasharray:e.signal===`power`?`5 5`:void 0},`overlay-${e.id}`)})}),e.connections.filter(V).map(e=>{let r=z.get(e.fromDevice),i=z.get(e.toDevice);if(!r||!i)return null;let a=t?.kind===`connection`&&t.id===e.id;return(0,o.jsx)(`path`,{d:j(r,i,B(e)),fill:`none`,stroke:`transparent`,strokeWidth:14,className:`cursor-pointer`,onClick:t=>{t.stopPropagation(),n?.(a?null:{kind:`connection`,id:e.id})}},`hit-${e.id}`)}),e.connections.filter(e=>!V(e)).map(Z),R.map(n=>{if(t?.kind===`device`&&t.id===n.id)return null;let r=!t||e.connections.some(e=>t?.kind===`connection`&&e.id===t.id&&(e.fromDevice===n.id||e.toDevice===n.id));return(0,o.jsxs)(`g`,{opacity:r?1:.35,children:[(0,o.jsx)(`rect`,{x:n.x,y:n.y,width:c,height:l,rx:12,fill:`var(--background)`,stroke:n.category===`amplifier`||n.category===`stereo-amplifier`||n.category===`mono-amplifier`||n.category===`preamp`?`color-mix(in oklab, var(--primary) 35%, transparent)`:`var(--border)`,strokeWidth:n.category===`amplifier`||n.category===`stereo-amplifier`||n.category===`mono-amplifier`||n.category===`preamp`?1.6:1}),(0,o.jsx)(`text`,{x:n.x+16,y:n.y+24,fill:`var(--primary)`,fontSize:`8.5`,letterSpacing:`1.2`,className:`uppercase`,children:i(n)}),(0,o.jsx)(`text`,{x:n.x+16,y:n.y+43,fill:`var(--foreground)`,fontSize:`13`,fontWeight:`500`,children:n.name.length>22?`${n.name.slice(0,21)}…`:n.name}),(0,o.jsx)(`text`,{x:n.x+16,y:n.y+59,fill:`var(--muted-foreground)`,fontSize:`9`,children:n.subtitle.length>30?`${n.subtitle.slice(0,29)}…`:n.subtitle}),(0,o.jsx)(`rect`,{x:n.x,y:n.y,width:c,height:l,rx:12,fill:`transparent`,stroke:`transparent`,pointerEvents:`all`,className:u?`cursor-grab`:`cursor-pointer`,onPointerDown:J(n),onPointerUp:X(n),onClick:e=>e.stopPropagation()})]},n.id)}),(()=>{let e=t?.kind===`device`?R.find(e=>e.id===t.id):void 0;if(!e)return null;let{x:n,y:r,w:a,h:s}=N(e,H,U);return(0,o.jsxs)(`g`,{children:[(0,o.jsx)(`foreignObject`,{x:n,y:r,width:a,height:s,children:(0,o.jsxs)(`div`,{className:`h-full w-full rounded-2xl border-2 border-primary bg-background p-4 shadow-2xl`,children:[(0,o.jsx)(`p`,{className:`text-[8.5px] uppercase tracking-[0.14em] text-primary`,children:i(e)}),(0,o.jsx)(`p`,{className:`mt-1 text-[14px] font-medium leading-tight text-foreground`,children:e.name}),e.subtitle&&(0,o.jsx)(`p`,{className:`mt-1.5 text-[11px] leading-snug text-muted-foreground`,children:e.subt

1itle}),(e.specs?.filter(e=>e.value).length??0)>0&&(0,o.jsx)(`dl`,{className:`mt-3 space-y-1 border-t border-border pt-2.5`,children:e.specs.filter(e=>e.value).map(e=>(0,o.jsxs)(`div`,{className:`flex gap-2 text-[9.5px] leading-snug`,children:[(0,o.jsx)(`dt`,{className:`shrink-0 uppercase tracking-[0.12em] text-muted-foreground`,children:e.label}),(0,o.jsx)(`dd`,{className:`text-foreground`,children:e.value})]},e.label))}),(e.inputs.length>0||e.outputs.length>0)&&(0,o.jsxs)(`dl`,{className:`mt-3 space-y-1 border-t border-border pt-2.5 text-[9.5px] leading-snug text-muted-foreground`,children:[e.inputs.length>0&&(0,o.jsxs)(`div`,{className:`flex gap-2`,children:[(0,o.jsx)(`dt`,{className:`shrink-0 uppercase tracking-[0.12em]`,children:`In`}),(0,o.jsx)(`dd`,{className:`text-foreground`,children:e.inputs.join(`, `)})]}),e.outputs.length>0&&(0,o.jsxs)(`div`,{className:`flex gap-2`,children:[(0,o.jsx)(`dt`,{className:`shrink-0 uppercase tracking-[0.12em]`,children:`Out`}),(0,o.jsx)(`dd`,{className:`text-foreground`,children:e.outputs.join(`, `)})]})]})]})}),(0,o.jsx)(`rect`,{x:n,y:r,width:a,height:s,rx:16,fill:`transparent`,pointerEvents:`all`,className:u?`cursor-grab`:`cursor-pointer`,onPointerDown:J(e),onPointerUp:X(e),onClick:e=>e.stopPropagation()})]})})(),(()=>{let i=t?.kind===`connection`?e.connections.find(e=>e.id===t.id):void 0;if(!i)return null;let a=z.get(i.fromDevice),c=z.get(i.toDevice);if(!a||!c)return null;let{x:l,y:u,w:d,h:f}=F(i,a,c,H,U);return(0,o.jsxs)(`g`,{children:[(0,o.jsx)(`foreignObject`,{x:l,y:u,width:d,height:f,children:(0,o.jsxs)(`div`,{className:`h-full w-full rounded-2xl border-2 border-primary bg-background p-4 shadow-2xl`,children:[(0,o.jsxs)(`p`,{className:`text-[8.5px] uppercase tracking-[0.14em]`,style:{color:s[i.signal]},children:[r[i.signal],` · `,i.length]}),(0,o.jsx)(`p`,{className:`mt-1 text-[14px] font-medium leading-tight text-foreground`,children:i.cable||`Unnamed cable`}),(0,o.jsxs)(`dl`,{className:`mt-3 space-y-1.5 border-t border-border pt-2.5 text-[9.5px] leading-snug text-muted-foreground`,children:[(0,o.jsxs)(`div`,{className:`flex gap-2`,children:[(0,o.jsx)(`dt`,{className:`shrink-0 uppercase tracking-[0.12em]`,children:`From`}),(0,o.jsxs)(`dd`,{className:`text-foreground`,children:[a.name,` · `,i.fromPort]})]}),(0,o.jsxs)(`div`,{className:`flex gap-2`,children:[(0,o.jsx)(`dt`,{className:`shrink-0 uppercase tracking-[0.12em]`,children:`To`}),(0,o.jsxs)(`dd`,{className:`text-foreground`,children:[c.name,` · `,i.toPort]})]})]})]})}),(0,o.jsx)(`rect`,{x:l,y:u,width:d,height:f,rx:16,fill:`transparent`,pointerEvents:`all`,className:`cursor-pointer`,onClick:e=>{e.stopPropagation(),n?.(null)}})]})})()]})}),(0,o.jsx)(`div`,{className:`relative mt-8 flex flex-wrap gap-6 border-t border-border pt-6`,children:Object.keys(r).map(e=>(0,o.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,o.jsx)(`span`,{className:`h-px w-8`,style:{backgroundColor:s[e]}}),(0,o.jsx)(`span`,{className:`text-[10px] uppercase tracking-[0.2em] text-muted-foreground`,children:r[e]})]},e))})]})}export{I as t};