UNPKG

@jalez/react-flow-smart-edge

Version:

Smart edge routing for @xyflow/react v12+ (maintained fork of @tisoap/react-flow-smart-edge)

3 lines (2 loc) 5.67 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@xyflow/react"),e=require("react"),o=require("pathfinding");const n=(t,e)=>{switch(e){case"top":return{x:t.x,y:t.y-1};case"bottom":return{x:t.x,y:t.y+1};case"left":return{x:t.x-1,y:t.y};case"right":return{x:t.x+1,y:t.y}}},r=(t,e,o)=>{let r=t.getNodeAt(e.x,e.y);for(;!r.walkable;){t.setWalkableAt(r.x,r.y,!0);const e=n(r,o);r=t.getNodeAt(e.x,e.y)}},a=(t,e,o,n)=>{let r=t.x/n,a=t.y/n,i=e/n,l=o/n;if(i<1)for(;1!==i;)i++,r++;else if(i>1)for(;1!==i;)i--,r--;if(l<1)for(;1!==l;)l++,a++;else if(l>1)for(;1!==l;)l--,a--;return{x:r,y:a}},i=(t,e,o,n)=>{let r=t.x*n,a=t.y*n,i=e,l=o;if(i<n)for(;i!==n;)i+=n,r-=n;else if(i>n)for(;i!==n;)i-=n,r+=n;if(l<n)for(;l!==n;)l+=n,a-=n;else if(l>n)for(;l!==n;)l-=n,a+=n;return{x:r,y:a}},l=function(t,e){return void 0===e&&(e=10),Math.round(t/e)*e},s=function(t,e){return void 0===e&&(e=10),Math.floor(t/e)*e},g=function(t,e){return void 0===e&&(e=10),Math.ceil(t/e)*e},d=function(t,e){void 0===e&&(e=0);let o=Math.max(Math.round(t),e);return o=Number.isInteger(o)?o:e,o=o>=e?o:e,o},x=(t,e,o)=>{let n=`M ${t.x}, ${t.y} `;return o.forEach(t=>{const[e,o]=t;n+=`L ${e}, ${o} `}),n+=`L ${e.x}, ${e.y} `,n},h=(t,e,o)=>{const n=[[t.x,t.y],...o,[e.x,e.y]];return u(n)},u=t=>{let e=t[0];const o=t[0];let n=`M${o[0]},${o[1]}M`;for(let o=0;o<t.length;o++){const r=t[o],a=y(e[0],e[1],r[0],r[1]);n+=` ${a[0]},${a[1]}`,n+=`Q${r[0]},${r[1]}`,e=r}const r=t[t.length-1];return n+=` ${r[0]},${r[1]}`,n},y=(t,e,o,n)=>[(t-o)/2+o,(e-n)/2+n],c=(t,e,n)=>{try{const r=new o.AStarFinder({diagonalMovement:o.DiagonalMovement.Always}).findPath(e.x,e.y,n.x,n.y,t),a=o.Util.smoothenPath(t,r);return 0===r.length||0===a.length?null:{fullPath:r,smoothedPath:a}}catch{return null}},f=(t,e,n)=>{try{const r=new o.AStarFinder({diagonalMovement:o.DiagonalMovement.Never}).findPath(e.x,e.y,n.x,n.y,t),a=o.Util.smoothenPath(t,r);return 0===r.length||0===a.length?null:{fullPath:r,smoothedPath:a}}catch{return null}},p=(t,e,n)=>{try{const r=new o.JumpPointFinder({diagonalMovement:o.DiagonalMovement.Never}).findPath(e.x,e.y,n.x,n.y,t);return 0===r.length||0===r.length?null:{fullPath:r,smoothedPath:r}}catch{return null}},m=t=>{let{options:e={},nodes:x=[],sourceX:u,sourceY:y,targetX:f,targetY:p,sourcePosition:m,targetPosition:b}=t;try{const{drawEdge:t=h,generatePath:E=c}=e;let{gridRatio:M=10,nodePadding:P=10}=e;M=d(M),P=d(P);const{graphBox:S,nodeBoxes:N}=function(t,e,o){void 0===e&&(e=2),void 0===o&&(o=2);let n=Number.MIN_SAFE_INTEGER,r=Number.MIN_SAFE_INTEGER,a=Number.MAX_SAFE_INTEGER,i=Number.MAX_SAFE_INTEGER;const l=t.map(t=>{const l=Math.max(t.width||0,1),d=Math.max(t.height||0,1),x=t.position.x||0,h=t.position.y||0,u={x:x-e,y:h-e},y={x:x-e,y:h+d+e},c={x:x+l+e,y:h-e},f={x:x+l+e,y:h+d+e};return o>0&&(u.x=s(u.x,o),u.y=s(u.y,o),y.x=s(y.x,o),y.y=g(y.y,o),c.x=g(c.x,o),c.y=s(c.y,o),f.x=g(f.x,o),f.y=g(f.y,o)),u.y<i&&(i=u.y),u.x<a&&(a=u.x),f.y>r&&(r=f.y),f.x>n&&(n=f.x),{id:t.id,width:l,height:d,topLeft:u,bottomLeft:y,topRight:c,bottomRight:f}}),d=2*e;n=g(n+d,o),r=g(r+d,o),a=s(a-d,o),i=s(i-d,o);const x={x:a,y:i},h={x:a,y:r},u={x:n,y:i};return{nodeBoxes:l,graphBox:{topLeft:x,bottomLeft:h,topRight:u,bottomRight:{x:n,y:r},width:Math.abs(x.x-u.x),height:Math.abs(x.y-h.y),xMax:n,yMax:r,xMin:a,yMin:i}}}(x,P,M),v={x:u,y:y,position:m},w={x:f,y:p,position:b},{grid:B,start:A,end:$}=function(t,e,i,s,d){void 0===d&&(d=2);const{xMin:x,yMin:h,width:u,height:y}=t,c=g(u,d)/d+1,f=g(y,d)/d+1,p=new o.Grid(c,f);e.forEach(t=>{const e=a(t.topLeft,x,h,d),o=a(t.bottomRight,x,h,d);for(let t=e.x;t<o.x;t++)for(let n=e.y;n<o.y;n++)p.setWalkableAt(t,n,!1)});const m=a({x:l(i.x,d),y:l(i.y,d)},x,h,d),b=a({x:l(s.x,d),y:l(s.y,d)},x,h,d),E=p.getNodeAt(m.x,m.y);r(p,E,i.position);const M=p.getNodeAt(b.x,b.y);r(p,M,s.position);const P=n(E,i.position),S=n(M,s.position);return{grid:p,start:P,end:S}}(S,N,v,w,M),R=E(B,A,$);if(null===R)return null;const{fullPath:k,smoothedPath:X}=R,_=t(v,w,X.map(t=>{const[e,o]=t,n=i({x:e,y:o},S.xMin,S.yMin,M);return[n.x,n.y]})),L=k[Math.floor(k.length/2)],[Y,D]=L,{x:F,y:I}=i({x:Y,y:D},S.xMin,S.yMin,M);return{svgPathString:_,edgeCenterX:F,edgeCenterY:I}}catch{return null}};function b(o){let{nodes:n,options:r,...a}=o;const{sourceX:i,sourceY:l,sourcePosition:s,targetX:g,targetY:d,targetPosition:x,style:h,label:u,labelStyle:y,labelShowBg:c,labelBgStyle:f,labelBgPadding:p,labelBgBorderRadius:b,markerEnd:E,markerStart:M,interactionWidth:P}=a,S=m({sourcePosition:s,targetPosition:x,sourceX:i,sourceY:l,targetX:g,targetY:d,options:r,nodes:n});if(null===S)return e.createElement(r.fallback||t.BezierEdge,{...a});const{edgeCenterX:N,edgeCenterY:v,svgPathString:w}=S;return e.createElement(t.BaseEdge,{path:w,labelX:N,labelY:v,label:u,labelStyle:y,labelShowBg:c,labelBgStyle:f,labelBgPadding:p,labelBgBorderRadius:b,style:h,markerStart:M,markerEnd:E,interactionWidth:P})}const E={drawEdge:h,generatePath:c,fallback:t.BezierEdge};function M(o){const n=t.useNodes();return e.createElement(b,{...o,options:E,nodes:n})}const P={drawEdge:x,generatePath:p,fallback:t.StepEdge},S={drawEdge:x,generatePath:f,fallback:t.StraightEdge};exports.SmartBezierEdge=M,exports.SmartEdge=b,exports.SmartStepEdge=function(o){const n=t.useNodes();return e.createElement(b,{...o,options:P,nodes:n})},exports.SmartStraightEdge=function(o){const n=t.useNodes();return e.createElement(b,{...o,options:S,nodes:n})},exports.default=M,exports.getSmartEdge=m,exports.pathfindingAStarDiagonal=c,exports.pathfindingAStarNoDiagonal=f,exports.pathfindingJumpPointNoDiagonal=p,exports.svgDrawSmoothLinePath=h,exports.svgDrawStraightLinePath=x; //# sourceMappingURL=react-flow-smart-edge.cjs.production.min.js.map