@mp70/react-networks 0.11.1-alpha → 0.11.3-alpha
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import Pt,{useState,useSyncExternalStore,useMemo,useRef,useEffect,useCallback}from'react';import {useReactFlow,Handle,Position,getBezierPath,EdgeLabelRenderer,BaseEdge,ReactFlowProvider,useNodesState,useEdgesState,addEdge,useOnSelectionChange,ReactFlow,Background,Controls,MiniMap}from'reactflow';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var it=()=>"bottom-up",ie=e=>e.data.uNumberingDirection||it(),Pe=(e,o,t)=>t==="bottom-up"?o-e+1:e,Ge=(e,o,t)=>t==="bottom-up"?o-e+1:e;var De=(e,o,t,r)=>{if(!e.parentId||e.parentId!==o.id)return t;e.data.uHeight||1;let i=o.data.uHeight||42,a=ie(o),d=60,l=t.y-d,p=Math.round(l/20)+1,g=Pe(p,i,a),y=Math.max(1,g);if(!Ce(o,e,y,r)){let U=ge(o,e,r,y);U!==y&&(y=U);}let A=Ge(y,i,a),S=d+(A-1)*20-1;return {x:t.x,y:S,uPosition:y}},Ce=(e,o,t,r)=>{let n=o.data.uHeight||1,i=e.data.uHeight||42;if(t<1||t+n-1>i)return false;let a=r.filter(d=>d.type==="device"&&d.parentId===e.id&&d.id!==o.id);for(let d of a){let l=d.data.uPosition||1,p=d.data.uHeight||1,g=t,y=t+n-1,A=l,S=l+p-1;if(g<=S&&y>=A)return false}return true},ge=(e,o,t,r=1)=>{let n=o.data.uHeight||1,i=e.data.uHeight||42;for(let a=r;a<=i-n+1;a++)if(Ce(e,o,a,t))return a;return 1},de=(e,o)=>{let t=60,r=ie(e),n=e.data.uHeight||42,i=Ge(o,n,r);return {x:0,y:t+(i-1)*20-1}},Ye=(e,o,t)=>{let r=de(o,t);return {...e,position:r,data:{...e.data,uPosition:t}}},at=(e,o)=>{let t=e.data.uPosition||1,r=e.data.uHeight||1,n=o.data.uHeight||42,i=Math.max(1,Math.min(n-r+1,t));return i!==t?Ye(e,o,i):e};var Re=({data:e,selected:o,id:t,onViewChange:r,onRackFaceChange:n})=>{let{label:i,ports:a=0,status:d="active",uHeight:l=42,uPosition:p=1,face:g="front",customHeaderText:y}=e,{getNodes:A,setNodes:S}=useReactFlow(),U=A(),[k,w]=useState(true),Z=()=>{let W=ie({data:e})==="bottom-up"?"top-down":"bottom-up";S(P=>P.map(h=>h.id===t?{...h,data:{...h.data,uNumberingDirection:W}}:h));},j=()=>{let b=g==="front"?"rear":"front";n?(n(t,b),r&&U.filter(P=>P.parentId===t).forEach(P=>{r(P.id,b);})):r?U.filter(P=>P.parentId===t).forEach(P=>{r(P.id,b);}):S(W=>W.map(P=>P.id===t?{...P,data:{...P.data,face:b}}:P.parentId===t?{...P,data:{...P.data,view:b}}:P));},F=b=>{switch(b){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}},B=()=>{let b=[],W=60,P=ie({data:e});for(let h=1;h<=l;h++){let T=W+(h-1)*20-4,I=Pe(h,l,P);b.push(jsx("div",{style:{position:"absolute",left:"-35px",top:`${T}px`,background:"#374151",color:"#9ca3af",padding:"2px 4px",borderRadius:"2px",fontSize:"8px",fontWeight:"bold",width:"28px",textAlign:"center",border:"1px solid #4b5563",zIndex:10,height:`${20}px`,display:"flex",alignItems:"center",justifyContent:"center",lineHeight:1},children:I},h));}return b};return jsxs("div",{className:`rack-node ${o?"selected":""}`,style:{background:"transparent",border:`2px solid ${F(d)}`,borderRadius:"8px",padding:0,width:"300px",height:`${60+l*20}px`,color:"white",fontFamily:"monospace",fontSize:"12px",boxShadow:o?"0 0 0 2px #3b82f6":"0 2px 4px rgba(0,0,0,0.1)",position:"relative",display:"flex",flexDirection:"column"},children:[jsx(Handle,{type:"target",position:Position.Top}),jsxs("div",{style:{textAlign:"center",marginBottom:0,zIndex:2,background:"#1f2937",padding:"8px",position:"relative",height:`${60}px`,display:"flex",flexDirection:"column",justifyContent:"center"},children:[jsx("div",{style:{fontWeight:"bold",marginBottom:"4px"},children:i}),jsxs("div",{style:{fontSize:"10px",color:"#9ca3af"},children:[typeof a=="number"?a:0," ports \u2022 ",l,"U \u2022 ",g]}),y&&jsx("div",{style:{fontSize:"9px",color:"#fbbf24",fontWeight:"bold",marginTop:"2px"},children:y}),jsxs("div",{style:{display:"flex",gap:"4px",position:"absolute",top:"4px",right:"4px"},children:[jsx("button",{onPointerDown:b=>{b.stopPropagation();},onMouseDown:b=>{b.stopPropagation();},onClick:b=>{b.stopPropagation(),b.preventDefault(),w(!k);},style:{background:k?"#10b981":"#374151",color:k?"#ffffff":"#9ca3af",border:"1px solid #4b5563",borderRadius:"2px",padding:"2px 6px",fontSize:"8px",cursor:"pointer",fontFamily:"monospace"},title:`${k?"Hide":"Show"} U markers`,children:"U"}),jsx("button",{onPointerDown:b=>{b.stopPropagation();},onMouseDown:b=>{b.stopPropagation();},onClick:b=>{b.stopPropagation(),b.preventDefault(),Z();},style:{background:"#374151",color:"#9ca3af",border:"1px solid #4b5563",borderRadius:"2px",padding:"2px 6px",fontSize:"8px",cursor:"pointer",fontFamily:"monospace"},title:`Switch U numbering to ${ie({data:e})==="bottom-up"?"top-down":"bottom-up"}`,children:ie({data:e})==="bottom-up"?"\u2191\u2193":"\u2193\u2191"}),jsx("button",{onPointerDown:b=>{b.stopPropagation();},onMouseDown:b=>{b.stopPropagation();},onClick:b=>{b.stopPropagation(),b.preventDefault(),j();},style:{background:"#374151",color:"#9ca3af",border:"1px solid #4b5563",borderRadius:"2px",padding:"2px 6px",fontSize:"8px",cursor:"pointer",fontFamily:"monospace"},title:`Switch to ${g==="front"?"rear":"front"} view`,children:g==="front"?"\u21C4 Rear":"\u21C4 Front"})]})]}),jsx("div",{style:{flex:1,background:"transparent",position:"relative",minHeight:`${l*20}px`,overflow:"hidden"}}),k&&jsx("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none"},children:B()})]})};var Se=({data:e,selected:o})=>{let{label:t,status:r="active"}=e,n=i=>{switch(i){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}};return jsxs("div",{className:`fiber-node ${o?"selected":""}`,style:{background:"#1f2937",border:`2px solid ${n(r)}`,borderRadius:"50%",width:"60px",height:"60px",display:"flex",alignItems:"center",justifyContent:"center",color:"white",fontFamily:"monospace",fontSize:"10px",fontWeight:"bold",boxShadow:o?"0 0 0 2px #3b82f6":"0 2px 4px rgba(0,0,0,0.1)",position:"relative"},children:[jsx(Handle,{type:"target",position:Position.Top}),jsx(Handle,{type:"source",position:Position.Bottom}),jsx(Handle,{type:"target",position:Position.Left}),jsx(Handle,{type:"source",position:Position.Right}),jsx("div",{style:{textAlign:"center"},children:jsx("div",{style:{fontSize:"8px",lineHeight:"1.2"},children:t})}),jsx("div",{style:{position:"absolute",bottom:"4px",left:"50%",transform:"translateX(-50%)",width:"8px",height:"8px",background:n(r),borderRadius:"50%"}})]})};var $e=({id:e,sourceX:o,sourceY:t,targetX:r,targetY:n,sourcePosition:i,targetPosition:a,data:d,selected:l,style:p})=>{let[g,y,A]=getBezierPath({sourceX:o,sourceY:t,sourcePosition:i,targetX:r,targetY:n,targetPosition:a}),{bandwidth:S,length:U,color:k="#10b981"}=d||{},w={stroke:k,strokeWidth:l?3:2,strokeDasharray:d?.type==="fiber"?"5,5":"none",fill:"none",...p};return jsxs(Fragment,{children:[jsx("path",{id:e,className:"react-flow__edge-path",d:g,stroke:k,strokeWidth:l?3:2,strokeDasharray:d?.type==="fiber"?"5,5":"none",fill:"none",style:w}),jsx(EdgeLabelRenderer,{children:d&&(S||U)&&jsxs("div",{style:{position:"absolute",transform:`translate(-50%, -50%) translate(${y}px,${A}px)`,background:"#1f2937",padding:"4px 8px",borderRadius:"4px",fontSize:"10px",color:"white",fontFamily:"monospace",border:`1px solid ${k}`,pointerEvents:"none"},children:[S&&jsx("div",{children:S}),U&&jsxs("div",{children:[U,"m"]})]})})]})};var Te=({id:e,sourceX:o,sourceY:t,targetX:r,targetY:n,sourcePosition:i,targetPosition:a,style:d={},data:l,markerEnd:p})=>{let [g,y,A]=getBezierPath({sourceX:o,sourceY:t,sourcePosition:i,targetX:r,targetY:n,targetPosition:a}),S=l?.connectorType||"C13";l?.voltage||"AC";l?.amperage||(S==="C19"?"16A":"10A");return jsx(BaseEdge,{id:e,path:g,markerEnd:p,style:(()=>{let Z={stroke:l?.color||"#f59e0b",strokeWidth:S==="C19"?5:3,strokeLinecap:"round",strokeLinejoin:"round",...d};return S==="C19"?{...Z,strokeDasharray:"none"}:{...Z,strokeDasharray:"6,3"}})()})};var Xe=(t=>(t.FULL="full",t.HALF="half",t))(Xe||{});var Ue={C13:{type:"C13",color:"#f59e0b",borderColor:"#d97706",amperage:10,voltage:230,phases:1},C14:{type:"C14",color:"#f59e0b",borderColor:"#d97706",amperage:10,voltage:230,phases:1},C19:{type:"C19",color:"#fbbf24",borderColor:"#d97706",amperage:16,voltage:230,phases:1},C20:{type:"C20",color:"#fbbf24",borderColor:"#d97706",amperage:16,voltage:230,phases:1}};function pe(e){let o=Ue[e];if(!o)throw new Error(`Unknown connector type: ${e}`);let t=o.amperage===16;o.amperage===10;let n=t?12:8,i=t?10:5,a=t?{borderRadius:"3px"}:{clipPath:"polygon(2px 0, calc(100% - 2px) 0, 100% 2px, 100% 100%, 0 100%, 0 2px)",borderRadius:"0px"};return {width:n,height:i,color:o.color,borderColor:o.borderColor,fontSize:t?"3px":"4px",...a}}function xe(e){let o=Ue[e];if(!o)throw new Error(`Unknown connector type: ${e}`);return o}function xt(e){return xe(e).amperage===16}function Ie(e){return e%10<8?"C13":"C19"}function ye(e){let o=e.toLowerCase();return o.includes("mx304")||o.includes("mx480")||o.includes("mx960")?"C20":"C14"}var Fe=({data:e,selected:o})=>{let{label:t,status:r="active",deviceType:n="server",manufacturer:i,role:a,uHeight:d=1,uPosition:l=1,width:p="full",ports:g=[],rearPorts:y=[],view:A,powerSide:S="left"}=e,U=A||(y.length>0&&g.length===0?"rear":"front"),k={};k["net-top"]="front",k["net-bottom"]="front",g.length>0&&g.forEach(h=>{h.ports.forEach(T=>{let I=T.type?.includes("power")?T.label:`${h.name}-${T.label}`;k[I]="front";});}),k["pwr-left-1"]="rear",k["pwr-left-2"]="rear",k["net-right-1"]="rear",k["net-right-2"]="rear",y.length>0&&y.forEach(h=>{h.ports.forEach(T=>{let I=T.type?.includes("power")?T.label:`${h.name}-${T.label}`;k[I]="rear";});});let w=d*20,Z=p==="half"?"150px":"304px",j=p==="half"?"150px":void 0,F=h=>{switch(h){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}},b=(h,T)=>{let I=[];if(h.length===0)return I;let L=Math.max(4,Math.floor(w*.4)),V=Math.max(2,Math.floor(w*.2));return h.forEach((f,C)=>{f.ports.forEach((v,H)=>{let O=!!v.type&&v.type.includes("power");if(T==="front"&&O)return;let z=O?`${v.label}`:`${f.name}-${v.label}`,q=v.connected,M="#6b7280";if(q)if(v.type?.includes("power"))M=v.type==="power_c19"?"#fbbf24":"#f59e0b";else if(v.type==="console"||v.type==="mgmt")M="#8b5cf6";else if(v.type==="usb")M="#10b981";else switch(v.cableType){case "smf":M="#fbbf24";break;case "cat6":M="#8b5cf6";break;case "om3":M="#06b6d4";break;case "om4":M="#8b5cf6";break;case "om5":M="#84cc16";break;case "cat5e":M="#3b82f6";break;case "cat6a":M="#ef4444";break;case "cat7":M="#f97316";break;case "fiber":M="#3b82f6";break;case "ethernet":M="#10b981";break;default:M="#10b981";}let ne=Position.Top,D={width:`${L}px`,height:`${V}px`,background:q?M:"#6b7280",border:`1px solid ${q?M:"#374151"}`,borderRadius:"1px",cursor:"pointer"};if(T==="front")H%2===0?(ne=Position.Top,D.transform="translateY(50%)",D.left=`${H/2*(L+2)}px`):(ne=Position.Bottom,D.transform="translateY(-50%)",D.left=`${(H-1)/2*(L+2)}px`);else if(v.type?.includes("power")){ne=Position.Left,D.transform="translateX(50%)";let we=w<=20?10:20,s=w<=20?30:50;D.top=`${we+H*s}%`;let m=ye(t),c=pe(m);D={...D,width:`${c.width}px`,height:`${c.height}px`,zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:c.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:c.borderRadius,clipPath:c.clipPath};}else ne=Position.Right,D.transform="translateX(50%)",D.top=`${25+H*50}%`;let fe=O?"target":q?"source":"target";I.push(jsx(Handle,{id:z,type:fe,position:ne,style:D,title:`${f.name} - ${v.label} ${q?"(connected)":"(disconnected)"}`,children:O?H+1:void 0},z));});}),I},W=()=>{let h=[],I=Math.max(4,Math.floor(w*.4)),L=Math.max(2,Math.floor(w*.2));if(U==="front"){if(g.length>0)return b(g,"front");if(n==="switch"&&(t.toLowerCase().includes("agg")||t.toLowerCase().includes("core")||a==="agg"||a==="core"))return P();h.push(jsx(Handle,{id:"net-top",type:"target",position:Position.Top,style:{width:`${I}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateY(50%)"},title:"Network Port (Top)"},"net-top")),h.push(jsx(Handle,{id:"net-bottom",type:"target",position:Position.Bottom,style:{width:`${I}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateY(-50%)"},title:"Network Port (Bottom)"},"net-bottom"));}else if(U==="rear"){if(y.length>0)return b(y,"rear");let V=n==="switch",f=n==="patch-panel";if(!f){let C=ye(t),v=xe(C),H=pe(C),O=w<=20?"10%":"25%";h.push(jsx(Handle,{id:"pwr-left-1",type:"target",position:Position.Left,style:{width:`${H.width}px`,height:`${H.height}px`,background:H.color,border:`1px solid ${H.borderColor}`,cursor:"pointer",transform:"translateX(50%)",top:O,zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:H.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:H.borderRadius,clipPath:H.clipPath},title:`Power Port 1 (${v.type}) - ${v.voltage}V, ${v.amperage}A`,children:"1"},"pwr-1"));let z=w<=20?"50%":"75%";h.push(jsx(Handle,{id:"pwr-left-2",type:"target",position:Position.Left,style:{width:`${H.width}px`,height:`${H.height}px`,background:H.color,border:`1px solid ${H.borderColor}`,cursor:"pointer",transform:"translateX(50%)",top:z,zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:H.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:H.borderRadius,clipPath:H.clipPath},title:`Power Port 2 (${v.type}) - ${v.voltage}V, ${v.amperage}A`,children:"2"},"pwr-2"));}!V&&!f&&(h.push(jsx(Handle,{id:"net-right-1",type:"target",position:Position.Right,style:{width:`${I}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateX(50%)",top:"25%"},title:"Network Port 1 (Right)"},"net-right-1")),h.push(jsx(Handle,{id:"net-right-2",type:"target",position:Position.Right,style:{width:`${I}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateX(50%)",top:"75%"},title:"Network Port 2 (Right)"},"net-right-2")));}return h},P=()=>{let h=[],I=Math.max(10,Math.floor(w*.45)),L=Math.max(5,Math.floor(w*.25));for(let f=1;f<=16;f++){let C=jsx(Handle,{id:`port-${f}`,type:"source",position:Position.Top,style:{width:`${I}px`,height:`${L}px`,background:"#10b981",border:"1px solid #059669",borderRadius:"2px",cursor:"pointer",transform:"translateY(50%)",zIndex:1e3,left:`${(f-1)*(I+2)}px`},title:`Port ${f}`},`port-${f}`);h.push(C);}for(let f=17;f<=32;f++){let C=f-16,v=jsx(Handle,{id:`port-${f}`,type:"source",position:Position.Bottom,style:{width:`${I}px`,height:`${L}px`,background:"#10b981",border:"1px solid #059669",borderRadius:"2px",cursor:"pointer",transform:"translateY(-50%)",zIndex:1e3,left:`${(C-1)*(I+2)}px`},title:`Port ${f}`},`port-${f}`);h.push(v);}for(let f=1;f<=4;f++){let C=Math.max(4,Math.floor(w*.3)),v=Math.max(3,Math.floor(w*.15));h.push(jsx(Handle,{id:`uplink-${f}`,type:"source",position:Position.Right,style:{width:`${C}px`,height:`${v}px`,background:"#8b5cf6",border:"0.5px solid #7c3aed",borderRadius:"0.5px",cursor:"pointer",transform:"translateX(-50%)"},title:`Uplink ${f}`},`uplink-${f}`));}return h};return jsxs("div",{className:`device-node ${o?"selected":""}`,style:{background:"#1f2937",border:`1px solid ${F(r)}`,borderRadius:"2px",padding:"0px",width:Z,...j&&{left:j},height:`${w}px`,color:"white",fontFamily:"monospace",fontSize:"8px",boxShadow:o?"0 0 0 1px #3b82f6":"0 1px 2px rgba(0,0,0,0.1)",position:"relative",display:"flex",flexDirection:"column",justifyContent:"center",cursor:"grab",marginBottom:"0px",boxSizing:"border-box",marginTop:"0px",marginLeft:"0px",marginRight:"0px"},children:[jsxs("div",{style:{textAlign:"center",flex:1,display:"flex",flexDirection:"column",justifyContent:"center",overflow:"hidden",padding:"2px"},children:[jsx("div",{style:{fontWeight:"bold",fontSize:"7px",lineHeight:"1.1",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:t}),d>1&&jsx("div",{style:{fontSize:"6px",color:"#9ca3af",lineHeight:"1"},children:i})]}),d>1&&jsxs("div",{style:{position:"absolute",bottom:"1px",right:"1px",background:"#374151",color:"#9ca3af",padding:"1px 2px",borderRadius:"1px",fontSize:"6px",lineHeight:"1"},children:[d,"U"]}),jsx("div",{style:{position:"absolute",bottom:"1px",left:"1px",width:"4px",height:"4px",background:F(r),borderRadius:"50%"}}),W()]})};var Me=({data:e,selected:o,id:t})=>{let{label:r,status:n="active",heightCm:i=100,powerPorts:a=36,portTypes:d=[],widthPx:l=15,mgmt_unit:p}=e,g=U=>{switch(U){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}},y=i*4.2,A=()=>{let k=Math.ceil(a/10),w=Array(10).fill(0).map((f,C)=>C<8?"10A":"16A");for(let f=0,C=0;f<k;++f)for(let v=0;v<10&&C<a;++v,++C){w[v];}let h=[],T=15,V=(y-T-3)/(a-9)*.5;for(let f=0;f<a;f++){let C=T-2+V*f,v=`${f+1}`;if(p&&(p==="top"&&f===0||p==="middle"&&f===Math.floor(a/2)||p==="bottom"&&f===a-1)){h.push(S(C));continue}let O=Ie(f),z=pe(O),q=Math.round((l-z.width)/2-1);h.push(jsx(Handle,{type:"source",position:Position.Right,id:v,style:{position:"absolute",left:`${q}px`,top:`${C-z.height/2}px`,width:`${z.width}px`,height:`${z.height}px`,background:z.color,border:`1px solid ${z.borderColor}`,cursor:"pointer",zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:z.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:z.borderRadius,clipPath:z.clipPath},title:`Power Port ${f+1} (${O})`,children:f+1},`handle-${v}`));}return h},S=U=>jsxs("div",{style:{position:"absolute",left:`${(l-16)/2}px`,top:`${U-12/2}px`,width:"16px",height:"12px",background:"#1a1a1a",border:"1px solid #374151",borderRadius:"1px",display:"flex",flexDirection:"column",padding:"1px",zIndex:10},children:[jsx("div",{style:{position:"absolute",left:"-10px",top:"1px",background:"#ffffff",border:"0.5px solid #6b7280",borderRadius:"0.5px",width:"8px",height:"10px",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"3px",color:"#10b981",fontFamily:"monospace",fontWeight:"bold",transform:"rotate(90deg)",transformOrigin:"center"},children:"APC"}),jsx(Handle,{type:"source",position:Position.Right,id:"mgmt-net-1",style:{width:"70%",height:"6px",background:"#10b981",border:"1px solid #059669",borderRadius:"1px",cursor:"pointer",zIndex:11,margin:"0 auto"},title:"Management Network Port"},"mgmt-net-1")]},"mgmt-unit");return jsxs("div",{className:`vertical-pdu-node ${o?"selected":""}`,style:{background:"linear-gradient(90deg, #2d3748 0%, #1a202c 50%, #2d3748 100%)",border:`1px solid ${g(n)}`,borderRadius:"2px",padding:0,width:`${l}px`,height:`${y}px`,color:"white",fontFamily:"monospace",fontSize:"12px",boxShadow:o?"0 0 0 2px #3b82f6":"0 1px 3px rgba(0,0,0,0.3)",position:"relative",display:"flex",flexDirection:"column"},children:[jsx("div",{style:{textAlign:"center",marginBottom:0,zIndex:2,background:"linear-gradient(90deg, #4a5568 0%, #2d3748 50%, #4a5568 100%)",padding:"2px",position:"relative",height:"20px",display:"flex",flexDirection:"column",justifyContent:"center",borderBottom:"1px solid #4a5568"},children:jsx("div",{style:{fontWeight:"bold",fontSize:"6px",color:"#e2e8f0"},children:r})}),jsx("div",{style:{flex:1,background:"linear-gradient(180deg, #2d3748 0%, #1a202c 50%, #2d3748 100%)",position:"relative",minHeight:`${y-20}px`,overflow:"hidden"},children:A()})]})};function Nt(e,o){if(!e.source||!e.target||!e.sourceHandle||!e.targetHandle)return {valid:true};let t=o.edges.some(n=>n.source===e.source&&n.sourceHandle===e.sourceHandle),r=o.edges.some(n=>n.target===e.target&&n.targetHandle===e.targetHandle);return t?{valid:false,reason:"Source port is already connected"}:r?{valid:false,reason:"Target port is already connected"}:{valid:true}}function kt(e,o){if(!o)return;let t=o.data||{};if(t.handleSideMap&&t.handleSideMap[e])return t.handleSideMap[e];if(e==="net-top"||e==="net-bottom")return "front";if(e==="pwr-left-1"||e==="pwr-left-2"||e==="net-right-1"||e==="net-right-2")return "rear";let r=Array.isArray(t.ports)?t.ports:[],n=Array.isArray(t.rearPorts)?t.rearPorts:[];if(e.startsWith("pwr")||e.includes("power"))return "rear";if(r.length>0){for(let a of r)for(let d of a.ports||[])if((d.type&&String(d.type).includes("power")?d.label:`${a.name}-${d.label}`)===e)return "front"}if(n.length>0){for(let a of n)for(let d of a.ports||[])if((d.type&&String(d.type).includes("power")?d.label:`${a.name}-${d.label}`)===e)return "rear"}}function Be(e={},o={}){let t={nodes:e.nodes??[],edges:e.edges??[],debug:e.debug??false},r=new Set;return {getState:()=>t,setState:p=>{t={...t,...p},r.forEach(g=>g(t));},subscribe:p=>(r.add(p),()=>r.delete(p)),selectEdgeZIndex:p=>{let g=t.nodes.find(w=>w.id===p.target);if(!g||g.type!=="device")return 1e3;let y=g.data?.view||"front",A=kt(p.targetHandle||"",g);if(A)return y===A?1e3:500;let S=p.targetHandle||"",U=S.startsWith("pwr")||S.startsWith("power"),k=S.startsWith("net-")||S.startsWith("port-")||S.startsWith("uplink-")||S.includes("Fiber")||S.includes("Ports");return U?y==="rear"?1e3:500:k?y==="front"?1e3:500:1e3},validateConnection:p=>(o.validateConnection||Nt)(p,t)}}function vt(e){let o=n=>e.subscribe(n),t=()=>e.getState();return useSyncExternalStore(o,t,t)}function _e(e){let o=r=>e.subscribe(r),t=()=>e.getState().nodes;return useSyncExternalStore(o,t,t)}function We(e){let o=r=>e.subscribe(r),t=()=>e.getState().edges;return useSyncExternalStore(o,t,t)}function qe(e){return e.selectEdgeZIndex}var It=(e,o)=>({rack:t=>jsx(Re,{...t,onViewChange:e,onRackFaceChange:o}),fiber:Se,device:Fe,"vertical-pdu":Me}),At={fiber:$e,power:Te},Ft=({nodes:e,edges:o,initialNodes:t,initialEdges:r,onNodesChange:n,onEdgesChange:i,store:a,debug:d,onNodeClick:l,onEdgeClick:p,onViewChange:g,onRackFaceChange:y,className:A,style:S,alignRacksToBottom:U})=>{let k=Array.isArray(e)&&Array.isArray(o),w=Pt.useMemo(()=>a||Be({nodes:k?e:t||e||[],edges:k?o:r||o||[],debug:d}),[a,k,e,o,t,r,d]),Z=_e(w),j=We(w),[F,B,b]=useNodesState(Z),[W,P,h]=useEdgesState(j),T=qe(w),I=useMemo(()=>It(g,y),[g,y]),L=useMemo(()=>At,[]),V=useRef(F);useEffect(()=>{V.current=F;},[F]);let f=useRef(W);useEffect(()=>{f.current=W;},[W]),useEffect(()=>{B(Z);},[Z,B]),useEffect(()=>{P(j);},[j,P]),useEffect(()=>{k&&w.setState({nodes:e||[]});},[k,e,w]),useEffect(()=>{k&&w.setState({edges:o||[]});},[k,o,w]),useEffect(()=>{if(!U||!F||F.length===0)return;let s=F.filter(x=>x.type==="rack");if(s.length===0)return;let m=s.map(x=>{let _=x.data&&x.data.uHeight||42,Y=60+_*20;return (x.position?.y||0)+Y}),c=Math.min(...m),u=Math.max(...m);if(u-c<20)return;let N=u,$=F.map(x=>{if(x.type!=="rack")return x;let _=x.data&&x.data.uHeight||42,Y=60+_*20,oe=(x.position?.y||0)+Y,se=N-oe;return Math.abs(se)<5?x:{...x,position:{x:x.position?.x||0,y:(x.position?.y||0)+se}}});$.some((x,_)=>x.position!==F[_].position)&&B($);},[U,F,B]);let C=useCallback(s=>V.current.find(m=>m.id===s),[]);useCallback((s,m)=>{let c=C(s);if(!c||c.type!=="device")return 1e3;let u=c.data?.view||"front",N=(c.data?.handleSideMap||{})[m],$;if(N)$=u===N?1e3:500;else {let E=m.startsWith("pwr-left")||m.startsWith("power"),x=m.startsWith("net-")||m.startsWith("port-")||m.startsWith("uplink-")||m.includes("Fiber")||m.includes("Ports");E?$=u==="rear"?1e3:500:x?$=u==="front"?1e3:500:$=1e3;}return $},[C]);useEffect(()=>{P(s=>s.map(m=>{let c=T(m);return {...m,zIndex:c,style:{...m.style,zIndex:c}}}));},[F,P,T]),useEffect(()=>{let s=F.map(c=>{if(c.type==="device"&&c.parentId&&c.data.uPosition&&(!c.position||c.position.x===0&&c.position.y===0)){let u=C(c.parentId);if(u){let R=de(u,c.data.uPosition);return {...c,position:R}}}return c});s.some((c,u)=>c.position!==F[u].position)&&B(s);},[F,B,C]);let H=useCallback(s=>{let m=s.map(c=>{if(c.type==="position"&&c.position){let u=C(c.id);if(u&&u.type==="device"&&u.parentId){let R=C(u.parentId);if(R){let N=De(u,R,c.position,V.current);if(N.uPosition!==void 0){let $={...u,data:{...u.data,uPosition:N.uPosition}};B(E=>E.map(x=>x.id===u.id?$:x));}return {...c,position:{x:N.x,y:N.y}}}}if(u&&u.type==="device"&&!u.parentId){let R=V.current.filter(E=>E.type==="rack"),N=null,$=1/0;for(let E of R){let x=E,_=Math.sqrt(Math.pow(c.position.x-x.position.x,2)+Math.pow(c.position.y-x.position.y,2)),Y=300,oe=(x.data.uHeight||42)*20,se=x.position.x,Ne=x.position.x+Y,ke=x.position.y,ve=x.position.y+oe;c.position.x>=se&&c.position.x<=Ne&&c.position.y>=ke&&c.position.y<=ve&&_<$&&($=_,N=x);}if(N){let E={...u,parentId:N.id,extent:"parent",data:{...u.data,uPosition:1}};B(Y=>Y.map(oe=>oe.id===u.id?E:oe));let x=c.position.x-N.position.x,_=c.position.y-N.position.y;return {...c,position:{x,y:_}}}}if(u&&u.type==="device"&&u.parentId){let R=C(u.parentId);if(R){let N=R,$=300,E=(N.data.uHeight||42)*20,x=N.position.x,_=N.position.x+$,Y=N.position.y,oe=N.position.y+E;if(c.position.x<x||c.position.x>_||c.position.y<Y||c.position.y>oe){let se=c.position.x+N.position.x,Ne=c.position.y+N.position.y,ke={...u,parentId:void 0,extent:void 0,data:{...u.data,uPosition:void 0}};return B(ve=>ve.map(Oe=>Oe.id===u.id?ke:Oe)),{...c,position:{x:se,y:Ne}}}}}}return c});b(m);},[b,B,C]);useCallback(s=>{if(!s.source||!s.target||!s.sourceHandle||!s.targetHandle)return {valid:true};let m=s.sourceHandle,c=s.targetHandle,u=f.current.some(N=>N.source===s.source&&N.sourceHandle===m),R=f.current.some(N=>N.target===s.target&&N.targetHandle===c);return u?{valid:false,reason:"Source port is already connected"}:R?{valid:false,reason:"Target port is already connected"}:{valid:true}},[]);let z=useCallback(s=>{let c=C(s.source)?.type==="vertical-pdu",u=!!s.targetHandle&&(s.targetHandle.startsWith("pwr")||s.targetHandle.startsWith("power"));if(c&&u&&s.target&&s.targetHandle){let $=f.current.find(E=>E.target===s.target&&E.targetHandle===s.targetHandle);if($){let E={...s,type:"power",zIndex:T({...s,id:"temp-id"})};P(x=>{let _=x.filter(Y=>Y.id!==$.id);return addEdge(E,_)});return}}let R=w.validateConnection({source:s.source??null,target:s.target??null,sourceHandle:s.sourceHandle??null,targetHandle:s.targetHandle??null});if(!R.valid){if(c&&s.source&&s.sourceHandle){let $=f.current.find(E=>E.source===s.source&&E.sourceHandle===s.sourceHandle);if($){let E={...s,type:u?"power":"fiber",zIndex:T({...s,id:"temp-id"})};P(x=>{let _=x.filter(Y=>Y.id!==$.id);return addEdge(E,_)});return}}console.warn(`Connection rejected: ${R.reason}`);return}let N={...s,type:c&&u?"power":"fiber",zIndex:T({...s,id:"temp-id"})};P($=>addEdge(N,$));},[P,w,T,C]),q=useCallback((s,m)=>{if((s.metaKey||s.ctrlKey)&&m.type==="device"){let u=m.data||{},R=u.view||(Array.isArray(u.rearPorts)&&u.rearPorts.length>0?"rear":"front"),N=R==="front"?"rear":"front";console.log(`Command+click: Toggling device ${m.id} from ${R} to ${N}`),g&&g(m.id,N),l&&l(m);}else m.type!=="device"&&l&&l(m);},[g,l]),M=useCallback(()=>{},[]),ne=useCallback((s,m)=>{p&&p(m);},[p]),[D,fe]=useState(null);useOnSelectionChange({onChange:({nodes:s})=>{s&&s.length===1?fe(s[0]):fe(null);}});let we=useCallback(()=>{if(!D)return;let s=C(D.id);if(s){if(s.type==="rack"){let c=(s.data&&s.data.face||"front")==="front"?"rear":"front";y?y(s.id,c):B(u=>u.map(R=>R.id===s.id?{...R,data:{...R.data,face:c}}:R.parentId===s.id?{...R,data:{...R.data,view:c}}:R));return}if(s.type==="device"){let m=s.data||{},c=Array.isArray(m.rearPorts)&&m.rearPorts.length>0,u=Array.isArray(m.ports)&&m.ports.length>0,N=(m.view||(c&&!u?"rear":"front"))==="front"?"rear":"front";g?g(s.id,N):B($=>$.map(E=>E.id===s.id?{...E,data:{...E.data,view:N}}:E));}}},[D,C,y,g,B]);return jsxs("div",{className:A,style:{width:"100%",height:"100%",...S},children:[jsxs(ReactFlow,{nodes:F,edges:W,onNodesChange:s=>{H(s);s.reduce((c,u)=>(u.type==="add"||u.type==="remove",c),null);k?n&&n(V.current):w.setState({nodes:V.current});},onEdgesChange:s=>{h(s),k?i&&i(f.current):w.setState({edges:f.current});},onConnect:z,onNodeClick:q,onNodeDoubleClick:M,onEdgeClick:ne,nodeTypes:I,edgeTypes:L,defaultEdgeOptions:{zIndex:1e3,reconnectable:true},fitView:true,attributionPosition:"bottom-left",children:[jsx(Background,{}),jsx(Controls,{}),jsx(MiniMap,{})]}),D&&(D.type==="rack"||D.type==="device")&&jsx("div",{style:{position:"absolute",top:12,right:12,display:"flex",gap:8,zIndex:2e3},children:jsx("button",{onClick:s=>{s.preventDefault(),we();},style:{background:"#374151",color:"#e5e7eb",border:"1px solid #4b5563",borderRadius:4,padding:"6px 10px",fontSize:11,fontFamily:"monospace",cursor:"pointer"},title:D.type==="rack"?(D.data?.face||"front")==="front"?"Switch to rear":"Switch to front":(D.data?.view||(Array.isArray(D.data?.rearPorts)&&D.data.rearPorts.length>0&&!(Array.isArray(D.data?.ports)&&D.data.ports.length>0)?"rear":"front"))==="front"?"Switch to rear":"Switch to front",children:D.type==="rack"?(D.data?.face||"front")==="front"?"\u21C4 Rear":"\u21C4 Front":(D.data?.view||(Array.isArray(D.data?.rearPorts)&&D.data.rearPorts.length>0&&!(Array.isArray(D.data?.ports)&&D.data.ports.length>0)?"rear":"front"))==="front"?"\u21C4 Rear":"\u21C4 Front"})})]})},Mt=e=>jsx(ReactFlowProvider,{children:jsx(Ft,{...e})});var tt=e=>({id:`rack-${e.id}`,type:"rack",position:{x:0,y:0},data:{label:e.name,status:e.status.value,uHeight:e.u_height,netboxId:e.id,netboxType:"rack",facilityId:e.facility_id,serial:e.serial,assetTag:e.asset_tag,site:e.site.name,role:e.role?.name,tenant:e.tenant?.name}}),ot=e=>({id:`device-${e.id}`,type:"device",position:{x:0,y:0},parentId:e.rack?`rack-${e.rack.id}`:void 0,extent:e.rack?"parent":void 0,data:{label:e.name,status:e.status.value,deviceType:e.device_type.model,manufacturer:e.device_type.manufacturer.name,role:e.device_role.name,uHeight:1,uPosition:e.position||1,face:e.face||"front",netboxId:e.id,netboxType:"device",primaryIp4:e.primary_ip4?.address,primaryIp6:e.primary_ip6?.address,site:e.site.name,rack:e.rack?.name}}),rt=e=>({id:`cable-${e.id}`,source:`device-${e.termination_a.device.name}`,target:`device-${e.termination_b.device.name}`,type:"fiber",data:{bandwidth:e.type.label,length:e.length||0,color:e.color,netboxId:e.id,netboxType:"cable",status:e.status.value,terminationA:e.termination_a.name,terminationB:e.termination_b.name}}),Bt=e=>{let o=[],t=[];return e.racks.forEach(r=>{o.push(tt(r));}),e.devices.forEach(r=>{o.push(ot(r));}),e.cables.forEach(r=>{t.push(rt(r));}),{nodes:o,edges:t}},zt=(e,o)=>{let t=new Map,r=new Set;return e.filter(i=>i.position!==null).sort((i,a)=>(i.position||0)-(a.position||0)).forEach(i=>{i.position&&(t.set(i.id,i.position),r.add(i.position));}),t},_t=e=>{let o=e.filter(n=>n.type==="rack"),t=e.filter(n=>n.type==="device"),r=e.filter(n=>!["rack","device"].includes(n.type));return o.forEach((n,i)=>{n.position={x:i*300,y:100};}),t.forEach(n=>{if(n.parentId){let i=o.find(a=>a.id===n.parentId);if(i){let a=n.data.uPosition||1,d=n.data.uHeight||1;n.position={x:i.position.x+50,y:i.position.y+a*20-d*10};}}else n.position={x:Math.random()*400+100,y:Math.random()*200+50};}),r.forEach((n,i)=>{n.position={x:i*150+100,y:300};}),e};var ue=class extends Error{constructor(t,r,n,i,a){super(`Device placement conflict: ${r} at U${n}-${n+i-1} in rack ${t}${a?` conflicts with ${a}`:""}`);this.rackId=t;this.deviceId=r;this.uPosition=n;this.uHeight=i;this.conflictWith=a;this.name="DevicePlacementError";}};function Ve(e,o={}){let{conflictPolicy:t="strict"}=o,r=[],n=[];for(let i of e.devices)i.unit+i.height-1>e.units&&n.push({deviceId:i.id,uPosition:i.unit,uHeight:i.height,rackUHeight:e.units});for(let i=0;i<e.devices.length;i++){let a=e.devices[i],d=a.unit,l=a.unit+a.height-1;for(let p=i+1;p<e.devices.length;p++){let g=e.devices[p],y=g.unit,A=g.unit+g.height-1;d<=A&&l>=y&&r.push({deviceId:a.id,uPosition:a.unit,uHeight:a.height,conflictWith:g.id});}}return {isValid:r.length===0&&n.length===0,conflicts:r,outOfBounds:n}}function nt(e,o,t={}){let{deviceTypeMapping:r={}}=t,n=r[e.type]||"device",i=de(o,e.unit);return {id:e.id,type:n,position:i,parentId:o.id,extent:"parent",data:{label:e.name,status:"active",deviceType:e.type,uHeight:e.height,uPosition:e.unit,width:e.width||"full",role:e.role,ports:e.ports,rearPorts:e.rearPorts,connections:e.connections}}}function Wt(e){return {id:e.id,type:"rack",position:e.position,data:{label:e.name,status:"active",uHeight:e.units,uNumberingDirection:e.uNumberingDirection||"bottom-up",customHeaderText:e.customHeaderText,ports:[]}}}function Lt(e,o={}){let{conflictPolicy:t="strict",validatePlacements:r=true}=o,n=[],i=[];if(r)for(let a of e){let d=Ve(a,o);if(!d.isValid&&t==="strict"){let l=[];throw d.conflicts.forEach(p=>{l.push(`Device ${p.deviceId} at U${p.uPosition}-${p.uPosition+p.uHeight-1} conflicts with ${p.conflictWith}`);}),d.outOfBounds.forEach(p=>{l.push(`Device ${p.deviceId} at U${p.uPosition}-${p.uPosition+p.uHeight-1} exceeds rack height (${p.rackUHeight}U)`);}),new ue(a.id,d.conflicts[0]?.deviceId||d.outOfBounds[0]?.deviceId||"unknown",d.conflicts[0]?.uPosition||d.outOfBounds[0]?.uPosition||1,d.conflicts[0]?.uHeight||d.outOfBounds[0]?.uHeight||1)}}for(let a of e){let d=Wt(a);n.push(d);for(let l of a.devices)try{let p=nt(l,d,o);i.push(p);}catch(p){if(t==="strict")throw p;if(t==="nearest"){let g=ge(d,{id:l.id,data:{label:l.name,uHeight:l.height}},i,l.unit);if(g!==l.unit){console.warn(`Device ${l.id} moved from U${l.unit} to U${g} due to conflict`);let y={...l,unit:g},A=nt(y,d,o);i.push(A);}else throw new ue(a.id,l.id,l.unit,l.height)}}}return n.push(...i),n}function Vt(e){let o=[],t=e.filter(r=>r.type==="rack");for(let r of t){let i=e.filter(a=>a.type==="device"&&a.parentId===r.id).map(a=>({id:a.id,name:a.data.label,unit:a.data.uPosition||1,height:a.data.uHeight||1,type:a.data.deviceType||"server",width:a.data.width,ports:a.data.ports,connections:a.data.connections}));o.push({id:r.id,name:r.data.label,position:r.position,units:r.data.uHeight||42,uNumberingDirection:r.data.uNumberingDirection||"bottom-up",customHeaderText:r.data.customHeaderText,devices:i});}return o}function Ot(e,o,t,r){return e.map(n=>n.id!==o?n:{...n,devices:n.devices.map(i=>i.id!==t?i:{...i,unit:r})})}function Gt(e,o,t,r={}){let{conflictPolicy:n="strict"}=r;return e.map(i=>{if(i.id!==o)return i;if(n==="strict"&&!Ve({...i,devices:[...i.devices,t]},r).isValid)throw new ue(o,t.id,t.unit,t.height);return {...i,devices:[...i.devices,t]}})}function Yt(e,o,t){return e.map(r=>r.id!==o?r:{...r,devices:r.devices.filter(n=>n.id!==t)})}export{Fe as DeviceNode,ue as DevicePlacementError,$e as FiberEdge,Se as FiberNode,Mt as NetworkDiagram,Ue as POWER_CONNECTORS,Te as PowerEdge,Re as RackNode,Me as VerticalPDU,Xe as Width,Gt as addDeviceToRack,Lt as buildNodesFromRackConfig,de as calculateDevicePositionFromU,zt as calculateUPositions,Be as createNetworkDiagramStore,Vt as createRackConfigFromNodes,ge as findNextAvailableUPosition,_t as generateLayout,xe as getConnectorConfig,ye as getDeviceConnectorType,Ie as getPDUPortType,pe as getPowerPortStyle,xt as isHighPowerConnector,Ce as isUPositionAvailable,rt as netboxCableToNetworkEdge,ot as netboxDeviceToNetworkNode,tt as netboxRackToNetworkNode,Bt as netboxToNetworkDiagram,Yt as removeDeviceFromRack,De as snapToUPosition,Ye as updateDeviceUPosition,Ot as updateDeviceUPositionInSchema,We as useDiagramEdges,_e as useDiagramNodes,vt as useNetworkDiagram,at as validateAndSnapDevice,Ve as validateRackDevicePlacements};//# sourceMappingURL=index.mjs.map
|
|
1
|
+
import Pt,{useState,useSyncExternalStore,useMemo,useRef,useEffect,useCallback}from'react';import {useReactFlow,Handle,Position,getBezierPath,EdgeLabelRenderer,BaseEdge,ReactFlowProvider,useNodesState,useEdgesState,addEdge,useOnSelectionChange,ReactFlow,Background,Controls,MiniMap}from'reactflow';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var it=()=>"bottom-up",ie=e=>e.data.uNumberingDirection||it(),me=(e,o,t)=>t==="bottom-up"?o-e+1:e,he=(e,o,t)=>t==="bottom-up"?o-e+1:e;var Ce=(e,o,t,n)=>{if(!e.parentId||e.parentId!==o.id)return t;let r=e.data.uHeight||1,i=o.data.uHeight||42,a=ie(o),d=60,l=t.y-d,p=Math.round(l/20)+1,f;a==="bottom-up"?f=me(p,i,a)-r+1:f=me(p,i,a);let k=i-r+1,H=Math.max(1,Math.min(k,f));if(a==="top-down"&&f<=1&&(H=1),!Re(o,e,H,n)){let S=be(o,e,n,H);S!==H&&(H=S);}let R;if(a==="bottom-up"){let S=H+r-1,N=he(S,i,a);R=d+(N-1)*20-1;}else {let S=he(H,i,a);R=d+(S-1)*20-1;}return {x:t.x,y:R,uPosition:H}},Re=(e,o,t,n)=>{let r=o.data.uHeight||1,i=e.data.uHeight||42;if(t<1||t+r-1>i)return false;let a=n.filter(d=>d.type==="device"&&d.parentId===e.id&&d.id!==o.id);for(let d of a){let l=d.data.uPosition||1,p=d.data.uHeight||1,f=t,k=t+r-1,H=l,R=l+p-1;if(f<=R&&k>=H)return false}return true},be=(e,o,t,n=1)=>{let r=o.data.uHeight||1,i=e.data.uHeight||42;for(let a=n;a<=i-r+1;a++)if(Re(e,o,a,t))return a;return 1},de=(e,o,t=1)=>{let n=60,r=ie(e),i=e.data.uHeight||42,a=he(o,i,r),d;if(r==="bottom-up"){let l=o+t-1,p=he(l,i,r);d=n+(p-1)*20-1;}else d=n+(a-1)*20-1;return {x:0,y:d}},Ye=(e,o,t)=>{let n=e.data.uHeight||1,r=de(o,t,n);return {...e,position:r,data:{...e.data,uPosition:t}}},at=(e,o)=>{let t=e.data.uPosition||1,n=e.data.uHeight||1,r=o.data.uHeight||42,i=Math.max(1,Math.min(r-n+1,t));return i!==t?Ye(e,o,i):e};var Se=({data:e,selected:o,id:t,onViewChange:n,onRackFaceChange:r})=>{let{label:i,ports:a=0,status:d="active",uHeight:l=42,uPosition:p=1,face:f="front",customHeaderText:k}=e,{getNodes:H,setNodes:R}=useReactFlow(),S=H(),[N,y]=useState(true),Z=()=>{let W=ie({data:e})==="bottom-up"?"top-down":"bottom-up";R(P=>P.map(h=>h.id===t?{...h,data:{...h.data,uNumberingDirection:W}}:h));},K=()=>{let b=f==="front"?"rear":"front";r?(r(t,b),n&&S.filter(P=>P.parentId===t).forEach(P=>{n(P.id,b);})):n?S.filter(P=>P.parentId===t).forEach(P=>{n(P.id,b);}):R(W=>W.map(P=>P.id===t?{...P,data:{...P.data,face:b}}:P.parentId===t?{...P,data:{...P.data,view:b}}:P));},F=b=>{switch(b){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}},B=()=>{let b=[],W=60,P=ie({data:e});for(let h=1;h<=l;h++){let I=W+(h-1)*20-4,A=me(h,l,P);b.push(jsx("div",{style:{position:"absolute",left:"-35px",top:`${I}px`,background:"#374151",color:"#9ca3af",padding:"2px 4px",borderRadius:"2px",fontSize:"8px",fontWeight:"bold",width:"28px",textAlign:"center",border:"1px solid #4b5563",zIndex:10,height:`${20}px`,display:"flex",alignItems:"center",justifyContent:"center",lineHeight:1},children:A},h));}return b};return jsxs("div",{className:`rack-node ${o?"selected":""}`,style:{background:"transparent",border:`2px solid ${F(d)}`,borderRadius:"8px",padding:0,width:"300px",height:`${60+l*20}px`,color:"white",fontFamily:"monospace",fontSize:"12px",boxShadow:o?"0 0 0 2px #3b82f6":"0 2px 4px rgba(0,0,0,0.1)",position:"relative",display:"flex",flexDirection:"column"},children:[jsx(Handle,{type:"target",position:Position.Top}),jsxs("div",{style:{textAlign:"center",marginBottom:0,zIndex:2,background:"#1f2937",padding:"8px",position:"relative",height:`${60}px`,display:"flex",flexDirection:"column",justifyContent:"center"},children:[jsx("div",{style:{fontWeight:"bold",marginBottom:"4px"},children:i}),jsxs("div",{style:{fontSize:"10px",color:"#9ca3af"},children:[k?jsx("span",{style:{color:"#fbbf24",fontWeight:"bold"},children:k}):jsxs("span",{children:[typeof a=="number"?a:0," ports"]})," \u2022 ",l,"U \u2022 ",f]}),jsxs("div",{style:{display:"flex",gap:"4px",position:"absolute",top:"4px",right:"4px"},children:[jsx("button",{onPointerDown:b=>{b.stopPropagation();},onMouseDown:b=>{b.stopPropagation();},onClick:b=>{b.stopPropagation(),b.preventDefault(),y(!N);},style:{background:N?"#10b981":"#374151",color:N?"#ffffff":"#9ca3af",border:"1px solid #4b5563",borderRadius:"2px",padding:"2px 6px",fontSize:"8px",cursor:"pointer",fontFamily:"monospace"},title:`${N?"Hide":"Show"} U markers`,children:"U"}),jsx("button",{onPointerDown:b=>{b.stopPropagation();},onMouseDown:b=>{b.stopPropagation();},onClick:b=>{b.stopPropagation(),b.preventDefault(),Z();},style:{background:"#374151",color:"#9ca3af",border:"1px solid #4b5563",borderRadius:"2px",padding:"2px 6px",fontSize:"8px",cursor:"pointer",fontFamily:"monospace"},title:`Switch U numbering to ${ie({data:e})==="bottom-up"?"top-down":"bottom-up"}`,children:ie({data:e})==="bottom-up"?"\u2191\u2193":"\u2193\u2191"}),jsx("button",{onPointerDown:b=>{b.stopPropagation();},onMouseDown:b=>{b.stopPropagation();},onClick:b=>{b.stopPropagation(),b.preventDefault(),K();},style:{background:"#374151",color:"#9ca3af",border:"1px solid #4b5563",borderRadius:"2px",padding:"2px 6px",fontSize:"8px",cursor:"pointer",fontFamily:"monospace"},title:`Switch to ${f==="front"?"rear":"front"} view`,children:f==="front"?"\u21C4 Rear":"\u21C4 Front"})]})]}),jsx("div",{style:{flex:1,background:"transparent",position:"relative",minHeight:`${l*20}px`,overflow:"hidden"}}),N&&jsx("div",{style:{position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none"},children:B()})]})};var He=({data:e,selected:o})=>{let{label:t,status:n="active"}=e,r=i=>{switch(i){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}};return jsxs("div",{className:`fiber-node ${o?"selected":""}`,style:{background:"#1f2937",border:`2px solid ${r(n)}`,borderRadius:"50%",width:"60px",height:"60px",display:"flex",alignItems:"center",justifyContent:"center",color:"white",fontFamily:"monospace",fontSize:"10px",fontWeight:"bold",boxShadow:o?"0 0 0 2px #3b82f6":"0 2px 4px rgba(0,0,0,0.1)",position:"relative"},children:[jsx(Handle,{type:"target",position:Position.Top}),jsx(Handle,{type:"source",position:Position.Bottom}),jsx(Handle,{type:"target",position:Position.Left}),jsx(Handle,{type:"source",position:Position.Right}),jsx("div",{style:{textAlign:"center"},children:jsx("div",{style:{fontSize:"8px",lineHeight:"1.2"},children:t})}),jsx("div",{style:{position:"absolute",bottom:"4px",left:"50%",transform:"translateX(-50%)",width:"8px",height:"8px",background:r(n),borderRadius:"50%"}})]})};var Te=({id:e,sourceX:o,sourceY:t,targetX:n,targetY:r,sourcePosition:i,targetPosition:a,data:d,selected:l,style:p})=>{let[f,k,H]=getBezierPath({sourceX:o,sourceY:t,sourcePosition:i,targetX:n,targetY:r,targetPosition:a}),{bandwidth:R,length:S,color:N="#10b981"}=d||{},y={stroke:N,strokeWidth:l?3:2,strokeDasharray:d?.type==="fiber"?"5,5":"none",fill:"none",...p};return jsxs(Fragment,{children:[jsx("path",{id:e,className:"react-flow__edge-path",d:f,stroke:N,strokeWidth:l?3:2,strokeDasharray:d?.type==="fiber"?"5,5":"none",fill:"none",style:y}),jsx(EdgeLabelRenderer,{children:d&&(R||S)&&jsxs("div",{style:{position:"absolute",transform:`translate(-50%, -50%) translate(${k}px,${H}px)`,background:"#1f2937",padding:"4px 8px",borderRadius:"4px",fontSize:"10px",color:"white",fontFamily:"monospace",border:`1px solid ${N}`,pointerEvents:"none"},children:[R&&jsx("div",{children:R}),S&&jsxs("div",{children:[S,"m"]})]})})]})};var Ue=({id:e,sourceX:o,sourceY:t,targetX:n,targetY:r,sourcePosition:i,targetPosition:a,style:d={},data:l,markerEnd:p})=>{let [f,k,H]=getBezierPath({sourceX:o,sourceY:t,sourcePosition:i,targetX:n,targetY:r,targetPosition:a}),R=l?.connectorType||"C13";l?.voltage||"AC";l?.amperage||(R==="C19"?"16A":"10A");return jsx(BaseEdge,{id:e,path:f,markerEnd:p,style:(()=>{let Z={stroke:l?.color||"#f59e0b",strokeWidth:R==="C19"?5:3,strokeLinecap:"round",strokeLinejoin:"round",...d};return R==="C19"?{...Z,strokeDasharray:"none"}:{...Z,strokeDasharray:"6,3"}})()})};var Xe=(t=>(t.FULL="full",t.HALF="half",t))(Xe||{});var Ie={C13:{type:"C13",color:"#f59e0b",borderColor:"#d97706",amperage:10,voltage:230,phases:1},C14:{type:"C14",color:"#f59e0b",borderColor:"#d97706",amperage:10,voltage:230,phases:1},C19:{type:"C19",color:"#fbbf24",borderColor:"#d97706",amperage:16,voltage:230,phases:1},C20:{type:"C20",color:"#fbbf24",borderColor:"#d97706",amperage:16,voltage:230,phases:1}};function pe(e){let o=Ie[e];if(!o)throw new Error(`Unknown connector type: ${e}`);let t=o.amperage===16;o.amperage===10;let r=t?12:8,i=t?10:5,a=t?{borderRadius:"3px"}:{clipPath:"polygon(2px 0, calc(100% - 2px) 0, 100% 2px, 100% 100%, 0 100%, 0 2px)",borderRadius:"0px"};return {width:r,height:i,color:o.color,borderColor:o.borderColor,fontSize:t?"3px":"4px",...a}}function we(e){let o=Ie[e];if(!o)throw new Error(`Unknown connector type: ${e}`);return o}function xt(e){return we(e).amperage===16}function Ae(e){return e%10<8?"C13":"C19"}function Ne(e){let o=e.toLowerCase();return o.includes("mx304")||o.includes("mx480")||o.includes("mx960")?"C20":"C14"}var Me=({data:e,selected:o})=>{let{label:t,status:n="active",deviceType:r="server",manufacturer:i,role:a,uHeight:d=1,uPosition:l=1,width:p="full",ports:f=[],rearPorts:k=[],view:H,powerSide:R="left"}=e,S=H||(k.length>0&&f.length===0?"rear":"front"),N={};N["net-top"]="front",N["net-bottom"]="front",f.length>0&&f.forEach(h=>{h.ports.forEach(I=>{let A=I.type?.includes("power")?I.label:`${h.name}-${I.label}`;N[A]="front";});}),N["pwr-left-1"]="rear",N["pwr-left-2"]="rear",N["net-right-1"]="rear",N["net-right-2"]="rear",k.length>0&&k.forEach(h=>{h.ports.forEach(I=>{let A=I.type?.includes("power")?I.label:`${h.name}-${I.label}`;N[A]="rear";});});let y=d*20,Z=p==="half"?"150px":"304px",K=p==="half"?"150px":void 0,F=h=>{switch(h){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}},b=(h,I)=>{let A=[];if(h.length===0)return A;let L=Math.max(4,Math.floor(y*.4)),V=Math.max(2,Math.floor(y*.2));return h.forEach((g,C)=>{g.ports.forEach((v,$)=>{let O=!!v.type&&v.type.includes("power");if(I==="front"&&O)return;let _=O?`${v.label}`:`${g.name}-${v.label}`,J=v.connected,M="#6b7280";if(J)if(v.type?.includes("power"))M=v.type==="power_c19"?"#fbbf24":"#f59e0b";else if(v.type==="console"||v.type==="mgmt")M="#8b5cf6";else if(v.type==="usb")M="#10b981";else switch(v.cableType){case "smf":M="#fbbf24";break;case "cat6":M="#8b5cf6";break;case "om3":M="#06b6d4";break;case "om4":M="#8b5cf6";break;case "om5":M="#84cc16";break;case "cat5e":M="#3b82f6";break;case "cat6a":M="#ef4444";break;case "cat7":M="#f97316";break;case "fiber":M="#3b82f6";break;case "ethernet":M="#10b981";break;default:M="#10b981";}let ne=Position.Top,D={width:`${L}px`,height:`${V}px`,background:J?M:"#6b7280",border:`1px solid ${J?M:"#374151"}`,borderRadius:"1px",cursor:"pointer"};if(I==="front")$%2===0?(ne=Position.Top,D.transform="translateY(50%)",D.left=`${$/2*(L+2)}px`):(ne=Position.Bottom,D.transform="translateY(-50%)",D.left=`${($-1)/2*(L+2)}px`);else if(v.type?.includes("power")){ne=Position.Left,D.transform="translateX(50%)";let ke=y<=20?10:20,s=y<=20?30:50;D.top=`${ke+$*s}%`;let m=Ne(t),c=pe(m);D={...D,width:`${c.width}px`,height:`${c.height}px`,zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:c.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:c.borderRadius,clipPath:c.clipPath};}else ne=Position.Right,D.transform="translateX(50%)",D.top=`${25+$*50}%`;let ge=O?"target":J?"source":"target";A.push(jsx(Handle,{id:_,type:ge,position:ne,style:D,title:`${g.name} - ${v.label} ${J?"(connected)":"(disconnected)"}`,children:O?$+1:void 0},_));});}),A},W=()=>{let h=[],A=Math.max(4,Math.floor(y*.4)),L=Math.max(2,Math.floor(y*.2));if(S==="front"){if(f.length>0)return b(f,"front");if(r==="switch"&&(t.toLowerCase().includes("agg")||t.toLowerCase().includes("core")||a==="agg"||a==="core"))return P();h.push(jsx(Handle,{id:"net-top",type:"target",position:Position.Top,style:{width:`${A}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateY(50%)"},title:"Network Port (Top)"},"net-top")),h.push(jsx(Handle,{id:"net-bottom",type:"target",position:Position.Bottom,style:{width:`${A}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateY(-50%)"},title:"Network Port (Bottom)"},"net-bottom"));}else if(S==="rear"){if(k.length>0)return b(k,"rear");let V=r==="switch",g=r==="patch-panel";if(!g){let C=Ne(t),v=we(C),$=pe(C),O=y<=20?"10%":"25%";h.push(jsx(Handle,{id:"pwr-left-1",type:"target",position:Position.Left,style:{width:`${$.width}px`,height:`${$.height}px`,background:$.color,border:`1px solid ${$.borderColor}`,cursor:"pointer",transform:"translateX(50%)",top:O,zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:$.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:$.borderRadius,clipPath:$.clipPath},title:`Power Port 1 (${v.type}) - ${v.voltage}V, ${v.amperage}A`,children:"1"},"pwr-1"));let _=y<=20?"50%":"75%";h.push(jsx(Handle,{id:"pwr-left-2",type:"target",position:Position.Left,style:{width:`${$.width}px`,height:`${$.height}px`,background:$.color,border:`1px solid ${$.borderColor}`,cursor:"pointer",transform:"translateX(50%)",top:_,zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:$.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:$.borderRadius,clipPath:$.clipPath},title:`Power Port 2 (${v.type}) - ${v.voltage}V, ${v.amperage}A`,children:"2"},"pwr-2"));}!V&&!g&&(h.push(jsx(Handle,{id:"net-right-1",type:"target",position:Position.Right,style:{width:`${A}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateX(50%)",top:"25%"},title:"Network Port 1 (Right)"},"net-right-1")),h.push(jsx(Handle,{id:"net-right-2",type:"target",position:Position.Right,style:{width:`${A}px`,height:`${L}px`,background:"#10b981",border:"0.5px solid #059669",borderRadius:"1px",cursor:"pointer",transform:"translateX(50%)",top:"75%"},title:"Network Port 2 (Right)"},"net-right-2")));}return h},P=()=>{let h=[],A=Math.max(10,Math.floor(y*.45)),L=Math.max(5,Math.floor(y*.25));for(let g=1;g<=16;g++){let C=jsx(Handle,{id:`port-${g}`,type:"source",position:Position.Top,style:{width:`${A}px`,height:`${L}px`,background:"#10b981",border:"1px solid #059669",borderRadius:"2px",cursor:"pointer",transform:"translateY(50%)",zIndex:1e3,left:`${(g-1)*(A+2)}px`},title:`Port ${g}`},`port-${g}`);h.push(C);}for(let g=17;g<=32;g++){let C=g-16,v=jsx(Handle,{id:`port-${g}`,type:"source",position:Position.Bottom,style:{width:`${A}px`,height:`${L}px`,background:"#10b981",border:"1px solid #059669",borderRadius:"2px",cursor:"pointer",transform:"translateY(-50%)",zIndex:1e3,left:`${(C-1)*(A+2)}px`},title:`Port ${g}`},`port-${g}`);h.push(v);}for(let g=1;g<=4;g++){let C=Math.max(4,Math.floor(y*.3)),v=Math.max(3,Math.floor(y*.15));h.push(jsx(Handle,{id:`uplink-${g}`,type:"source",position:Position.Right,style:{width:`${C}px`,height:`${v}px`,background:"#8b5cf6",border:"0.5px solid #7c3aed",borderRadius:"0.5px",cursor:"pointer",transform:"translateX(-50%)"},title:`Uplink ${g}`},`uplink-${g}`));}return h};return jsxs("div",{className:`device-node ${o?"selected":""}`,style:{background:"#1f2937",border:`1px solid ${F(n)}`,borderRadius:"2px",padding:"0px",width:Z,...K&&{left:K},height:`${y}px`,color:"white",fontFamily:"monospace",fontSize:"8px",boxShadow:o?"0 0 0 1px #3b82f6":"0 1px 2px rgba(0,0,0,0.1)",position:"relative",display:"flex",flexDirection:"column",justifyContent:"center",cursor:"grab",marginBottom:"0px",boxSizing:"border-box",marginTop:"0px",marginLeft:"0px",marginRight:"0px"},children:[jsxs("div",{style:{textAlign:"center",flex:1,display:"flex",flexDirection:"column",justifyContent:"center",overflow:"hidden",padding:"2px"},children:[jsx("div",{style:{fontWeight:"bold",fontSize:"7px",lineHeight:"1.1",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:t}),d>1&&jsx("div",{style:{fontSize:"6px",color:"#9ca3af",lineHeight:"1"},children:i})]}),d>1&&jsxs("div",{style:{position:"absolute",bottom:"1px",right:"1px",background:"#374151",color:"#9ca3af",padding:"1px 2px",borderRadius:"1px",fontSize:"6px",lineHeight:"1"},children:[d,"U"]}),jsx("div",{style:{position:"absolute",bottom:"1px",left:"1px",width:"4px",height:"4px",background:F(n),borderRadius:"50%"}}),W()]})};var Be=({data:e,selected:o,id:t})=>{let{label:n,status:r="active",heightCm:i=100,powerPorts:a=36,portTypes:d=[],widthPx:l=15,mgmt_unit:p}=e,f=S=>{switch(S){case "active":return "#10b981";case "inactive":return "#6b7280";case "maintenance":return "#f59e0b";default:return "#6b7280"}},k=i*4.2,H=()=>{let N=Math.ceil(a/10),y=Array(10).fill(0).map((g,C)=>C<8?"10A":"16A");for(let g=0,C=0;g<N;++g)for(let v=0;v<10&&C<a;++v,++C){y[v];}let h=[],I=15,V=(k-I-3)/(a-9)*.5;for(let g=0;g<a;g++){let C=I-2+V*g,v=`${g+1}`;if(p&&(p==="top"&&g===0||p==="middle"&&g===Math.floor(a/2)||p==="bottom"&&g===a-1)){h.push(R(C));continue}let O=Ae(g),_=pe(O),J=Math.round((l-_.width)/2-1);h.push(jsx(Handle,{type:"source",position:Position.Right,id:v,style:{position:"absolute",left:`${J}px`,top:`${C-_.height/2}px`,width:`${_.width}px`,height:`${_.height}px`,background:_.color,border:`1px solid ${_.borderColor}`,cursor:"pointer",zIndex:10,display:"flex",alignItems:"center",justifyContent:"center",fontSize:_.fontSize,color:"#1a1a1a",fontFamily:"monospace",fontWeight:"bold",borderRadius:_.borderRadius,clipPath:_.clipPath},title:`Power Port ${g+1} (${O})`,children:g+1},`handle-${v}`));}return h},R=S=>jsxs("div",{style:{position:"absolute",left:`${(l-16)/2}px`,top:`${S-12/2}px`,width:"16px",height:"12px",background:"#1a1a1a",border:"1px solid #374151",borderRadius:"1px",display:"flex",flexDirection:"column",padding:"1px",zIndex:10},children:[jsx("div",{style:{position:"absolute",left:"-10px",top:"1px",background:"#ffffff",border:"0.5px solid #6b7280",borderRadius:"0.5px",width:"8px",height:"10px",display:"flex",alignItems:"center",justifyContent:"center",fontSize:"3px",color:"#10b981",fontFamily:"monospace",fontWeight:"bold",transform:"rotate(90deg)",transformOrigin:"center"},children:"APC"}),jsx(Handle,{type:"source",position:Position.Right,id:"mgmt-net-1",style:{width:"70%",height:"6px",background:"#10b981",border:"1px solid #059669",borderRadius:"1px",cursor:"pointer",zIndex:11,margin:"0 auto"},title:"Management Network Port"},"mgmt-net-1")]},"mgmt-unit");return jsxs("div",{className:`vertical-pdu-node ${o?"selected":""}`,style:{background:"linear-gradient(90deg, #2d3748 0%, #1a202c 50%, #2d3748 100%)",border:`1px solid ${f(r)}`,borderRadius:"2px",padding:0,width:`${l}px`,height:`${k}px`,color:"white",fontFamily:"monospace",fontSize:"12px",boxShadow:o?"0 0 0 2px #3b82f6":"0 1px 3px rgba(0,0,0,0.3)",position:"relative",display:"flex",flexDirection:"column"},children:[jsx("div",{style:{textAlign:"center",marginBottom:0,zIndex:2,background:"linear-gradient(90deg, #4a5568 0%, #2d3748 50%, #4a5568 100%)",padding:"2px",position:"relative",height:"20px",display:"flex",flexDirection:"column",justifyContent:"center",borderBottom:"1px solid #4a5568"},children:jsx("div",{style:{fontWeight:"bold",fontSize:"6px",color:"#e2e8f0"},children:n})}),jsx("div",{style:{flex:1,background:"linear-gradient(180deg, #2d3748 0%, #1a202c 50%, #2d3748 100%)",position:"relative",minHeight:`${k-20}px`,overflow:"hidden"},children:H()})]})};function Nt(e,o){if(!e.source||!e.target||!e.sourceHandle||!e.targetHandle)return {valid:true};let t=o.edges.some(r=>r.source===e.source&&r.sourceHandle===e.sourceHandle),n=o.edges.some(r=>r.target===e.target&&r.targetHandle===e.targetHandle);return t?{valid:false,reason:"Source port is already connected"}:n?{valid:false,reason:"Target port is already connected"}:{valid:true}}function kt(e,o){if(!o)return;let t=o.data||{};if(t.handleSideMap&&t.handleSideMap[e])return t.handleSideMap[e];if(e==="net-top"||e==="net-bottom")return "front";if(e==="pwr-left-1"||e==="pwr-left-2"||e==="net-right-1"||e==="net-right-2")return "rear";let n=Array.isArray(t.ports)?t.ports:[],r=Array.isArray(t.rearPorts)?t.rearPorts:[];if(e.startsWith("pwr")||e.includes("power"))return "rear";if(n.length>0){for(let a of n)for(let d of a.ports||[])if((d.type&&String(d.type).includes("power")?d.label:`${a.name}-${d.label}`)===e)return "front"}if(r.length>0){for(let a of r)for(let d of a.ports||[])if((d.type&&String(d.type).includes("power")?d.label:`${a.name}-${d.label}`)===e)return "rear"}}function _e(e={},o={}){let t={nodes:e.nodes??[],edges:e.edges??[],debug:e.debug??false},n=new Set;return {getState:()=>t,setState:p=>{t={...t,...p},n.forEach(f=>f(t));},subscribe:p=>(n.add(p),()=>n.delete(p)),selectEdgeZIndex:p=>{let f=t.nodes.find(y=>y.id===p.target);if(!f||f.type!=="device")return 1e3;let k=f.data?.view||"front",H=kt(p.targetHandle||"",f);if(H)return k===H?1e3:500;let R=p.targetHandle||"",S=R.startsWith("pwr")||R.startsWith("power"),N=R.startsWith("net-")||R.startsWith("port-")||R.startsWith("uplink-")||R.includes("Fiber")||R.includes("Ports");return S?k==="rear"?1e3:500:N?k==="front"?1e3:500:1e3},validateConnection:p=>(o.validateConnection||Nt)(p,t)}}function vt(e){let o=r=>e.subscribe(r),t=()=>e.getState();return useSyncExternalStore(o,t,t)}function We(e){let o=n=>e.subscribe(n),t=()=>e.getState().nodes;return useSyncExternalStore(o,t,t)}function Le(e){let o=n=>e.subscribe(n),t=()=>e.getState().edges;return useSyncExternalStore(o,t,t)}function qe(e){return e.selectEdgeZIndex}var It=(e,o)=>({rack:t=>jsx(Se,{...t,onViewChange:e,onRackFaceChange:o}),fiber:He,device:Me,"vertical-pdu":Be}),At={fiber:Te,power:Ue},Ft=({nodes:e,edges:o,initialNodes:t,initialEdges:n,onNodesChange:r,onEdgesChange:i,store:a,debug:d,onNodeClick:l,onEdgeClick:p,onViewChange:f,onRackFaceChange:k,className:H,style:R,alignRacksToBottom:S})=>{let N=Array.isArray(e)&&Array.isArray(o),y=Pt.useMemo(()=>a||_e({nodes:N?e:t||e||[],edges:N?o:n||o||[],debug:d}),[a,N,e,o,t,n,d]),Z=We(y),K=Le(y),[F,B,b]=useNodesState(Z),[W,P,h]=useEdgesState(K),I=qe(y),A=useMemo(()=>It(f,k),[f,k]),L=useMemo(()=>At,[]),V=useRef(F);useEffect(()=>{V.current=F;},[F]);let g=useRef(W);useEffect(()=>{g.current=W;},[W]),useEffect(()=>{B(Z);},[Z,B]),useEffect(()=>{P(K);},[K,P]),useEffect(()=>{N&&y.setState({nodes:e||[]});},[N,e,y]),useEffect(()=>{N&&y.setState({edges:o||[]});},[N,o,y]),useEffect(()=>{if(!S||!F||F.length===0)return;let s=F.filter(x=>x.type==="rack");if(s.length===0)return;let m=s.map(x=>{let z=x.data&&x.data.uHeight||42,Y=60+z*20;return (x.position?.y||0)+Y}),c=Math.min(...m),u=Math.max(...m);if(u-c<20)return;let w=u,U=F.map(x=>{if(x.type!=="rack")return x;let z=x.data&&x.data.uHeight||42,Y=60+z*20,oe=(x.position?.y||0)+Y,se=w-oe;return Math.abs(se)<5?x:{...x,position:{x:x.position?.x||0,y:(x.position?.y||0)+se}}});U.some((x,z)=>x.position!==F[z].position)&&B(U);},[S,F,B]);let C=useCallback(s=>V.current.find(m=>m.id===s),[]);useCallback((s,m)=>{let c=C(s);if(!c||c.type!=="device")return 1e3;let u=c.data?.view||"front",w=(c.data?.handleSideMap||{})[m],U;if(w)U=u===w?1e3:500;else {let T=m.startsWith("pwr-left")||m.startsWith("power"),x=m.startsWith("net-")||m.startsWith("port-")||m.startsWith("uplink-")||m.includes("Fiber")||m.includes("Ports");T?U=u==="rear"?1e3:500:x?U=u==="front"?1e3:500:U=1e3;}return U},[C]);useEffect(()=>{P(s=>s.map(m=>{let c=I(m);return {...m,zIndex:c,style:{...m.style,zIndex:c}}}));},[F,P,I]),useEffect(()=>{let s=F.map(c=>{if(c.type==="device"&&c.parentId&&c.data.uPosition&&(!c.position||c.position.x===0&&c.position.y===0)){let u=C(c.parentId);if(u){let E=de(u,c.data.uPosition);return {...c,position:E}}}return c});s.some((c,u)=>c.position!==F[u].position)&&B(s);},[F,B,C]);let $=useCallback(s=>{let m=s.map(c=>{if(c.type==="position"&&c.position){let u=C(c.id);if(u&&u.type==="device"&&u.parentId){let E=C(u.parentId);if(E){let w=Ce(u,E,c.position,V.current);if(w.uPosition!==void 0){let U={...u,data:{...u.data,uPosition:w.uPosition}};B(T=>T.map(x=>x.id===u.id?U:x));}return {...c,position:{x:w.x,y:w.y}}}}if(u&&u.type==="device"&&!u.parentId){let E=V.current.filter(T=>T.type==="rack"),w=null,U=1/0;for(let T of E){let x=T,z=Math.sqrt(Math.pow(c.position.x-x.position.x,2)+Math.pow(c.position.y-x.position.y,2)),Y=300,oe=(x.data.uHeight||42)*20,se=x.position.x,ve=x.position.x+Y,Pe=x.position.y,De=x.position.y+oe;c.position.x>=se&&c.position.x<=ve&&c.position.y>=Pe&&c.position.y<=De&&z<U&&(U=z,w=x);}if(w){let T={...u,parentId:w.id,extent:"parent",data:{...u.data,uPosition:1}};B(Y=>Y.map(oe=>oe.id===u.id?T:oe));let x=c.position.x-w.position.x,z=c.position.y-w.position.y;return {...c,position:{x,y:z}}}}if(u&&u.type==="device"&&u.parentId){let E=C(u.parentId);if(E){let w=E,U=300,T=(w.data.uHeight||42)*20,x=w.position.x,z=w.position.x+U,Y=w.position.y,oe=w.position.y+T;if(c.position.x<x||c.position.x>z||c.position.y<Y||c.position.y>oe){let se=c.position.x+w.position.x,ve=c.position.y+w.position.y,Pe={...u,parentId:void 0,extent:void 0,data:{...u.data,uPosition:void 0}};return B(De=>De.map(Ge=>Ge.id===u.id?Pe:Ge)),{...c,position:{x:se,y:ve}}}}}}return c});b(m);},[b,B,C]);useCallback(s=>{if(!s.source||!s.target||!s.sourceHandle||!s.targetHandle)return {valid:true};let m=s.sourceHandle,c=s.targetHandle,u=g.current.some(w=>w.source===s.source&&w.sourceHandle===m),E=g.current.some(w=>w.target===s.target&&w.targetHandle===c);return u?{valid:false,reason:"Source port is already connected"}:E?{valid:false,reason:"Target port is already connected"}:{valid:true}},[]);let _=useCallback(s=>{let c=C(s.source)?.type==="vertical-pdu",u=!!s.targetHandle&&(s.targetHandle.startsWith("pwr")||s.targetHandle.startsWith("power"));if(c&&u&&s.target&&s.targetHandle){let U=g.current.find(T=>T.target===s.target&&T.targetHandle===s.targetHandle);if(U){let T={...s,type:"power",zIndex:I({...s,id:"temp-id"})};P(x=>{let z=x.filter(Y=>Y.id!==U.id);return addEdge(T,z)});return}}let E=y.validateConnection({source:s.source??null,target:s.target??null,sourceHandle:s.sourceHandle??null,targetHandle:s.targetHandle??null});if(!E.valid){if(c&&s.source&&s.sourceHandle){let U=g.current.find(T=>T.source===s.source&&T.sourceHandle===s.sourceHandle);if(U){let T={...s,type:u?"power":"fiber",zIndex:I({...s,id:"temp-id"})};P(x=>{let z=x.filter(Y=>Y.id!==U.id);return addEdge(T,z)});return}}console.warn(`Connection rejected: ${E.reason}`);return}let w={...s,type:c&&u?"power":"fiber",zIndex:I({...s,id:"temp-id"})};P(U=>addEdge(w,U));},[P,y,I,C]),J=useCallback((s,m)=>{if((s.metaKey||s.ctrlKey)&&m.type==="device"){let u=m.data||{},E=u.view||(Array.isArray(u.rearPorts)&&u.rearPorts.length>0?"rear":"front"),w=E==="front"?"rear":"front";console.log(`Command+click: Toggling device ${m.id} from ${E} to ${w}`),f&&f(m.id,w),l&&l(m);}else m.type!=="device"&&l&&l(m);},[f,l]),M=useCallback(()=>{},[]),ne=useCallback((s,m)=>{p&&p(m);},[p]),[D,ge]=useState(null);useOnSelectionChange({onChange:({nodes:s})=>{s&&s.length===1?ge(s[0]):ge(null);}});let ke=useCallback(()=>{if(!D)return;let s=C(D.id);if(s){if(s.type==="rack"){let c=(s.data&&s.data.face||"front")==="front"?"rear":"front";k?k(s.id,c):B(u=>u.map(E=>E.id===s.id?{...E,data:{...E.data,face:c}}:E.parentId===s.id?{...E,data:{...E.data,view:c}}:E));return}if(s.type==="device"){let m=s.data||{},c=Array.isArray(m.rearPorts)&&m.rearPorts.length>0,u=Array.isArray(m.ports)&&m.ports.length>0,w=(m.view||(c&&!u?"rear":"front"))==="front"?"rear":"front";f?f(s.id,w):B(U=>U.map(T=>T.id===s.id?{...T,data:{...T.data,view:w}}:T));}}},[D,C,k,f,B]);return jsxs("div",{className:H,style:{width:"100%",height:"100%",...R},children:[jsxs(ReactFlow,{nodes:F,edges:W,onNodesChange:s=>{$(s);s.reduce((c,u)=>(u.type==="add"||u.type==="remove",c),null);N?r&&r(V.current):y.setState({nodes:V.current});},onEdgesChange:s=>{h(s),N?i&&i(g.current):y.setState({edges:g.current});},onConnect:_,onNodeClick:J,onNodeDoubleClick:M,onEdgeClick:ne,nodeTypes:A,edgeTypes:L,defaultEdgeOptions:{zIndex:1e3,reconnectable:true},fitView:true,attributionPosition:"bottom-left",children:[jsx(Background,{}),jsx(Controls,{}),jsx(MiniMap,{})]}),D&&(D.type==="rack"||D.type==="device")&&jsx("div",{style:{position:"absolute",top:12,right:12,display:"flex",gap:8,zIndex:2e3},children:jsx("button",{onClick:s=>{s.preventDefault(),ke();},style:{background:"#374151",color:"#e5e7eb",border:"1px solid #4b5563",borderRadius:4,padding:"6px 10px",fontSize:11,fontFamily:"monospace",cursor:"pointer"},title:D.type==="rack"?(D.data?.face||"front")==="front"?"Switch to rear":"Switch to front":(D.data?.view||(Array.isArray(D.data?.rearPorts)&&D.data.rearPorts.length>0&&!(Array.isArray(D.data?.ports)&&D.data.ports.length>0)?"rear":"front"))==="front"?"Switch to rear":"Switch to front",children:D.type==="rack"?(D.data?.face||"front")==="front"?"\u21C4 Rear":"\u21C4 Front":(D.data?.view||(Array.isArray(D.data?.rearPorts)&&D.data.rearPorts.length>0&&!(Array.isArray(D.data?.ports)&&D.data.ports.length>0)?"rear":"front"))==="front"?"\u21C4 Rear":"\u21C4 Front"})})]})},Mt=e=>jsx(ReactFlowProvider,{children:jsx(Ft,{...e})});var tt=e=>({id:`rack-${e.id}`,type:"rack",position:{x:0,y:0},data:{label:e.name,status:e.status.value,uHeight:e.u_height,netboxId:e.id,netboxType:"rack",facilityId:e.facility_id,serial:e.serial,assetTag:e.asset_tag,site:e.site.name,role:e.role?.name,tenant:e.tenant?.name}}),ot=e=>({id:`device-${e.id}`,type:"device",position:{x:0,y:0},parentId:e.rack?`rack-${e.rack.id}`:void 0,extent:e.rack?"parent":void 0,data:{label:e.name,status:e.status.value,deviceType:e.device_type.model,manufacturer:e.device_type.manufacturer.name,role:e.device_role.name,uHeight:1,uPosition:e.position||1,face:e.face||"front",netboxId:e.id,netboxType:"device",primaryIp4:e.primary_ip4?.address,primaryIp6:e.primary_ip6?.address,site:e.site.name,rack:e.rack?.name}}),rt=e=>({id:`cable-${e.id}`,source:`device-${e.termination_a.device.name}`,target:`device-${e.termination_b.device.name}`,type:"fiber",data:{bandwidth:e.type.label,length:e.length||0,color:e.color,netboxId:e.id,netboxType:"cable",status:e.status.value,terminationA:e.termination_a.name,terminationB:e.termination_b.name}}),Bt=e=>{let o=[],t=[];return e.racks.forEach(n=>{o.push(tt(n));}),e.devices.forEach(n=>{o.push(ot(n));}),e.cables.forEach(n=>{t.push(rt(n));}),{nodes:o,edges:t}},_t=(e,o)=>{let t=new Map,n=new Set;return e.filter(i=>i.position!==null).sort((i,a)=>(i.position||0)-(a.position||0)).forEach(i=>{i.position&&(t.set(i.id,i.position),n.add(i.position));}),t},zt=e=>{let o=e.filter(r=>r.type==="rack"),t=e.filter(r=>r.type==="device"),n=e.filter(r=>!["rack","device"].includes(r.type));return o.forEach((r,i)=>{r.position={x:i*300,y:100};}),t.forEach(r=>{if(r.parentId){let i=o.find(a=>a.id===r.parentId);if(i){let a=r.data.uPosition||1,d=r.data.uHeight||1;r.position={x:i.position.x+50,y:i.position.y+a*20-d*10};}}else r.position={x:Math.random()*400+100,y:Math.random()*200+50};}),n.forEach((r,i)=>{r.position={x:i*150+100,y:300};}),e};var ue=class extends Error{constructor(t,n,r,i,a){super(`Device placement conflict: ${n} at U${r}-${r+i-1} in rack ${t}${a?` conflicts with ${a}`:""}`);this.rackId=t;this.deviceId=n;this.uPosition=r;this.uHeight=i;this.conflictWith=a;this.name="DevicePlacementError";}};function Oe(e,o={}){let{conflictPolicy:t="strict"}=o,n=[],r=[];for(let i of e.devices)i.unit+i.height-1>e.units&&r.push({deviceId:i.id,uPosition:i.unit,uHeight:i.height,rackUHeight:e.units});for(let i=0;i<e.devices.length;i++){let a=e.devices[i],d=a.unit,l=a.unit+a.height-1;for(let p=i+1;p<e.devices.length;p++){let f=e.devices[p],k=f.unit,H=f.unit+f.height-1;d<=H&&l>=k&&n.push({deviceId:a.id,uPosition:a.unit,uHeight:a.height,conflictWith:f.id});}}return {isValid:n.length===0&&r.length===0,conflicts:n,outOfBounds:r}}function nt(e,o,t={}){let{deviceTypeMapping:n={}}=t,r=n[e.type]||"device",i=de(o,e.unit,e.height);return {id:e.id,type:r,position:i,parentId:o.id,extent:"parent",data:{label:e.name,status:"active",deviceType:e.type,uHeight:e.height,uPosition:e.unit,width:e.width||"full",role:e.role,ports:e.ports,rearPorts:e.rearPorts,connections:e.connections}}}function Wt(e){return {id:e.id,type:"rack",position:e.position,data:{label:e.name,status:"active",uHeight:e.units,uNumberingDirection:e.uNumberingDirection||"bottom-up",customHeaderText:e.customHeaderText,ports:[]}}}function Lt(e,o={}){let{conflictPolicy:t="strict",validatePlacements:n=true}=o,r=[],i=[];if(n)for(let a of e){let d=Oe(a,o);if(!d.isValid&&t==="strict"){let l=[];throw d.conflicts.forEach(p=>{l.push(`Device ${p.deviceId} at U${p.uPosition}-${p.uPosition+p.uHeight-1} conflicts with ${p.conflictWith}`);}),d.outOfBounds.forEach(p=>{l.push(`Device ${p.deviceId} at U${p.uPosition}-${p.uPosition+p.uHeight-1} exceeds rack height (${p.rackUHeight}U)`);}),new ue(a.id,d.conflicts[0]?.deviceId||d.outOfBounds[0]?.deviceId||"unknown",d.conflicts[0]?.uPosition||d.outOfBounds[0]?.uPosition||1,d.conflicts[0]?.uHeight||d.outOfBounds[0]?.uHeight||1)}}for(let a of e){let d=Wt(a);r.push(d);for(let l of a.devices)try{let p=nt(l,d,o);i.push(p);}catch(p){if(t==="strict")throw p;if(t==="nearest"){let f=be(d,{id:l.id,data:{label:l.name,uHeight:l.height}},i,l.unit);if(f!==l.unit){console.warn(`Device ${l.id} moved from U${l.unit} to U${f} due to conflict`);let k={...l,unit:f},H=nt(k,d,o);i.push(H);}else throw new ue(a.id,l.id,l.unit,l.height)}}}return r.push(...i),r}function Vt(e){let o=[],t=e.filter(n=>n.type==="rack");for(let n of t){let i=e.filter(a=>a.type==="device"&&a.parentId===n.id).map(a=>({id:a.id,name:a.data.label,unit:a.data.uPosition||1,height:a.data.uHeight||1,type:a.data.deviceType||"server",width:a.data.width,ports:a.data.ports,connections:a.data.connections}));o.push({id:n.id,name:n.data.label,position:n.position,units:n.data.uHeight||42,uNumberingDirection:n.data.uNumberingDirection||"bottom-up",customHeaderText:n.data.customHeaderText,devices:i});}return o}function Ot(e,o,t,n){return e.map(r=>r.id!==o?r:{...r,devices:r.devices.map(i=>i.id!==t?i:{...i,unit:n})})}function Gt(e,o,t,n={}){let{conflictPolicy:r="strict"}=n;return e.map(i=>{if(i.id!==o)return i;if(r==="strict"&&!Oe({...i,devices:[...i.devices,t]},n).isValid)throw new ue(o,t.id,t.unit,t.height);return {...i,devices:[...i.devices,t]}})}function Yt(e,o,t){return e.map(n=>n.id!==o?n:{...n,devices:n.devices.filter(r=>r.id!==t)})}export{Me as DeviceNode,ue as DevicePlacementError,Te as FiberEdge,He as FiberNode,Mt as NetworkDiagram,Ie as POWER_CONNECTORS,Ue as PowerEdge,Se as RackNode,Be as VerticalPDU,Xe as Width,Gt as addDeviceToRack,Lt as buildNodesFromRackConfig,de as calculateDevicePositionFromU,_t as calculateUPositions,_e as createNetworkDiagramStore,Vt as createRackConfigFromNodes,be as findNextAvailableUPosition,zt as generateLayout,we as getConnectorConfig,Ne as getDeviceConnectorType,Ae as getPDUPortType,pe as getPowerPortStyle,xt as isHighPowerConnector,Re as isUPositionAvailable,rt as netboxCableToNetworkEdge,ot as netboxDeviceToNetworkNode,tt as netboxRackToNetworkNode,Bt as netboxToNetworkDiagram,Yt as removeDeviceFromRack,Ce as snapToUPosition,Ye as updateDeviceUPosition,Ot as updateDeviceUPositionInSchema,Le as useDiagramEdges,We as useDiagramNodes,vt as useNetworkDiagram,at as validateAndSnapDevice,Oe as validateRackDevicePlacements};//# sourceMappingURL=index.mjs.map
|
|
2
2
|
//# sourceMappingURL=index.mjs.map
|