@code0-tech/pictor 0.0.0-mvp.26 → 0.0.0-mvp.28

package/dist/components/d-flow/DFlow.js

@@ -1,95 +1,104 @@
-import { jsx as K } from "react/jsx-runtime";
-import { c as U } from "../../_virtual/compiler-runtime.js";
-import { ReactFlowProvider as $, useNodesState as J, useEdgesState as Q, useUpdateNodeInternals as Z, ReactFlow as tt } from "@xyflow/react";
-import G from "react";
-import { mergeCode0Props as et } from "../../utils/utils.js";
-import '../../assets/components/d-flow/DFlow.style.css';import '../../assets/node_modules/@xyflow/react/dist/style.css';/* empty css                                              */
+import { jsx as Y, jsxs as U } from "react/jsx-runtime";
+import { c as $ } from "../../_virtual/compiler-runtime.js";
+import "../../utils/contextStore.js";
+import K from "react";
+import { mergeCode0Props as J } from "../../utils/utils.js";
+import { ReactFlowProvider as Q, useNodesState as Z, useEdgesState as tt, useUpdateNodeInternals as et, ReactFlow as ot, Background as st, BackgroundVariant as nt } from "@xyflow/react";
+import '../../assets/components/d-flow-panel/DFlowMiniMap.style.css';import '../../assets/components/d-flow/DFlow.style.css';import '../../assets/node_modules/@xyflow/react/dist/style.css';/* empty css                                              */
 /* empty css                 */
