@oscherbakov/react-flow-automated-layout 1.3.1 → 1.3.2

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.
@@ -225,7 +225,7 @@ function re({
225
225
  }), r || i(f), e || c(m);
226
226
  }
227
227
  }, [t, r, e, o]), V(() => {
228
- t.length !== s && u(t.length);
228
+ t.length !== s && u(t.length), N(!1);
229
229
  }, [t]), V(() => {
230
230
  b.size > 0 && C.size > 0 && !g && N(!0);
231
231
  }, [b, C, g]), V(() => {
@@ -346,7 +346,7 @@ const oe = (t, r, e = "no-parent") => {
346
346
  }
347
347
  }), l;
348
348
  };
349
- function tt(t, r, e = "no-parent") {
349
+ function et(t, r, e = "no-parent") {
350
350
  const o = [];
351
351
  let n = t;
352
352
  const i = /* @__PURE__ */ new Set();
@@ -368,11 +368,11 @@ function tt(t, r, e = "no-parent") {
368
368
  function z(t, r, e, o = "no-parent") {
369
369
  if (t === r)
370
370
  return t;
371
- const n = tt(t, e, o), i = n.indexOf(r);
371
+ const n = et(t, e, o), i = n.indexOf(r);
372
372
  return i === -1 ? null : i === 0 ? t : n[i - 1] || null;
373
373
  }
374
374
  function F(t, r, e, o = "no-parent") {
375
- const n = tt(t, e, o), i = tt(r, e, o), l = new Set(i);
375
+ const n = et(t, e, o), i = et(r, e, o), l = new Set(i);
376
376
  let c = null, h = -1;
377
377
  for (let g = 0; g < n.length; g++)
378
378
  if (l.has(n[g])) {
@@ -500,7 +500,7 @@ const ie = (t) => JSON.parse(JSON.stringify(t)), Et = (t, r, e, o, n) => {
500
500
  });
501
501
  });
502
502
  };
503
- function et(t, r, e = "no-parent") {
503
+ function rt(t, r, e = "no-parent") {
504
504
  const o = /* @__PURE__ */ new Map();
505
505
  for (const n of t) {
506
506
  const { lca: i, sourceChild: l, targetChild: c } = F(
@@ -526,7 +526,7 @@ function et(t, r, e = "no-parent") {
526
526
  }
527
527
  return ce(t, r, o, e), se(o), o;
528
528
  }
529
- const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
529
+ const nt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
530
530
  var c, h;
531
531
  const o = e.get(t);
532
532
  if (!o)
@@ -685,8 +685,8 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
685
685
  }
686
686
  h.add(u.id);
687
687
  }), h;
688
- }, Nt = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = "no-parent") => {
689
- const N = et(n, o, g), { updatedNodes: b } = await j(
688
+ }, Nt = async (t, r, e, o, n, i = nt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = "no-parent") => {
689
+ const N = rt(n, o, g), { updatedNodes: b } = await j(
690
690
  t,
691
691
  r,
692
692
  e,
@@ -724,7 +724,7 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
724
724
  updatedEdges: n
725
725
  // Always return original edges unchanged
726
726
  };
727
- }, j = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = /* @__PURE__ */ new Map(), N = "no-parent") => {
727
+ }, j = async (t, r, e, o, n, i = nt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = /* @__PURE__ */ new Map(), N = "no-parent") => {
728
728
  const b = e.get(t);
729
729
  if (!b || b.size === 0)
730
730
  return { updatedNodes: [] };
@@ -779,9 +779,9 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
779
779
  }, de = (t, r, e) => (t.style || (t.style = {}), t.width = r, t.height = e, t.measured = {
780
780
  width: r,
781
781
  height: e
782
- }, t.style.width = r, t.style.height = e, t), fe = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = "no-parent") => {
782
+ }, t.style.width = r, t.style.height = e, t), fe = async (t, r, e, o, n, i = nt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = "no-parent") => {
783
783
  let N = [];
784
- const b = et(n, o, g), C = /* @__PURE__ */ new Map();
784
+ const b = rt(n, o, g), C = /* @__PURE__ */ new Map();
785
785
  let p = 0;
786
786
  const f = (y, x) => {
787
787
  x > p && (p = x);
@@ -967,7 +967,7 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
967
967
  u
968
968
  ]), N = U(async (b, C, p, f) => {
969
969
  if (f != null && f.aborted) return { nodes: C, edges: p };
970
- const m = ft(r), y = o.padding.horizontal, x = s ? C : C.filter((v) => !v.hidden), w = new Set(x.map((v) => v.id)), E = s ? p : p.filter((v) => w.has(v.source) && w.has(v.target)), L = et(E, i, u), M = (v) => {
970
+ const m = ft(r), y = o.padding.horizontal, x = s ? C : C.filter((v) => !v.hidden), w = new Set(x.map((v) => v.id)), E = s ? p : p.filter((v) => w.has(v.source) && w.has(v.target)), L = rt(E, i, u), M = (v) => {
971
971
  const S = [], R = n.get(v);
972
972
  if (R)
973
973
  for (const _ of R)
@@ -1047,15 +1047,15 @@ function Ce({
1047
1047
  setAutoLayout: q,
1048
1048
  setLayoutInProgress: I,
1049
1049
  setLayoutHidden: Q,
1050
- setLayoutEngines: nt,
1050
+ setLayoutEngines: ot,
1051
1051
  setLayoutEngineOptions: vt,
1052
1052
  setPadding: Tt,
1053
- setNodeSpacing: ot,
1054
- setLayerSpacing: it,
1053
+ setNodeSpacing: it,
1054
+ setLayerSpacing: st,
1055
1055
  setNodeWidth: kt,
1056
1056
  setNodeHeight: Bt,
1057
- setParentResizingOptionsState: st,
1058
- setSelectedNodes: ct
1057
+ setParentResizingOptionsState: ct,
1058
+ setSelectedNodes: at
1059
1059
  } = ee({
1060
1060
  initialDirection: r,
1061
1061
  initialAlgorithm: e,
@@ -1068,10 +1068,10 @@ function Ce({
1068
1068
  layoutEngines: a
1069
1069
  }), {
1070
1070
  nodeIdWithNode: W,
1071
- nodeParentIdMapWithChildIdSet: at,
1071
+ nodeParentIdMapWithChildIdSet: lt,
1072
1072
  numberOfNodes: Mt,
1073
1073
  nodesLength: St,
1074
- childrenInitialized: lt,
1074
+ childrenInitialized: K,
1075
1075
  parentChildStructure: Dt
1076
1076
  } = re({
1077
1077
  nodes: p,
@@ -1079,8 +1079,8 @@ function Ce({
1079
1079
  externalNodeParentIdMapWithChildIdSet: g,
1080
1080
  noParentKey: b
1081
1081
  }), Rt = U(({ nodes: H }) => {
1082
- ct(H);
1083
- }, [ct]);
1082
+ at(H);
1083
+ }, [at]);
1084
1084
  Pt({
1085
1085
  onChange: Rt
1086
1086
  });
@@ -1089,7 +1089,7 @@ function Ce({
1089
1089
  m,
1090
1090
  y,
1091
1091
  R,
1092
- at,
1092
+ lt,
1093
1093
  W,
1094
1094
  O,
1095
1095
  k,
@@ -1107,26 +1107,27 @@ function Ce({
1107
1107
  updateNodes: s,
1108
1108
  updateEdges: u,
1109
1109
  setLayoutInProgress: I,
1110
- setNodeSpacing: ot,
1111
- setLayerSpacing: it
1112
- }), Gt = U((H, K) => {
1113
- nt(($t) => ({ ...$t, [H]: K }));
1114
- }, [nt]), _t = U((H) => {
1115
- st((K) => ({
1116
- ...K,
1110
+ setNodeSpacing: it,
1111
+ setLayerSpacing: st
1112
+ }), Gt = U((H, tt) => {
1113
+ ot(($t) => ({ ...$t, [H]: tt }));
1114
+ }, [ot]), _t = U((H) => {
1115
+ ct((tt) => ({
1116
+ ...tt,
1117
1117
  ...H,
1118
1118
  enabled: x
1119
1119
  }));
1120
- }, [x, st]);
1120
+ }, [x, ct]);
1121
1121
  V(() => {
1122
1122
  var H;
1123
- C || W.has((H = p[p.length - 1]) == null ? void 0 : H.id) && lt && x && ht();
1124
- }, [lt, x, m, Mt, O, k, Dt, St]);
1123
+ C || W.has((H = p[p.length - 1]) == null ? void 0 : H.id) && K && x && ht();
1124
+ }, [K, x, m, Mt, O, k, Dt, St]);
1125
1125
  const Ht = {
1126
1126
  direction: m,
1127
1127
  algorithm: y,
1128
1128
  autoLayout: x,
1129
1129
  layoutInProgress: w,
1130
+ childrenInitialized: K,
1130
1131
  padding: G,
1131
1132
  nodeSpacing: O,
1132
1133
  layerSpacing: k,
@@ -1136,7 +1137,7 @@ function Ce({
1136
1137
  parentResizingOptions: R,
1137
1138
  layoutEngines: L,
1138
1139
  layoutEngineOptions: M,
1139
- nodeParentIdMapWithChildIdSet: at,
1140
+ nodeParentIdMapWithChildIdSet: lt,
1140
1141
  nodeIdWithNode: W,
1141
1142
  noParentKey: b,
1142
1143
  updateNodes: s,
@@ -1146,8 +1147,8 @@ function Ce({
1146
1147
  setAutoLayout: q,
1147
1148
  setLayoutInProgress: I,
1148
1149
  setPadding: Tt,
1149
- setNodeSpacing: ot,
1150
- setLayerSpacing: it,
1150
+ setNodeSpacing: it,
1151
+ setLayerSpacing: st,
1151
1152
  setNodeWidth: kt,
1152
1153
  setNodeHeight: Bt,
1153
1154
  setLayoutHidden: Q,
@@ -1 +1 @@
1
- (function(M,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react/jsx-runtime"),require("react"),require("@xyflow/react"),require("@dagrejs/dagre")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@xyflow/react","@dagrejs/dagre"],n):(M=typeof globalThis<"u"?globalThis:M||self,n(M.reactFlowAutomatedLayout={},M.jsxRuntime,M.React,M.ReactFlow,M.dagre))})(this,function(M,n,k,B,rt){"use strict";const ot=k.createContext(void 0);function P(){const t=k.useContext(ot);if(t===void 0)throw new Error("useLayoutContext must be used within a LayoutProvider");return t}const st=t=>{switch(t){case"DOWN":return"TB";case"RIGHT":return"LR";case"UP":return"BT";case"LEFT":return"RL";default:return"TB"}},nt=t=>{switch(t){case"TB":return"DOWN";case"LR":return"RIGHT";case"BT":return"UP";case"RL":return"LEFT";default:return"DOWN"}},Et={enabled:!0,padding:{horizontal:80,vertical:48},respectHeaderHeight:!0,minWidth:200,minHeight:100},vt=t=>{switch(t){case"DOWN":return B.Position.Bottom;case"RIGHT":return B.Position.Right;case"UP":return B.Position.Top;case"LEFT":return B.Position.Left;default:return B.Position.Bottom}},Nt=t=>{switch(t){case"DOWN":return B.Position.Top;case"RIGHT":return B.Position.Left;case"UP":return B.Position.Bottom;case"LEFT":return B.Position.Right;default:return B.Position.Top}};function kt(t,r,e){if(e)return{nodes:t,edges:r};const s=t.filter(h=>!h.hidden),o=new Set(s.map(h=>h.id)),i=r.filter(h=>o.has(h.source)&&o.has(h.target));return{nodes:s,edges:i}}const Bt=172,Tt=36,V=async(t,r,e,s=0,o=50,i=50,h=Bt,a=Tt,d=!1)=>{const l=new rt.graphlib.Graph().setDefaultEdgeLabel(()=>({}));l.setGraph({rankdir:e,marginx:s,marginy:s,nodesep:o,ranksep:i,edgesep:Math.max(20,o/4),ranker:"tight-tree"});const c=d?t:t.filter(g=>!g.hidden);if(c.length===0)return{nodes:[],edges:[],width:0,height:0};c.forEach(g=>{var y,x;const f=Number((y=g.style)==null?void 0:y.width)||h,b=Number((x=g.style)==null?void 0:x.height)||a;l.setNode(g.id,{width:f,height:b})}),r.forEach(g=>{var v,E;const f=g.sourceHandle,b=g.targetHandle,y=!!((v=g.data)!=null&&v.isReciprocal),x=!!((E=g.data)!=null&&E.isSyntheticBridge);let w={};y?w={constraint:!1,minlen:1,weight:5}:x?w={constraint:!0,minlen:1,weight:4}:f==="right"&&b==="left"?w={constraint:!1,minlen:1}:f==="bottom"&&b==="top"?w={constraint:!0,minlen:1}:w={constraint:!0,minlen:2},l.setEdge(g.source,g.target,w)}),rt.layout(l);const u=l.graph().width||0,p=l.graph().height||0,N=vt(nt(e)),C=Nt(nt(e));return{nodes:c.map(g=>{var E;const f=l.node(g.id),{width:b,height:y}=f,x={...g,sourcePosition:N,targetPosition:C,selected:!1},w=f.x,v=f.y;switch((E=g.data)==null?void 0:E.positionType){case"center":x.position={x:w,y:v};break;case"topRight":x.position={x:w+b/2,y:v-y/2};break;case"bottomLeft":x.position={x:w-b/2,y:v+y/2};break;case"bottomRight":x.position={x:w+b/2,y:v+y/2};break;case"topLeft":default:x.position={x:w-b/2,y:v-y/2}}return x}),edges:r,width:u,height:p}},it={calculate:async(t,r,e)=>{const s=e.nodes||t,o=e.edges||r,h=e.dagreDirection||typeof e.direction=="string"&&(e.direction==="RIGHT"||e.direction==="LEFT"?"LR":"TB")||"TB",a=e.margin??(typeof e.padding=="number"?e.padding:0),d=e.nodeSpacing??50,l=e.layerSpacing??50,c=e.nodeWidth??172,u=e.nodeHeight??36,p=e.layoutHidden??!1;return V(s,o,h,a,d,l,c,u,p)}},ct={dagre:it};function St({initialDirection:t="DOWN",initialAlgorithm:r="layered",initialAutoLayout:e=!0,initialPadding:s=50,initialSpacing:o={node:50,layer:50},initialNodeDimensions:i={width:172,height:36},initialParentResizingOptions:h,includeHidden:a=!1,layoutEngines:d}){const[l,c]=k.useState(t),[u,p]=k.useState(r),[N,C]=k.useState(e),[L,g]=k.useState(!1),[f,b]=k.useState(a),[y,x]=k.useState({...ct,...d}),[w,v]=k.useState({}),[E,D]=k.useState(s),[G,m]=k.useState(o.node||150),[S,T]=k.useState(o.layer||180),[O,A]=k.useState(i.width||100),[_,W]=k.useState(i.height||100),[$,K]=k.useState({...Et,...h,enabled:e}),[j,R]=k.useState([]);return{direction:l,algorithm:u,autoLayout:N,layoutInProgress:L,layoutHidden:f,layoutEngines:y,layoutEngineOptions:w,padding:E,nodeSpacing:G,layerSpacing:S,nodeWidth:O,nodeHeight:_,parentResizingOptions:$,selectedNodes:j,setDirection:c,setAlgorithm:p,setAutoLayout:C,setLayoutInProgress:g,setLayoutHidden:b,setLayoutEngines:x,setLayoutEngineOptions:v,setPadding:D,setNodeSpacing:m,setLayerSpacing:T,setNodeWidth:A,setNodeHeight:W,setParentResizingOptionsState:K,setSelectedNodes:R}}function Mt({nodes:t,externalNodeIdWithNode:r,externalNodeParentIdMapWithChildIdSet:e,noParentKey:s="no-parent"}){const[o,i]=k.useState(new Map),[h,a]=k.useState(new Map),[d,l]=k.useState({}),[c,u]=k.useState(t.length),[p,N]=k.useState(!1),C=r||o,L=e||h,g=C.size;return k.useEffect(()=>{if(!r||!e){const f=new Map,b=new Map;t.forEach(y=>{var w;f.set(y.id,y);const x=y.parentId||s;b.has(x)||b.set(x,new Set),(w=b.get(x))==null||w.add(y.id)}),r||i(f),e||a(b)}},[t,r,e,s]),k.useEffect(()=>{t.length!==c&&u(t.length)},[t]),k.useEffect(()=>{C.size>0&&L.size>0&&!p&&N(!0)},[C,L,p]),k.useEffect(()=>{const f={};L.forEach((y,x)=>{f[x]=y.size});let b=!1;for(const y in f)if(!d.hasOwnProperty(y)||f[y]!==d[y]){b=!0;break}b&&l(f)},[L]),{nodeIdWithNode:C,nodeParentIdMapWithChildIdSet:L,numberOfNodes:g,nodesLength:c,childrenInitialized:p,parentChildStructure:d}}function Dt({nodes:t,edges:r,selectedNodes:e,layoutHidden:s,calculateLayout:o,calculateContainerLayout:i,updateNodes:h,updateEdges:a,setLayoutInProgress:d,setNodeSpacing:l,setLayerSpacing:c}){const u=B.useReactFlow(),p=k.useRef(null),N=k.useRef(null),C=k.useCallback(async(g=[],f=[])=>{p.current&&p.current.abort();const b=new AbortController;p.current=b;const y=g.length>0?g:t,x=f.length>0?f:r;if(y.length===0)return{nodes:y,edges:x};try{if(d(!0),b.signal.aborted)return{nodes:y,edges:x};const{nodes:w,edges:v}=kt(y,x,s),E=await o(w,v,e,b.signal);return b.signal.aborted?{nodes:y,edges:x}:(p.current===b&&(h?h(E.nodes):u!=null&&u.setNodes&&u.setNodes(E.nodes),a?a(E.edges):u!=null&&u.setEdges&&u.setEdges(E.edges),N.current&&(N.current.node!==void 0&&l(N.current.node),N.current.layer!==void 0&&c(N.current.layer),N.current=null)),E)}catch(w){return b.signal.aborted||console.error("Error applying layout:",w),{nodes:y,edges:x}}finally{p.current===b&&(d(!1),p.current=null)}},[t,r,e,o,h,a,u,s,d,l,c]),L=k.useCallback(async g=>{p.current&&p.current.abort();const f=new AbortController;if(p.current=f,t.length===0)return{nodes:t,edges:r};try{if(d(!0),f.signal.aborted)return{nodes:t,edges:r};const b=await i(g,t,r,f.signal);return f.signal.aborted?{nodes:t,edges:r}:(p.current===f&&(h?h(b.nodes):u!=null&&u.setNodes&&u.setNodes(b.nodes),a?a(b.edges):u!=null&&u.setEdges&&u.setEdges(b.edges)),b)}catch(b){return f.signal.aborted||console.error("Error applying container layout:",b),{nodes:t,edges:r}}finally{p.current===f&&(d(!1),p.current=null)}},[t,r,i,h,a,u,d]);return{applyLayout:C,applyContainerLayout:L,pendingSpacingUpdateRef:N}}const Ot=(t,r,e="no-parent")=>{const s=new Set,o=new Map;t.forEach((a,d)=>{const l=r.get(d);l&&o.set(d,{id:d,node:l,children:[],depth:0})});const i=(a,d)=>{if(s.has(a)||!t.has(a)||!r.get(a))return null;s.add(a);const c=o.get(a);c.depth=d;const u=t.get(a)||new Set;for(const p of u)if(t.has(p)&&r.get(p)){const C=i(p,d+1);C&&c.children.push(C)}return c},h=[];return t.forEach((a,d)=>{const l=r.get(d);if(l){const c=l.parentId;if(!c||c===e){const u=i(d,0);u&&h.push(u)}}}),h};function I(t,r,e="no-parent"){const s=[];let o=t;const i=new Set;for(;o&&o!==e;){if(i.has(o)){console.warn(`Cycle detected in ancestor path for node ${t}`);break}i.add(o),s.push(o);const h=r.get(o);if(!h||!h.parentId){o=e;break}o=h.parentId}return o===e&&s.push(e),s}function z(t,r,e,s="no-parent"){if(t===r)return t;const o=I(t,e,s),i=o.indexOf(r);return i===-1?null:i===0?t:o[i-1]||null}function U(t,r,e,s="no-parent"){const o=I(t,e,s),i=I(r,e,s),h=new Set(i);let a=null,d=-1;for(let p=0;p<o.length;p++)if(h.has(o[p])){a=o[p],d=p;break}if(!a)return{lca:null,sourceChild:null,targetChild:null};const l=i.indexOf(a),c=d>0?o[d-1]:t,u=l>0?i[l-1]:r;return{lca:a,sourceChild:c,targetChild:u}}const At=t=>JSON.parse(JSON.stringify(t)),at=(t,r,e,s,o)=>{const i=At(t);return i.source=r,i.target=e,i.id=s,i.data={...i.data,...o},i},zt=t=>{for(const r of t.values()){const e=new Map;r.forEach(o=>{const i=`${o.source}->${o.target}`,h=e.get(i)||[];h.push(o),e.set(i,h)});const s=new Set;r.forEach(o=>{const i=`${o.source}->${o.target}`,h=`${o.target}->${o.source}`;if(s.has(i)||s.has(h))return;const a=e.get(h);if(!a||a.length===0)return;[...e.get(i)||[],...a].forEach(l=>{l.data={...l.data,isReciprocal:!0}}),s.add(i),s.add(h)})}},mt=(t,r,e,s)=>{const o=new Map,i=new Map;t.forEach(a=>{const d=o.get(a.target)||[];d.push(a),o.set(a.target,d);const l=i.get(a.source)||[];l.push(a),i.set(a.source,l)});const h=new Set;i.forEach((a,d)=>{const l=o.get(d)||[];l.length!==0&&l.forEach(c=>{a.forEach(u=>{if(c.source===u.target)return;const{lca:p,sourceChild:N,targetChild:C}=U(c.source,u.target,r,s),L=U(c.source,d,r,s).lca,g=U(d,u.target,r,s).lca;if(!L||L!==g)return;const f=z(c.source,L,r,s),b=z(u.target,L,r,s),y=z(d,L,r,s);if(!f||!b||!y||f!==b||f===y)return;const x=f,w=z(c.source,x,r,s),v=z(u.target,x,r,s);if(!p||!N||!C||!w||!v||w===v)return;const E=`synthetic_bridge_${c.id}_${d}_${u.id}_${x}`;if(h.has(E))return;const D=at(c,w,v,E,{isTemporary:!0,isSyntheticBridge:!0,bridgeNode:d,bridgeBranch:y,anchorBranch:f,originalSource:c.source,originalTarget:u.target});e.has(x)||e.set(x,[]),e.get(x).push(D),h.add(E)})})})};function X(t,r,e="no-parent"){const s=new Map;for(const o of t){const{lca:i,sourceChild:h,targetChild:a}=U(o.source,o.target,r,e);if(i&&h&&a&&h!==a){const d=at(o,h,a,`temp_${o.id}_${i}`,{isTemporary:!0,originalSource:o.source,originalTarget:o.target});s.has(i)||s.set(i,[]),s.get(i).push(d)}}return mt(t,r,s,e),zt(s),s}const q=10,lt=(t,r)=>t.find(e=>e.id===r),ht=(t,r,e)=>{var a,d;const s=e.get(t);if(!s)return null;let o=s.position.x+(s.width||Number((a=s.style)==null?void 0:a.width)||172)/2,i=s.position.y+(s.height||Number((d=s.style)==null?void 0:d.height)||36)/2,h=s.parentId;for(;h&&h!==r;){const l=e.get(h);if(!l)break;o+=l.position.x,i+=l.position.y,h=l.parentId}return{x:o,y:i}},H=t=>{var r,e;return{width:t.width||Number((r=t.style)==null?void 0:r.width)||172,height:t.height||Number((e=t.style)==null?void 0:e.height)||36}},dt=t=>{const{width:r,height:e}=H(t);return{x:t.position.x+r/2,y:t.position.y+e/2}},Gt=(t,r)=>{if(t.length===0)return{nodes:t,width:0,height:0};let e=Number.POSITIVE_INFINITY,s=Number.POSITIVE_INFINITY,o=Number.NEGATIVE_INFINITY,i=Number.NEGATIVE_INFINITY;t.forEach(c=>{const{width:u,height:p}=H(c);e=Math.min(e,c.position.x),s=Math.min(s,c.position.y),o=Math.max(o,c.position.x+u),i=Math.max(i,c.position.y+p)});const h=r-e,a=r-s;t.forEach(c=>{c.position={x:c.position.x+h,y:c.position.y+a}});const d=o-e+r*2,l=i-s+r*2;return{nodes:t,width:d,height:l}},_t=(t,r,e,s)=>{if(!(t.length<2||s.size===0))if(r==="TB"||r==="BT"){const o=[...t].sort((i,h)=>i.position.x-h.position.x);o.forEach((i,h)=>{if(!s.has(i.id))return;let a=i.position.x+H(i).width;for(let d=h+1;d<o.length;d++){const l=o[d],{width:c}=H(l),u=a+e;l.position.x<u&&(l.position.x=u),a=l.position.x+c}})}else{const o=[...t].sort((i,h)=>i.position.y-h.position.y);o.forEach((i,h)=>{if(!s.has(i.id))return;let a=i.position.y+H(i).height;for(let d=h+1;d<o.length;d++){const l=o[d],{height:c}=H(l),u=a+e;l.position.y<u&&(l.position.y=u),a=l.position.y+c}})}},Ht=(t,r,e,s)=>{const o=new Map,i=new Map;r.forEach(a=>{const d=o.get(a.target)||[];d.push(a),o.set(a.target,d);const l=i.get(a.source)||[];l.push(a),i.set(a.source,l)});const h=new Map;return i.forEach((a,d)=>{const l=o.get(d)||[];l.length!==0&&l.forEach(c=>{a.forEach(u=>{if(c.source===u.target)return;const p=U(c.source,d,e,s).lca,N=U(d,u.target,e,s).lca;if(p!==t||N!==t)return;const C=z(c.source,t,e,s),L=z(u.target,t,e,s),g=z(d,t,e,s);if(!C||!L||!g||C!==L||C===g)return;const f=z(c.source,C,e,s),b=z(u.target,C,e,s);if(!f||!b||f===b)return;const y=`${C}:${g}:${f}:${b}`;h.set(y,{anchorContainerId:C,bridgeContainerId:g,sourceNodeId:f,targetNodeId:b})})})}),[...h.values()]},Ft=(t,r,e,s,o,i,h)=>{const a=Ht(r,o,i,h),d=new Set;return a.forEach(l=>{const c=lt(t,l.anchorContainerId),u=lt(t,l.bridgeContainerId);if(!c||!u)return;const p=ht(l.sourceNodeId,r,i),N=ht(l.targetNodeId,r,i);if(!p||!N)return;const{width:C,height:L}=H(u),{width:g,height:f}=H(c),b=dt(c),y=dt(u);if(e==="TB"||e==="BT"){const x=(p.y+N.y)/2;u.position.y=x-L/2;const w=y.x>=b.x,v=w?u.position.x-(c.position.x+g):c.position.x-(u.position.x+C),E=Math.max(s,v);u.position.x=w?c.position.x+g+E:c.position.x-C-E}else{const x=(p.x+N.x)/2;u.position.x=x-C/2;const w=y.y>=b.y,v=w?u.position.y-(c.position.y+f):c.position.y-(u.position.y+L),E=Math.max(s,v);u.position.y=w?c.position.y+f+E:c.position.y-L-E}d.add(u.id)}),d},ut=async(t,r,e,s,o,i=q,h=50,a=50,d=172,l=36,c=V,u=!1,p="no-parent")=>{const N=X(o,s,p),{updatedNodes:C}=await Y(t,r,e,s,o,i,h,a,d,l,c,u,N,p),L=s.get(t);if(!L)return{updatedNodes:C,updatedEdges:o};const{updatedNodes:g}=await ut(L.parentId||p,r,e,s,o,i,h,a,d,l,c,u,p);return{updatedNodes:[...g,...C],updatedEdges:o}},Y=async(t,r,e,s,o,i=q,h=50,a=50,d=172,l=36,c=V,u=!1,p=new Map,N="no-parent")=>{const C=e.get(t);if(!C||C.size===0)return{updatedNodes:[]};const L=[];if(C.forEach(E=>{const D=s.get(E);D&&L.push(D)}),L.length===0)return{updatedNodes:[]};let g=r;const f=s.get(t);f&&f.data.layoutDirection&&(g=f.data.layoutDirection);const b=p.get(t)||[],{nodes:y,edges:x}=await c(L,b,g,i,h,a,d,l,u);y.forEach(E=>{s.set(E.id,E)});const w=Ft(y,t,g,h,o,s,N);_t(y,g,h,w),y.forEach(E=>{s.set(E.id,E)});const v=Gt(y,i);return v.nodes.forEach(E=>{s.set(E.id,E)}),f&&v.width&&v.height&&Pt(f,v.width,v.height),{updatedNodes:[...v.nodes],udpatedParentNode:f||void 0}},Pt=(t,r,e)=>(t.style||(t.style={}),t.width=r,t.height=e,t.measured={width:r,height:e},t.style.width=r,t.style.height=e,t),Ut=async(t,r,e,s,o,i=q,h=50,a=50,d=172,l=36,c=V,u=!1,p="no-parent")=>{let N=[];const C=X(o,s,p),L=new Map;let g=0;const f=(y,x)=>{x>g&&(g=x);for(const w of y)L.has(x)||L.set(x,[]),L.get(x).push(w.id),w.children.length>0&&f(w.children,x+1)};f(t,0);for(let y=g;y>=0;y--){const x=L.get(y)||[],w=await Promise.all(x.map(v=>Y(v,r,e,s,o,i,h,a,d,l,c,u,C,p)));for(const{updatedNodes:v}of w)N=[...v,...N]}const{updatedNodes:b}=await Y(p,r,e,s,o,i,h,a,d,l,c,u,C,p);return N=[...b,...N],{updatedNodes:N,updatedEdges:o}},Vt=(t,r,e,s="no-parent")=>{const o=t.map(l=>l.id),i=t.map(l=>{var c;return((c=e.get(l.id))==null?void 0:c.parentId)||l.parentId}).filter(l=>!!l),a=Array.from(new Set([...o,...i])).filter(l=>r.has(l)),d=a.filter(l=>{const c=e.get(l);return c?!c.parentId||!a.includes(c.parentId):!0});return d.length===0?[s]:d},Yt=async(t,r,e)=>{const{dagreDirection:s,nodeParentIdMapWithChildIdSet:o,nodeIdWithNode:i,nodes:h,edges:a,margin:d,nodeSpacing:l,layerSpacing:c,nodeWidth:u,nodeHeight:p,layoutHidden:N=!1,noParentKey:C="no-parent"}=r,L=Vt(t,o,i,C);if(L.length===0)return{nodes:h,edges:a};const g=new Map,f=new Map;if(e!=null&&e.aborted)return{nodes:h,edges:a};(await Promise.all(L.map(async w=>e!=null&&e.aborted?{updatedNodes:[],updatedEdges:[]}:ut(w,s,o,i,a,d,l,c,u,p,void 0,N)))).forEach(({updatedNodes:w,updatedEdges:v})=>{w.forEach(E=>{g.set(E.id,E)}),v.forEach(E=>{f.set(E.id,E)})});const y=h.map(w=>g.has(w.id)?g.get(w.id):w),x=a.map(w=>f.has(w.id)?f.get(w.id):w);return{nodes:y,edges:x}},jt=(t,r,e,s,o,i,h,a,d=172,l=36,c=!1,u="no-parent")=>{const p=k.useCallback(async(C,L,g,f)=>{if(!(t[e]||t.dagre))return console.error(`Layout engine "${e}" not found`),{nodes:C,edges:L};const y=c?C:C.filter(S=>!S.hidden),x=new Set(y.map(S=>S.id)),w=c?L:L.filter(S=>x.has(S.source)&&x.has(S.target)),v=st(r),E=s.padding.horizontal;let D=[],G=[];if(g&&g.length>0){const S=c?g:g.filter(O=>!O.hidden),T=await Yt(S,{dagreDirection:v,nodeParentIdMapWithChildIdSet:o,nodeIdWithNode:i,nodes:y,edges:w,margin:E,nodeSpacing:h,layerSpacing:a,nodeWidth:d,nodeHeight:l,layoutHidden:c,noParentKey:u},f);D=T.nodes,G=T.edges}else{if(f!=null&&f.aborted)return{nodes:C,edges:L};const S=Ot(o,i,u),T=await Ut(S,v,o,i,w,E,h,a,d,l,void 0,c,u);D=T.updatedNodes,G=T.updatedEdges}return{nodes:C.map(S=>!c&&S.hidden?S:D.find(O=>O.id===S.id)||S),edges:G}},[e,r,t,s.padding.horizontal,o,i,h,a,d,l,c,u]),N=k.useCallback(async(C,L,g,f)=>{if(f!=null&&f.aborted)return{nodes:L,edges:g};const b=st(r),y=s.padding.horizontal,x=c?L:L.filter(T=>!T.hidden),w=new Set(x.map(T=>T.id)),v=c?g:g.filter(T=>w.has(T.source)&&w.has(T.target)),E=X(v,i,u),D=T=>{const O=[],A=o.get(T);if(A)for(const _ of A)o.has(_)&&O.push(...D(_));return O.push(T),O},G=D(C),m=new Map;for(const T of G){if(f!=null&&f.aborted)return{nodes:L,edges:g};const{updatedNodes:O,udpatedParentNode:A}=await Y(T,b,o,i,v,y,h,a,d,l,void 0,c,E,u);O.forEach(_=>m.set(_.id,_)),A&&m.set(A.id,{...A})}return{nodes:L.map(T=>m.get(T.id)??T),edges:g}},[r,s.padding.horizontal,o,i,h,a,d,l,c,u]);return{calculateLayout:p,calculateContainerLayout:N}};function It({children:t,initialDirection:r="DOWN",initialAlgorithm:e="layered",initialAutoLayout:s=!0,initialPadding:o=50,initialSpacing:i={node:50,layer:50},initialNodeDimensions:h={width:172,height:36},initialParentResizingOptions:a,includeHidden:d=!1,layoutEngines:l,updateNodes:c,updateEdges:u,nodeParentIdMapWithChildIdSet:p,nodeIdWithNode:N,noParentKey:C="no-parent",disableAutoLayoutEffect:L=!1}){const g=B.useNodes(),f=B.useEdges(),{direction:b,algorithm:y,autoLayout:x,layoutInProgress:w,layoutHidden:v,layoutEngines:E,layoutEngineOptions:D,padding:G,nodeSpacing:m,layerSpacing:S,nodeWidth:T,nodeHeight:O,parentResizingOptions:A,selectedNodes:_,setDirection:W,setAlgorithm:$,setAutoLayout:K,setLayoutInProgress:j,setLayoutHidden:R,setLayoutEngines:gt,setLayoutEngineOptions:qt,setPadding:Jt,setNodeSpacing:pt,setLayerSpacing:yt,setNodeWidth:Zt,setNodeHeight:Qt,setParentResizingOptionsState:xt,setSelectedNodes:wt}=St({initialDirection:r,initialAlgorithm:e,initialAutoLayout:s,initialPadding:o,initialSpacing:i,initialNodeDimensions:h,initialParentResizingOptions:a,includeHidden:d,layoutEngines:l}),{nodeIdWithNode:tt,nodeParentIdMapWithChildIdSet:bt,numberOfNodes:Wt,nodesLength:$t,childrenInitialized:Ct,parentChildStructure:Kt}=Mt({nodes:g,externalNodeIdWithNode:N,externalNodeParentIdMapWithChildIdSet:p,noParentKey:C}),Rt=k.useCallback(({nodes:F})=>{wt(F)},[wt]);B.useOnSelectionChange({onChange:Rt});const{calculateLayout:te,calculateContainerLayout:ee}=jt(E,b,y,A,bt,tt,m,S,T,O,v,C),{applyLayout:Lt,applyContainerLayout:re}=Dt({nodes:g,edges:f,selectedNodes:_,layoutHidden:v,calculateLayout:te,calculateContainerLayout:ee,updateNodes:c,updateEdges:u,setLayoutInProgress:j,setNodeSpacing:pt,setLayerSpacing:yt}),oe=k.useCallback((F,et)=>{gt(ie=>({...ie,[F]:et}))},[gt]),se=k.useCallback(F=>{xt(et=>({...et,...F,enabled:x}))},[x,xt]);k.useEffect(()=>{var F;L||tt.has((F=g[g.length-1])==null?void 0:F.id)&&Ct&&x&&Lt()},[Ct,x,b,Wt,m,S,Kt,$t]);const ne={direction:b,algorithm:y,autoLayout:x,layoutInProgress:w,padding:G,nodeSpacing:m,layerSpacing:S,nodeWidth:T,nodeHeight:O,layoutHidden:v,parentResizingOptions:A,layoutEngines:E,layoutEngineOptions:D,nodeParentIdMapWithChildIdSet:bt,nodeIdWithNode:tt,noParentKey:C,updateNodes:c,updateEdges:u,setDirection:W,setAlgorithm:$,setAutoLayout:K,setLayoutInProgress:j,setPadding:Jt,setNodeSpacing:pt,setLayerSpacing:yt,setNodeWidth:Zt,setNodeHeight:Qt,setLayoutHidden:R,setParentResizingOptions:se,setLayoutEngineOptions:qt,applyLayout:Lt,applyContainerLayout:re,clearLayoutCache:()=>{},registerLayoutEngine:oe};return n.jsx(ot.Provider,{value:ne,children:t})}const J=({compact:t=!1})=>{const{direction:r,setDirection:e,clearLayoutCache:s}=P(),o=i=>{e(i),s&&s()};return t?n.jsx(B.ControlButton,{onClick:()=>o(r==="DOWN"?"RIGHT":"DOWN"),title:`Switch to ${r==="DOWN"?"horizontal":"vertical"} layout`,children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:r==="DOWN"?n.jsx("path",{d:"M4 12h16M16 6l6 6-6 6"}):n.jsx("path",{d:"M12 4v16M6 16l6 6 6-6"})})}):n.jsxs(n.Fragment,{children:[n.jsx(B.ControlButton,{onClick:()=>o("DOWN"),className:r==="DOWN"?"selected":"",title:"Top to Bottom",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M12 4v16M6 16l6 6 6-6"})})}),n.jsx(B.ControlButton,{onClick:()=>o("RIGHT"),className:r==="RIGHT"?"selected":"",title:"Left to Right",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M4 12h16M16 6l6 6-6 6"})})}),n.jsx(B.ControlButton,{onClick:()=>o("LEFT"),className:r==="LEFT"?"selected":"",title:"Right to Left",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M20 12H4M8 6L2 12l6 6"})})}),n.jsx(B.ControlButton,{onClick:()=>o("UP"),className:r==="UP"?"selected":"",title:"Bottom to Top",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M12 20V4M6 8l6-6 6 6"})})})]})},Z=({compact:t=!1})=>{const{nodeSpacing:r,layerSpacing:e,setNodeSpacing:s,setLayerSpacing:o,clearLayoutCache:i}=P(),[h,a]=k.useState(!1),d=c=>{s(c),i&&i()},l=c=>{o(c),i&&i()};return t?n.jsxs("div",{style:{position:"relative"},children:[n.jsx(B.ControlButton,{onClick:()=>a(!h),title:"Adjust node and layer spacing",children:n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"3",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("path",{d:"M7 10v4M17 10v4M10 7h4M10 17h4"})]})}),h&&n.jsxs("div",{className:"react-flow-spacing-dropdown",style:{position:"absolute",right:"0",top:"100%",marginTop:"8px",background:"white",border:"1px solid #ddd",borderRadius:"4px",padding:"8px",boxShadow:"0 2px 10px rgba(0,0,0,0.1)",zIndex:10,minWidth:"200px"},children:[n.jsxs("div",{style:{marginBottom:"12px"},children:[n.jsxs("div",{style:{fontWeight:"bold",marginBottom:"4px"},children:["Node Spacing: ",r,"px"]}),n.jsx("div",{style:{display:"flex",gap:"4px"},children:[50,100,150,200].map(c=>n.jsx("button",{onClick:()=>d(c),style:{background:r===c?"#0041d0":"#f5f5f5",color:r===c?"white":"inherit",border:"1px solid #ddd",borderRadius:"4px",padding:"4px 8px",cursor:"pointer"},children:c},c))})]}),n.jsxs("div",{children:[n.jsxs("div",{style:{fontWeight:"bold",marginBottom:"4px"},children:["Layer Spacing: ",e,"px"]}),n.jsx("div",{style:{display:"flex",gap:"4px"},children:[50,100,150,200].map(c=>n.jsx("button",{onClick:()=>l(c),style:{background:e===c?"#0041d0":"#f5f5f5",color:e===c?"white":"inherit",border:"1px solid #ddd",borderRadius:"4px",padding:"4px 8px",cursor:"pointer"},children:c},c))})]}),n.jsx("div",{style:{marginTop:"12px",textAlign:"right"},children:n.jsx("button",{onClick:()=>a(!1),style:{background:"#f5f5f5",border:"1px solid #ddd",borderRadius:"4px",padding:"4px 8px",cursor:"pointer"},children:"Close"})})]})]}):n.jsxs("div",{className:"spacing-controls",children:[n.jsxs(B.ControlButton,{onClick:()=>d(Math.max(50,r-25)),title:"Decrease node spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"3",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("line",{x1:"7",y1:"10",x2:"7",y2:"14"}),n.jsx("line",{x1:"17",y1:"10",x2:"17",y2:"14"}),n.jsx("line",{x1:"10",y1:"7",x2:"14",y2:"7"}),n.jsx("line",{x1:"10",y1:"17",x2:"14",y2:"17"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"-"})]}),n.jsxs("div",{style:{display:"inline-flex",alignItems:"center",padding:"5px 10px",fontSize:"12px",background:"#f8f8f8",borderRadius:"4px",margin:"0 4px",border:"1px solid #ddd"},children:[r,"px"]}),n.jsxs(B.ControlButton,{onClick:()=>d(Math.min(300,r+25)),title:"Increase node spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"3",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("line",{x1:"7",y1:"10",x2:"7",y2:"14"}),n.jsx("line",{x1:"17",y1:"10",x2:"17",y2:"14"}),n.jsx("line",{x1:"10",y1:"7",x2:"14",y2:"7"}),n.jsx("line",{x1:"10",y1:"17",x2:"14",y2:"17"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"+"})]}),n.jsx("div",{style:{display:"inline-block",width:"1px",height:"24px",background:"#ddd",margin:"0 10px"}}),n.jsxs(B.ControlButton,{onClick:()=>l(Math.max(50,e-25)),title:"Decrease layer spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("line",{x1:"4",y1:"6",x2:"20",y2:"6"}),n.jsx("line",{x1:"4",y1:"12",x2:"20",y2:"12"}),n.jsx("line",{x1:"4",y1:"18",x2:"20",y2:"18"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"-"})]}),n.jsxs("div",{style:{display:"inline-flex",alignItems:"center",padding:"5px 10px",fontSize:"12px",background:"#f8f8f8",borderRadius:"4px",margin:"0 4px",border:"1px solid #ddd"},children:[e,"px"]}),n.jsxs(B.ControlButton,{onClick:()=>l(Math.min(300,e+25)),title:"Increase layer spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("line",{x1:"4",y1:"6",x2:"20",y2:"6"}),n.jsx("line",{x1:"4",y1:"12",x2:"20",y2:"12"}),n.jsx("line",{x1:"4",y1:"18",x2:"20",y2:"18"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"+"})]})]})},Q=({compact:t=!1})=>{const{autoLayout:r,setAutoLayout:e}=P(),s=()=>{e(!r)};return n.jsx(B.ControlButton,{onClick:s,className:r?"selected":"",title:r?"Disable automatic layout":"Enable automatic layout",style:{color:r?"green":"inherit"},children:t?n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"1.5",fill:"none",children:[n.jsx("rect",{x:"4",y:"4",width:"4",height:"4",rx:"1"}),n.jsx("rect",{x:"4",y:"16",width:"4",height:"4",rx:"1"}),n.jsx("rect",{x:"16",y:"10",width:"4",height:"4",rx:"1"}),n.jsxs(n.Fragment,{children:[n.jsx("path",{d:"M8 6c6 0 3 8 8 6"}),n.jsx("path",{d:"M8 18c3-3 2-8 6-6"})]})]}):n.jsxs(n.Fragment,{children:["Auto-Layout ",r?"ON":"OFF"]})})},ft=({compact:t=!1})=>{const{layoutInProgress:r,setLayoutInProgress:e,applyLayout:s}=P(),o=async()=>{if(!r)try{e(!0),await s()}catch(i){console.error("Error applying layout:",i)}};return n.jsxs(B.ControlButton,{onClick:o,title:"Apply layout",disabled:r,style:{color:r?"#999":"#000"},children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"1.5",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"5",height:"5",rx:"1"}),n.jsx("rect",{x:"16",y:"3",width:"5",height:"5",rx:"1"}),n.jsx("rect",{x:"3",y:"16",width:"5",height:"5",rx:"1"}),n.jsx("rect",{x:"16",y:"16",width:"5",height:"5",rx:"1"}),n.jsx("path",{d:"M8 5.5h8M5.5 8v8M18.5 8v8M8 18.5h8"}),n.jsx("circle",{cx:"12",cy:"12",r:"3"}),n.jsx("path",{d:"M11 10.5v3l2-1.5z",fill:"currentColor"})]}),!t&&n.jsx("span",{style:{marginLeft:"4px"},children:"Apply Layout"})]})},Xt=({showDirectionControls:t=!0,showSpacingControls:r=!0,showAutoLayoutToggle:e=!0,showApplyLayoutButton:s=!0,standalone:o=!1,position:i="top-right"})=>{const h=P(),{autoLayout:a}=h;return o?n.jsxs(B.Controls,{position:i,showZoom:!1,showFitView:!1,showInteractive:!1,children:[s&&!a&&n.jsx(ft,{compact:!0}),t&&n.jsx(J,{compact:!0}),r&&n.jsx(Z,{compact:!0}),e&&n.jsx(Q,{compact:!0})]}):n.jsxs(n.Fragment,{children:[s&&!a&&n.jsx(ft,{compact:!0}),t&&n.jsx(J,{compact:!0}),r&&n.jsx(Z,{compact:!0}),e&&n.jsx(Q,{compact:!0})]})};M.AutoLayoutToggle=Q,M.DagreEngine=it,M.DirectionControls=J,M.LayoutControls=Xt,M.LayoutProvider=It,M.SpacingControls=Z,M.engines=ct,M.useLayoutContext=P,Object.defineProperty(M,Symbol.toStringTag,{value:"Module"})});
1
+ (function(M,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react/jsx-runtime"),require("react"),require("@xyflow/react"),require("@dagrejs/dagre")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@xyflow/react","@dagrejs/dagre"],n):(M=typeof globalThis<"u"?globalThis:M||self,n(M.reactFlowAutomatedLayout={},M.jsxRuntime,M.React,M.ReactFlow,M.dagre))})(this,function(M,n,k,B,ot){"use strict";const st=k.createContext(void 0);function P(){const t=k.useContext(st);if(t===void 0)throw new Error("useLayoutContext must be used within a LayoutProvider");return t}const nt=t=>{switch(t){case"DOWN":return"TB";case"RIGHT":return"LR";case"UP":return"BT";case"LEFT":return"RL";default:return"TB"}},it=t=>{switch(t){case"TB":return"DOWN";case"LR":return"RIGHT";case"BT":return"UP";case"RL":return"LEFT";default:return"DOWN"}},Et={enabled:!0,padding:{horizontal:80,vertical:48},respectHeaderHeight:!0,minWidth:200,minHeight:100},vt=t=>{switch(t){case"DOWN":return B.Position.Bottom;case"RIGHT":return B.Position.Right;case"UP":return B.Position.Top;case"LEFT":return B.Position.Left;default:return B.Position.Bottom}},Nt=t=>{switch(t){case"DOWN":return B.Position.Top;case"RIGHT":return B.Position.Left;case"UP":return B.Position.Bottom;case"LEFT":return B.Position.Right;default:return B.Position.Top}};function kt(t,r,e){if(e)return{nodes:t,edges:r};const s=t.filter(h=>!h.hidden),o=new Set(s.map(h=>h.id)),i=r.filter(h=>o.has(h.source)&&o.has(h.target));return{nodes:s,edges:i}}const Bt=172,Tt=36,V=async(t,r,e,s=0,o=50,i=50,h=Bt,a=Tt,d=!1)=>{const l=new ot.graphlib.Graph().setDefaultEdgeLabel(()=>({}));l.setGraph({rankdir:e,marginx:s,marginy:s,nodesep:o,ranksep:i,edgesep:Math.max(20,o/4),ranker:"tight-tree"});const c=d?t:t.filter(g=>!g.hidden);if(c.length===0)return{nodes:[],edges:[],width:0,height:0};c.forEach(g=>{var y,x;const f=Number((y=g.style)==null?void 0:y.width)||h,b=Number((x=g.style)==null?void 0:x.height)||a;l.setNode(g.id,{width:f,height:b})}),r.forEach(g=>{var v,E;const f=g.sourceHandle,b=g.targetHandle,y=!!((v=g.data)!=null&&v.isReciprocal),x=!!((E=g.data)!=null&&E.isSyntheticBridge);let w={};y?w={constraint:!1,minlen:1,weight:5}:x?w={constraint:!0,minlen:1,weight:4}:f==="right"&&b==="left"?w={constraint:!1,minlen:1}:f==="bottom"&&b==="top"?w={constraint:!0,minlen:1}:w={constraint:!0,minlen:2},l.setEdge(g.source,g.target,w)}),ot.layout(l);const u=l.graph().width||0,p=l.graph().height||0,N=vt(it(e)),C=Nt(it(e));return{nodes:c.map(g=>{var E;const f=l.node(g.id),{width:b,height:y}=f,x={...g,sourcePosition:N,targetPosition:C,selected:!1},w=f.x,v=f.y;switch((E=g.data)==null?void 0:E.positionType){case"center":x.position={x:w,y:v};break;case"topRight":x.position={x:w+b/2,y:v-y/2};break;case"bottomLeft":x.position={x:w-b/2,y:v+y/2};break;case"bottomRight":x.position={x:w+b/2,y:v+y/2};break;case"topLeft":default:x.position={x:w-b/2,y:v-y/2}}return x}),edges:r,width:u,height:p}},ct={calculate:async(t,r,e)=>{const s=e.nodes||t,o=e.edges||r,h=e.dagreDirection||typeof e.direction=="string"&&(e.direction==="RIGHT"||e.direction==="LEFT"?"LR":"TB")||"TB",a=e.margin??(typeof e.padding=="number"?e.padding:0),d=e.nodeSpacing??50,l=e.layerSpacing??50,c=e.nodeWidth??172,u=e.nodeHeight??36,p=e.layoutHidden??!1;return V(s,o,h,a,d,l,c,u,p)}},at={dagre:ct};function St({initialDirection:t="DOWN",initialAlgorithm:r="layered",initialAutoLayout:e=!0,initialPadding:s=50,initialSpacing:o={node:50,layer:50},initialNodeDimensions:i={width:172,height:36},initialParentResizingOptions:h,includeHidden:a=!1,layoutEngines:d}){const[l,c]=k.useState(t),[u,p]=k.useState(r),[N,C]=k.useState(e),[L,g]=k.useState(!1),[f,b]=k.useState(a),[y,x]=k.useState({...at,...d}),[w,v]=k.useState({}),[E,D]=k.useState(s),[G,m]=k.useState(o.node||150),[S,T]=k.useState(o.layer||180),[O,A]=k.useState(i.width||100),[_,W]=k.useState(i.height||100),[$,K]=k.useState({...Et,...h,enabled:e}),[j,R]=k.useState([]);return{direction:l,algorithm:u,autoLayout:N,layoutInProgress:L,layoutHidden:f,layoutEngines:y,layoutEngineOptions:w,padding:E,nodeSpacing:G,layerSpacing:S,nodeWidth:O,nodeHeight:_,parentResizingOptions:$,selectedNodes:j,setDirection:c,setAlgorithm:p,setAutoLayout:C,setLayoutInProgress:g,setLayoutHidden:b,setLayoutEngines:x,setLayoutEngineOptions:v,setPadding:D,setNodeSpacing:m,setLayerSpacing:T,setNodeWidth:A,setNodeHeight:W,setParentResizingOptionsState:K,setSelectedNodes:R}}function Mt({nodes:t,externalNodeIdWithNode:r,externalNodeParentIdMapWithChildIdSet:e,noParentKey:s="no-parent"}){const[o,i]=k.useState(new Map),[h,a]=k.useState(new Map),[d,l]=k.useState({}),[c,u]=k.useState(t.length),[p,N]=k.useState(!1),C=r||o,L=e||h,g=C.size;return k.useEffect(()=>{if(!r||!e){const f=new Map,b=new Map;t.forEach(y=>{var w;f.set(y.id,y);const x=y.parentId||s;b.has(x)||b.set(x,new Set),(w=b.get(x))==null||w.add(y.id)}),r||i(f),e||a(b)}},[t,r,e,s]),k.useEffect(()=>{t.length!==c&&u(t.length),N(!1)},[t]),k.useEffect(()=>{C.size>0&&L.size>0&&!p&&N(!0)},[C,L,p]),k.useEffect(()=>{const f={};L.forEach((y,x)=>{f[x]=y.size});let b=!1;for(const y in f)if(!d.hasOwnProperty(y)||f[y]!==d[y]){b=!0;break}b&&l(f)},[L]),{nodeIdWithNode:C,nodeParentIdMapWithChildIdSet:L,numberOfNodes:g,nodesLength:c,childrenInitialized:p,parentChildStructure:d}}function Dt({nodes:t,edges:r,selectedNodes:e,layoutHidden:s,calculateLayout:o,calculateContainerLayout:i,updateNodes:h,updateEdges:a,setLayoutInProgress:d,setNodeSpacing:l,setLayerSpacing:c}){const u=B.useReactFlow(),p=k.useRef(null),N=k.useRef(null),C=k.useCallback(async(g=[],f=[])=>{p.current&&p.current.abort();const b=new AbortController;p.current=b;const y=g.length>0?g:t,x=f.length>0?f:r;if(y.length===0)return{nodes:y,edges:x};try{if(d(!0),b.signal.aborted)return{nodes:y,edges:x};const{nodes:w,edges:v}=kt(y,x,s),E=await o(w,v,e,b.signal);return b.signal.aborted?{nodes:y,edges:x}:(p.current===b&&(h?h(E.nodes):u!=null&&u.setNodes&&u.setNodes(E.nodes),a?a(E.edges):u!=null&&u.setEdges&&u.setEdges(E.edges),N.current&&(N.current.node!==void 0&&l(N.current.node),N.current.layer!==void 0&&c(N.current.layer),N.current=null)),E)}catch(w){return b.signal.aborted||console.error("Error applying layout:",w),{nodes:y,edges:x}}finally{p.current===b&&(d(!1),p.current=null)}},[t,r,e,o,h,a,u,s,d,l,c]),L=k.useCallback(async g=>{p.current&&p.current.abort();const f=new AbortController;if(p.current=f,t.length===0)return{nodes:t,edges:r};try{if(d(!0),f.signal.aborted)return{nodes:t,edges:r};const b=await i(g,t,r,f.signal);return f.signal.aborted?{nodes:t,edges:r}:(p.current===f&&(h?h(b.nodes):u!=null&&u.setNodes&&u.setNodes(b.nodes),a?a(b.edges):u!=null&&u.setEdges&&u.setEdges(b.edges)),b)}catch(b){return f.signal.aborted||console.error("Error applying container layout:",b),{nodes:t,edges:r}}finally{p.current===f&&(d(!1),p.current=null)}},[t,r,i,h,a,u,d]);return{applyLayout:C,applyContainerLayout:L,pendingSpacingUpdateRef:N}}const Ot=(t,r,e="no-parent")=>{const s=new Set,o=new Map;t.forEach((a,d)=>{const l=r.get(d);l&&o.set(d,{id:d,node:l,children:[],depth:0})});const i=(a,d)=>{if(s.has(a)||!t.has(a)||!r.get(a))return null;s.add(a);const c=o.get(a);c.depth=d;const u=t.get(a)||new Set;for(const p of u)if(t.has(p)&&r.get(p)){const C=i(p,d+1);C&&c.children.push(C)}return c},h=[];return t.forEach((a,d)=>{const l=r.get(d);if(l){const c=l.parentId;if(!c||c===e){const u=i(d,0);u&&h.push(u)}}}),h};function I(t,r,e="no-parent"){const s=[];let o=t;const i=new Set;for(;o&&o!==e;){if(i.has(o)){console.warn(`Cycle detected in ancestor path for node ${t}`);break}i.add(o),s.push(o);const h=r.get(o);if(!h||!h.parentId){o=e;break}o=h.parentId}return o===e&&s.push(e),s}function z(t,r,e,s="no-parent"){if(t===r)return t;const o=I(t,e,s),i=o.indexOf(r);return i===-1?null:i===0?t:o[i-1]||null}function U(t,r,e,s="no-parent"){const o=I(t,e,s),i=I(r,e,s),h=new Set(i);let a=null,d=-1;for(let p=0;p<o.length;p++)if(h.has(o[p])){a=o[p],d=p;break}if(!a)return{lca:null,sourceChild:null,targetChild:null};const l=i.indexOf(a),c=d>0?o[d-1]:t,u=l>0?i[l-1]:r;return{lca:a,sourceChild:c,targetChild:u}}const At=t=>JSON.parse(JSON.stringify(t)),lt=(t,r,e,s,o)=>{const i=At(t);return i.source=r,i.target=e,i.id=s,i.data={...i.data,...o},i},zt=t=>{for(const r of t.values()){const e=new Map;r.forEach(o=>{const i=`${o.source}->${o.target}`,h=e.get(i)||[];h.push(o),e.set(i,h)});const s=new Set;r.forEach(o=>{const i=`${o.source}->${o.target}`,h=`${o.target}->${o.source}`;if(s.has(i)||s.has(h))return;const a=e.get(h);if(!a||a.length===0)return;[...e.get(i)||[],...a].forEach(l=>{l.data={...l.data,isReciprocal:!0}}),s.add(i),s.add(h)})}},mt=(t,r,e,s)=>{const o=new Map,i=new Map;t.forEach(a=>{const d=o.get(a.target)||[];d.push(a),o.set(a.target,d);const l=i.get(a.source)||[];l.push(a),i.set(a.source,l)});const h=new Set;i.forEach((a,d)=>{const l=o.get(d)||[];l.length!==0&&l.forEach(c=>{a.forEach(u=>{if(c.source===u.target)return;const{lca:p,sourceChild:N,targetChild:C}=U(c.source,u.target,r,s),L=U(c.source,d,r,s).lca,g=U(d,u.target,r,s).lca;if(!L||L!==g)return;const f=z(c.source,L,r,s),b=z(u.target,L,r,s),y=z(d,L,r,s);if(!f||!b||!y||f!==b||f===y)return;const x=f,w=z(c.source,x,r,s),v=z(u.target,x,r,s);if(!p||!N||!C||!w||!v||w===v)return;const E=`synthetic_bridge_${c.id}_${d}_${u.id}_${x}`;if(h.has(E))return;const D=lt(c,w,v,E,{isTemporary:!0,isSyntheticBridge:!0,bridgeNode:d,bridgeBranch:y,anchorBranch:f,originalSource:c.source,originalTarget:u.target});e.has(x)||e.set(x,[]),e.get(x).push(D),h.add(E)})})})};function X(t,r,e="no-parent"){const s=new Map;for(const o of t){const{lca:i,sourceChild:h,targetChild:a}=U(o.source,o.target,r,e);if(i&&h&&a&&h!==a){const d=lt(o,h,a,`temp_${o.id}_${i}`,{isTemporary:!0,originalSource:o.source,originalTarget:o.target});s.has(i)||s.set(i,[]),s.get(i).push(d)}}return mt(t,r,s,e),zt(s),s}const q=10,ht=(t,r)=>t.find(e=>e.id===r),dt=(t,r,e)=>{var a,d;const s=e.get(t);if(!s)return null;let o=s.position.x+(s.width||Number((a=s.style)==null?void 0:a.width)||172)/2,i=s.position.y+(s.height||Number((d=s.style)==null?void 0:d.height)||36)/2,h=s.parentId;for(;h&&h!==r;){const l=e.get(h);if(!l)break;o+=l.position.x,i+=l.position.y,h=l.parentId}return{x:o,y:i}},H=t=>{var r,e;return{width:t.width||Number((r=t.style)==null?void 0:r.width)||172,height:t.height||Number((e=t.style)==null?void 0:e.height)||36}},ut=t=>{const{width:r,height:e}=H(t);return{x:t.position.x+r/2,y:t.position.y+e/2}},Gt=(t,r)=>{if(t.length===0)return{nodes:t,width:0,height:0};let e=Number.POSITIVE_INFINITY,s=Number.POSITIVE_INFINITY,o=Number.NEGATIVE_INFINITY,i=Number.NEGATIVE_INFINITY;t.forEach(c=>{const{width:u,height:p}=H(c);e=Math.min(e,c.position.x),s=Math.min(s,c.position.y),o=Math.max(o,c.position.x+u),i=Math.max(i,c.position.y+p)});const h=r-e,a=r-s;t.forEach(c=>{c.position={x:c.position.x+h,y:c.position.y+a}});const d=o-e+r*2,l=i-s+r*2;return{nodes:t,width:d,height:l}},_t=(t,r,e,s)=>{if(!(t.length<2||s.size===0))if(r==="TB"||r==="BT"){const o=[...t].sort((i,h)=>i.position.x-h.position.x);o.forEach((i,h)=>{if(!s.has(i.id))return;let a=i.position.x+H(i).width;for(let d=h+1;d<o.length;d++){const l=o[d],{width:c}=H(l),u=a+e;l.position.x<u&&(l.position.x=u),a=l.position.x+c}})}else{const o=[...t].sort((i,h)=>i.position.y-h.position.y);o.forEach((i,h)=>{if(!s.has(i.id))return;let a=i.position.y+H(i).height;for(let d=h+1;d<o.length;d++){const l=o[d],{height:c}=H(l),u=a+e;l.position.y<u&&(l.position.y=u),a=l.position.y+c}})}},Ht=(t,r,e,s)=>{const o=new Map,i=new Map;r.forEach(a=>{const d=o.get(a.target)||[];d.push(a),o.set(a.target,d);const l=i.get(a.source)||[];l.push(a),i.set(a.source,l)});const h=new Map;return i.forEach((a,d)=>{const l=o.get(d)||[];l.length!==0&&l.forEach(c=>{a.forEach(u=>{if(c.source===u.target)return;const p=U(c.source,d,e,s).lca,N=U(d,u.target,e,s).lca;if(p!==t||N!==t)return;const C=z(c.source,t,e,s),L=z(u.target,t,e,s),g=z(d,t,e,s);if(!C||!L||!g||C!==L||C===g)return;const f=z(c.source,C,e,s),b=z(u.target,C,e,s);if(!f||!b||f===b)return;const y=`${C}:${g}:${f}:${b}`;h.set(y,{anchorContainerId:C,bridgeContainerId:g,sourceNodeId:f,targetNodeId:b})})})}),[...h.values()]},Ft=(t,r,e,s,o,i,h)=>{const a=Ht(r,o,i,h),d=new Set;return a.forEach(l=>{const c=ht(t,l.anchorContainerId),u=ht(t,l.bridgeContainerId);if(!c||!u)return;const p=dt(l.sourceNodeId,r,i),N=dt(l.targetNodeId,r,i);if(!p||!N)return;const{width:C,height:L}=H(u),{width:g,height:f}=H(c),b=ut(c),y=ut(u);if(e==="TB"||e==="BT"){const x=(p.y+N.y)/2;u.position.y=x-L/2;const w=y.x>=b.x,v=w?u.position.x-(c.position.x+g):c.position.x-(u.position.x+C),E=Math.max(s,v);u.position.x=w?c.position.x+g+E:c.position.x-C-E}else{const x=(p.x+N.x)/2;u.position.x=x-C/2;const w=y.y>=b.y,v=w?u.position.y-(c.position.y+f):c.position.y-(u.position.y+L),E=Math.max(s,v);u.position.y=w?c.position.y+f+E:c.position.y-L-E}d.add(u.id)}),d},ft=async(t,r,e,s,o,i=q,h=50,a=50,d=172,l=36,c=V,u=!1,p="no-parent")=>{const N=X(o,s,p),{updatedNodes:C}=await Y(t,r,e,s,o,i,h,a,d,l,c,u,N,p),L=s.get(t);if(!L)return{updatedNodes:C,updatedEdges:o};const{updatedNodes:g}=await ft(L.parentId||p,r,e,s,o,i,h,a,d,l,c,u,p);return{updatedNodes:[...g,...C],updatedEdges:o}},Y=async(t,r,e,s,o,i=q,h=50,a=50,d=172,l=36,c=V,u=!1,p=new Map,N="no-parent")=>{const C=e.get(t);if(!C||C.size===0)return{updatedNodes:[]};const L=[];if(C.forEach(E=>{const D=s.get(E);D&&L.push(D)}),L.length===0)return{updatedNodes:[]};let g=r;const f=s.get(t);f&&f.data.layoutDirection&&(g=f.data.layoutDirection);const b=p.get(t)||[],{nodes:y,edges:x}=await c(L,b,g,i,h,a,d,l,u);y.forEach(E=>{s.set(E.id,E)});const w=Ft(y,t,g,h,o,s,N);_t(y,g,h,w),y.forEach(E=>{s.set(E.id,E)});const v=Gt(y,i);return v.nodes.forEach(E=>{s.set(E.id,E)}),f&&v.width&&v.height&&Pt(f,v.width,v.height),{updatedNodes:[...v.nodes],udpatedParentNode:f||void 0}},Pt=(t,r,e)=>(t.style||(t.style={}),t.width=r,t.height=e,t.measured={width:r,height:e},t.style.width=r,t.style.height=e,t),Ut=async(t,r,e,s,o,i=q,h=50,a=50,d=172,l=36,c=V,u=!1,p="no-parent")=>{let N=[];const C=X(o,s,p),L=new Map;let g=0;const f=(y,x)=>{x>g&&(g=x);for(const w of y)L.has(x)||L.set(x,[]),L.get(x).push(w.id),w.children.length>0&&f(w.children,x+1)};f(t,0);for(let y=g;y>=0;y--){const x=L.get(y)||[],w=await Promise.all(x.map(v=>Y(v,r,e,s,o,i,h,a,d,l,c,u,C,p)));for(const{updatedNodes:v}of w)N=[...v,...N]}const{updatedNodes:b}=await Y(p,r,e,s,o,i,h,a,d,l,c,u,C,p);return N=[...b,...N],{updatedNodes:N,updatedEdges:o}},Vt=(t,r,e,s="no-parent")=>{const o=t.map(l=>l.id),i=t.map(l=>{var c;return((c=e.get(l.id))==null?void 0:c.parentId)||l.parentId}).filter(l=>!!l),a=Array.from(new Set([...o,...i])).filter(l=>r.has(l)),d=a.filter(l=>{const c=e.get(l);return c?!c.parentId||!a.includes(c.parentId):!0});return d.length===0?[s]:d},Yt=async(t,r,e)=>{const{dagreDirection:s,nodeParentIdMapWithChildIdSet:o,nodeIdWithNode:i,nodes:h,edges:a,margin:d,nodeSpacing:l,layerSpacing:c,nodeWidth:u,nodeHeight:p,layoutHidden:N=!1,noParentKey:C="no-parent"}=r,L=Vt(t,o,i,C);if(L.length===0)return{nodes:h,edges:a};const g=new Map,f=new Map;if(e!=null&&e.aborted)return{nodes:h,edges:a};(await Promise.all(L.map(async w=>e!=null&&e.aborted?{updatedNodes:[],updatedEdges:[]}:ft(w,s,o,i,a,d,l,c,u,p,void 0,N)))).forEach(({updatedNodes:w,updatedEdges:v})=>{w.forEach(E=>{g.set(E.id,E)}),v.forEach(E=>{f.set(E.id,E)})});const y=h.map(w=>g.has(w.id)?g.get(w.id):w),x=a.map(w=>f.has(w.id)?f.get(w.id):w);return{nodes:y,edges:x}},jt=(t,r,e,s,o,i,h,a,d=172,l=36,c=!1,u="no-parent")=>{const p=k.useCallback(async(C,L,g,f)=>{if(!(t[e]||t.dagre))return console.error(`Layout engine "${e}" not found`),{nodes:C,edges:L};const y=c?C:C.filter(S=>!S.hidden),x=new Set(y.map(S=>S.id)),w=c?L:L.filter(S=>x.has(S.source)&&x.has(S.target)),v=nt(r),E=s.padding.horizontal;let D=[],G=[];if(g&&g.length>0){const S=c?g:g.filter(O=>!O.hidden),T=await Yt(S,{dagreDirection:v,nodeParentIdMapWithChildIdSet:o,nodeIdWithNode:i,nodes:y,edges:w,margin:E,nodeSpacing:h,layerSpacing:a,nodeWidth:d,nodeHeight:l,layoutHidden:c,noParentKey:u},f);D=T.nodes,G=T.edges}else{if(f!=null&&f.aborted)return{nodes:C,edges:L};const S=Ot(o,i,u),T=await Ut(S,v,o,i,w,E,h,a,d,l,void 0,c,u);D=T.updatedNodes,G=T.updatedEdges}return{nodes:C.map(S=>!c&&S.hidden?S:D.find(O=>O.id===S.id)||S),edges:G}},[e,r,t,s.padding.horizontal,o,i,h,a,d,l,c,u]),N=k.useCallback(async(C,L,g,f)=>{if(f!=null&&f.aborted)return{nodes:L,edges:g};const b=nt(r),y=s.padding.horizontal,x=c?L:L.filter(T=>!T.hidden),w=new Set(x.map(T=>T.id)),v=c?g:g.filter(T=>w.has(T.source)&&w.has(T.target)),E=X(v,i,u),D=T=>{const O=[],A=o.get(T);if(A)for(const _ of A)o.has(_)&&O.push(...D(_));return O.push(T),O},G=D(C),m=new Map;for(const T of G){if(f!=null&&f.aborted)return{nodes:L,edges:g};const{updatedNodes:O,udpatedParentNode:A}=await Y(T,b,o,i,v,y,h,a,d,l,void 0,c,E,u);O.forEach(_=>m.set(_.id,_)),A&&m.set(A.id,{...A})}return{nodes:L.map(T=>m.get(T.id)??T),edges:g}},[r,s.padding.horizontal,o,i,h,a,d,l,c,u]);return{calculateLayout:p,calculateContainerLayout:N}};function It({children:t,initialDirection:r="DOWN",initialAlgorithm:e="layered",initialAutoLayout:s=!0,initialPadding:o=50,initialSpacing:i={node:50,layer:50},initialNodeDimensions:h={width:172,height:36},initialParentResizingOptions:a,includeHidden:d=!1,layoutEngines:l,updateNodes:c,updateEdges:u,nodeParentIdMapWithChildIdSet:p,nodeIdWithNode:N,noParentKey:C="no-parent",disableAutoLayoutEffect:L=!1}){const g=B.useNodes(),f=B.useEdges(),{direction:b,algorithm:y,autoLayout:x,layoutInProgress:w,layoutHidden:v,layoutEngines:E,layoutEngineOptions:D,padding:G,nodeSpacing:m,layerSpacing:S,nodeWidth:T,nodeHeight:O,parentResizingOptions:A,selectedNodes:_,setDirection:W,setAlgorithm:$,setAutoLayout:K,setLayoutInProgress:j,setLayoutHidden:R,setLayoutEngines:pt,setLayoutEngineOptions:qt,setPadding:Jt,setNodeSpacing:yt,setLayerSpacing:xt,setNodeWidth:Zt,setNodeHeight:Qt,setParentResizingOptionsState:wt,setSelectedNodes:bt}=St({initialDirection:r,initialAlgorithm:e,initialAutoLayout:s,initialPadding:o,initialSpacing:i,initialNodeDimensions:h,initialParentResizingOptions:a,includeHidden:d,layoutEngines:l}),{nodeIdWithNode:tt,nodeParentIdMapWithChildIdSet:Ct,numberOfNodes:Wt,nodesLength:$t,childrenInitialized:et,parentChildStructure:Kt}=Mt({nodes:g,externalNodeIdWithNode:N,externalNodeParentIdMapWithChildIdSet:p,noParentKey:C}),Rt=k.useCallback(({nodes:F})=>{bt(F)},[bt]);B.useOnSelectionChange({onChange:Rt});const{calculateLayout:te,calculateContainerLayout:ee}=jt(E,b,y,A,Ct,tt,m,S,T,O,v,C),{applyLayout:Lt,applyContainerLayout:re}=Dt({nodes:g,edges:f,selectedNodes:_,layoutHidden:v,calculateLayout:te,calculateContainerLayout:ee,updateNodes:c,updateEdges:u,setLayoutInProgress:j,setNodeSpacing:yt,setLayerSpacing:xt}),oe=k.useCallback((F,rt)=>{pt(ie=>({...ie,[F]:rt}))},[pt]),se=k.useCallback(F=>{wt(rt=>({...rt,...F,enabled:x}))},[x,wt]);k.useEffect(()=>{var F;L||tt.has((F=g[g.length-1])==null?void 0:F.id)&&et&&x&&Lt()},[et,x,b,Wt,m,S,Kt,$t]);const ne={direction:b,algorithm:y,autoLayout:x,layoutInProgress:w,childrenInitialized:et,padding:G,nodeSpacing:m,layerSpacing:S,nodeWidth:T,nodeHeight:O,layoutHidden:v,parentResizingOptions:A,layoutEngines:E,layoutEngineOptions:D,nodeParentIdMapWithChildIdSet:Ct,nodeIdWithNode:tt,noParentKey:C,updateNodes:c,updateEdges:u,setDirection:W,setAlgorithm:$,setAutoLayout:K,setLayoutInProgress:j,setPadding:Jt,setNodeSpacing:yt,setLayerSpacing:xt,setNodeWidth:Zt,setNodeHeight:Qt,setLayoutHidden:R,setParentResizingOptions:se,setLayoutEngineOptions:qt,applyLayout:Lt,applyContainerLayout:re,clearLayoutCache:()=>{},registerLayoutEngine:oe};return n.jsx(st.Provider,{value:ne,children:t})}const J=({compact:t=!1})=>{const{direction:r,setDirection:e,clearLayoutCache:s}=P(),o=i=>{e(i),s&&s()};return t?n.jsx(B.ControlButton,{onClick:()=>o(r==="DOWN"?"RIGHT":"DOWN"),title:`Switch to ${r==="DOWN"?"horizontal":"vertical"} layout`,children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:r==="DOWN"?n.jsx("path",{d:"M4 12h16M16 6l6 6-6 6"}):n.jsx("path",{d:"M12 4v16M6 16l6 6 6-6"})})}):n.jsxs(n.Fragment,{children:[n.jsx(B.ControlButton,{onClick:()=>o("DOWN"),className:r==="DOWN"?"selected":"",title:"Top to Bottom",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M12 4v16M6 16l6 6 6-6"})})}),n.jsx(B.ControlButton,{onClick:()=>o("RIGHT"),className:r==="RIGHT"?"selected":"",title:"Left to Right",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M4 12h16M16 6l6 6-6 6"})})}),n.jsx(B.ControlButton,{onClick:()=>o("LEFT"),className:r==="LEFT"?"selected":"",title:"Right to Left",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M20 12H4M8 6L2 12l6 6"})})}),n.jsx(B.ControlButton,{onClick:()=>o("UP"),className:r==="UP"?"selected":"",title:"Bottom to Top",children:n.jsx("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:n.jsx("path",{d:"M12 20V4M6 8l6-6 6 6"})})})]})},Z=({compact:t=!1})=>{const{nodeSpacing:r,layerSpacing:e,setNodeSpacing:s,setLayerSpacing:o,clearLayoutCache:i}=P(),[h,a]=k.useState(!1),d=c=>{s(c),i&&i()},l=c=>{o(c),i&&i()};return t?n.jsxs("div",{style:{position:"relative"},children:[n.jsx(B.ControlButton,{onClick:()=>a(!h),title:"Adjust node and layer spacing",children:n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"3",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("path",{d:"M7 10v4M17 10v4M10 7h4M10 17h4"})]})}),h&&n.jsxs("div",{className:"react-flow-spacing-dropdown",style:{position:"absolute",right:"0",top:"100%",marginTop:"8px",background:"white",border:"1px solid #ddd",borderRadius:"4px",padding:"8px",boxShadow:"0 2px 10px rgba(0,0,0,0.1)",zIndex:10,minWidth:"200px"},children:[n.jsxs("div",{style:{marginBottom:"12px"},children:[n.jsxs("div",{style:{fontWeight:"bold",marginBottom:"4px"},children:["Node Spacing: ",r,"px"]}),n.jsx("div",{style:{display:"flex",gap:"4px"},children:[50,100,150,200].map(c=>n.jsx("button",{onClick:()=>d(c),style:{background:r===c?"#0041d0":"#f5f5f5",color:r===c?"white":"inherit",border:"1px solid #ddd",borderRadius:"4px",padding:"4px 8px",cursor:"pointer"},children:c},c))})]}),n.jsxs("div",{children:[n.jsxs("div",{style:{fontWeight:"bold",marginBottom:"4px"},children:["Layer Spacing: ",e,"px"]}),n.jsx("div",{style:{display:"flex",gap:"4px"},children:[50,100,150,200].map(c=>n.jsx("button",{onClick:()=>l(c),style:{background:e===c?"#0041d0":"#f5f5f5",color:e===c?"white":"inherit",border:"1px solid #ddd",borderRadius:"4px",padding:"4px 8px",cursor:"pointer"},children:c},c))})]}),n.jsx("div",{style:{marginTop:"12px",textAlign:"right"},children:n.jsx("button",{onClick:()=>a(!1),style:{background:"#f5f5f5",border:"1px solid #ddd",borderRadius:"4px",padding:"4px 8px",cursor:"pointer"},children:"Close"})})]})]}):n.jsxs("div",{className:"spacing-controls",children:[n.jsxs(B.ControlButton,{onClick:()=>d(Math.max(50,r-25)),title:"Decrease node spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"3",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("line",{x1:"7",y1:"10",x2:"7",y2:"14"}),n.jsx("line",{x1:"17",y1:"10",x2:"17",y2:"14"}),n.jsx("line",{x1:"10",y1:"7",x2:"14",y2:"7"}),n.jsx("line",{x1:"10",y1:"17",x2:"14",y2:"17"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"-"})]}),n.jsxs("div",{style:{display:"inline-flex",alignItems:"center",padding:"5px 10px",fontSize:"12px",background:"#f8f8f8",borderRadius:"4px",margin:"0 4px",border:"1px solid #ddd"},children:[r,"px"]}),n.jsxs(B.ControlButton,{onClick:()=>d(Math.min(300,r+25)),title:"Increase node spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"3",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"3",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("rect",{x:"14",y:"14",width:"7",height:"7",rx:"1"}),n.jsx("line",{x1:"7",y1:"10",x2:"7",y2:"14"}),n.jsx("line",{x1:"17",y1:"10",x2:"17",y2:"14"}),n.jsx("line",{x1:"10",y1:"7",x2:"14",y2:"7"}),n.jsx("line",{x1:"10",y1:"17",x2:"14",y2:"17"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"+"})]}),n.jsx("div",{style:{display:"inline-block",width:"1px",height:"24px",background:"#ddd",margin:"0 10px"}}),n.jsxs(B.ControlButton,{onClick:()=>l(Math.max(50,e-25)),title:"Decrease layer spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("line",{x1:"4",y1:"6",x2:"20",y2:"6"}),n.jsx("line",{x1:"4",y1:"12",x2:"20",y2:"12"}),n.jsx("line",{x1:"4",y1:"18",x2:"20",y2:"18"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"-"})]}),n.jsxs("div",{style:{display:"inline-flex",alignItems:"center",padding:"5px 10px",fontSize:"12px",background:"#f8f8f8",borderRadius:"4px",margin:"0 4px",border:"1px solid #ddd"},children:[e,"px"]}),n.jsxs(B.ControlButton,{onClick:()=>l(Math.min(300,e+25)),title:"Increase layer spacing",children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"2",fill:"none",children:[n.jsx("line",{x1:"4",y1:"6",x2:"20",y2:"6"}),n.jsx("line",{x1:"4",y1:"12",x2:"20",y2:"12"}),n.jsx("line",{x1:"4",y1:"18",x2:"20",y2:"18"})]}),n.jsx("span",{style:{marginLeft:"4px"},children:"+"})]})]})},Q=({compact:t=!1})=>{const{autoLayout:r,setAutoLayout:e}=P(),s=()=>{e(!r)};return n.jsx(B.ControlButton,{onClick:s,className:r?"selected":"",title:r?"Disable automatic layout":"Enable automatic layout",style:{color:r?"green":"inherit"},children:t?n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"1.5",fill:"none",children:[n.jsx("rect",{x:"4",y:"4",width:"4",height:"4",rx:"1"}),n.jsx("rect",{x:"4",y:"16",width:"4",height:"4",rx:"1"}),n.jsx("rect",{x:"16",y:"10",width:"4",height:"4",rx:"1"}),n.jsxs(n.Fragment,{children:[n.jsx("path",{d:"M8 6c6 0 3 8 8 6"}),n.jsx("path",{d:"M8 18c3-3 2-8 6-6"})]})]}):n.jsxs(n.Fragment,{children:["Auto-Layout ",r?"ON":"OFF"]})})},gt=({compact:t=!1})=>{const{layoutInProgress:r,setLayoutInProgress:e,applyLayout:s}=P(),o=async()=>{if(!r)try{e(!0),await s()}catch(i){console.error("Error applying layout:",i)}};return n.jsxs(B.ControlButton,{onClick:o,title:"Apply layout",disabled:r,style:{color:r?"#999":"#000"},children:[n.jsxs("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",strokeWidth:"1.5",fill:"none",children:[n.jsx("rect",{x:"3",y:"3",width:"5",height:"5",rx:"1"}),n.jsx("rect",{x:"16",y:"3",width:"5",height:"5",rx:"1"}),n.jsx("rect",{x:"3",y:"16",width:"5",height:"5",rx:"1"}),n.jsx("rect",{x:"16",y:"16",width:"5",height:"5",rx:"1"}),n.jsx("path",{d:"M8 5.5h8M5.5 8v8M18.5 8v8M8 18.5h8"}),n.jsx("circle",{cx:"12",cy:"12",r:"3"}),n.jsx("path",{d:"M11 10.5v3l2-1.5z",fill:"currentColor"})]}),!t&&n.jsx("span",{style:{marginLeft:"4px"},children:"Apply Layout"})]})},Xt=({showDirectionControls:t=!0,showSpacingControls:r=!0,showAutoLayoutToggle:e=!0,showApplyLayoutButton:s=!0,standalone:o=!1,position:i="top-right"})=>{const h=P(),{autoLayout:a}=h;return o?n.jsxs(B.Controls,{position:i,showZoom:!1,showFitView:!1,showInteractive:!1,children:[s&&!a&&n.jsx(gt,{compact:!0}),t&&n.jsx(J,{compact:!0}),r&&n.jsx(Z,{compact:!0}),e&&n.jsx(Q,{compact:!0})]}):n.jsxs(n.Fragment,{children:[s&&!a&&n.jsx(gt,{compact:!0}),t&&n.jsx(J,{compact:!0}),r&&n.jsx(Z,{compact:!0}),e&&n.jsx(Q,{compact:!0})]})};M.AutoLayoutToggle=Q,M.DagreEngine=ct,M.DirectionControls=J,M.LayoutControls=Xt,M.LayoutProvider=It,M.SpacingControls=Z,M.engines=at,M.useLayoutContext=P,Object.defineProperty(M,Symbol.toStringTag,{value:"Module"})});
@@ -24,6 +24,7 @@ export interface LayoutContextState {
24
24
  algorithm: LayoutAlgorithm;
25
25
  autoLayout: boolean;
26
26
  layoutInProgress: boolean;
27
+ childrenInitialized: boolean;
27
28
  padding: number;
28
29
  nodeSpacing: number;
29
30
  layerSpacing: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oscherbakov/react-flow-automated-layout",
3
- "version": "1.3.1",
3
+ "version": "1.3.2",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "description": "A React library for automated layout of nested node graphs with parent-child relationships using React Flow",