-import { DFlowFunctionDefaultCard as ot } from "./function/DFlowFunctionDefaultCard.js";
-import { DFlowFunctionGroupCard as st } from "./function/DFlowFunctionGroupCard.js";
-import { DFlowFunctionSuggestionCard as nt } from "./function/DFlowFunctionSuggestionCard.js";
-import { DFlowFunctionTriggerCard as it } from "./function/DFlowFunctionTriggerCard.js";
-import { DFlowEdge as rt } from "./edge/DFlowEdge.js";
-const at = (y, C) => {
-  if (!C || C.size === 0)
+import { DFlowFunctionDefaultCard as it } from "../d-flow-function/DFlowFunctionDefaultCard.js";
+import { DFlowFunctionGroupCard as rt } from "../d-flow-function/DFlowFunctionGroupCard.js";
+import { DFlowFunctionSuggestionCard as at } from "../d-flow-function/DFlowFunctionSuggestionCard.js";
+import { DFlowFunctionTriggerCard as dt } from "../d-flow-function/DFlowFunctionTriggerCard.js";
+import { DFlowEdge as ct } from "./DFlowEdge.js";
+import { DFlowPanelSize as ht } from "../d-flow-panel/DFlowPanelSize.js";
+import { DFlowPanelControl as lt } from "../d-flow-panel/DFlowPanelControl.js";
+import { useFlowEdges as pt } from "./DFlow.edges.hook.js";
+import { useFlowNodes as gt } from "./DFlow.nodes.hook.js";
+import "../button/Button.js";
+/* empty css                                      */
+import { DFlowPanelLayout as mt } from "../d-flow-panel/DFlowPanelLayout.js";
+import { DFlowValidation as ft } from "../d-flow-validation/DFlowValidation.js";
+const ut = (F, N) => {
+  if (!N || N.size === 0)
     return {
-      nodes: y
+      nodes: F
     };
-  const m = 75, Y = 75, N = 16, z = 0.25;
-  let _ = 0, F = !1;
-  const f = y.map((o) => ({
+  const w = 50, P = 50, k = 16, S = 0.25;
+  let W = 0, D = !1;
+  const f = F.map((o) => ({
     ...o
-  })), L = /* @__PURE__ */ new Map(), W = /* @__PURE__ */ new Map();
+  })), H = /* @__PURE__ */ new Map(), L = /* @__PURE__ */ new Map();
   for (const o of f) {
-    const c = o.data?.linkingId;
-    if (c) {
-      let l = W.get(c);
-      l || (l = [], W.set(c, l)), l.push(o.id);
+    const l = o.data?.linkingId;
+    if (l) {
+      let p = L.get(l);
+      p || (p = [], L.set(l, p)), p.push(o.id);
     }
-    if (o.parentId && !c) {
-      let l = L.get(o.parentId);
-      l || (l = [], L.set(o.parentId, l)), l.push(o.id);
+    if (o.parentId && !l) {
+      let p = H.get(o.parentId);
+      p || (p = [], H.set(o.parentId, p)), p.push(o.id);
     }
   }
-  const M = /* @__PURE__ */ new Map(), E = /* @__PURE__ */ new Map(), w = new Map(f.map((o) => [o.id, o]));
-  for (const [o, c] of L) {
-    const l = new Array(c.length);
-    for (let b = 0; b < c.length; b++) l[b] = w.get(c[b]);
-    M.set(o, l);
+  const z = /* @__PURE__ */ new Map(), C = /* @__PURE__ */ new Map(), G = new Map(f.map((o) => [o.id, o]));
+  for (const [o, l] of H) {
+    const p = new Array(l.length);
+    for (let g = 0; g < l.length; g++) p[g] = G.get(l[g]);
+    z.set(o, p);
   }
-  for (const [o, c] of W) {
-    const l = new Array(c.length);
-    for (let b = 0; b < c.length; b++) l[b] = w.get(c[b]);
-    E.set(o, l);
+  for (const [o, l] of L) {
+    const p = new Array(l.length);
+    for (let g = 0; g < l.length; g++) p[g] = G.get(l[g]);
+    C.set(o, p);
   }
-  const g = /* @__PURE__ */ new Map();
+  const x = /* @__PURE__ */ new Map();
   for (const o of f) {
-    const c = typeof o.style?.width == "number" ? o.style.width : void 0, l = typeof o.style?.height == "number" ? o.style.height : void 0, b = o.measured?.width && o.measured.width > 0 ? o.measured.width : void 0, P = o.measured?.height && o.measured.height > 0 ? o.measured.height : void 0;
-    g.set(o.id, {
-      w: c ?? b ?? 200,
-      h: l ?? P ?? 80
+    const l = typeof o.style?.width == "number" ? o.style.width : void 0, p = typeof o.style?.height == "number" ? o.style.height : void 0, g = o.measured?.width && o.measured.width > 0 ? o.measured.width : void 0, M = o.measured?.height && o.measured.height > 0 ? o.measured.height : void 0;
+    x.set(o.id, {
+      w: l ?? g ?? 200,
+      h: p ?? M ?? 80
     });
   }
-  const B = /* @__PURE__ */ new Map(), x = (o) => {
-    if (B.has(o.id)) return B.get(o.id);
+  const I = /* @__PURE__ */ new Map(), r = (o) => {
+    if (I.has(o.id)) return I.get(o.id);
     if (o.type !== "group") {
-      const T = g.get(o.id);
-      return B.set(o.id, T), T;
+      const E = x.get(o.id);
+      return I.set(o.id, E), E;
     }
-    const c = typeof o.style?.width == "number" ? o.style.width : void 0, l = typeof o.style?.height == "number" ? o.style.height : void 0;
-    if (c !== void 0 && l !== void 0) {
-      const T = {
-        w: c,
-        h: l
+    const l = typeof o.style?.width == "number" ? o.style.width : void 0, p = typeof o.style?.height == "number" ? o.style.height : void 0;
+    if (l !== void 0 && p !== void 0) {
+      const E = {
+        w: l,
+        h: p
       };
-      return B.set(o.id, T), T;
+      return I.set(o.id, E), E;
     }
-    const b = M.get(o.id) ?? [];
-    let P = 0, H = 0, v = 0;
-    for (const T of b) {
-      const V = x(T);
-      P += V.h, V.w > H && (H = V.w), v++;
+    const g = z.get(o.id) ?? [];
+    let M = 0, _ = 0, v = 0;
+    for (const E of g) {
+      const V = r(E);
+      M += V.h, V.w > _ && (_ = V.w), v++;
     }
-    P += m * Math.max(0, v - 1);
-    const D = {
-      w: H + 2 * N,
-      h: (v ? P : 0) + 2 * N
+    M += w * Math.max(0, v - 1);
+    const A = {
+      w: _ + 2 * k,
+      h: (v ? M : 0) + 2 * k
     };
-    return B.set(o.id, D), D;
+    return I.set(o.id, A), A;
   };
   do {
-    F = !1, _++, B.clear();
-    for (const e of f) x(e);
-    const o = /* @__PURE__ */ new Map(), c = /* @__PURE__ */ new Map(), l = (e) => Math.round(e / 10), b = (e, h, p) => {
-      const d = [{
+    D = !1, W++, I.clear();
+    for (const e of f) r(e);
+    const o = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map(), p = (e) => Math.round(e / 10), g = (e, h, m) => {
+      const c = [{
         node: e,
         cx: h,
-        cy: p,
+        cy: m,
         phase: 0
       }];
-      let I = 0;
-      for (; d.length; ) {
-        const t = d[d.length - 1];
+      let y = 0;
+      for (; c.length; ) {
+        const t = c[c.length - 1];
         switch (t.phase) {
           case 0: {
             o.set(t.node.id, {
@@ -99,26 +108,26 @@ const at = (y, C) => {
             const {
               w: s,
               h: n
-            } = x(t.node);
+            } = r(t.node);
             t.w = s, t.h = n;
-            const i = E.get(t.node.id) ?? [], r = [], u = [];
-            for (const k of i)
-              k.type === "group" ? u.push(k) : r.push(k);
-            r.sort((k, a) => +k.data?.paramIndex - +a.data?.paramIndex), u.sort((k, a) => +k.data?.paramIndex - +a.data?.paramIndex), t.right = r, t.gParams = u;
-            let S = 0;
-            for (const k of r) S += x(k).h;
-            S += m * Math.max(0, r.length - 1), t.py = t.cy - S / 2, t.rightBottom = t.cy + n / 2, t.rightIndex = 0, t.phase = 1;
+            const i = C.get(t.node.id) ?? [], a = [], u = [];
+            for (const b of i)
+              b.type === "group" ? u.push(b) : a.push(b);
+            a.sort((b, d) => +b.data?.paramIndex - +d.data?.paramIndex), u.sort((b, d) => +b.data?.paramIndex - +d.data?.paramIndex), t.right = a, t.gParams = u;
+            let T = 0;
+            for (const b of a) T += r(b).h;
+            T += w * Math.max(0, a.length - 1), t.py = t.cy - T / 2, t.rightBottom = t.cy + n / 2, t.rightIndex = 0, t.phase = 1;
             break;
           }
           case 1: {
             if (t.rightIndex < t.right.length) {
-              const s = t.right[t.rightIndex], n = x(s), i = t.cx + t.w / 2 + Y + n.w / 2;
-              let r = t.py + n.h / 2;
-              const u = l(i), k = (c.get(u) ?? Number.NEGATIVE_INFINITY) + m;
-              r - n.h / 2 < k && (r = k + n.h / 2, t.py = r - n.h / 2), t.childKey = u, t.childPs = n, d.push({
+              const s = t.right[t.rightIndex], n = r(s), i = t.cx + t.w / 2 + P + n.w / 2;
+              let a = t.py + n.h / 2;
+              const u = p(i), b = (l.get(u) ?? Number.NEGATIVE_INFINITY) + w;
+              a - n.h / 2 < b && (a = b + n.h / 2, t.py = a - n.h / 2), t.childKey = u, t.childPs = n, c.push({
                 node: s,
                 cx: i,
-                cy: r,
+                cy: a,
                 phase: 0
               }), t.phase = 10;
             } else
@@ -127,7 +136,7 @@ const at = (y, C) => {
           }
           case 10: {
             const s = t.lastChildBottom;
-            c.set(t.childKey, Math.max(c.get(t.childKey) ?? Number.NEGATIVE_INFINITY, s)), t.rightBottom = Math.max(t.rightBottom, s), t.py = Math.max(t.py + t.childPs.h + m, s + m), t.rightIndex++, t.phase = 1;
+            l.set(t.childKey, Math.max(l.get(t.childKey) ?? Number.NEGATIVE_INFINITY, s)), t.rightBottom = Math.max(t.rightBottom, s), t.py = Math.max(t.py + t.childPs.h + w, s + w), t.rightIndex++, t.phase = 1;
             break;
           }
           case 2: {
@@ -135,21 +144,21 @@ const at = (y, C) => {
               const s = [];
               let n = 0;
               for (const i of t.gParams) {
-                const r = x(i);
-                s.push(r), n += r.w;
+                const a = r(i);
+                s.push(a), n += a.w;
               }
-              n += Y * (t.gParams.length - 1), t.gSizes = s, t.gx = t.cx - n / 2, t.gy = t.bottom + m, t.rowBottom = t.bottom, t.gIndex = 0, t.phase = 3;
+              n += P * (t.gParams.length - 1), t.gSizes = s, t.gx = t.cx - n / 2, t.gy = t.bottom + w, t.rowBottom = t.bottom, t.gIndex = 0, t.phase = 3;
             } else
               t.phase = 4;
             break;
           }
           case 3: {
             if (t.gIndex < t.gParams.length) {
-              const s = t.gParams[t.gIndex], n = t.gSizes[t.gIndex], i = t.gx + n.w / 2, r = t.gy + n.h / 2;
-              t.gx += n.w + Y, d.push({
+              const s = t.gParams[t.gIndex], n = t.gSizes[t.gIndex], i = t.gx + n.w / 2, a = t.gy + n.h / 2;
+              t.gx += n.w + P, c.push({
                 node: s,
                 cx: i,
-                cy: r,
+                cy: a,
                 phase: 0
               }), t.childPs = n, t.phase = 30;
             } else
@@ -163,213 +172,219 @@ const at = (y, C) => {
           }
           case 4: {
             if (t.node.type === "group") {
-              const s = M.get(t.node.id) ?? [], n = [];
+              const s = z.get(t.node.id) ?? [], n = [];
               for (const i of s)
                 i.data?.linkingId || n.push(i);
-              t.kids = n, t.kidIndex = 0, t.curY = t.cy - t.h / 2 + N, t.phase = 5;
+              t.kids = n, t.kidIndex = 0, t.curY = t.cy - t.h / 2 + k, t.phase = 5;
             } else
               t.phase = 6;
             break;
           }
           case 5: {
             if (t.kidIndex < t.kids.length) {
-              const s = t.kids[t.kidIndex], n = x(s), i = t.curY + n.h / 2;
-              d.push({
+              const s = t.kids[t.kidIndex], n = r(s), i = t.curY + n.h / 2;
+              c.push({
                 node: s,
                 cx: t.cx,
                 cy: i,
                 phase: 0
               }), t.childPs = n, t.phase = 50;
             } else {
-              const s = t.curY - m;
-              t.bottom = Math.max(t.bottom, s + N), t.phase = 6;
+              const s = t.curY - w;
+              t.bottom = Math.max(t.bottom, s + k), t.phase = 6;
             }
             break;
           }
           case 50: {
             const s = t.lastChildBottom;
-            t.curY = s + m, t.kidIndex++, t.phase = 5;
+            t.curY = s + w, t.kidIndex++, t.phase = 5;
             break;
           }
           case 6: {
-            const s = d.pop();
-            d.length ? d[d.length - 1].lastChildBottom = s.bottom : I = s.bottom;
+            const s = c.pop();
+            c.length ? c[c.length - 1].lastChildBottom = s.bottom : y = s.bottom;
             break;
           }
         }
       }
-      return I;
+      return y;
     };
-    let P = 0;
+    let M = 0;
     for (const e of f)
-      !e.data?.linkingId && !e.parentId && (P = b(e, 0, P + x(e).h / 2) + m);
-    const H = /* @__PURE__ */ new Map();
-    for (const e of f) H.set(e.id, o.get(e.id));
+      !e.data?.linkingId && !e.parentId && (M = g(e, 0, M + r(e).h / 2) + w);
+    const _ = /* @__PURE__ */ new Map();
+    for (const e of f) _.set(e.id, o.get(e.id));
     const v = /* @__PURE__ */ new Map();
     for (const e of f) {
       const {
         w: h,
-        h: p
-      } = x(e), {
-        x: d,
-        y: I
-      } = H.get(e.id);
+        h: m
+      } = r(e), {
+        x: c,
+        y
+      } = _.get(e.id);
       v.set(e.id, {
-        x: d - h / 2,
-        y: I - p / 2
+        x: c - h / 2,
+        y: y - m / 2
       });
     }
     for (const e of f) {
       const h = v.get(e.id);
-      let p = h.x, d = h.y;
+      let m = h.x, c = h.y;
       if (e.parentId) {
-        const I = v.get(e.parentId);
-        p -= I.x, d -= I.y;
+        const y = v.get(e.parentId);
+        m -= y.x, c -= y.y;
       }
       e.position = {
-        x: p,
-        y: d
+        x: m,
+        y: c
       };
     }
-    const D = /* @__PURE__ */ new Map();
-    for (const e of f) D.set(e.id, e);
-    const T = (e) => {
-      let h = 0, p = e;
-      for (; p?.parentId && (h++, p = D.get(p.parentId), !!p); )
+    const A = /* @__PURE__ */ new Map();
+    for (const e of f) A.set(e.id, e);
+    const E = (e) => {
+      let h = 0, m = e;
+      for (; m?.parentId && (h++, m = A.get(m.parentId), !!m); )
         ;
       return h;
     }, V = [];
     for (const e of f)
       e.type === "group" && V.push(e);
-    V.sort((e, h) => T(h) - T(e));
+    V.sort((e, h) => E(h) - E(e));
     for (const e of V) {
       const h = [];
-      for (const a of f)
-        a.parentId === e.id && h.push(a);
+      for (const d of f)
+        d.parentId === e.id && h.push(d);
       if (!h.length) {
-        const a = typeof e.style?.width == "number" ? e.style.width : 2 * N, A = typeof e.style?.height == "number" ? e.style.height : 2 * N;
+        const d = typeof e.style?.width == "number" ? e.style.width : 2 * k, B = typeof e.style?.height == "number" ? e.style.height : 2 * k;
         e.style = {
           ...e.style,
-          width: a,
-          height: A
+          width: d,
+          height: B
         };
         continue;
       }
-      const p = (a) => {
-        const A = typeof a.style?.width == "number" ? a.style.width : void 0, j = typeof a.style?.height == "number" ? a.style.height : void 0, X = g.get(a.id);
+      const m = (d) => {
+        const B = typeof d.style?.width == "number" ? d.style.width : void 0, q = typeof d.style?.height == "number" ? d.style.height : void 0, X = x.get(d.id);
         return {
-          w: A ?? X.w,
-          h: j ?? X.h
+          w: B ?? X.w,
+          h: q ?? X.h
         };
       };
-      let d = Number.POSITIVE_INFINITY, I = Number.POSITIVE_INFINITY, t = Number.NEGATIVE_INFINITY, s = Number.NEGATIVE_INFINITY;
-      for (const a of h) {
-        const A = p(a);
-        a.position.x < d && (d = a.position.x), a.position.y < I && (I = a.position.y), a.position.x + A.w > t && (t = a.position.x + A.w), a.position.y + A.h > s && (s = a.position.y + A.h);
+      let c = Number.POSITIVE_INFINITY, y = Number.POSITIVE_INFINITY, t = Number.NEGATIVE_INFINITY, s = Number.NEGATIVE_INFINITY;
+      for (const d of h) {
+        const B = m(d);
+        d.position.x < c && (c = d.position.x), d.position.y < y && (y = d.position.y), d.position.x + B.w > t && (t = d.position.x + B.w), d.position.y + B.h > s && (s = d.position.y + B.h);
       }
-      const n = d - N, i = I - N;
-      if (Math.abs(n) > z || Math.abs(i) > z) {
-        for (const a of h)
-          a.position.x -= n, a.position.y -= i;
-        F = !0;
+      const n = c - k, i = y - k;
+      if (Math.abs(n) > S || Math.abs(i) > S) {
+        for (const d of h)
+          d.position.x -= n, d.position.y -= i;
+        D = !0;
       }
-      const r = t - d + 2 * N, u = s - I + 2 * N, S = typeof e.style?.width == "number" ? e.style.width : x(e).w, k = typeof e.style?.height == "number" ? e.style.height : x(e).h;
-      (Math.abs(r - S) > z || Math.abs(u - k) > z) && (F = !0), e.measured = {
-        width: r,
+      const a = t - c + 2 * k, u = s - y + 2 * k, T = typeof e.style?.width == "number" ? e.style.width : r(e).w, b = typeof e.style?.height == "number" ? e.style.height : r(e).h;
+      (Math.abs(a - T) > S || Math.abs(u - b) > S) && (D = !0), e.measured = {
+        width: a,
         height: u
       }, e.style = {
         ...e.style,
-        width: r,
+        width: a,
         height: u
-      }, g.set(e.id, {
-        w: r,
+      }, x.set(e.id, {
+        w: a,
         h: u
       });
     }
-    B.clear();
-    for (const e of f) x(e);
+    I.clear();
+    for (const e of f) r(e);
     const R = /* @__PURE__ */ new Map(), O = /* @__PURE__ */ new Map();
     for (const e of f) {
-      const h = x(e), p = o.get(e.id);
-      O.set(e.id, p), R.set(e.id, {
-        x: p.x - h.w / 2,
-        y: p.y - h.h / 2
+      const h = r(e), m = o.get(e.id);
+      O.set(e.id, m), R.set(e.id, {
+        x: m.x - h.w / 2,
+        y: m.y - h.h / 2
       });
     }
     for (const e of f) {
-      const h = [], p = E.get(e.id) ?? [];
-      for (const i of p)
+      const h = [], m = C.get(e.id) ?? [];
+      for (const i of m)
         i.type === "group" && h.push(i);
       if (!h.length) continue;
-      const d = h.slice().sort((i, r) => (+i.data?.paramIndex || 0) - (+r.data?.paramIndex || 0)), I = [];
-      for (const i of d) {
-        const r = D.get(i.id), u = typeof r.style?.width == "number" ? r.style.width : void 0;
-        I.push(u ?? x(r).w);
+      const c = h.slice().sort((i, a) => (+i.data?.paramIndex || 0) - (+a.data?.paramIndex || 0)), y = [];
+      for (const i of c) {
+        const a = A.get(i.id), u = typeof a.style?.width == "number" ? a.style.width : void 0;
+        y.push(u ?? r(a).w);
       }
       let t = 0;
-      for (const i of I) t += i;
-      t += Y * (d.length - 1);
+      for (const i of y) t += i;
+      t += P * (c.length - 1);
       let n = O.get(e.id).x - t / 2;
-      for (let i = 0; i < d.length; i++) {
-        const r = d[i], u = D.get(r.id), S = u.parentId ? R.get(u.parentId) : {
+      for (let i = 0; i < c.length; i++) {
+        const a = c[i], u = A.get(a.id), T = u.parentId ? R.get(u.parentId) : {
           x: 0
         };
-        u.position.x = n - S.x, n += I[i] + Y;
+        u.position.x = n - T.x, n += y[i] + P;
       }
     }
-  } while (F && _ < 5);
+  } while (D && W < 5);
   return {
     nodes: f
   };
-}, q = G.cache(at), bt = (y) => {
-  const C = U.c(2);
-  let m;
-  return C[0] !== y ? (m = /* @__PURE__ */ K($, { children: /* @__PURE__ */ K(dt, { ...y }) }), C[0] = y, C[1] = m) : m = C[1], m;
-}, dt = (y) => {
-  const [C, m] = J(y.nodes), [Y, N, z] = Q(y.edges), _ = Z(), F = G.useCallback((M) => {
+}, j = K.cache(ut), Ht = (F) => {
+  const N = $.c(2);
+  let w;
+  return N[0] !== F ? (w = /* @__PURE__ */ Y(Q, { children: /* @__PURE__ */ Y(wt, { ...F }) }), N[0] = F, N[1] = w) : w = N[1], w;
+}, wt = (F) => {
+  const {
+    flowId: N
+  } = F, w = {
+    default: it,
+    group: rt,
+    suggestion: at,
+    trigger: dt
+  }, P = {
+    default: ct
+  }, k = gt(N), S = pt(N), [W, D] = Z([]), [f, H, L] = tt([]), z = et(), C = K.useCallback((x) => {
     requestAnimationFrame(() => {
-      M.forEach((E) => _(E));
+      x.forEach((I) => z(I));
     });
-  }, [_]), f = {
-    default: ot,
-    group: st,
-    suggestion: nt,
-    trigger: it,
-    ...y.nodeTypes
-  }, L = {
-    default: rt,
-    ...y.edgeTypes
-  }, W = G.useCallback((M) => {
-    const E = Array.from(new Set(M.filter((g) => g.type === "dimensions" || g.type === "position").map((g) => g.id))), w = /* @__PURE__ */ new Map();
-    M.filter((g) => g.type === "dimensions").forEach((g) => w.set(g.id, g.dimensions)), m((g) => {
-      const B = g.map((o) => {
-        if (!w.has(o.id)) return o;
-        const c = w.get(o.id) || {};
+  }, [z]), G = K.useCallback((x) => {
+    const I = Array.from(new Set(x.filter((o) => o.type === "dimensions" || o.type === "position").map((o) => o.id))), r = /* @__PURE__ */ new Map();
+    x.filter((o) => o.type === "dimensions").forEach((o) => r.set(o.id, o.dimensions)), D((o) => {
+      const l = o.map((g) => {
+        if (!r.has(g.id)) return g;
+        const M = r.get(g.id) || {};
         return {
-          ...o,
+          ...g,
           measured: {
-            width: c.width ?? o.measured?.width ?? 0,
-            height: c.height ?? o.measured?.height ?? 0
+            width: M.width ?? g.measured?.width ?? 0,
+            height: M.height ?? g.measured?.height ?? 0
           }
         };
       });
-      return q(B, new Set(E)).nodes;
-    }), F(E);
-  }, [F]);
-  return G.useEffect(() => {
-    const M = y.nodes.map((w) => {
-      const g = w.measured ? [] : document.querySelectorAll("[data-id='" + w.id + "']");
+      return j(l, new Set(I)).nodes;
+    }), C(I);
+  }, [C]);
+  return K.useEffect(() => {
+    const x = k.map((r) => {
+      const o = r.measured ? [] : document.querySelectorAll("[data-id='" + r.id + "']");
       return {
-        ...w,
+        ...r,
         measured: {
-          width: w.measured?.width ?? g[0]?.clientWidth ?? 0,
-          height: w.measured?.height ?? g[0]?.clientHeight ?? 0
+          width: r.measured?.width ?? o[0]?.clientWidth ?? 0,
+          height: r.measured?.height ?? o[0]?.clientHeight ?? 0
         }
       };
-    }), E = q(M, new Set(M.map((w) => w.id)));
-    m(E.nodes), N(y.edges), F(E.nodes.map((w) => w.id));
-  }, [y.nodes, y.edges, F]), /* @__PURE__ */ K(tt, { onlyRenderVisibleElements: !0, panOnScroll: !1, nodeTypes: f, edgeTypes: L, onInit: (M) => M.fitView(), onNodesChange: W, onEdgesChange: z, ...et("flow", y), nodes: C, edges: Y });
+    }), I = j(x, new Set(x.map((r) => r.id)));
+    D(I.nodes), H(S), C(I.nodes.map((r) => r.id));
+  }, [k, S, C]), /* @__PURE__ */ U(ot, { onlyRenderVisibleElements: !0, panOnScroll: !1, nodeTypes: w, edgeTypes: P, onInit: (x) => x.fitView(), onNodesChange: G, onEdgesChange: L, fitView: !0, ...J("flow", F), nodes: W, edges: f, children: [
+    /* @__PURE__ */ Y(st, { variant: nt.Dots, color: "rgba(255,255,255, .05)", gap: 8, size: 2 }),
+    /* @__PURE__ */ Y(ht, {}),
+    /* @__PURE__ */ Y(mt, {}),
+    /* @__PURE__ */ Y(ft, { flowId: "gid://sagittarius/Flow/1" }),
+    /* @__PURE__ */ Y(lt, { flowId: N })
+  ] });
 };
 export {
-  bt as DFlow
+  Ht as DFlow
 };

package/dist/components/d-flow/DFlow.nodes.hook.d.ts

@@ -1,3 +1,7 @@
 import { Node } from '@xyflow/react';
 import { Flow } from '@code0-tech/sagittarius-graphql-types';
-export declare const useFlowNodes: (flowId: Flow["id"]) => Node[];
+import { DFlowFunctionDefaultCardDataProps } from '../d-flow-function/DFlowFunctionDefaultCard';
+import { DFlowFunctionSuggestionCardDataProps } from '../d-flow-function/DFlowFunctionSuggestionCard';
+import { DFlowFunctionTriggerCardDataProps } from '../d-flow-function/DFlowFunctionTriggerCard';
+import { DFlowFunctionGroupCardDataProps } from '../d-flow-function/DFlowFunctionGroupCard';
+export declare const useFlowNodes: (flowId: Flow["id"]) => Node<DFlowFunctionDefaultCardDataProps | DFlowFunctionSuggestionCardDataProps | DFlowFunctionTriggerCardDataProps | DFlowFunctionGroupCardDataProps>[];