nodalix 0.1.0

package/dist/index.js

@@ -0,0 +1,3905 @@
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.js
+var index_exports = {};
+__export(index_exports, {
+  AddNewNode: () => AddNewNode,
+  DEFAULT_EDGE_LABEL_FIELDS: () => DEFAULT_EDGE_LABEL_FIELDS,
+  DEFAULT_NODE_IMAGE: () => DEFAULT_NODE_IMAGE,
+  DEFAULT_RATE_COLOR_RANGES: () => DEFAULT_RATE_COLOR_RANGES,
+  EDGE_LABEL_FIELDS: () => EDGE_LABEL_FIELDS,
+  EDGE_LINE_STYLE: () => EDGE_LINE_STYLE,
+  GRAPH_LANGUAGE: () => GRAPH_LANGUAGE,
+  GetSelectedNode: () => GetSelectedNode,
+  Graph_Engine: () => Graph_Engine,
+  NODALIX_EDITION: () => NODALIX_EDITION,
+  NODALIX_MAX_NODES: () => NODALIX_MAX_NODES,
+  NODE_TYPE: () => NODE_TYPE,
+  OnNodeClick: () => OnNodeClick,
+  SetSelectedNode: () => SetSelectedNode,
+  buildEdgeInfoLabel: () => buildEdgeInfoLabel,
+  canAddGraphNode: () => canAddGraphNode,
+  countGraphNodes: () => countGraphNodes,
+  enforceNodeLimit: () => enforceNodeLimit,
+  getGraphGuide: () => getGraphGuide,
+  getNodeDisplayLabel: () => getNodeDisplayLabel,
+  getNodeEntityImage: () => getNodeEntityImage,
+  getRateBorderColor: () => getRateBorderColor,
+  getSafeNodePosition: () => getSafeNodePosition,
+  hasNodeLimit: () => hasNodeLimit,
+  isBasicEdition: () => isBasicEdition,
+  isFullEdition: () => isFullEdition,
+  isHelperNodeId: () => isHelperNodeId,
+  mirrorEdgeRef: () => mirrorEdgeRef,
+  normalizeEdgeLabelFields: () => normalizeEdgeLabelFields,
+  normalizeEdgeLineStyle: () => normalizeEdgeLineStyle,
+  normalizeGraphLanguage: () => normalizeGraphLanguage,
+  normalizeRateColorRanges: () => normalizeRateColorRanges,
+  resolveEdgeVisStyle: () => resolveEdgeVisStyle
+});
+module.exports = __toCommonJS(index_exports);
+var import_react3 = __toESM(require("react"));
+
+// src/Components/Graph.js
+var import_react2 = __toESM(require("react"));
+var import_vis = require("vis");
+
+// src/Components/Options.js
+var getGridTheme = (isDark) => isDark ? {
+  background: "#0b1220",
+  minor: "rgba(148,163,184,0.14)",
+  major: "rgba(148,163,184,0.28)"
+} : {
+  background: "#f8fafc",
+  minor: "rgba(15,23,42,0.07)",
+  major: "rgba(15,23,42,0.14)"
+};
+var getNiceGridStep = (scale) => {
+  const targetPx = 32;
+  const raw = targetPx / Math.max(scale, 0.05);
+  const pow = Math.pow(10, Math.floor(Math.log10(raw)));
+  const norm = raw / pow;
+  let nice;
+  if (norm <= 1) nice = 1;
+  else if (norm <= 2) nice = 2;
+  else if (norm <= 5) nice = 5;
+  else nice = 10;
+  return nice * pow;
+};
+var drawNetworkGrid = (ctx, network, isDark) => {
+  if (!ctx || !network) return;
+  const theme = getGridTheme(isDark);
+  const canvas = ctx.canvas;
+  const w = canvas.clientWidth;
+  const h = canvas.clientHeight;
+  if (!w || !h) return;
+  const tl = network.DOMtoCanvas({ x: 0, y: 0 });
+  const br = network.DOMtoCanvas({ x: w, y: h });
+  const minX = Math.min(tl.x, br.x);
+  const maxX = Math.max(tl.x, br.x);
+  const minY = Math.min(tl.y, br.y);
+  const maxY = Math.max(tl.y, br.y);
+  const scale = network.getScale();
+  const step = getNiceGridStep(scale);
+  const majorEvery = 5;
+  const lineWidth = 1 / Math.max(scale, 0.05);
+  ctx.save();
+  ctx.fillStyle = theme.background;
+  ctx.fillRect(minX, minY, maxX - minX, maxY - minY);
+  const startX = Math.floor(minX / step) * step;
+  const startY = Math.floor(minY / step) * step;
+  let col = 0;
+  for (let x = startX; x <= maxX; x += step, col++) {
+    const isMajor = col % majorEvery === 0;
+    ctx.strokeStyle = isMajor ? theme.major : theme.minor;
+    ctx.lineWidth = isMajor ? lineWidth * 1.35 : lineWidth;
+    ctx.beginPath();
+    ctx.moveTo(x, minY);
+    ctx.lineTo(x, maxY);
+    ctx.stroke();
+  }
+  let row = 0;
+  for (let y = startY; y <= maxY; y += step, row++) {
+    const isMajor = row % majorEvery === 0;
+    ctx.strokeStyle = isMajor ? theme.major : theme.minor;
+    ctx.lineWidth = isMajor ? lineWidth * 1.35 : lineWidth;
+    ctx.beginPath();
+    ctx.moveTo(minX, y);
+    ctx.lineTo(maxX, y);
+    ctx.stroke();
+  }
+  ctx.restore();
+};
+var buildInteractionOptions = (dragNodes = true) => ({
+  selectable: true,
+  multiselect: true,
+  dragNodes: !!dragNodes,
+  dragView: true,
+  zoomView: true,
+  hover: true,
+  hoverConnectedEdges: false,
+  tooltipDelay: 100
+});
+var buildOptions = (isDark, { dragNodes = true } = {}) => {
+  const palette = isDark ? {
+    text: "#e5e7eb",
+    subtext: "#9ca3af",
+    edge: "#6ea8ff",
+    nodeBorder: "#93c5fd",
+    nodeBg: "#0b1220",
+    boxBorder: "#374151",
+    labelBg: "rgba(17,24,39,.6)",
+    mainBorder: "#60a5fa",
+    mainBg: "#0f172a"
+  } : {
+    text: "#111827",
+    subtext: "#4b5563",
+    edge: "rgb(50, 87, 155)",
+    nodeBorder: "#1f3a5f",
+    nodeBg: "#ffffff",
+    boxBorder: "rgb(200,200,200)",
+    labelBg: "#ffffff",
+    mainBorder: "#1d4ed8",
+    mainBg: "#ffffff"
+  };
+  return {
+    layout: { hierarchical: false },
+    // فیزیک خاموش برای چیدمان قطعی
+    physics: { enabled: false },
+    interaction: buildInteractionOptions(dragNodes),
+    edges: {
+      width: 2,
+      smooth: {
+        type: "cubicBezier",
+        forceDirection: "horizontal",
+        roundness: 0.2
+      },
+      arrows: { to: { enabled: true } },
+      font: {
+        size: 14,
+        align: "middle",
+        color: palette.text,
+        background: palette.labelBg,
+        face: "Vazir"
+      },
+      color: {
+        color: palette.edge,
+        highlight: palette.edge,
+        hover: palette.edge,
+        inherit: false
+      },
+      chosen: {
+        edge(values, id, selected) {
+          if (selected) {
+            values.shadow = true;
+            values.shadowColor = values.color || "rgba(0,0,0,1)";
+            values.shadowSize = 10;
+            values.shadowX = 0;
+            values.shadowY = 0;
+            values.width = 3;
+          }
+        }
+      }
+    },
+    // پیش‌فرض نودها
+    nodes: {
+      shape: "dot",
+      size: 14,
+      borderWidth: 1,
+      borderWidthSelected: 2,
+      font: {
+        size: 12,
+        face: "Vazir",
+        color: palette.text
+      },
+      color: {
+        border: palette.nodeBorder,
+        background: palette.nodeBg,
+        highlight: {
+          border: palette.mainBorder,
+          background: palette.nodeBg
+        },
+        hover: {
+          border: palette.mainBorder,
+          background: palette.nodeBg
+        }
+      },
+      shadow: false
+    },
+    groups: {
+      /**
+       * MAIN nodes (type: "main") — formerly "address"
+       */
+      main: {
+        shape: "circularImage",
+        icon: { face: "FontAwesome", code: "\uF007", size: 50, color: "black" },
+        font: { size: 13, face: "Vazir", color: palette.edge, align: "left" },
+        borderWidth: 2,
+        borderColor: "#FF5733",
+        color: { background: "#ffffff" },
+        shapeProperties: { useBorderWithImage: true },
+        align: "horizontal",
+        chosen: {
+          node(values) {
+            values.borderWidth = 3;
+            values.size = 22;
+            values.shadow = true;
+            values.shadowColor = "rgba(0,0,0,.25)";
+            values.shadowSize = 14;
+            values.shadowX = 0;
+            values.shadowY = 2;
+          }
+        }
+      },
+      /**
+       * EDGE INFO GROUP (نودهای اطلاعات یال / Tr)
+       */
+      edgeInfo: {
+        shape: "dot",
+        size: 8,
+        borderWidth: 1,
+        font: {
+          size: 10,
+          face: "Vazir",
+          color: palette.subtext,
+          align: "center"
+        },
+        color: {
+          border: "rgba(107,114,128,0.55)",
+          background: "rgba(107,114,128,0.28)",
+          highlight: {
+            border: "rgba(107,114,128,0.7)",
+            background: "rgba(107,114,128,0.35)"
+          },
+          hover: {
+            border: "rgba(107,114,128,0.7)",
+            background: "rgba(107,114,128,0.35)"
+          }
+        },
+        chosen: {
+          node(values) {
+            values.borderWidth = 1;
+            values.size = 8;
+            values.shadow = false;
+          }
+        }
+      },
+      sub: {
+        shape: "dot",
+        size: 6,
+        font: { size: 13, family: "Arial", color: palette.edge },
+        color: {
+          border: palette.edge,
+          background: palette.edge,
+          highlight: { background: palette.edge, border: palette.edge }
+        },
+        borderWidth: 0
+      },
+      hotWallet: {
+        shape: "text",
+        font: { size: 12, face: "Vazir", color: palette.edge, align: "left" },
+        borderWidth: 0,
+        size: 0,
+        color: {
+          background: "transparent",
+          border: "transparent",
+          highlight: { background: "transparent", border: "transparent" }
+        }
+      },
+      labelNode: {
+        font: { size: 12, face: "Vazir", color: palette.subtext, align: "center" },
+        borderWidth: 1,
+        borderColor: "#FF5733",
+        align: "horizontal",
+        shape: "box",
+        color: {
+          border: palette.boxBorder,
+          background: isDark ? "rgba(31,41,55,.6)" : "#fff"
+        },
+        size: 15
+      },
+      Arrow: {
+        font: { size: 22, face: "Vazir", color: palette.edge, align: "center" },
+        borderWidth: 0,
+        align: "center",
+        shape: "text",
+        color: {
+          background: "transparent",
+          border: "transparent",
+          highlight: { background: "transparent", border: "transparent" }
+        },
+        size: 16
+      }
+    }
+  };
+};
+
+// src/Components/miladiCalendar.js
+function MiladiCalendar(time) {
+  if (time.toString().length === 10) {
+    time = time * 1e3;
+  }
+  const date = new Date(time);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
+  const hour = date.getHours();
+  const minute = date.getMinutes();
+  const second = date.getSeconds();
+  return {
+    year,
+    month,
+    day,
+    hour,
+    minute,
+    second
+  };
+}
+
+// src/graphConfig.js
+var NODE_TYPE = {
+  MAIN: "main",
+  SUB: "sub"
+};
+var EDGE_LABEL_FIELDS = {
+  VALUE: "value",
+  SUB_TEXT: "subText",
+  SUB_VALUE: "subValue",
+  TIME: "time"
+};
+var DEFAULT_EDGE_LABEL_FIELDS = [
+  EDGE_LABEL_FIELDS.VALUE,
+  EDGE_LABEL_FIELDS.SUB_TEXT,
+  EDGE_LABEL_FIELDS.TIME
+];
+var EDGE_LINE_STYLE = {
+  SOLID: "solid",
+  DASHED: "dashed",
+  DOTTED: "dotted"
+};
+var DEFAULT_EDGE_LINE_STYLE = EDGE_LINE_STYLE.SOLID;
+function normalizeEdgeLineStyle(style) {
+  const allowed = new Set(Object.values(EDGE_LINE_STYLE));
+  return allowed.has(style) ? style : DEFAULT_EDGE_LINE_STYLE;
+}
+function resolveEdgeVisStyle(options = {}) {
+  const {
+    isDark = false,
+    paintedColor = null,
+    paintedLineStyle = null
+  } = options;
+  const lineStyle = normalizeEdgeLineStyle(paintedLineStyle || DEFAULT_EDGE_LINE_STYLE);
+  const defaultColor = isDark ? "#6ea8ff" : "rgb(50, 87, 155)";
+  const color = paintedColor || defaultColor;
+  let dashes = false;
+  if (lineStyle === EDGE_LINE_STYLE.DASHED) dashes = [10, 8];
+  if (lineStyle === EDGE_LINE_STYLE.DOTTED) dashes = [2, 7];
+  return {
+    width: 2,
+    dashes,
+    smooth: {
+      type: "cubicBezier",
+      forceDirection: "horizontal",
+      roundness: 0.2
+    },
+    arrows: { to: { enabled: true, scaleFactor: 0.85 } },
+    color: {
+      color,
+      highlight: color,
+      hover: color,
+      inherit: false
+    }
+  };
+}
+function mirrorEdgeRef(edge, overrides = {}) {
+  return {
+    id: overrides.id ?? (edge == null ? void 0 : edge.id),
+    value: (edge == null ? void 0 : edge.value) ?? null,
+    subText: (edge == null ? void 0 : edge.subText) ?? null,
+    subValue: (edge == null ? void 0 : edge.subValue) ?? null,
+    time: (edge == null ? void 0 : edge.time) ?? Math.floor(Date.now() / 1e3)
+  };
+}
+var DEFAULT_RATE_COLOR_RANGES = [
+  { min: 70, max: Infinity, color: "red" },
+  { min: 50, max: 70, color: "orange" }
+];
+function normalizeEdgeLabelFields(fields) {
+  if (!Array.isArray(fields) || !fields.length) return [...DEFAULT_EDGE_LABEL_FIELDS];
+  const allowed = new Set(Object.values(EDGE_LABEL_FIELDS));
+  const normalized = fields.filter((f) => allowed.has(f));
+  return normalized.length ? normalized : [...DEFAULT_EDGE_LABEL_FIELDS];
+}
+function normalizeRateColorRanges(ranges) {
+  if (!Array.isArray(ranges) || !ranges.length) return [...DEFAULT_RATE_COLOR_RANGES];
+  return ranges.filter((r) => r && r.color).map((r) => ({
+    min: r.min ?? -Infinity,
+    max: r.max ?? Infinity,
+    color: r.color
+  }));
+}
+function getRateBorderColor(rate, ranges, defaultColor) {
+  if (rate == null || !Number.isFinite(Number(rate))) return defaultColor;
+  const value = Number(rate);
+  const bands = normalizeRateColorRanges(ranges);
+  for (const band of bands) {
+    const min = band.min ?? -Infinity;
+    const max = band.max ?? Infinity;
+    if (max === Infinity) {
+      if (value >= min) return band.color;
+    } else if (value >= min && value < max) {
+      return band.color;
+    }
+  }
+  return defaultColor;
+}
+var formatTime = (timestamp) => {
+  const m = MiladiCalendar(timestamp);
+  return `\u200E ${m.year}/${m.month}/${m.day} - ${m.hour}:${m.minute}`;
+};
+function buildEdgeInfoLabel(edgeData, fields = DEFAULT_EDGE_LABEL_FIELDS) {
+  const list = normalizeEdgeLabelFields(fields);
+  if (!edgeData) return "";
+  const lines = [];
+  const hasValue = list.includes(EDGE_LABEL_FIELDS.VALUE);
+  const hasSubText = list.includes(EDGE_LABEL_FIELDS.SUB_TEXT);
+  const hasSubValue = list.includes(EDGE_LABEL_FIELDS.SUB_VALUE);
+  const hasTime = list.includes(EDGE_LABEL_FIELDS.TIME);
+  if (hasValue) {
+    let line = `\u200E${Number(edgeData.value || 0).toLocaleString()}`;
+    if (hasSubText && edgeData.subText) line += ` ${edgeData.subText}`;
+    lines.push(line);
+  } else if (hasSubText && edgeData.subText) {
+    lines.push(String(edgeData.subText));
+  }
+  if (hasSubValue) {
+    const v = edgeData.subValue;
+    lines.push(
+      typeof v === "number" && !isNaN(v) ? `\u200E${v.toLocaleString()} USD` : "\u0642\u06CC\u0645\u062A \u0646\u0627\u0645\u0634\u062E\u0635"
+    );
+  }
+  if (hasTime) {
+    const t = edgeData.time;
+    lines.push(
+      typeof t === "number" && !isNaN(t) ? formatTime(t) : "\u0632\u0645\u0627\u0646 \u0646\u0627\u0645\u0634\u062E\u0635"
+    );
+  }
+  return lines.join(" \n ");
+}
+function getNodeDisplayLabel(item) {
+  if (!item) return "";
+  if (item.type === NODE_TYPE.SUB) return item.subText ?? "";
+  if (item.label != null) return item.label;
+  if (item.entity != null) return item.entity.name ?? "";
+  const text = item.text ?? "";
+  return `...${String(text).substring(0, 7)}`;
+}
+var DEFAULT_NODE_ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" fill="none">
+  <circle cx="32" cy="32" r="31" fill="#f1f5f9" stroke="#cbd5e1" stroke-width="2"/>
+  <circle cx="32" cy="24" r="9" fill="#94a3b8"/>
+  <path fill="#94a3b8" d="M14 52c3.2-9.6 11.2-14 18-14s14.8 4.4 18 14H14z"/>
+</svg>`;
+var DEFAULT_NODE_IMAGE = `data:image/svg+xml,${encodeURIComponent(
+  DEFAULT_NODE_ICON_SVG
+)}`;
+var hasEntityImage = (value) => typeof value === "string" && value.trim().length > 0;
+var GRAPH_LANGUAGE = {
+  FA: "fa",
+  EN: "en"
+};
+function normalizeGraphLanguage(value) {
+  return value === GRAPH_LANGUAGE.EN ? GRAPH_LANGUAGE.EN : GRAPH_LANGUAGE.FA;
+}
+function getNodeEntityImage(item) {
+  var _a, _b, _c;
+  if (!(item == null ? void 0 : item.entity)) return DEFAULT_NODE_IMAGE;
+  const fromMetadata = (_b = (_a = item.entity) == null ? void 0 : _a.metadata) == null ? void 0 : _b.image;
+  const fromEntity = (_c = item.entity) == null ? void 0 : _c.image;
+  if (hasEntityImage(fromMetadata)) return fromMetadata.trim();
+  if (hasEntityImage(fromEntity)) return fromEntity.trim();
+  return DEFAULT_NODE_IMAGE;
+}
+
+// src/Components/SetEdgesData.js
+var SetEdgesData = (GraphData) => {
+  const CreatedEdges = [];
+  const nodeIdMap = GraphData.reduce((map, node) => {
+    map[node.id] = node.id;
+    return map;
+  }, {});
+  GraphData.forEach((node) => {
+    if (node.type !== NODE_TYPE.MAIN) return;
+    if (Array.isArray(node.inputs)) {
+      node.inputs.forEach((edgeData) => {
+        const sourceId = nodeIdMap[edgeData.id];
+        if (sourceId !== void 0) {
+          CreatedEdges.push({ from: sourceId, to: node.id });
+        }
+      });
+    }
+    if (Array.isArray(node.outputs)) {
+      node.outputs.forEach((edgeData) => {
+        const targetId = nodeIdMap[edgeData.id];
+        if (targetId !== void 0) {
+          CreatedEdges.push({ from: node.id, to: targetId });
+        }
+      });
+    }
+  });
+  return CreatedEdges;
+};
+
+// src/Components/Graph.js
+var import_html2canvas = __toESM(require("html2canvas"));
+var XLSX = __toESM(require("xlsx"));
+
+// src/graphGuide.js
+function getGraphGuide(isFa) {
+  if (isFa) {
+    return {
+      title: "\u0631\u0627\u0647\u0646\u0645\u0627\u06CC \u0627\u0633\u062A\u0641\u0627\u062F\u0647 \u0627\u0632 \u06AF\u0631\u0627\u0641",
+      close: "\u0628\u0633\u062A\u0646",
+      sections: [
+        {
+          title: "\u062D\u0631\u06A9\u062A \u062F\u0631 \u0628\u0648\u0645",
+          items: [
+            "\u0628\u0631\u0627\u06CC \u062C\u0627\u0628\u0647\u200C\u062C\u0627\u06CC\u06CC \u0646\u0645\u0627\u060C \u0631\u0648\u06CC \u0641\u0636\u0627\u06CC \u062E\u0627\u0644\u06CC \u06A9\u0644\u06CC\u06A9 \u06A9\u0631\u062F\u0647 \u0648 \u0628\u06A9\u0634\u06CC\u062F.",
+            "\u0628\u0627 \u0627\u0633\u06A9\u0631\u0648\u0644 \u0645\u0627\u0648\u0633 \u0628\u0632\u0631\u06AF\u200C\u0646\u0645\u0627\u06CC\u06CC \u0648 \u06A9\u0648\u0686\u06A9\u200C\u0646\u0645\u0627\u06CC\u06CC \u06A9\u0646\u06CC\u062F."
+          ]
+        },
+        {
+          title: "\u0627\u0646\u062A\u062E\u0627\u0628 \u0648 \u0648\u06CC\u0631\u0627\u06CC\u0634",
+          items: [
+            "\u0631\u0648\u06CC \u06AF\u0631\u0647 \u06CC\u0627 \u06CC\u0627\u0644 \u06A9\u0644\u06CC\u06A9 \u06A9\u0646\u06CC\u062F \u062A\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u0648\u062F.",
+            "\u0628\u0631\u0627\u06CC \u0627\u0646\u062A\u062E\u0627\u0628 \u0686\u0646\u062F\u062A\u0627\u06CC\u06CC\u060C \u06A9\u0644\u06CC\u062F Ctrl \u0631\u0627 \u0646\u06AF\u0647 \u062F\u0627\u0631\u06CC\u062F \u0648 \u06A9\u0644\u06CC\u06A9 \u06A9\u0646\u06CC\u062F.",
+            "\u06AF\u0631\u0647\u200C\u0647\u0627\u06CC \u0627\u0635\u0644\u06CC (main) \u0631\u0627 \u0645\u06CC\u200C\u062A\u0648\u0627\u0646\u06CC\u062F \u0628\u0627 \u06A9\u0634\u06CC\u062F\u0646 \u062C\u0627\u0628\u0647\u200C\u062C\u0627 \u06A9\u0646\u06CC\u062F."
+          ]
+        },
+        {
+          title: "\u067E\u0646\u0644 \u0627\u0628\u0632\u0627\u0631\u0647\u0627 (\u06AF\u0648\u0634\u0647 \u0628\u0627\u0644\u0627)",
+          items: [
+            "\u062C\u0633\u062A\u062C\u0648: \u0647\u0627\u06CC\u0644\u0627\u06CC\u062A \u06AF\u0631\u0647 \u0628\u0631 \u0627\u0633\u0627\u0633 \u0634\u0646\u0627\u0633\u0647 \u06CC\u0627 \u0628\u0631\u0686\u0633\u0628.",
+            "\u0646\u0645\u0627\u06CC\u0634 \u0627\u0637\u0644\u0627\u0639\u0627\u062A \u06CC\u0627\u0644: \u0646\u0645\u0627\u06CC\u0634 \u06CC\u0627 \u0645\u062E\u0641\u06CC \u06A9\u0631\u062F\u0646 \u06AF\u0631\u0647\u200C\u0647\u0627\u06CC \u0645\u06CC\u0627\u0646\u06CC \u0631\u0648\u06CC \u06CC\u0627\u0644\u200C\u0647\u0627.",
+            "\u06AF\u0631\u06CC\u062F: \u0646\u0645\u0627\u06CC\u0634 \u0634\u0628\u06A9\u0647\u0654 \u067E\u0633\u200C\u0632\u0645\u06CC\u0646\u0647.",
+            "\u0631\u0646\u06AF \u06CC\u0627\u0644: \u0631\u0646\u06AF\u200C\u0622\u0645\u06CC\u0632\u06CC \u06CC\u0627\u0644\u200C\u0647\u0627\u06CC \u0627\u0646\u062A\u062E\u0627\u0628\u200C\u0634\u062F\u0647.",
+            "\u0645\u0631\u062A\u0628\u200C\u0633\u0627\u0632\u06CC: \u0686\u06CC\u062F\u0645\u0627\u0646 \u062E\u0648\u062F\u06A9\u0627\u0631 \u06AF\u0631\u0647\u200C\u0647\u0627.",
+            "\u0627\u0633\u06A9\u0631\u06CC\u0646\u200C\u0634\u0627\u062A \u0648 \u062E\u0631\u0648\u062C\u06CC Excel.",
+            "\u0647\u0627\u06CC\u0644\u0627\u06CC\u062A \u0645\u0633\u06CC\u0631\u0647\u0627: \u067E\u06CC\u062F\u0627 \u06A9\u0631\u062F\u0646 \u0645\u0633\u06CC\u0631 \u0628\u06CC\u0646 \u062F\u0648 \u0634\u0646\u0627\u0633\u0647 \u06AF\u0631\u0647."
+          ]
+        },
+        {
+          title: "\u0627\u0637\u0644\u0627\u0639\u0627\u062A \u0647\u0646\u06AF\u0627\u0645 \u0647\u0627\u0648\u0631",
+          items: [
+            "\u0628\u0627 \u0642\u0631\u0627\u0631 \u062F\u0627\u062F\u0646 \u0645\u0648\u0633 \u0631\u0648\u06CC \u06AF\u0631\u0647\u060C \u062C\u0632\u0626\u06CC\u0627\u062A \u0622\u0646 \u0646\u0645\u0627\u06CC\u0634 \u062F\u0627\u062F\u0647 \u0645\u06CC\u200C\u0634\u0648\u062F.",
+            "\u0627\u06AF\u0631 \u062A\u0648\u0633\u0639\u0647\u200C\u062F\u0647\u0646\u062F\u0647 \u0641\u0639\u0627\u0644 \u06A9\u0631\u062F\u0647 \u0628\u0627\u0634\u062F\u060C \u0647\u0627\u0648\u0631 \u0631\u0648\u06CC \u06CC\u0627\u0644 \u0647\u0645 \u0627\u0637\u0644\u0627\u0639\u0627\u062A \u0627\u062A\u0635\u0627\u0644 \u0631\u0627 \u0646\u0634\u0627\u0646 \u0645\u06CC\u200C\u062F\u0647\u062F."
+          ]
+        },
+        {
+          title: "\u0632\u0628\u0627\u0646",
+          items: [
+            "\u0627\u0632 \u0628\u062E\u0634 \u0632\u0628\u0627\u0646 \u062F\u0631 \u067E\u0646\u0644 \u0627\u0628\u0632\u0627\u0631\u0647\u0627 \u0645\u06CC\u200C\u062A\u0648\u0627\u0646\u06CC\u062F \u0628\u06CC\u0646 \u0641\u0627\u0631\u0633\u06CC \u0648 \u0627\u0646\u06AF\u0644\u06CC\u0633\u06CC \u062C\u0627\u0628\u0647\u200C\u062C\u0627 \u0634\u0648\u06CC\u062F."
+          ]
+        }
+      ]
+    };
+  }
+  return {
+    title: "Graph Usage Guide",
+    close: "Close",
+    sections: [
+      {
+        title: "Canvas navigation",
+        items: [
+          "Click and drag empty space to pan the view.",
+          "Use the mouse wheel to zoom in and out."
+        ]
+      },
+      {
+        title: "Selection and editing",
+        items: [
+          "Click a node or edge to select it.",
+          "Hold Ctrl and click for multi-selection.",
+          "Main nodes can be repositioned by dragging."
+        ]
+      },
+      {
+        title: "Tools panel (top corner)",
+        items: [
+          "Search: highlight nodes by ID or label.",
+          "Edge info nodes: show or hide mid-edge label nodes.",
+          "Grid: toggle background grid.",
+          "Edge color: paint selected edges.",
+          "Arrange: auto-layout nodes.",
+          "Screenshot and Excel export.",
+          "Path highlight: find routes between two node IDs."
+        ]
+      },
+      {
+        title: "Hover information",
+        items: [
+          "Hover a node to see its details.",
+          "If enabled by the developer, hovering an edge shows connection data."
+        ]
+      },
+      {
+        title: "Language",
+        items: [
+          "Switch between Persian and English from the language section in the tools panel."
+        ]
+      }
+    ]
+  };
+}
+
+// src/branding.js
+var FOOTER_TEXT = "powered by nodalix";
+
+// src/edition.js
+var NODALIX_EDITION = "full";
+var NODALIX_MAX_NODES = Infinity;
+var isBasicEdition = () => NODALIX_EDITION === "basic";
+var isFullEdition = () => NODALIX_EDITION === "full";
+var hasNodeLimit = () => Number.isFinite(NODALIX_MAX_NODES);
+
+// src/graphNodeLimits.js
+var S = (v) => String(v);
+function isHelperNodeId(id) {
+  const s = S(id);
+  return s.endsWith("_Arrow") || s.endsWith("hotWallet") || s.includes("Tr");
+}
+function isUserGraphNode(node) {
+  return Boolean(node == null ? void 0 : node.id) && !isHelperNodeId(node.id);
+}
+function countGraphNodes(nodes) {
+  if (!Array.isArray(nodes)) return 0;
+  return nodes.filter(isUserGraphNode).length;
+}
+function enforceNodeLimit(nodes, maxNodes) {
+  if (!Array.isArray(nodes)) return [];
+  if (!Number.isFinite(maxNodes)) return [...nodes];
+  let keptCount = 0;
+  const kept = [];
+  for (const node of nodes) {
+    if (!isUserGraphNode(node)) {
+      kept.push(node);
+      continue;
+    }
+    if (keptCount >= maxNodes) continue;
+    kept.push(node);
+    keptCount += 1;
+  }
+  return kept;
+}
+function canAddGraphNode(nodes, maxNodes) {
+  if (!Number.isFinite(maxNodes)) return true;
+  return countGraphNodes(nodes) < maxNodes;
+}
+function getNodeLimitError(maxNodes) {
+  return `Graph node limit reached (${maxNodes} max in nodalix-basic).`;
+}
+
+// src/Components/graphPanelIcons.js
+var import_react = __toESM(require("react"));
+var stroke = {
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+function IconCamera({ size = 16 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement(
+    "path",
+    {
+      ...stroke,
+      d: "M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement("circle", { ...stroke, cx: "12", cy: "13", r: "4" }));
+}
+function IconTable({ size = 16 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement("rect", { ...stroke, x: "3", y: "4", width: "18", height: "16", rx: "2" }), /* @__PURE__ */ import_react.default.createElement("path", { ...stroke, d: "M3 10h18M9 4v16M15 4v16" }));
+}
+function IconRoute({ size = 16 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement("circle", { ...stroke, cx: "6", cy: "19", r: "2" }), /* @__PURE__ */ import_react.default.createElement("circle", { ...stroke, cx: "18", cy: "5", r: "2" }), /* @__PURE__ */ import_react.default.createElement("path", { ...stroke, d: "M8 17c4-2 6-5 8-10" }));
+}
+function IconEraser({ size = 16 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement(
+    "path",
+    {
+      ...stroke,
+      d: "M20 20H8l-6-6 9.5-9.5a2.8 2.8 0 0 1 4 0L20 10v10z"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement("path", { ...stroke, d: "M6.5 13.5L14 6" }));
+}
+function IconSearch({ size = 16 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement("circle", { ...stroke, cx: "11", cy: "11", r: "7" }), /* @__PURE__ */ import_react.default.createElement("path", { ...stroke, d: "M20 20l-3.5-3.5" }));
+}
+function IconGlobe({ size = 14 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement("circle", { ...stroke, cx: "12", cy: "12", r: "9" }), /* @__PURE__ */ import_react.default.createElement("path", { ...stroke, d: "M3 12h18M12 3a15 15 0 0 1 0 18M12 3a15 15 0 0 0 0 18" }));
+}
+function IconChevron({ size = 14, up = true }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement(
+    "path",
+    {
+      ...stroke,
+      d: up ? "M6 15l6-6 6 6" : "M6 9l6 6 6-6"
+    }
+  ));
+}
+function IconLineDash({ size = 28 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 28 28", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement(
+    "line",
+    {
+      x1: "4",
+      y1: "14",
+      x2: "24",
+      y2: "14",
+      stroke: "currentColor",
+      strokeWidth: "2.5",
+      strokeDasharray: "5 4",
+      strokeLinecap: "round"
+    }
+  ));
+}
+function IconLineDot({ size = 28 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 28 28", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement(
+    "line",
+    {
+      x1: "4",
+      y1: "14",
+      x2: "24",
+      y2: "14",
+      stroke: "currentColor",
+      strokeWidth: "2.5",
+      strokeDasharray: "1.5 4",
+      strokeLinecap: "round"
+    }
+  ));
+}
+function IconLineSolid({ size = 28 }) {
+  return /* @__PURE__ */ import_react.default.createElement("svg", { width: size, height: size, viewBox: "0 0 28 28", "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement(
+    "line",
+    {
+      x1: "4",
+      y1: "14",
+      x2: "24",
+      y2: "14",
+      stroke: "currentColor",
+      strokeWidth: "2.5",
+      strokeLinecap: "round"
+    }
+  ));
+}
+function IconButtonContent({ icon, label }) {
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
+    "span",
+    {
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        flexShrink: 0
+      }
+    },
+    icon
+  ), label ? /* @__PURE__ */ import_react.default.createElement("span", null, label) : null);
+}
+
+// src/Components/Graph.js
+var S2 = (v) => String(v);
+var Nodalix_graph_engine = ({
+  Data,
+  NodesPosition,
+  SetNodesPosition,
+  Reload,
+  SetReload,
+  SetData,
+  SetScale,
+  Scale,
+  SetXPosition,
+  XPosition,
+  SetYPosition,
+  YPosition,
+  edgeLabelFields,
+  rateColorRanges,
+  showEdgeHoverInfo = false,
+  showHelpButton = true,
+  gridUserConfigurable = true,
+  showGrid: showGridProp = true,
+  nodesDraggableUserConfigurable = true,
+  nodesDraggable: nodesDraggableProp = true,
+  edgeInfoNodesUserConfigurable = true,
+  showEdgeInfoNodes: showEdgeInfoNodesProp = true,
+  languageUserConfigurable = true,
+  language: languageProp = "fa",
+  TakeSceenShot,
+  SetSelectedEdges,
+  PaintedEdges,
+  SetPaintedEdges,
+  setSelectedNodes,
+  SetNode,
+  onNodeClickRef
+}) => {
+  var _a;
+  const resolvedEdgeLabelFields = (0, import_react2.useMemo)(
+    () => normalizeEdgeLabelFields(edgeLabelFields),
+    [edgeLabelFields]
+  );
+  const resolvedRateColorRanges = (0, import_react2.useMemo)(
+    () => normalizeRateColorRanges(rateColorRanges),
+    [rateColorRanges]
+  );
+  (0, import_react2.useEffect)(() => {
+    console.log(Data);
+  }, [Data]);
+  const [isDarkMode, setIsDark] = (0, import_react2.useState)(false);
+  const [isStart, setIsStart] = (0, import_react2.useState)(false);
+  const [screenShot, setScreenShot] = (0, import_react2.useState)(TakeSceenShot);
+  const [isCapturing, setIsCapturing] = (0, import_react2.useState)(false);
+  const [AddPositionLoading, setAddPositionLoading] = (0, import_react2.useState)(false);
+  const [searchTerm, setSearchTerm] = (0, import_react2.useState)("");
+  const [userShowEdgeInfoNodes, setUserShowEdgeInfoNodes] = (0, import_react2.useState)(
+    !!showEdgeInfoNodesProp
+  );
+  const [userShowGrid, setUserShowGrid] = (0, import_react2.useState)(!!showGridProp);
+  const [userNodesDraggable, setUserNodesDraggable] = (0, import_react2.useState)(
+    !!nodesDraggableProp
+  );
+  const [userLang, setUserLang] = (0, import_react2.useState)(
+    () => normalizeGraphLanguage(languageProp)
+  );
+  const [pathFromId, setPathFromId] = (0, import_react2.useState)("");
+  const [pathToId, setPathToId] = (0, import_react2.useState)("");
+  const [pathMessage, setPathMessage] = (0, import_react2.useState)("");
+  const [hoverInfo, setHoverInfo] = (0, import_react2.useState)({
+    visible: false,
+    x: 0,
+    y: 0,
+    node: null
+  });
+  const [edgeHoverInfo, setEdgeHoverInfo] = (0, import_react2.useState)({
+    visible: false,
+    x: 0,
+    y: 0,
+    fromId: "",
+    toId: "",
+    summary: ""
+  });
+  const [showGuide, setShowGuide] = (0, import_react2.useState)(false);
+  const [panelOpen, setPanelOpen] = (0, import_react2.useState)(true);
+  const showEdgeHoverInfoRef = (0, import_react2.useRef)(!!showEdgeHoverInfo);
+  const edgeLabelFieldsRef = (0, import_react2.useRef)(resolvedEdgeLabelFields);
+  const containerRef = (0, import_react2.useRef)(null);
+  const networkInstanceRef = (0, import_react2.useRef)(null);
+  const showGridRef = (0, import_react2.useRef)(!!showGridProp);
+  const nodesDraggableRef = (0, import_react2.useRef)(!!nodesDraggableProp);
+  const isDarkModeRef = (0, import_react2.useRef)(
+    typeof document !== "undefined" && document.documentElement.classList.contains("dark")
+  );
+  const nodesRef = (0, import_react2.useRef)(null);
+  const edgesRef = (0, import_react2.useRef)(null);
+  const initializedRef = (0, import_react2.useRef)(false);
+  const viewportInitializedRef = (0, import_react2.useRef)(false);
+  const showEdgeInfoNodes = edgeInfoNodesUserConfigurable ? userShowEdgeInfoNodes : !!showEdgeInfoNodesProp;
+  const ShowGrid = gridUserConfigurable ? userShowGrid : !!showGridProp;
+  const nodesDraggableEnabled = nodesDraggableUserConfigurable ? userNodesDraggable : !!nodesDraggableProp;
+  const lang = languageUserConfigurable ? userLang : normalizeGraphLanguage(languageProp);
+  const isFa = lang === "fa";
+  const guideContent = (0, import_react2.useMemo)(() => getGraphGuide(isFa), [isFa]);
+  (0, import_react2.useEffect)(() => {
+    showEdgeHoverInfoRef.current = !!showEdgeHoverInfo;
+    if (!showEdgeHoverInfo) {
+      setEdgeHoverInfo({
+        visible: false,
+        x: 0,
+        y: 0,
+        fromId: "",
+        toId: "",
+        summary: ""
+      });
+    }
+  }, [showEdgeHoverInfo]);
+  (0, import_react2.useEffect)(() => {
+    edgeLabelFieldsRef.current = resolvedEdgeLabelFields;
+  }, [resolvedEdgeLabelFields]);
+  (0, import_react2.useEffect)(() => {
+    const el = document.documentElement;
+    const update = () => setIsDark(el.classList.contains("dark"));
+    update();
+    const obs = new MutationObserver(update);
+    obs.observe(el, { attributes: true, attributeFilter: ["class"] });
+    return () => obs.disconnect();
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    if (edgeInfoNodesUserConfigurable) {
+      setUserShowEdgeInfoNodes(!!showEdgeInfoNodesProp);
+    }
+  }, [showEdgeInfoNodesProp, edgeInfoNodesUserConfigurable]);
+  (0, import_react2.useEffect)(() => {
+    if (gridUserConfigurable) {
+      setUserShowGrid(!!showGridProp);
+    }
+  }, [showGridProp, gridUserConfigurable]);
+  (0, import_react2.useEffect)(() => {
+    if (nodesDraggableUserConfigurable) {
+      setUserNodesDraggable(!!nodesDraggableProp);
+    }
+  }, [nodesDraggableProp, nodesDraggableUserConfigurable]);
+  (0, import_react2.useEffect)(() => {
+    if (languageUserConfigurable) {
+      setUserLang(normalizeGraphLanguage(languageProp));
+    }
+  }, [languageProp, languageUserConfigurable]);
+  (0, import_react2.useEffect)(() => {
+    var _a2;
+    showGridRef.current = !!ShowGrid;
+    (_a2 = networkInstanceRef.current) == null ? void 0 : _a2.redraw();
+  }, [ShowGrid]);
+  (0, import_react2.useEffect)(() => {
+    nodesDraggableRef.current = !!nodesDraggableEnabled;
+    const instance = networkInstanceRef.current;
+    if (!instance) return;
+    try {
+      instance.setOptions({
+        interaction: buildInteractionOptions(nodesDraggableEnabled)
+      });
+    } catch (_) {
+    }
+  }, [nodesDraggableEnabled]);
+  (0, import_react2.useEffect)(() => {
+    var _a2;
+    isDarkModeRef.current = !!isDarkMode;
+    (_a2 = networkInstanceRef.current) == null ? void 0 : _a2.redraw();
+  }, [isDarkMode]);
+  const graphNodeCount = (0, import_react2.useMemo)(() => countGraphNodes(Data), [Data]);
+  const nodeLimitReached = isBasicEdition() && Number.isFinite(NODALIX_MAX_NODES) && graphNodeCount >= NODALIX_MAX_NODES;
+  const dataRef = (0, import_react2.useRef)(Data);
+  const newPositionsRef = (0, import_react2.useRef)(
+    Array.isArray(NodesPosition) ? NodesPosition : []
+  );
+  const selectedNodeIdsRef = (0, import_react2.useRef)([]);
+  const selectedEdgeIdsRef = (0, import_react2.useRef)([]);
+  const findEdgePayload = (fromId, toId) => {
+    const data = dataRef.current || [];
+    const fromNode = data.find((n) => S2(n.id) === fromId);
+    if (fromNode == null ? void 0 : fromNode.outputs) {
+      const match = fromNode.outputs.find((o) => S2(o == null ? void 0 : o.id) === toId);
+      if (match) return match;
+    }
+    const toNode = data.find((n) => S2(n.id) === toId);
+    if (toNode == null ? void 0 : toNode.inputs) {
+      const match = toNode.inputs.find((i) => S2(i == null ? void 0 : i.id) === fromId);
+      if (match) return match;
+    }
+    return null;
+  };
+  const getNodeLabelById = (id) => {
+    var _a2;
+    const fromDs = (_a2 = nodesRef.current) == null ? void 0 : _a2.get(id);
+    if (fromDs == null ? void 0 : fromDs.label) return S2(fromDs.label);
+    const fromData = (dataRef.current || []).find((n) => S2(n.id) === id);
+    if (fromData) return getNodeDisplayLabel(fromData) || S2(fromData.text || id);
+    return S2(id);
+  };
+  const baseNodeStyleRef = (0, import_react2.useRef)(/* @__PURE__ */ new Map());
+  const baseEdgeStyleRef = (0, import_react2.useRef)(/* @__PURE__ */ new Map());
+  (0, import_react2.useEffect)(() => {
+    dataRef.current = Data;
+  }, [Data]);
+  (0, import_react2.useEffect)(() => {
+    if (Array.isArray(NodesPosition)) {
+      newPositionsRef.current = NodesPosition.map((p) => ({
+        ...p,
+        id: S2(p.id)
+      }));
+    }
+  }, [NodesPosition]);
+  const wait = (ms) => new Promise((r) => setTimeout(r, ms));
+  const snapToGridIfNeeded = (x, y, instance) => {
+    if (!showGridRef.current || !instance) return { x, y };
+    const step = getNiceGridStep(instance.getScale());
+    if (!isFinite(step) || step <= 0) return { x, y };
+    return {
+      x: Math.round(x / step) * step,
+      y: Math.round(y / step) * step
+    };
+  };
+  const emitNodeClick = (nodePayload) => {
+    if (!nodePayload) return;
+    SetNode(nodePayload);
+    if (typeof (onNodeClickRef == null ? void 0 : onNodeClickRef.current) === "function") {
+      onNodeClickRef.current(nodePayload);
+    }
+  };
+  const downloadBlob = (blob, filename) => {
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = filename;
+    document.body.appendChild(a);
+    a.click();
+    a.remove();
+    setTimeout(() => URL.revokeObjectURL(url), 1e3);
+  };
+  const getPaintedMap = () => {
+    const map = /* @__PURE__ */ new Map();
+    (PaintedEdges || []).forEach((p) => {
+      const id = S2(p == null ? void 0 : p.id);
+      if (!id) return;
+      const entry = {
+        color: (p == null ? void 0 : p.color) || null,
+        lineStyle: (p == null ? void 0 : p.lineStyle) || null
+      };
+      if (!entry.color && !entry.lineStyle) return;
+      map.set(id, entry);
+    });
+    return map;
+  };
+  const compactPaintedEntry = (entry) => {
+    if (!entry) return null;
+    const next = {};
+    if (entry.color) next.color = entry.color;
+    if (entry.lineStyle && entry.lineStyle !== EDGE_LINE_STYLE.SOLID) {
+      next.lineStyle = entry.lineStyle;
+    }
+    return Object.keys(next).length ? next : null;
+  };
+  const syncPaintedEdgesToParent = (map) => {
+    if (typeof SetPaintedEdges !== "function") return;
+    const arr = Array.from(map.entries()).map(([id, entry]) => {
+      const compact = compactPaintedEntry(entry);
+      return compact ? { id, ...compact } : null;
+    }).filter(Boolean);
+    SetPaintedEdges(arr);
+  };
+  const buildPaintedEdgeVisUpdate = (id, entry) => ({
+    id,
+    ...resolveEdgeVisStyle({
+      isDark: isDarkMode,
+      paintedColor: (entry == null ? void 0 : entry.color) || null,
+      paintedLineStyle: (entry == null ? void 0 : entry.lineStyle) || null
+    })
+  });
+  const applyColorToSelectedEdges = (colorOrNull) => {
+    const instance = networkInstanceRef.current;
+    const edgesDS = edgesRef.current;
+    if (!instance || !edgesDS) return;
+    const selectedIds = instance.getSelectedEdges().map(S2);
+    if (!selectedIds.length) return;
+    const map = getPaintedMap();
+    const updates = [];
+    selectedIds.forEach((id) => {
+      const edge = edgesDS.get(id);
+      if (!edge) return;
+      const existing = map.get(id) || { color: null, lineStyle: null };
+      const nextEntry = { ...existing, color: colorOrNull || null };
+      const compact = compactPaintedEntry(nextEntry);
+      if (compact) map.set(id, nextEntry);
+      else map.delete(id);
+      updates.push(
+        buildPaintedEdgeVisUpdate(
+          id,
+          compact ? nextEntry : { color: null, lineStyle: null }
+        )
+      );
+    });
+    if (updates.length) edgesDS.update(updates);
+    syncPaintedEdgesToParent(map);
+    captureBaseStyles();
+    paintSelectionStyles();
+  };
+  const applyLineStyleToSelectedEdges = (lineStyleOrNull) => {
+    const instance = networkInstanceRef.current;
+    const edgesDS = edgesRef.current;
+    if (!instance || !edgesDS) return;
+    const selectedIds = instance.getSelectedEdges().map(S2);
+    if (!selectedIds.length) return;
+    const map = getPaintedMap();
+    const updates = [];
+    selectedIds.forEach((id) => {
+      const edge = edgesDS.get(id);
+      if (!edge) return;
+      const existing = map.get(id) || { color: null, lineStyle: null };
+      const nextEntry = {
+        ...existing,
+        lineStyle: lineStyleOrNull && lineStyleOrNull !== EDGE_LINE_STYLE.SOLID ? normalizeEdgeLineStyle(lineStyleOrNull) : null
+      };
+      const compact = compactPaintedEntry(nextEntry);
+      if (compact) map.set(id, nextEntry);
+      else map.delete(id);
+      updates.push(
+        buildPaintedEdgeVisUpdate(
+          id,
+          compact ? nextEntry : { color: null, lineStyle: null }
+        )
+      );
+    });
+    if (updates.length) edgesDS.update(updates);
+    syncPaintedEdgesToParent(map);
+    captureBaseStyles();
+    paintSelectionStyles();
+  };
+  const runSearch = (term) => {
+    var _a2, _b;
+    const instance = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    if (!instance || !nodesDS) return;
+    const q = S2(term || "").trim().toLowerCase();
+    if (!q) return;
+    const all = nodesDS.get().filter((n) => !isHelperNodeId(n.id));
+    const hits = all.filter((n) => {
+      const id = S2(n.id).toLowerCase();
+      const label = S2(n.label || "").toLowerCase();
+      return id.includes(q) || label.includes(q);
+    });
+    if (!hits.length) return;
+    const hitIds = hits.map((h) => S2(h.id));
+    instance.setSelection(
+      { nodes: hitIds, edges: [] },
+      { unselectAll: true, highlightEdges: false }
+    );
+    selectedNodeIdsRef.current = [...hitIds];
+    selectedEdgeIdsRef.current = [];
+    setSelectedNodes(hitIds.map((id) => nodesDS.get(id)).filter(Boolean));
+    SetSelectedEdges([]);
+    paintSelectionStyles();
+    if (hitIds.length === 1) {
+      instance.focus(hitIds[0], {
+        scale: Math.max(instance.getScale(), 1.1),
+        animation: { duration: 450, easingFunction: "easeInOutQuad" }
+      });
+      return;
+    }
+    let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+    hitIds.forEach((id) => {
+      const bb = instance.getBoundingBox(id);
+      if (!bb) return;
+      minX = Math.min(minX, bb.left);
+      minY = Math.min(minY, bb.top);
+      maxX = Math.max(maxX, bb.right);
+      maxY = Math.max(maxY, bb.bottom);
+    });
+    if (isFinite(minX) && isFinite(minY) && isFinite(maxX) && isFinite(maxY)) {
+      const pad = 100;
+      const cw = ((_a2 = containerRef.current) == null ? void 0 : _a2.clientWidth) || 1e3;
+      const ch = ((_b = containerRef.current) == null ? void 0 : _b.clientHeight) || 700;
+      const w = Math.max(1, maxX - minX + pad * 2);
+      const h = Math.max(1, maxY - minY + pad * 2);
+      const scale = Math.min(cw / w, ch / h);
+      const center = { x: (minX + maxX) / 2, y: (minY + maxY) / 2 };
+      instance.moveTo({
+        position: center,
+        scale,
+        animation: { duration: 500, easingFunction: "easeInOutQuad" }
+      });
+    }
+  };
+  const takeGraphExcelExport = () => {
+    const nodesDS = nodesRef.current;
+    const edgesDS = edgesRef.current;
+    if (!nodesDS || !edgesDS) return;
+    const mainNodes = nodesDS.get().filter((n) => !isHelperNodeId(n.id)).map((n) => ({
+      id: S2(n.id),
+      label: S2(n.label ?? ""),
+      type: S2(n.type ?? n.group ?? ""),
+      address: S2(n.address ?? n.text ?? ""),
+      subText: S2(n.subText ?? ""),
+      rate: n.rate ?? "",
+      metadata: S2(n.metadata ?? ""),
+      inputs: JSON.stringify(Array.isArray(n.inputs) ? n.inputs : []),
+      outputs: JSON.stringify(Array.isArray(n.outputs) ? n.outputs : []),
+      inputCount: Array.isArray(n.inputs) ? n.inputs.length : 0,
+      outputCount: Array.isArray(n.outputs) ? n.outputs.length : 0,
+      x: Number(n.x ?? 0),
+      y: Number(n.y ?? 0)
+    }));
+    const edges = edgesDS.get().map((e) => ({
+      id: S2(e.id),
+      from: S2(e.from),
+      to: S2(e.to),
+      label: S2(e.label ?? ""),
+      value: e.value ?? "",
+      subText: S2(e.subText ?? ""),
+      subValue: e.subValue ?? "",
+      time: e.time ?? "",
+      width: e.width ?? ""
+    }));
+    const workbook = XLSX.utils.book_new();
+    const nodeSheet = XLSX.utils.json_to_sheet(mainNodes);
+    const edgeSheet = XLSX.utils.json_to_sheet(edges);
+    XLSX.utils.book_append_sheet(workbook, nodeSheet, "Nodes");
+    XLSX.utils.book_append_sheet(workbook, edgeSheet, "Edges");
+    const array = XLSX.write(workbook, {
+      type: "array",
+      bookType: "xlsx",
+      compression: true
+    });
+    const blob = new Blob([array], {
+      type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+    });
+    downloadBlob(blob, `graph-export-${Date.now()}.xlsx`);
+  };
+  const findAndHighlightAllPaths = () => {
+    const instance = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    const edgesDS = edgesRef.current;
+    const fromId = S2(pathFromId).trim();
+    const toId = S2(pathToId).trim();
+    if (!instance || !nodesDS || !edgesDS) return;
+    if (!fromId || !toId) {
+      setPathMessage(
+        isFa ? "\u0644\u0637\u0641\u0627\u064B \u0622\u06CC\u062F\u06CC \u0645\u0628\u062F\u0627 \u0648 \u0645\u0642\u0635\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F." : "Please provide both source and destination ids."
+      );
+      return;
+    }
+    if (!nodesDS.get(fromId) || !nodesDS.get(toId)) {
+      setPathMessage(
+        isFa ? "\u06CC\u06A9\u06CC \u0627\u0632 \u0622\u06CC\u062F\u06CC\u200C\u0647\u0627 \u062F\u0631 \u06AF\u0631\u0627\u0641 \u0648\u062C\u0648\u062F \u0646\u062F\u0627\u0631\u062F." : "One of the node ids does not exist in graph."
+      );
+      return;
+    }
+    const edgeRows = edgesDS.get();
+    const adjacency = /* @__PURE__ */ new Map();
+    const edgeIdsByPair = /* @__PURE__ */ new Map();
+    edgeRows.forEach((e) => {
+      const from = S2(e.from);
+      const to = S2(e.to);
+      if (!adjacency.has(from)) adjacency.set(from, /* @__PURE__ */ new Set());
+      adjacency.get(from).add(to);
+      const key = `${from}__${to}`;
+      if (!edgeIdsByPair.has(key)) edgeIdsByPair.set(key, []);
+      edgeIdsByPair.get(key).push(S2(e.id));
+    });
+    const MAX_PATHS = 3e3;
+    const MAX_DEPTH = Math.max(nodesDS.getIds().length || 0, 1);
+    const allPaths = [];
+    const nodePath = [fromId];
+    const visited = /* @__PURE__ */ new Set([fromId]);
+    const dfs = (current, depth) => {
+      if (allPaths.length >= MAX_PATHS || depth > MAX_DEPTH) return;
+      if (current === toId) {
+        allPaths.push([...nodePath]);
+        return;
+      }
+      const nextSet = adjacency.get(current);
+      if (!nextSet || !nextSet.size) return;
+      for (const next of nextSet) {
+        if (visited.has(next)) continue;
+        visited.add(next);
+        nodePath.push(next);
+        dfs(next, depth + 1);
+        nodePath.pop();
+        visited.delete(next);
+      }
+    };
+    dfs(fromId, 0);
+    if (!allPaths.length) {
+      instance.setSelection(
+        { nodes: [fromId, toId], edges: [] },
+        { unselectAll: true, highlightEdges: false }
+      );
+      selectedNodeIdsRef.current = [fromId, toId];
+      selectedEdgeIdsRef.current = [];
+      setSelectedNodes([nodesDS.get(fromId), nodesDS.get(toId)].filter(Boolean));
+      SetSelectedEdges([]);
+      paintSelectionStyles();
+      setPathMessage(
+        isFa ? "\u0645\u0633\u06CC\u0631 \u0645\u0633\u062A\u0642\u06CC\u0645\u06CC \u067E\u06CC\u062F\u0627 \u0646\u0634\u062F." : "No directed path was found."
+      );
+      return;
+    }
+    const selectedNodes = /* @__PURE__ */ new Set();
+    const selectedEdges = /* @__PURE__ */ new Set();
+    allPaths.forEach((path) => {
+      path.forEach((id) => selectedNodes.add(id));
+      for (let i = 0; i < path.length - 1; i++) {
+        const ids = edgeIdsByPair.get(`${path[i]}__${path[i + 1]}`) || [];
+        ids.forEach((id) => selectedEdges.add(id));
+      }
+    });
+    const selectedNodeIds = Array.from(selectedNodes);
+    const selectedEdgeIds = Array.from(selectedEdges);
+    instance.setSelection(
+      { nodes: selectedNodeIds, edges: selectedEdgeIds },
+      { unselectAll: true, highlightEdges: false }
+    );
+    selectedNodeIdsRef.current = selectedNodeIds;
+    selectedEdgeIdsRef.current = selectedEdgeIds;
+    setSelectedNodes(selectedNodeIds.map((id) => nodesDS.get(id)).filter(Boolean));
+    SetSelectedEdges(selectedEdgeIds.map((id) => edgesDS.get(id)).filter(Boolean));
+    paintSelectionStyles();
+    setPathMessage(
+      isFa ? `${allPaths.length.toLocaleString()} \u0645\u0633\u06CC\u0631 \u067E\u06CC\u062F\u0627 \u0634\u062F.` : `${allPaths.length.toLocaleString()} path(s) found.`
+    );
+  };
+  const handleAutoArrangeGraph = async () => {
+    var _a2;
+    const instance = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    const edgesDS = edgesRef.current;
+    if (!instance || !nodesDS || !edgesDS) return;
+    if (handleAutoArrangeGraph.__running) return;
+    handleAutoArrangeGraph.__running = true;
+    setAddPositionLoading(true);
+    const raf = () => new Promise((r) => requestAnimationFrame(r));
+    const S3 = (v) => String(v ?? "");
+    try {
+      try {
+        instance.setOptions({ physics: { enabled: false } });
+      } catch (_) {
+      }
+      const allNodes = nodesDS.get();
+      const allEdges = edgesDS.get();
+      const byId = new Map(allNodes.map((n) => [S3(n.id), n]));
+      const mainNodes = allNodes.filter((n) => !isHelperNodeId(n.id));
+      if (!mainNodes.length) return;
+      const mainIds = new Set(mainNodes.map((n) => S3(n.id)));
+      const mainEdges = allEdges.filter(
+        (e) => mainIds.has(S3(e.from)) && mainIds.has(S3(e.to))
+      );
+      const BOX_MARGIN = 14;
+      const INFO_BOX_MARGIN = 16;
+      const clamp = (v, min, max) => Math.min(Math.max(v, min), max);
+      const boxesOverlap = (x1, y1, hw1, hh1, x2, y2, hw2, hh2, margin = 0) => Math.abs(x1 - x2) < hw1 + hw2 + margin && Math.abs(y1 - y2) < hh1 + hh2 + margin;
+      const estimateMainHalfSize = (mainId) => {
+        var _a3;
+        const node = byId.get(mainId) || {};
+        const size = Number((node == null ? void 0 : node.size) ?? 18);
+        const labelLen = S3((node == null ? void 0 : node.label) ?? "").length;
+        const fontSize = Number(((_a3 = node == null ? void 0 : node.font) == null ? void 0 : _a3.size) ?? 13);
+        return {
+          x: clamp(26 + size + labelLen * (fontSize * 0.38), 38, 130),
+          y: clamp(24 + size * 1.05, 34, 88)
+        };
+      };
+      const estimateInfoHalfSize = (infoNode) => {
+        const lines = S3((infoNode == null ? void 0 : infoNode.label) ?? "").split("\n");
+        const maxChars = lines.reduce((m, l) => Math.max(m, l.trim().length), 0);
+        const fontSize = 12;
+        const lineHeight = 15;
+        const pad = 18;
+        return {
+          x: clamp(pad + maxChars * (fontSize * 0.58), 64, 300),
+          y: clamp(pad + lines.length * lineHeight, 30, 130)
+        };
+      };
+      const getMainHalf = (mainId) => estimateMainHalfSize(mainId);
+      const getInfoHalf = (infoNode) => estimateInfoHalfSize(infoNode);
+      const overlapsAnyMainBox = (x, y, hw, hh, mainPosMap2, margin = BOX_MARGIN) => {
+        for (const [mid, p] of Object.entries(mainPosMap2)) {
+          if (!p) continue;
+          const mh = getMainHalf(mid);
+          if (boxesOverlap(x, y, hw, hh, p.x, p.y, mh.x, mh.y, margin))
+            return true;
+        }
+        return false;
+      };
+      const overlapsAnyInfoBox = (id, x, y, hw, hh, infoPlaced2, infoHalfMap2, margin = INFO_BOX_MARGIN) => {
+        for (const [oid, p] of Object.entries(infoPlaced2)) {
+          if (!p || oid === id) continue;
+          const oh = infoHalfMap2[oid] || { x: 80, y: 40 };
+          if (boxesOverlap(x, y, hw, hh, p.x, p.y, oh.x, oh.y, margin))
+            return true;
+        }
+        return false;
+      };
+      const overlapsPlacedHelpers = (id, x, y, hw, hh, placedMap2, halfMap, margin = BOX_MARGIN) => {
+        for (const [oid, p] of Object.entries(placedMap2)) {
+          if (!p || oid === id) continue;
+          const oh = halfMap[oid];
+          if (!oh) continue;
+          if (boxesOverlap(x, y, hw, hh, p.x, p.y, oh.x, oh.y, margin))
+            return true;
+        }
+        return false;
+      };
+      const collidesMapBox = (id, x, y, hw, hh, map, halfMap, margin = BOX_MARGIN) => {
+        for (const [oid, p] of Object.entries(map)) {
+          if (!p || oid === id) continue;
+          const oh = halfMap[oid] || { x: hw, y: hh };
+          if (boxesOverlap(x, y, hw, hh, p.x, p.y, oh.x, oh.y, margin))
+            return true;
+        }
+        return false;
+      };
+      const placeAroundBox = (id, bx, by, halfX, halfY, placedMap2, halfMap, opts = {}) => {
+        const margin = opts.margin ?? BOX_MARGIN;
+        const ringStep = opts.ringStep ?? 20;
+        const maxRings = opts.maxRings ?? 48;
+        const angles = opts.angles ?? 48;
+        if (!collidesMapBox(id, bx, by, halfX, halfY, placedMap2, halfMap, margin))
+          return { x: bx, y: by };
+        for (let r = 1; r <= maxRings; r++) {
+          const rad = r * ringStep;
+          for (let k = 0; k < angles; k++) {
+            const a = 2 * Math.PI * k / angles;
+            const x = bx + Math.cos(a) * rad;
+            const y = by + Math.sin(a) * rad;
+            if (!collidesMapBox(id, x, y, halfX, halfY, placedMap2, halfMap, margin))
+              return { x, y };
+          }
+        }
+        return { x: bx, y: by };
+      };
+      const infoPosIsValid = (id, x, y, infoNode, infoHalf, mainPosMap2, infoPlaced2, infoHalfMap2, placedMap2, placedHalfMap2) => !overlapsAnyMainBox(
+        x,
+        y,
+        infoHalf.x,
+        infoHalf.y,
+        mainPosMap2,
+        INFO_BOX_MARGIN
+      ) && !overlapsAnyInfoBox(
+        id,
+        x,
+        y,
+        infoHalf.x,
+        infoHalf.y,
+        infoPlaced2,
+        infoHalfMap2,
+        INFO_BOX_MARGIN
+      ) && !overlapsPlacedHelpers(
+        id,
+        x,
+        y,
+        infoHalf.x,
+        infoHalf.y,
+        placedMap2,
+        placedHalfMap2,
+        BOX_MARGIN
+      );
+      const pushOutFromMainForbidden = (id, p, infoNode, infoHalf, mainPosMap2, infoPlaced2, infoHalfMap2, placedMap2, placedHalfMap2) => {
+        let x = p.x, y = p.y;
+        const isBad = (cx, cy) => !infoPosIsValid(
+          id,
+          cx,
+          cy,
+          infoNode,
+          infoHalf,
+          mainPosMap2,
+          infoPlaced2,
+          infoHalfMap2,
+          placedMap2,
+          placedHalfMap2
+        );
+        if (!isBad(x, y)) return { x, y };
+        const step = Math.max(24, Math.min(infoHalf.x, infoHalf.y) * 0.35);
+        for (let k = 1; k <= 180; k++) {
+          const d = k * step;
+          const tries = [
+            { x, y: y + d },
+            { x, y: y - d },
+            { x: x + d, y },
+            { x: x - d, y },
+            { x: x + d, y: y + d },
+            { x: x - d, y: y - d },
+            { x: x + d, y: y - d },
+            { x: x - d, y: y + d }
+          ];
+          for (const t of tries) {
+            if (!isBad(t.x, t.y)) return t;
+          }
+        }
+        for (let r = step * 2; r <= 5600; r += step * 1.6) {
+          for (let a = 0; a < 40; a++) {
+            const ang = 2 * Math.PI * a / 40;
+            const cx = x + Math.cos(ang) * r;
+            const cy = y + Math.sin(ang) * r;
+            if (!isBad(cx, cy)) return { x: cx, y: cy };
+          }
+        }
+        return { x, y };
+      };
+      const inDeg = /* @__PURE__ */ Object.create(null);
+      const outDeg = /* @__PURE__ */ Object.create(null);
+      const adj = /* @__PURE__ */ Object.create(null);
+      const revAdj = /* @__PURE__ */ Object.create(null);
+      for (const n of mainNodes) {
+        const id = S3(n.id);
+        inDeg[id] = 0;
+        outDeg[id] = 0;
+        adj[id] = [];
+        revAdj[id] = [];
+      }
+      for (const e of mainEdges) {
+        const f = S3(e.from), t = S3(e.to);
+        if (inDeg[f] == null || inDeg[t] == null) continue;
+        adj[f].push(t);
+        revAdj[t].push(f);
+        outDeg[f] += 1;
+        inDeg[t] += 1;
+      }
+      const q = [];
+      const inTmp = { ...inDeg };
+      const layer = /* @__PURE__ */ Object.create(null);
+      for (const id of Object.keys(inTmp)) {
+        if (inTmp[id] === 0) {
+          q.push(id);
+          layer[id] = 0;
+        }
+      }
+      if (!q.length) {
+        const ids = Object.keys(inTmp).sort();
+        q.push(ids[0]);
+        layer[ids[0]] = 0;
+      }
+      while (q.length) {
+        const u = q.shift();
+        const nextL = (layer[u] ?? 0) + 1;
+        for (const v of adj[u]) {
+          if (layer[v] == null || nextL > layer[v]) layer[v] = nextL;
+          inTmp[v] -= 1;
+          if (inTmp[v] === 0) q.push(v);
+        }
+      }
+      let changed = true;
+      while (changed) {
+        changed = false;
+        for (const id of Object.keys(inDeg)) {
+          if (layer[id] != null) continue;
+          const parents = revAdj[id] || [];
+          if (!parents.length) {
+            layer[id] = 0;
+            changed = true;
+            continue;
+          }
+          const known = parents.filter((p) => layer[p] != null);
+          if (!known.length) continue;
+          layer[id] = Math.max(...known.map((p) => layer[p])) + 1;
+          changed = true;
+        }
+      }
+      for (const id of Object.keys(inDeg)) {
+        if (layer[id] == null) layer[id] = 0;
+      }
+      const layers = /* @__PURE__ */ Object.create(null);
+      for (const [id, l] of Object.entries(layer)) {
+        if (!layers[l]) layers[l] = [];
+        layers[l].push(id);
+      }
+      const layerKeys = Object.keys(layers).map(Number).sort((a, b) => a - b);
+      const oldPos = /* @__PURE__ */ Object.create(null);
+      for (const n of allNodes) oldPos[S3(n.id)] = { x: n.x || 0, y: n.y || 0 };
+      for (const lk of layerKeys) {
+        layers[lk].sort((a, b) => {
+          var _a3, _b;
+          return (((_a3 = oldPos[a]) == null ? void 0 : _a3.y) ?? 0) - (((_b = oldPos[b]) == null ? void 0 : _b.y) ?? 0);
+        });
+      }
+      const nCount = mainNodes.length;
+      const medianOf = (arr) => {
+        if (!arr.length) return Number.POSITIVE_INFINITY;
+        const sorted = [...arr].sort((a, b) => a - b);
+        const mid = Math.floor(sorted.length / 2);
+        return sorted.length % 2 ? sorted[mid] : (sorted[mid - 1] + sorted[mid]) / 2;
+      };
+      const barySort = (ids, getNeighbors) => {
+        return [...ids].sort((a, b) => {
+          var _a3, _b;
+          const na = getNeighbors(a);
+          const nb = getNeighbors(b);
+          const ba = medianOf(na);
+          const bb = medianOf(nb);
+          if (ba !== bb) return ba - bb;
+          return (((_a3 = oldPos[a]) == null ? void 0 : _a3.y) ?? 0) - (((_b = oldPos[b]) == null ? void 0 : _b.y) ?? 0);
+        });
+      };
+      const indexInLayer = () => {
+        const idx = /* @__PURE__ */ Object.create(null);
+        for (const lk of layerKeys) {
+          const arr = layers[lk] || [];
+          const m = /* @__PURE__ */ Object.create(null);
+          for (let i = 0; i < arr.length; i++) m[arr[i]] = i;
+          idx[lk] = m;
+        }
+        return idx;
+      };
+      const crossSweeps = Math.min(
+        16,
+        8 + Math.floor(layerKeys.length / 2) + Math.floor(nCount / 80)
+      );
+      for (let sweep = 0; sweep < crossSweeps; sweep++) {
+        let idxMap2 = indexInLayer();
+        for (let i = 1; i < layerKeys.length; i++) {
+          const lk = layerKeys[i];
+          layers[lk] = barySort(
+            layers[lk],
+            (id) => (revAdj[id] || []).filter(
+              (p) => {
+                var _a3;
+                return (layer[p] ?? 999) < lk && ((_a3 = idxMap2[layer[p]]) == null ? void 0 : _a3[p]) != null;
+              }
+            ).map((p) => idxMap2[layer[p]][p])
+          );
+        }
+        idxMap2 = indexInLayer();
+        for (let i = layerKeys.length - 2; i >= 0; i--) {
+          const lk = layerKeys[i];
+          layers[lk] = barySort(
+            layers[lk],
+            (id) => (adj[id] || []).filter(
+              (c) => {
+                var _a3;
+                return (layer[c] ?? -1) > lk && ((_a3 = idxMap2[layer[c]]) == null ? void 0 : _a3[c]) != null;
+              }
+            ).map((c) => idxMap2[layer[c]][c])
+          );
+        }
+      }
+      const countAllCrossings = () => {
+        var _a3, _b, _c, _d;
+        const idx = indexInLayer();
+        let c = 0;
+        for (let li = 0; li < layerKeys.length; li++) {
+          for (let lj = li + 1; lj < layerKeys.length; lj++) {
+            const L = layerKeys[li];
+            const R = layerKeys[lj];
+            const edgesLR = mainEdges.filter((e) => {
+              const f = S3(e.from);
+              const t = S3(e.to);
+              return layer[f] === L && layer[t] === R;
+            });
+            for (let i = 0; i < edgesLR.length; i++) {
+              for (let j = i + 1; j < edgesLR.length; j++) {
+                const f1 = S3(edgesLR[i].from);
+                const t1 = S3(edgesLR[i].to);
+                const f2 = S3(edgesLR[j].from);
+                const t2 = S3(edgesLR[j].to);
+                const y1f = ((_a3 = idx[L]) == null ? void 0 : _a3[f1]) ?? 0;
+                const y2f = ((_b = idx[L]) == null ? void 0 : _b[f2]) ?? 0;
+                const y1t = ((_c = idx[R]) == null ? void 0 : _c[t1]) ?? 0;
+                const y2t = ((_d = idx[R]) == null ? void 0 : _d[t2]) ?? 0;
+                if ((y1f - y2f) * (y1t - y2t) < 0) c++;
+              }
+            }
+          }
+        }
+        return c;
+      };
+      const optimizeLayerOrders = () => {
+        const maxPasses = Math.min(10, 3 + Math.floor(nCount / 60));
+        for (let pass = 0; pass < maxPasses; pass++) {
+          let improved = false;
+          for (const lk of layerKeys) {
+            const arr = layers[lk];
+            if (!arr || arr.length < 2) continue;
+            for (let i = 0; i < arr.length - 1; i++) {
+              const before = countAllCrossings();
+              [arr[i], arr[i + 1]] = [arr[i + 1], arr[i]];
+              const after = countAllCrossings();
+              if (after < before) improved = true;
+              else [arr[i], arr[i + 1]] = [arr[i + 1], arr[i]];
+            }
+          }
+          if (!improved) break;
+        }
+      };
+      optimizeLayerOrders();
+      const maxLayerSize = Math.max(
+        1,
+        ...layerKeys.map((lk) => (layers[lk] || []).length)
+      );
+      const numLayers = Math.max(1, layerKeys.length);
+      const NODE_GAP_Y = clamp(
+        165 + Math.sqrt(maxLayerSize) * 36 + Math.log2(nCount + 1) * 16,
+        175,
+        380
+      );
+      const BASE_LAYER_GAP_X = clamp(
+        300 + Math.sqrt(nCount) * 8 + Math.sqrt(maxLayerSize) * 6,
+        300,
+        480
+      );
+      const edgeCountBetween = /* @__PURE__ */ Object.create(null);
+      for (const e of mainEdges) {
+        const f = S3(e.from);
+        const t = S3(e.to);
+        const lf = layer[f];
+        const lt = layer[t];
+        if (lf == null || lt == null || lf >= lt) continue;
+        const key = `${lf}|${lt}`;
+        edgeCountBetween[key] = (edgeCountBetween[key] || 0) + 1;
+      }
+      const colX = [];
+      let xAcc = 0;
+      for (let i = 0; i < layerKeys.length; i++) {
+        colX.push(xAcc);
+        if (i >= layerKeys.length - 1) break;
+        const leftL = layerKeys[i];
+        const rightL = layerKeys[i + 1];
+        let denseEdges = 0;
+        for (let l = leftL; l < rightL; l++) {
+          for (let r = l + 1; r <= rightL; r++) {
+            denseEdges = Math.max(denseEdges, edgeCountBetween[`${l}|${r}`] || 0);
+          }
+        }
+        xAcc += BASE_LAYER_GAP_X + Math.sqrt(denseEdges) * 18 + (((_a2 = layers[rightL]) == null ? void 0 : _a2.length) ?? 0) * 3;
+      }
+      const newPosMap = /* @__PURE__ */ Object.create(null);
+      const placedMap = /* @__PURE__ */ Object.create(null);
+      const placedHalfMap = /* @__PURE__ */ Object.create(null);
+      const mainPosMap = /* @__PURE__ */ Object.create(null);
+      const mainHalfMap = /* @__PURE__ */ Object.create(null);
+      for (let cx = 0; cx < layerKeys.length; cx++) {
+        const lk = layerKeys[cx];
+        const ids = layers[lk] || [];
+        const bx = colX[cx];
+        const nodeHalfs = ids.map((id) => estimateMainHalfSize(id));
+        let totalH = 0;
+        for (let i = 0; i < ids.length; i++) {
+          totalH += nodeHalfs[i].y * 2;
+          if (i < ids.length - 1) totalH += NODE_GAP_Y;
+        }
+        let yCursor = -totalH / 2;
+        for (let i = 0; i < ids.length; i++) {
+          const id = ids[i];
+          const half = nodeHalfs[i];
+          const by = yCursor + half.y;
+          yCursor += half.y * 2 + NODE_GAP_Y;
+          const p = placeAroundBox(
+            id,
+            bx,
+            by,
+            half.x,
+            half.y,
+            placedMap,
+            placedHalfMap,
+            { ringStep: 22, maxRings: 52, angles: 48 }
+          );
+          newPosMap[id] = { id, x: p.x, y: p.y };
+          placedMap[id] = { x: p.x, y: p.y };
+          placedHalfMap[id] = { x: half.x, y: half.y };
+          mainPosMap[id] = { x: p.x, y: p.y };
+          mainHalfMap[id] = { x: half.x, y: half.y };
+        }
+        if ((cx & 7) === 0) await raf();
+      }
+      for (const n of allNodes) {
+        const id = S3(n.id);
+        if (!id.endsWith("_Arrow")) continue;
+        const base = id.replace("_Arrow", "");
+        if (!newPosMap[base]) continue;
+        const p = placeAroundBox(
+          id,
+          newPosMap[base].x,
+          newPosMap[base].y - 46,
+          28,
+          28,
+          placedMap,
+          placedHalfMap,
+          { ringStep: 14, maxRings: 30, angles: 36 }
+        );
+        newPosMap[id] = { id, x: p.x, y: p.y };
+        placedMap[id] = { x: p.x, y: p.y };
+        placedHalfMap[id] = { x: 28, y: 28 };
+      }
+      for (const n of allNodes) {
+        const id = S3(n.id);
+        if (!id.endsWith("hotWallet")) continue;
+        const base = id.replace("hotWallet", "");
+        if (!newPosMap[base]) continue;
+        const owner = byId.get(base);
+        const by = (owner == null ? void 0 : owner.main) ? newPosMap[base].y - 50 : newPosMap[base].y - 30;
+        const p = placeAroundBox(
+          id,
+          newPosMap[base].x,
+          by,
+          36,
+          20,
+          placedMap,
+          placedHalfMap,
+          { ringStep: 14, maxRings: 30, angles: 36 }
+        );
+        newPosMap[id] = { id, x: p.x, y: p.y };
+        placedMap[id] = { x: p.x, y: p.y };
+        placedHalfMap[id] = { x: 36, y: 20 };
+      }
+      const infoNodes = allNodes.filter((n) => {
+        const fromId = S3(n.from);
+        const toId = S3(n.to);
+        return fromId && toId && mainIds.has(fromId) && mainIds.has(toId);
+      });
+      const infoNodeById = new Map(infoNodes.map((n) => [S3(n.id), n]));
+      const infoPlaced = /* @__PURE__ */ Object.create(null);
+      const infoHalfMap = /* @__PURE__ */ Object.create(null);
+      const infoByEdge = /* @__PURE__ */ Object.create(null);
+      for (const n of infoNodes) {
+        const key = `${S3(n.from)}|${S3(n.to)}`;
+        if (!infoByEdge[key]) infoByEdge[key] = [];
+        infoByEdge[key].push(n);
+      }
+      const sortedInfoNodes = [...infoNodes].sort((a, b) => {
+        const ha = estimateInfoHalfSize(a);
+        const hb = estimateInfoHalfSize(b);
+        return hb.x * hb.y - ha.x * ha.y;
+      });
+      const edgeSlotIndex = /* @__PURE__ */ Object.create(null);
+      for (let idx = 0; idx < sortedInfoNodes.length; idx++) {
+        const n = sortedInfoNodes[idx];
+        const id = S3(n.id);
+        const fromId = S3(n.from);
+        const toId = S3(n.to);
+        const edgeKey = `${fromId}|${toId}`;
+        const slot = edgeSlotIndex[edgeKey] ?? 0;
+        edgeSlotIndex[edgeKey] = slot + 1;
+        if (!newPosMap[fromId] || !newPosMap[toId]) continue;
+        const infoHalf = estimateInfoHalfSize(n);
+        const fx = newPosMap[fromId].x, fy = newPosMap[fromId].y;
+        const tx = newPosMap[toId].x, ty = newPosMap[toId].y;
+        const mx = (fx + tx) / 2;
+        const my = (fy + ty) / 2;
+        const dx = tx - fx;
+        const dy = ty - fy;
+        const len = Math.hypot(dx, dy) || 1;
+        const ux = dx / len;
+        const uy = dy / len;
+        let nx = -uy, ny = ux;
+        if (!isFinite(nx) || !isFinite(ny)) {
+          nx = 0;
+          ny = -1;
+        }
+        const fromHalf = getMainHalf(fromId);
+        const toHalf = getMainHalf(toId);
+        const minClearance = Math.max(fromHalf.x, fromHalf.y, toHalf.x, toHalf.y) + Math.max(infoHalf.x, infoHalf.y) + INFO_BOX_MARGIN + 24;
+        const totalOnEdge = (infoByEdge[edgeKey] || []).length;
+        const slotShift = (slot - (totalOnEdge - 1) / 2) * (infoHalf.y * 2 + 32);
+        const tangShift = slot * (infoHalf.x * 0.55 + 20);
+        let chosen = null;
+        const baseOff = clamp(minClearance + edgeSlotIndex[edgeKey] * 18, minClearance, 320);
+        for (let lvl = 0; lvl <= 120 && !chosen; lvl++) {
+          const off = baseOff + lvl * 24;
+          const tang = tangShift + lvl * 12;
+          const cands = [
+            { x: mx + nx * off + ux * tang, y: my + ny * off + uy * tang + slotShift },
+            { x: mx - nx * off - ux * tang, y: my - ny * off - uy * tang - slotShift },
+            { x: mx + nx * off - ux * tang, y: my + ny * off - uy * tang + slotShift },
+            { x: mx - nx * off + ux * tang, y: my - ny * off + uy * tang - slotShift },
+            { x: mx + ux * tang + nx * (off * 0.65), y: my + uy * tang + ny * (off * 0.65) },
+            { x: mx - ux * tang - nx * (off * 0.65), y: my - uy * tang - ny * (off * 0.65) }
+          ];
+          for (const c of cands) {
+            if (infoPosIsValid(
+              id,
+              c.x,
+              c.y,
+              n,
+              infoHalf,
+              mainPosMap,
+              infoPlaced,
+              infoHalfMap,
+              placedMap,
+              placedHalfMap
+            )) {
+              chosen = c;
+              break;
+            }
+          }
+        }
+        if (!chosen) {
+          for (let off = minClearance; off <= 5600 && !chosen; off += 48) {
+            for (let side = -1; side <= 1; side += 2) {
+              const c = {
+                x: mx + nx * off * side + ux * tangShift,
+                y: my + ny * off * side + uy * tangShift + slotShift
+              };
+              if (infoPosIsValid(
+                id,
+                c.x,
+                c.y,
+                n,
+                infoHalf,
+                mainPosMap,
+                infoPlaced,
+                infoHalfMap,
+                placedMap,
+                placedHalfMap
+              )) {
+                chosen = c;
+                break;
+              }
+            }
+          }
+        }
+        if (!chosen) {
+          for (let r = minClearance; r <= 5600 && !chosen; r += 64) {
+            for (let a = 0; a < 48; a++) {
+              const ang = 2 * Math.PI * a / 48;
+              const c = {
+                x: mx + Math.cos(ang) * r + slot * 30,
+                y: my + Math.sin(ang) * r + slotShift
+              };
+              if (infoPosIsValid(
+                id,
+                c.x,
+                c.y,
+                n,
+                infoHalf,
+                mainPosMap,
+                infoPlaced,
+                infoHalfMap,
+                placedMap,
+                placedHalfMap
+              )) {
+                chosen = c;
+                break;
+              }
+            }
+          }
+        }
+        if (!chosen) chosen = { x: mx + nx * minClearance, y: my + ny * minClearance };
+        chosen = pushOutFromMainForbidden(
+          id,
+          chosen,
+          n,
+          infoHalf,
+          mainPosMap,
+          infoPlaced,
+          infoHalfMap,
+          placedMap,
+          placedHalfMap
+        );
+        newPosMap[id] = { id, x: chosen.x, y: chosen.y };
+        placedMap[id] = { x: chosen.x, y: chosen.y };
+        placedHalfMap[id] = { x: infoHalf.x, y: infoHalf.y };
+        infoPlaced[id] = { x: chosen.x, y: chosen.y };
+        infoHalfMap[id] = { x: infoHalf.x, y: infoHalf.y };
+        if ((idx & 31) === 0) await raf();
+      }
+      if (ShowGrid) {
+        Object.entries(newPosMap).forEach(([id, p]) => {
+          const snapped = snapToGridIfNeeded(p.x, p.y, instance);
+          newPosMap[id] = { id, x: snapped.x, y: snapped.y };
+          placedMap[id] = { x: snapped.x, y: snapped.y };
+        });
+      }
+      for (const [id, infoNode] of infoNodeById.entries()) {
+        const pos = newPosMap[id];
+        if (!pos) continue;
+        const infoHalf = infoHalfMap[id] || estimateInfoHalfSize(infoNode);
+        let finalPos = { ...pos };
+        for (let attempt = 0; attempt < 8; attempt++) {
+          finalPos = pushOutFromMainForbidden(
+            id,
+            finalPos,
+            infoNode,
+            infoHalf,
+            mainPosMap,
+            infoPlaced,
+            infoHalfMap,
+            placedMap,
+            placedHalfMap
+          );
+          if (ShowGrid) {
+            finalPos = snapToGridIfNeeded(finalPos.x, finalPos.y, instance);
+          }
+          const stillBad = overlapsAnyMainBox(
+            finalPos.x,
+            finalPos.y,
+            infoHalf.x,
+            infoHalf.y,
+            mainPosMap,
+            INFO_BOX_MARGIN
+          );
+          if (!stillBad) break;
+        }
+        newPosMap[id] = { id, x: finalPos.x, y: finalPos.y };
+        placedMap[id] = { x: finalPos.x, y: finalPos.y };
+        infoPlaced[id] = { x: finalPos.x, y: finalPos.y };
+      }
+      const defaultEdgeSmooth = {
+        type: "cubicBezier",
+        forceDirection: "horizontal",
+        roundness: 0.2
+      };
+      const edgeSmoothById = /* @__PURE__ */ Object.create(null);
+      const mainToMainEdges = allEdges.filter(
+        (e) => mainIds.has(S3(e.from)) && mainIds.has(S3(e.to))
+      );
+      const getEdgeMid = (e) => {
+        var _a3, _b, _c, _d;
+        const f = S3(e.from);
+        const t = S3(e.to);
+        const fx = ((_a3 = newPosMap[f]) == null ? void 0 : _a3.x) ?? 0;
+        const fy = ((_b = newPosMap[f]) == null ? void 0 : _b.y) ?? 0;
+        const tx = ((_c = newPosMap[t]) == null ? void 0 : _c.x) ?? 0;
+        const ty = ((_d = newPosMap[t]) == null ? void 0 : _d.y) ?? 0;
+        return { fx, fy, tx, ty, mx: (fx + tx) / 2, my: (fy + ty) / 2 };
+      };
+      const setEdgeSmooth = (e, smooth) => {
+        edgeSmoothById[S3(e.id)] = smooth;
+      };
+      const pairGroups = /* @__PURE__ */ Object.create(null);
+      for (const e of mainToMainEdges) {
+        const key = `${S3(e.from)}|${S3(e.to)}`;
+        if (!pairGroups[key]) pairGroups[key] = [];
+        pairGroups[key].push(e);
+      }
+      for (const group of Object.values(pairGroups)) {
+        if (group.length <= 1) continue;
+        const sorted = [...group].sort((a, b) => S3(a.id).localeCompare(S3(b.id)));
+        sorted.forEach((e, i) => {
+          const tier = Math.floor(i / 2);
+          const roundness = clamp(0.2 + tier * 0.24, 0.18, 0.85);
+          const type = i % 2 === 0 ? "curvedCW" : "curvedCCW";
+          setEdgeSmooth(e, { type, roundness });
+        });
+      }
+      const channelBucket = Math.max(36, NODE_GAP_Y * 0.28);
+      const channelGroups = /* @__PURE__ */ Object.create(null);
+      for (const e of mainToMainEdges) {
+        if (edgeSmoothById[S3(e.id)]) continue;
+        const f = S3(e.from);
+        const t = S3(e.to);
+        const lf = layer[f];
+        const lt = layer[t];
+        if (lf == null || lt == null) continue;
+        const mid = getEdgeMid(e);
+        let channelKey;
+        if (lf === lt) {
+          channelKey = `col|${lf}|${Math.round(mid.mx / channelBucket)}`;
+        } else {
+          const leftL = Math.min(lf, lt);
+          const rightL = Math.max(lf, lt);
+          channelKey = `lr|${leftL}|${rightL}|${Math.round(mid.my / channelBucket)}`;
+        }
+        if (!channelGroups[channelKey]) channelGroups[channelKey] = [];
+        channelGroups[channelKey].push(e);
+      }
+      for (const group of Object.values(channelGroups)) {
+        if (group.length <= 1) continue;
+        const sorted = [...group].sort((a, b) => getEdgeMid(a).my - getEdgeMid(b).my);
+        const n = sorted.length;
+        sorted.forEach((e, i) => {
+          if (edgeSmoothById[S3(e.id)]) return;
+          const offset = i - (n - 1) / 2;
+          if (Math.abs(offset) < 0.01) {
+            setEdgeSmooth(e, { ...defaultEdgeSmooth, roundness: 0.08 });
+            return;
+          }
+          const type = offset < 0 ? "curvedCCW" : "curvedCW";
+          const roundness = clamp(0.14 + Math.abs(offset) * 0.18, 0.12, 0.75);
+          setEdgeSmooth(e, { type, roundness });
+        });
+      }
+      const edgeSmoothUpdates = mainToMainEdges.map((e) => ({
+        id: e.id,
+        smooth: edgeSmoothById[S3(e.id)] || defaultEdgeSmooth
+      }));
+      const updates = Object.values(newPosMap).map((p) => {
+        const id = S3(p.id);
+        const isMain = mainIds.has(id);
+        return {
+          id: p.id,
+          x: p.x,
+          y: p.y,
+          physics: false,
+          // main nodes must stay draggable; only helpers stay fixed
+          fixed: isMain ? false : { x: true, y: true }
+        };
+      });
+      const CHUNK = updates.length > 4e3 ? 300 : updates.length > 1500 ? 500 : 800;
+      for (let i = 0; i < updates.length; i += CHUNK) {
+        nodesDS.update(updates.slice(i, i + CHUNK));
+        await raf();
+      }
+      if (edgeSmoothUpdates.length) {
+        for (let i = 0; i < edgeSmoothUpdates.length; i += CHUNK) {
+          edgesDS.update(edgeSmoothUpdates.slice(i, i + CHUNK));
+          await raf();
+        }
+      }
+      const nextPositionsArr = Object.values(newPosMap);
+      newPositionsRef.current = nextPositionsArr;
+      SetNodesPosition(nextPositionsArr);
+      const dataCopy = Array.isArray(dataRef.current) ? [...dataRef.current] : [];
+      const idxMap = new Map(dataCopy.map((d, i) => [S3(d.id), i]));
+      for (const [id, p] of Object.entries(newPosMap)) {
+        const i = idxMap.get(id);
+        if (i != null)
+          dataCopy[i] = { ...dataCopy[i], x: p.x, y: p.y, physics: false };
+      }
+      SetData(dataCopy);
+      dataRef.current = dataCopy;
+      try {
+        instance.setOptions({
+          physics: { enabled: false },
+          interaction: buildInteractionOptions(nodesDraggableRef.current)
+        });
+      } catch (_) {
+      }
+      if (mainNodes.length <= 1200) {
+        instance.fit({
+          animation: { duration: 350, easingFunction: "easeInOutQuad" }
+        });
+      } else {
+        instance.moveTo({
+          animation: { duration: 180, easingFunction: "easeInOutQuad" }
+        });
+      }
+      try {
+        instance.storePositions();
+      } catch (_) {
+      }
+    } catch (err) {
+      console.error("Auto arrange failed:", err);
+    } finally {
+      setAddPositionLoading(false);
+      handleAutoArrangeGraph.__running = false;
+    }
+  };
+  const takeFullGraphScreenshot = async () => {
+    const instance = networkInstanceRef.current;
+    const container = containerRef.current;
+    const nodesDS = nodesRef.current;
+    if (!instance || !container || !nodesDS || isCapturing) return;
+    setIsCapturing(true);
+    const mainNodeIds = nodesDS.get().map((n) => S2(n.id)).filter((id) => !isHelperNodeId(id));
+    if (!mainNodeIds.length) {
+      setIsCapturing(false);
+      return;
+    }
+    const prevScale = instance.getScale();
+    const prevPos = instance.getViewPosition();
+    let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+    mainNodeIds.forEach((id) => {
+      const bb = instance.getBoundingBox(id);
+      if (!bb) return;
+      minX = Math.min(minX, bb.left);
+      minY = Math.min(minY, bb.top);
+      maxX = Math.max(maxX, bb.right);
+      maxY = Math.max(maxY, bb.bottom);
+    });
+    if (!isFinite(minX) || !isFinite(minY) || !isFinite(maxX) || !isFinite(maxY)) {
+      setIsCapturing(false);
+      return;
+    }
+    const padding = 120;
+    minX -= padding;
+    minY -= padding;
+    maxX += padding;
+    maxY += padding;
+    const graphW = Math.max(1, maxX - minX);
+    const graphH = Math.max(1, maxY - minY);
+    const cw = container.clientWidth || 1200;
+    const ch = container.clientHeight || 800;
+    const targetScale = Math.min(cw / graphW, ch / graphH);
+    const center = { x: (minX + maxX) / 2, y: (minY + maxY) / 2 };
+    try {
+      instance.moveTo({
+        position: center,
+        scale: targetScale,
+        animation: { duration: 320, easingFunction: "easeInOutQuad" }
+      });
+      await wait(500);
+      const canvas = await (0, import_html2canvas.default)(container, {
+        backgroundColor: "#ffffff",
+        useCORS: true,
+        scale: Math.min((window.devicePixelRatio || 2) + 1, 4),
+        logging: false
+      });
+      canvas.toBlob(
+        (blob) => {
+          if (!blob) return;
+          downloadBlob(blob, `graph-full-${Date.now()}.png`);
+        },
+        "image/png",
+        1
+      );
+    } finally {
+      instance.moveTo({
+        position: prevPos,
+        scale: prevScale,
+        animation: { duration: 220, easingFunction: "easeInOutQuad" }
+      });
+      setIsCapturing(false);
+    }
+  };
+  const syncAttachedNodesLive = (movedNodeIds) => {
+    const instance = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    if (!instance || !nodesDS || !(movedNodeIds == null ? void 0 : movedNodeIds.length)) return;
+    const ids = movedNodeIds.map(S2);
+    const pos = instance.getPositions(ids);
+    ids.forEach((id) => {
+      const p = pos[id];
+      if (!p) return;
+      const arrowId = `${id}_Arrow`;
+      if (nodesDS.get(arrowId)) instance.moveNode(arrowId, p.x, p.y - 46);
+      const hotId = `${id}hotWallet`;
+      if (nodesDS.get(hotId)) {
+        const owner = nodesDS.get(id);
+        instance.moveNode(hotId, p.x, (owner == null ? void 0 : owner.main) ? p.y - 45 : p.y - 25);
+      }
+    });
+  };
+  const syncEdgeLabelNodesLive = (movedNodeIds) => {
+    const instance = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    if (!instance || !nodesDS || !(movedNodeIds == null ? void 0 : movedNodeIds.length)) return;
+    const ids = new Set(movedNodeIds.map(S2));
+    const relatedLabels = nodesDS.get().filter(
+      (n) => n.group === "labelNode" && (ids.has(S2(n.from)) || ids.has(S2(n.to)))
+    );
+    relatedLabels.forEach((labelNode) => {
+      const fromId = S2(labelNode.from);
+      const toId = S2(labelNode.to);
+      const fp = instance.getPositions([fromId])[fromId];
+      const tp = instance.getPositions([toId])[toId];
+      if (!fp || !tp) return;
+      instance.moveNode(labelNode.id, (fp.x + tp.x) / 2, (fp.y + tp.y) / 2);
+    });
+  };
+  const captureBaseStyles = () => {
+    const nodesDS = nodesRef.current;
+    const edgesDS = edgesRef.current;
+    if (!nodesDS || !edgesDS) return;
+    baseNodeStyleRef.current.clear();
+    baseEdgeStyleRef.current.clear();
+    nodesDS.get().forEach((n) => {
+      baseNodeStyleRef.current.set(S2(n.id), {
+        borderWidth: n.borderWidth ?? 1.5,
+        color: n.color ?? void 0,
+        shadow: n.shadow ?? false
+      });
+    });
+    edgesDS.get().forEach((e) => {
+      baseEdgeStyleRef.current.set(S2(e.id), {
+        width: e.width ?? 2,
+        color: e.color ?? void 0,
+        shadow: e.shadow ?? false,
+        dashes: e.dashes ?? false
+      });
+    });
+  };
+  const paintSelectionStyles = () => {
+    const instance = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    const edgesDS = edgesRef.current;
+    if (!instance || !nodesDS || !edgesDS) return;
+    const selectedNodeIds = new Set(instance.getSelectedNodes().map(S2));
+    const selectedEdgeIds = new Set(instance.getSelectedEdges().map(S2));
+    const nodeUpdates = [];
+    nodesDS.getIds().map(S2).forEach((id) => {
+      const base = baseNodeStyleRef.current.get(id) || {};
+      if (selectedNodeIds.has(id)) {
+        nodeUpdates.push({
+          id,
+          borderWidth: 6,
+          shadow: {
+            enabled: true,
+            color: "rgba(0,168,255,0.55)",
+            size: 20,
+            x: 0,
+            y: 0
+          },
+          color: {
+            ...typeof base.color === "object" ? base.color : {},
+            border: "#00A8FF"
+          }
+        });
+      } else {
+        nodeUpdates.push({
+          id,
+          borderWidth: base.borderWidth ?? 1.5,
+          shadow: base.shadow ?? false,
+          color: base.color
+        });
+      }
+    });
+    const edgeUpdates = [];
+    edgesDS.getIds().map(S2).forEach((id) => {
+      var _a2;
+      const base = baseEdgeStyleRef.current.get(id) || {};
+      if (selectedEdgeIds.has(id)) {
+        const baseColor = typeof base.color === "object" ? (_a2 = base.color) == null ? void 0 : _a2.color : void 0;
+        const c = baseColor || "#00A8FF";
+        edgeUpdates.push({
+          id,
+          width: Math.max(base.width ?? 2, 4),
+          shadow: {
+            enabled: true,
+            color: "rgba(0,168,255,0.65)",
+            size: 14,
+            x: 0,
+            y: 0
+          },
+          color: { color: c, highlight: c, hover: c, inherit: false },
+          dashes: base.dashes ?? false
+        });
+      } else {
+        edgeUpdates.push({
+          id,
+          width: base.width ?? 2,
+          shadow: base.shadow ?? false,
+          color: base.color,
+          dashes: base.dashes ?? false
+        });
+      }
+    });
+    if (nodeUpdates.length) nodesDS.update(nodeUpdates);
+    if (edgeUpdates.length) edgesDS.update(edgeUpdates);
+  };
+  const edgeColorPalette = (0, import_react2.useMemo)(
+    () => [
+      "#ef4444",
+      "#f97316",
+      "#f59e0b",
+      "#eab308",
+      "#22c55e",
+      "#14b8a6",
+      "#06b6d4",
+      "#3b82f6",
+      "#8b5cf6",
+      "#ec4899"
+    ],
+    []
+  );
+  const getPanelShellStyle = () => ({
+    position: "absolute",
+    top: 12,
+    left: 12,
+    zIndex: 99999,
+    width: 300,
+    maxWidth: "calc(100% - 24px)",
+    borderRadius: 16,
+    padding: 10,
+    backdropFilter: "blur(12px)",
+    WebkitBackdropFilter: "blur(12px)",
+    background: isDarkMode ? "linear-gradient(160deg, rgba(15,23,42,0.92), rgba(30,41,59,0.86))" : "linear-gradient(160deg, rgba(255,255,255,0.96), rgba(248,250,252,0.92))",
+    border: `1px solid ${isDarkMode ? "rgba(148,163,184,0.24)" : "rgba(15,23,42,0.08)"}`,
+    boxShadow: isDarkMode ? "0 14px 40px rgba(2,6,23,.48)" : "0 14px 36px rgba(15,23,42,.10)",
+    color: isDarkMode ? "#e2e8f0" : "#0f172a",
+    overflow: "hidden"
+  });
+  const panelInsetStyle = {
+    padding: "8px 10px",
+    borderRadius: 10,
+    background: isDarkMode ? "rgba(15,23,42,.72)" : "rgba(255,255,255,.82)",
+    border: `1px solid ${isDarkMode ? "rgba(148,163,184,0.2)" : "rgba(15,23,42,0.08)"}`,
+    boxShadow: isDarkMode ? "0 10px 24px rgba(2,6,23,.18)" : "0 10px 24px rgba(15,23,42,.06)"
+  };
+  const panelToggleRowStyle = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: 6,
+    padding: "0 1px 5px"
+  };
+  const panelCollapseBodyStyle = (open) => ({
+    maxHeight: open ? 620 : 0,
+    opacity: open ? 1 : 0,
+    transition: "max-height 260ms ease, opacity 180ms ease",
+    overflow: "hidden",
+    pointerEvents: open ? "auto" : "none"
+  });
+  const compactInputStyle = {
+    width: "100%",
+    borderRadius: 8,
+    border: `1px solid ${isDarkMode ? "#334155" : "#cbd5e1"}`,
+    background: isDarkMode ? "rgba(15,23,42,.92)" : "#fff",
+    color: isDarkMode ? "#e2e8f0" : "#0f172a",
+    padding: "8px 10px",
+    outline: "none",
+    fontSize: 12,
+    boxSizing: "border-box"
+  };
+  const compactSectionLabel = {
+    fontSize: 12,
+    fontWeight: 900,
+    marginBottom: 8,
+    opacity: 1,
+    color: isDarkMode ? "#e2e8f0" : "#0f172a",
+    background: isDarkMode ? "rgba(14,165,233,.12)" : "rgba(14,165,233,.10)",
+    padding: "4px 8px",
+    borderRadius: 999,
+    border: `1px solid ${isDarkMode ? "rgba(56,189,248,.22)" : "rgba(14,165,233,.18)"}`
+  };
+  (0, import_react2.useEffect)(() => {
+    if (!containerRef.current || initializedRef.current) return;
+    nodesRef.current = new import_vis.DataSet([]);
+    edgesRef.current = new import_vis.DataSet([]);
+    const baseOptions = buildOptions(!!isDarkMode, {
+      dragNodes: nodesDraggableRef.current
+    });
+    const instance = new import_vis.Network(
+      containerRef.current,
+      { nodes: nodesRef.current, edges: edgesRef.current },
+      {
+        ...baseOptions,
+        physics: { enabled: false },
+        interaction: buildInteractionOptions(nodesDraggableRef.current)
+      }
+    );
+    networkInstanceRef.current = instance;
+    initializedRef.current = true;
+    instance.on("beforeDrawing", (ctx) => {
+      if (!showGridRef.current) return;
+      drawNetworkGrid(ctx, instance, isDarkModeRef.current);
+    });
+    const syncSelection = () => {
+      const nodeIds = instance.getSelectedNodes().map(S2);
+      const edgeIds = instance.getSelectedEdges().map(S2);
+      selectedNodeIdsRef.current = [...nodeIds];
+      selectedEdgeIdsRef.current = [...edgeIds];
+      setSelectedNodes(
+        nodeIds.map((id) => nodesRef.current.get(id)).filter(Boolean)
+      );
+      SetSelectedEdges(
+        edgeIds.map((id) => edgesRef.current.get(id)).filter(Boolean)
+      );
+      paintSelectionStyles();
+    };
+    instance.on("zoom", (params) => SetScale(params.scale));
+    instance.on("dragging", (params) => {
+      var _a2;
+      if (!((_a2 = params == null ? void 0 : params.nodes) == null ? void 0 : _a2.length)) return;
+      const movedMain = params.nodes.map(S2).filter((id) => !isHelperNodeId(id));
+      if (!movedMain.length) return;
+      syncAttachedNodesLive(movedMain);
+      syncEdgeLabelNodesLive(movedMain);
+    });
+    instance.on("dragEnd", (params) => {
+      var _a2;
+      const viewPos = instance.getViewPosition();
+      SetXPosition(viewPos.x);
+      SetYPosition(viewPos.y);
+      if ((_a2 = params == null ? void 0 : params.nodes) == null ? void 0 : _a2.length) {
+        const movedIds = params.nodes.map(S2).filter((id) => !isHelperNodeId(id));
+        if (!movedIds.length) {
+          syncSelection();
+          return;
+        }
+        const currentPositions = instance.getPositions(movedIds);
+        const dataCopy = [...dataRef.current];
+        const posMap = new Map(
+          (newPositionsRef.current || []).map((p) => [
+            S2(p.id),
+            { ...p, id: S2(p.id) }
+          ])
+        );
+        movedIds.forEach((id) => {
+          const p = currentPositions[id];
+          if (!p) return;
+          const gridOn = !!showGridRef.current;
+          const finalPos = gridOn ? snapToGridIfNeeded(p.x, p.y, instance) : { x: p.x, y: p.y };
+          if (gridOn) {
+            instance.moveNode(id, finalPos.x, finalPos.y);
+          }
+          const i = dataCopy.findIndex((d) => S2(d.id) === id);
+          if (i >= 0)
+            dataCopy[i] = { ...dataCopy[i], x: finalPos.x, y: finalPos.y };
+          posMap.set(id, { id, x: finalPos.x, y: finalPos.y });
+          const arrowId = `${id}_Arrow`;
+          if (nodesRef.current.get(arrowId)) {
+            const arrowPos = gridOn ? snapToGridIfNeeded(finalPos.x, finalPos.y - 46, instance) : { x: finalPos.x, y: finalPos.y - 46 };
+            instance.moveNode(arrowId, arrowPos.x, arrowPos.y);
+            posMap.set(arrowId, { id: arrowId, x: arrowPos.x, y: arrowPos.y });
+          }
+          const hotId = `${id}hotWallet`;
+          if (nodesRef.current.get(hotId)) {
+            const owner = nodesRef.current.get(id);
+            const hotY = (owner == null ? void 0 : owner.main) ? finalPos.y - 45 : finalPos.y - 25;
+            const hotPos = gridOn ? snapToGridIfNeeded(finalPos.x, hotY, instance) : { x: finalPos.x, y: hotY };
+            instance.moveNode(hotId, hotPos.x, hotPos.y);
+            posMap.set(hotId, { id: hotId, x: hotPos.x, y: hotPos.y });
+          }
+        });
+        syncEdgeLabelNodesLive(movedIds);
+        const nextPositions = Array.from(posMap.values());
+        newPositionsRef.current = nextPositions;
+        SetData(dataCopy);
+        dataRef.current = dataCopy;
+        SetNodesPosition(nextPositions);
+        try {
+          instance.storePositions();
+        } catch (_) {
+        }
+      }
+      syncSelection();
+    });
+    instance.on("hoverNode", (params) => {
+      var _a2;
+      const id = S2(params.node);
+      if (isHelperNodeId(id)) {
+        setHoverInfo({ visible: false, x: 0, y: 0, node: null });
+        return;
+      }
+      setEdgeHoverInfo({
+        visible: false,
+        x: 0,
+        y: 0,
+        fromId: "",
+        toId: "",
+        summary: ""
+      });
+      const n = (_a2 = nodesRef.current) == null ? void 0 : _a2.get(id);
+      if (!n) return;
+      const dom = instance.canvasToDOM(instance.getPositions([id])[id]);
+      setHoverInfo({ visible: true, x: dom.x, y: dom.y - 18, node: n });
+    });
+    instance.on(
+      "blurNode",
+      () => setHoverInfo({ visible: false, x: 0, y: 0, node: null })
+    );
+    instance.on("hoverEdge", (params) => {
+      var _a2, _b, _c, _d;
+      if (!showEdgeHoverInfoRef.current) return;
+      const edge = (_a2 = edgesRef.current) == null ? void 0 : _a2.get(S2(params.edge));
+      if (!edge) return;
+      const fromId = S2(edge.from);
+      const toId = S2(edge.to);
+      const payload = findEdgePayload(fromId, toId);
+      const summary = payload ? buildEdgeInfoLabel(payload, edgeLabelFieldsRef.current) : "";
+      const rect = (_b = containerRef.current) == null ? void 0 : _b.getBoundingClientRect();
+      const clientX = ((_c = params == null ? void 0 : params.event) == null ? void 0 : _c.clientX) ?? 0;
+      const clientY = ((_d = params == null ? void 0 : params.event) == null ? void 0 : _d.clientY) ?? 0;
+      const x = rect ? clientX - rect.left : clientX;
+      const y = rect ? clientY - rect.top : clientY;
+      setHoverInfo({ visible: false, x: 0, y: 0, node: null });
+      setEdgeHoverInfo({
+        visible: true,
+        x,
+        y: y - 12,
+        fromId,
+        toId,
+        summary
+      });
+    });
+    instance.on("blurEdge", () => {
+      if (!showEdgeHoverInfoRef.current) return;
+      setEdgeHoverInfo({
+        visible: false,
+        x: 0,
+        y: 0,
+        fromId: "",
+        toId: "",
+        summary: ""
+      });
+    });
+    instance.on("selectNode", syncSelection);
+    instance.on("selectEdge", syncSelection);
+    instance.on("deselectNode", syncSelection);
+    instance.on("deselectEdge", syncSelection);
+    return () => {
+      if (networkInstanceRef.current) {
+        try {
+          networkInstanceRef.current.destroy();
+        } catch (_) {
+        }
+      }
+      networkInstanceRef.current = null;
+      initializedRef.current = false;
+      viewportInitializedRef.current = false;
+    };
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    if (!initializedRef.current) return;
+    const instance = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    const edgesDS = edgesRef.current;
+    if (!instance || !nodesDS || !edgesDS) return;
+    const posMap = new Map(
+      (newPositionsRef.current || []).map((p) => [S2(p.id), p])
+    );
+    const nodesArr = [];
+    const edgesArr = [];
+    const defaultBorder = isDarkMode ? "#93c5fd" : "rgb(50, 87, 155)";
+    const paintedMap = /* @__PURE__ */ new Map();
+    (PaintedEdges || []).forEach((p) => {
+      const id = S2(p.id);
+      if (!id) return;
+      const entry = {
+        color: p.color || null,
+        lineStyle: p.lineStyle || null
+      };
+      if (entry.color || entry.lineStyle) paintedMap.set(id, entry);
+    });
+    Data.forEach((item) => {
+      const id = S2(item.id);
+      const p = posMap.get(id);
+      const x = Number((p == null ? void 0 : p.x) ?? item.x ?? 0);
+      const y = Number((p == null ? void 0 : p.y) ?? item.y ?? 0);
+      const label = getNodeDisplayLabel(item);
+      const borderColor = getRateBorderColor(
+        item.rate,
+        resolvedRateColorRanges,
+        defaultBorder
+      );
+      nodesArr.push({
+        ...item,
+        id,
+        x,
+        y,
+        group: item.type,
+        selectable: true,
+        main: !!item.main,
+        borderWidth: 2,
+        color: { border: borderColor },
+        rate: item.rate ?? null,
+        address: item.text,
+        image: getNodeEntityImage(item),
+        label
+      });
+      if (item.metadata != null) {
+        nodesArr.push({
+          id: `${id}hotWallet`,
+          x,
+          y: item.main ? y - 45 : y - 25,
+          group: "hotWallet",
+          image: "/images/fire.png",
+          label: item.metadata,
+          selectable: false,
+          physics: false,
+          fixed: { x: true, y: true }
+        });
+      }
+      if (item.main) {
+        nodesArr.push({
+          id: `${id}_Arrow`,
+          x,
+          y: y - 46,
+          group: "Arrow",
+          label: "\u2193",
+          selectable: false,
+          physics: false,
+          fixed: { x: true, y: true }
+        });
+      }
+    });
+    const rawEdges = SetEdgesData(Data).map((e, idx) => {
+      const from = S2(e.from);
+      const to = S2(e.to);
+      const id = e.id != null ? S2(e.id) : `${from}__${to}__${S2(e.label ?? "")}__${idx}`;
+      const painted = paintedMap.get(id) || { color: null, lineStyle: null };
+      const visStyle = resolveEdgeVisStyle({
+        isDark: isDarkMode,
+        paintedColor: painted.color,
+        paintedLineStyle: painted.lineStyle
+      });
+      return {
+        id,
+        from,
+        to,
+        label: e.label != null ? S2(e.label) : "",
+        selectable: true,
+        ...visStyle
+      };
+    });
+    const seen = /* @__PURE__ */ new Set();
+    const uniqueEdges = rawEdges.filter((e) => {
+      const key = `${e.from}__${e.to}__${S2(e.label ?? "")}`;
+      if (seen.has(key)) return false;
+      seen.add(key);
+      return true;
+    });
+    edgesArr.push(...uniqueEdges);
+    if (showEdgeInfoNodes && resolvedEdgeLabelFields.length) {
+      Data.forEach((node) => {
+        if (node.type !== NODE_TYPE.MAIN) return;
+        const nodeId = S2(node.id);
+        const selfPos = posMap.get(nodeId) || {
+          x: node.x ?? 0,
+          y: node.y ?? 0
+        };
+        const makeLabel = (edgeData) => buildEdgeInfoLabel(edgeData, resolvedEdgeLabelFields);
+        (node.inputs || []).forEach((inp) => {
+          const other = Data.find((d) => S2(d.id) === S2(inp.id));
+          if (!other) return;
+          const otherId = S2(other.id);
+          const otherPos = posMap.get(otherId) || {
+            x: other.x ?? 0,
+            y: other.y ?? 0
+          };
+          nodesArr.push({
+            id: `${nodeId}Tr${otherId}_in`,
+            x: (selfPos.x + otherPos.x) / 2,
+            y: (selfPos.y + otherPos.y) / 2,
+            from: nodeId,
+            to: otherId,
+            group: "labelNode",
+            label: makeLabel(inp),
+            selectable: false,
+            physics: false,
+            fixed: { x: true, y: true }
+          });
+        });
+        (node.outputs || []).forEach((out) => {
+          const other = Data.find((d) => S2(d.id) === S2(out.id));
+          if (!other) return;
+          const otherId = S2(other.id);
+          const otherPos = posMap.get(otherId) || {
+            x: other.x ?? 0,
+            y: other.y ?? 0
+          };
+          nodesArr.push({
+            id: `${nodeId}Tr${otherId}_out`,
+            x: (selfPos.x + otherPos.x) / 2,
+            y: (selfPos.y + otherPos.y) / 2,
+            from: nodeId,
+            to: otherId,
+            group: "labelNode",
+            label: makeLabel(out),
+            selectable: false,
+            physics: false,
+            fixed: { x: true, y: true }
+          });
+        });
+      });
+    }
+    nodesDS.clear();
+    edgesDS.clear();
+    nodesDS.add(nodesArr);
+    edgesDS.add(edgesArr);
+    const validNodeIds = selectedNodeIdsRef.current.map(S2).filter((id) => !!nodesDS.get(id));
+    const validEdgeIds = selectedEdgeIdsRef.current.map(S2).filter((id) => !!edgesDS.get(id));
+    instance.setSelection(
+      { nodes: validNodeIds, edges: validEdgeIds },
+      { unselectAll: true, highlightEdges: false }
+    );
+    captureBaseStyles();
+    paintSelectionStyles();
+    if (!viewportInitializedRef.current) {
+      instance.moveTo({
+        scale: Scale,
+        position: { x: XPosition, y: YPosition }
+      });
+      viewportInitializedRef.current = true;
+    }
+  }, [
+    Data,
+    Reload,
+    resolvedEdgeLabelFields,
+    resolvedRateColorRanges,
+    PaintedEdges,
+    isDarkMode,
+    Scale,
+    XPosition,
+    YPosition,
+    showEdgeInfoNodes
+  ]);
+  (0, import_react2.useEffect)(() => {
+    if (!networkInstanceRef.current) return;
+    const baseOptions = buildOptions(!!isDarkMode, {
+      dragNodes: nodesDraggableRef.current
+    });
+    networkInstanceRef.current.setOptions({
+      ...baseOptions,
+      physics: { enabled: false },
+      interaction: buildInteractionOptions(nodesDraggableRef.current)
+    });
+    paintSelectionStyles();
+  }, [isDarkMode]);
+  (0, import_react2.useEffect)(() => {
+    if (!isStart) {
+      SetReload(!Reload);
+      setIsStart(true);
+    }
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    if (screenShot !== TakeSceenShot) {
+      takeFullGraphScreenshot();
+      setScreenShot(TakeSceenShot);
+    }
+  }, [TakeSceenShot]);
+  (0, import_react2.useEffect)(() => {
+    const t = setTimeout(() => {
+      if (searchTerm.trim()) runSearch(searchTerm);
+    }, 180);
+    return () => clearTimeout(t);
+  }, [searchTerm]);
+  (0, import_react2.useEffect)(() => {
+    const network = networkInstanceRef.current;
+    const nodesDS = nodesRef.current;
+    if (!network || !nodesDS) return;
+    const S3 = (v) => String(v ?? "");
+    const isIgnoredNode = (id) => {
+      const s = S3(id);
+      return s.endsWith("hotWallet") || // helper
+      s.endsWith("_Arrow") || // helper
+      s.includes("Tr") || // edgeInfo-like
+      s.includes("edgeInfo");
+    };
+    const handleNodeClick = (params) => {
+      if (!(params == null ? void 0 : params.nodes) || params.nodes.length === 0) {
+        SetNode(null);
+        return;
+      }
+      const clickedId = params.nodes[0];
+      if (!clickedId) {
+        SetNode(null);
+        return;
+      }
+      if (isIgnoredNode(clickedId)) {
+        SetNode(null);
+        return;
+      }
+      const nodeData = nodesDS.get(clickedId);
+      if (!nodeData) {
+        SetNode(null);
+        return;
+      }
+      const rawNode = (dataRef.current || []).find(
+        (d) => S3(d.id) === S3(clickedId)
+      );
+      emitNodeClick(rawNode ? { ...rawNode } : { ...nodeData });
+    };
+    network.on("click", handleNodeClick);
+    return () => {
+      network.off("click", handleNodeClick);
+    };
+  }, [SetNode]);
+  const actionButtonBase = {
+    border: "none",
+    borderRadius: 10,
+    padding: "8px 12px",
+    cursor: "pointer",
+    fontWeight: 700,
+    fontSize: 11,
+    color: "#fff",
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 7,
+    boxShadow: "0 4px 14px rgba(2,6,23,.2)",
+    transition: "transform 120ms ease, filter 160ms ease, box-shadow 160ms ease"
+  };
+  const getGlassShellStyle = () => ({
+    backdropFilter: "blur(12px)",
+    WebkitBackdropFilter: "blur(12px)",
+    background: isDarkMode ? "linear-gradient(160deg, rgba(15,23,42,0.92), rgba(30,41,59,0.86))" : "linear-gradient(160deg, rgba(255,255,255,0.96), rgba(248,250,252,0.92))",
+    border: `1px solid ${isDarkMode ? "rgba(148,163,184,0.24)" : "rgba(15,23,42,0.08)"}`,
+    boxShadow: isDarkMode ? "0 14px 40px rgba(2,6,23,.48)" : "0 14px 36px rgba(15,23,42,.10)",
+    color: isDarkMode ? "#e2e8f0" : "#0f172a"
+  });
+  const toolbarButtonStyle = (bg, extra = {}) => ({
+    ...actionButtonBase,
+    background: bg,
+    ...extra
+  });
+  const ghostIconButtonStyle = (extra = {}) => ({
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 6,
+    border: `1px solid ${isDarkMode ? "#475569" : "#cbd5e1"}`,
+    borderRadius: 12,
+    padding: "7px 10px",
+    cursor: "pointer",
+    fontWeight: 700,
+    fontSize: 12,
+    background: isDarkMode ? "rgba(15,23,42,.65)" : "rgba(255,255,255,.9)",
+    color: isDarkMode ? "#f8fafc" : "#0f172a",
+    transition: "background 140ms ease, border-color 140ms ease",
+    ...extra
+  });
+  return /* @__PURE__ */ import_react2.default.createElement(
+    "div",
+    {
+      style: {
+        position: "relative",
+        width: "100%",
+        height: "100%",
+        minHeight: 400
+      }
+    },
+    /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        id: "myGraphDiv",
+        ref: containerRef,
+        className: "outline-none",
+        style: { width: "100%", height: "100%", outline: "none" }
+      }
+    ),
+    /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        dir: isFa ? "rtl" : "ltr",
+        style: {
+          position: "absolute",
+          top: 12,
+          right: 12,
+          zIndex: 1e5,
+          display: "flex",
+          flexWrap: "wrap",
+          gap: 8,
+          padding: 7,
+          borderRadius: 14,
+          ...getGlassShellStyle()
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: takeFullGraphScreenshot,
+          disabled: isCapturing,
+          title: isFa ? "\u0627\u0633\u06A9\u0631\u06CC\u0646\u200C\u0634\u0627\u062A" : "Screenshot",
+          style: toolbarButtonStyle(
+            isCapturing ? "#64748b" : isDarkMode ? "linear-gradient(135deg,#0ea5e9,#0284c7)" : "linear-gradient(135deg,#0284c7,#0369a1)",
+            {
+              cursor: isCapturing ? "not-allowed" : "pointer",
+              opacity: isCapturing ? 0.9 : 1
+            }
+          )
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          IconButtonContent,
+          {
+            icon: /* @__PURE__ */ import_react2.default.createElement(IconCamera, { size: 15 }),
+            label: isCapturing ? isFa ? "..." : "..." : isFa ? "\u0627\u0633\u06A9\u0631\u06CC\u0646\u200C\u0634\u0627\u062A" : "Screenshot"
+          }
+        )
+      ),
+      /* @__PURE__ */ import_react2.default.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: takeGraphExcelExport,
+          title: isFa ? "\u062E\u0631\u0648\u062C\u06CC \u0627\u06A9\u0633\u0644" : "Export Excel",
+          style: toolbarButtonStyle(
+            isDarkMode ? "linear-gradient(135deg,#0f766e,#0d9488)" : "linear-gradient(135deg,#0f766e,#0f766e)"
+          )
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          IconButtonContent,
+          {
+            icon: /* @__PURE__ */ import_react2.default.createElement(IconTable, { size: 15 }),
+            label: isFa ? "\u0627\u06A9\u0633\u0644" : "Excel"
+          }
+        )
+      )
+    ),
+    /* @__PURE__ */ import_react2.default.createElement("div", { dir: isFa ? "rtl" : "ltr", style: getPanelShellStyle() }, /* @__PURE__ */ import_react2.default.createElement("div", { style: panelToggleRowStyle }, /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          gap: 6,
+          minWidth: 0
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement("div", { style: { fontSize: 13, fontWeight: 800, letterSpacing: 0.1 } }, isFa ? "\u067E\u0646\u0644 \u06AF\u0631\u0627\u0641" : "Graph Panel"),
+      /* @__PURE__ */ import_react2.default.createElement(
+        "span",
+        {
+          style: {
+            fontSize: 11,
+            fontWeight: 800,
+            padding: "3px 8px",
+            borderRadius: 999,
+            background: isDarkMode ? "rgba(15,23,42,.7)" : "rgba(226,232,240,.95)",
+            whiteSpace: "nowrap"
+          }
+        },
+        isBasicEdition() && Number.isFinite(NODALIX_MAX_NODES) ? `${graphNodeCount}/${NODALIX_MAX_NODES}` : graphNodeCount
+      )
+    ), /* @__PURE__ */ import_react2.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setPanelOpen((p) => !p),
+        title: panelOpen ? isFa ? "\u0628\u0633\u062A\u0646" : "Collapse" : isFa ? "\u0628\u0627\u0632 \u06A9\u0631\u062F\u0646" : "Expand",
+        style: {
+          width: 30,
+          height: 30,
+          minWidth: 30,
+          borderRadius: 8,
+          border: `1px solid ${isDarkMode ? "#475569" : "#cbd5e1"}`,
+          background: isDarkMode ? "#0f172a" : "#ffffff",
+          color: isDarkMode ? "#e2e8f0" : "#0f172a",
+          cursor: "pointer",
+          display: "inline-flex",
+          alignItems: "center",
+          justifyContent: "center"
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(IconChevron, { size: 15, up: panelOpen })
+    )), /* @__PURE__ */ import_react2.default.createElement("div", { style: panelCollapseBodyStyle(panelOpen) }, /* @__PURE__ */ import_react2.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 7 } }, nodeLimitReached ? /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          ...panelInsetStyle,
+          background: isDarkMode ? "rgba(127,29,29,.35)" : "rgba(254,226,226,.95)",
+          border: `1px solid ${isDarkMode ? "#b91c1c" : "#fca5a5"}`,
+          color: isDarkMode ? "#fecaca" : "#991b1b",
+          fontSize: 11,
+          fontWeight: 700,
+          lineHeight: 1.4
+        }
+      },
+      isFa ? `Basic: \u062D\u062F\u0627\u06A9\u062B\u0631 ${NODALIX_MAX_NODES} \u06AF\u0631\u0647` : `Basic: max ${NODALIX_MAX_NODES} nodes`
+    ) : null, languageUserConfigurable ? /* @__PURE__ */ import_react2.default.createElement("div", { style: panelInsetStyle }, /* @__PURE__ */ import_react2.default.createElement("div", { dir: "ltr", style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 6 } }, /* @__PURE__ */ import_react2.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setUserLang("fa"),
+        style: {
+          ...ghostIconButtonStyle({
+            border: "none",
+            background: lang === "fa" ? "#0ea5e9" : "transparent",
+            color: lang === "fa" ? "#fff" : isDarkMode ? "#e2e8f0" : "#0f172a"
+          })
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(IconButtonContent, { icon: /* @__PURE__ */ import_react2.default.createElement(IconGlobe, { size: 14 }), label: "FA" })
+    ), /* @__PURE__ */ import_react2.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setUserLang("en"),
+        style: {
+          ...ghostIconButtonStyle({
+            border: "none",
+            background: lang === "en" ? "#0ea5e9" : "transparent",
+            color: lang === "en" ? "#fff" : isDarkMode ? "#e2e8f0" : "#0f172a"
+          })
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(IconButtonContent, { icon: /* @__PURE__ */ import_react2.default.createElement(IconGlobe, { size: 14 }), label: "EN" })
+    ))) : null, /* @__PURE__ */ import_react2.default.createElement("div", { style: panelInsetStyle }, /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          gap: 8,
+          color: isDarkMode ? "#94a3b8" : "#64748b"
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement("span", { style: { display: "inline-flex", flexShrink: 0 } }, /* @__PURE__ */ import_react2.default.createElement(IconSearch, { size: 15 })),
+      /* @__PURE__ */ import_react2.default.createElement(
+        "input",
+        {
+          dir: isFa ? "rtl" : "ltr",
+          value: searchTerm,
+          onChange: (e) => setSearchTerm(e.target.value),
+          placeholder: isFa ? "\u062C\u0633\u062A\u062C\u0648: ID \u06CC\u0627 Label" : "Search: ID or Label",
+          style: {
+            ...compactInputStyle,
+            border: "none",
+            background: "transparent",
+            padding: 0,
+            flex: 1
+          }
+        }
+      )
+    )), edgeInfoNodesUserConfigurable || gridUserConfigurable || nodesDraggableUserConfigurable ? /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          ...panelInsetStyle,
+          display: "flex",
+          flexWrap: "wrap",
+          gap: "6px 12px",
+          alignItems: "center"
+        }
+      },
+      edgeInfoNodesUserConfigurable ? /* @__PURE__ */ import_react2.default.createElement(
+        "label",
+        {
+          style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 4,
+            cursor: "pointer",
+            fontSize: 12,
+            fontWeight: 700
+          }
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          "input",
+          {
+            type: "checkbox",
+            checked: showEdgeInfoNodes,
+            onChange: (e) => setUserShowEdgeInfoNodes(e.target.checked),
+            style: { width: 14, height: 14 }
+          }
+        ),
+        isFa ? "\u06CC\u0627\u0644" : "Edge"
+      ) : null,
+      gridUserConfigurable ? /* @__PURE__ */ import_react2.default.createElement(
+        "label",
+        {
+          style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 4,
+            cursor: "pointer",
+            fontSize: 12,
+            fontWeight: 700
+          }
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          "input",
+          {
+            type: "checkbox",
+            checked: ShowGrid,
+            onChange: (e) => setUserShowGrid(e.target.checked),
+            style: { width: 14, height: 14 }
+          }
+        ),
+        isFa ? "\u06AF\u0631\u06CC\u062F" : "Grid"
+      ) : null,
+      nodesDraggableUserConfigurable ? /* @__PURE__ */ import_react2.default.createElement(
+        "label",
+        {
+          style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 4,
+            cursor: "pointer",
+            fontSize: 12,
+            fontWeight: 700
+          }
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          "input",
+          {
+            type: "checkbox",
+            checked: nodesDraggableEnabled,
+            onChange: (e) => setUserNodesDraggable(e.target.checked),
+            style: { width: 14, height: 14 }
+          }
+        ),
+        isFa ? "\u062C\u0627\u0628\u0647\u200C\u062C\u0627\u06CC\u06CC" : "Drag"
+      ) : null
+    ) : null, /* @__PURE__ */ import_react2.default.createElement("div", { style: panelInsetStyle }, /* @__PURE__ */ import_react2.default.createElement("div", { style: compactSectionLabel }, isFa ? "\u0631\u0646\u06AF \u06CC\u0627\u0644" : "Edge color"), /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          display: "grid",
+          gridTemplateColumns: "repeat(5, 1fr)",
+          gap: 6,
+          justifyItems: "center",
+          marginBottom: 6
+        }
+      },
+      edgeColorPalette.map((c) => /* @__PURE__ */ import_react2.default.createElement(
+        "button",
+        {
+          key: c,
+          type: "button",
+          onClick: () => applyColorToSelectedEdges(c),
+          title: c,
+          style: {
+            width: 28,
+            height: 28,
+            borderRadius: 7,
+            border: "1.5px solid rgba(255,255,255,0.9)",
+            background: c,
+            cursor: "pointer",
+            padding: 0
+          }
+        }
+      ))
+    ), /* @__PURE__ */ import_react2.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => applyColorToSelectedEdges(null),
+        style: { ...ghostIconButtonStyle({ width: "100%" }) }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(
+        IconButtonContent,
+        {
+          icon: /* @__PURE__ */ import_react2.default.createElement(IconEraser, { size: 14 }),
+          label: isFa ? "\u062D\u0630\u0641 \u0631\u0646\u06AF" : "Clear color"
+        }
+      )
+    )), /* @__PURE__ */ import_react2.default.createElement("div", { style: panelInsetStyle }, /* @__PURE__ */ import_react2.default.createElement("div", { style: compactSectionLabel }, isFa ? "\u0627\u0633\u062A\u0627\u06CC\u0644 \u062E\u0637" : "Line style"), /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          display: "grid",
+          gridTemplateColumns: "1fr 1fr 1fr",
+          gap: 6
+        }
+      },
+      [
+        {
+          style: EDGE_LINE_STYLE.DASHED,
+          label: isFa ? "\u0686\u06CC\u0646" : "Dash",
+          icon: /* @__PURE__ */ import_react2.default.createElement(IconLineDash, { size: 24 })
+        },
+        {
+          style: EDGE_LINE_STYLE.DOTTED,
+          label: isFa ? "\u0646\u0642\u0637\u0647" : "Dot",
+          icon: /* @__PURE__ */ import_react2.default.createElement(IconLineDot, { size: 24 })
+        },
+        {
+          style: null,
+          label: isFa ? "\u0633\u0627\u062F\u0647" : "Solid",
+          icon: /* @__PURE__ */ import_react2.default.createElement(IconLineSolid, { size: 24 })
+        }
+      ].map((item) => /* @__PURE__ */ import_react2.default.createElement(
+        "button",
+        {
+          key: item.label,
+          type: "button",
+          onClick: () => applyLineStyleToSelectedEdges(item.style),
+          title: item.label,
+          style: {
+            ...ghostIconButtonStyle({
+              flexDirection: "column",
+              gap: 2,
+              padding: "6px 4px",
+              background: isDarkMode ? "#0f172a" : "#fff"
+            })
+          }
+        },
+        item.icon,
+        /* @__PURE__ */ import_react2.default.createElement("span", { style: { fontSize: 11, fontWeight: 800 } }, item.label)
+      ))
+    )), /* @__PURE__ */ import_react2.default.createElement("div", { style: panelInsetStyle }, /* @__PURE__ */ import_react2.default.createElement("div", { style: compactSectionLabel }, isFa ? "\u0645\u0633\u06CC\u0631" : "Path"), /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          display: "grid",
+          gridTemplateColumns: "1fr 1fr",
+          gap: 6,
+          marginBottom: 6
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(
+        "input",
+        {
+          dir: "ltr",
+          value: pathFromId,
+          onChange: (e) => setPathFromId(e.target.value),
+          placeholder: isFa ? "\u0627\u0632" : "From",
+          style: compactInputStyle
+        }
+      ),
+      /* @__PURE__ */ import_react2.default.createElement(
+        "input",
+        {
+          dir: "ltr",
+          value: pathToId,
+          onChange: (e) => setPathToId(e.target.value),
+          placeholder: isFa ? "\u0628\u0647" : "To",
+          style: compactInputStyle
+        }
+      )
+    ), /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          display: "grid",
+          gridTemplateColumns: "1fr 1fr",
+          gap: 6
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: findAndHighlightAllPaths,
+          style: toolbarButtonStyle(
+            isDarkMode ? "linear-gradient(135deg,#7c3aed,#6d28d9)" : "linear-gradient(135deg,#6d28d9,#5b21b6)",
+            { width: "100%" }
+          )
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          IconButtonContent,
+          {
+            icon: /* @__PURE__ */ import_react2.default.createElement(IconRoute, { size: 14 }),
+            label: isFa ? "\u0645\u0633\u06CC\u0631" : "Find"
+          }
+        )
+      ),
+      /* @__PURE__ */ import_react2.default.createElement(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            const instance = networkInstanceRef.current;
+            if (!instance) return;
+            instance.unselectAll();
+            selectedNodeIdsRef.current = [];
+            selectedEdgeIdsRef.current = [];
+            setSelectedNodes([]);
+            SetSelectedEdges([]);
+            paintSelectionStyles();
+            setPathMessage("");
+          },
+          style: { ...ghostIconButtonStyle({ width: "100%" }) }
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          IconButtonContent,
+          {
+            icon: /* @__PURE__ */ import_react2.default.createElement(IconEraser, { size: 14 }),
+            label: isFa ? "\u067E\u0627\u06A9" : "Clear"
+          }
+        )
+      )
+    ), pathMessage ? /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          marginTop: 4,
+          fontSize: 11,
+          fontWeight: 700,
+          color: isDarkMode ? "#93c5fd" : "#1d4ed8",
+          lineHeight: 1.35
+        }
+      },
+      pathMessage
+    ) : null)))),
+    showHelpButton ? /* @__PURE__ */ import_react2.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setShowGuide(true),
+        title: isFa ? "\u0631\u0627\u0647\u0646\u0645\u0627\u06CC \u0627\u0633\u062A\u0641\u0627\u062F\u0647" : "Usage guide",
+        "aria-label": isFa ? "\u0631\u0627\u0647\u0646\u0645\u0627\u06CC \u0627\u0633\u062A\u0641\u0627\u062F\u0647" : "Usage guide",
+        style: {
+          position: "absolute",
+          bottom: 12,
+          right: 12,
+          zIndex: 99995,
+          width: 40,
+          height: 40,
+          borderRadius: 999,
+          border: `1px solid ${isDarkMode ? "rgba(148,163,184,0.35)" : "rgba(15,23,42,0.12)"}`,
+          background: isDarkMode ? "linear-gradient(135deg, rgba(15,23,42,0.95), rgba(30,41,59,0.9))" : "linear-gradient(135deg, rgba(255,255,255,0.96), rgba(248,250,252,0.92))",
+          color: isDarkMode ? "#e2e8f0" : "#0f172a",
+          fontSize: 18,
+          fontWeight: 900,
+          cursor: "pointer",
+          boxShadow: isDarkMode ? "0 8px 24px rgba(2,6,23,.45)" : "0 8px 20px rgba(15,23,42,.14)"
+        }
+      },
+      "?"
+    ) : null,
+    showGuide ? /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": guideContent.title,
+        onClick: () => setShowGuide(false),
+        style: {
+          position: "absolute",
+          inset: 0,
+          zIndex: 100001,
+          background: "rgba(2,6,23,0.45)",
+          display: "grid",
+          placeItems: "center",
+          padding: 16
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement(
+        "div",
+        {
+          dir: isFa ? "rtl" : "ltr",
+          onClick: (e) => e.stopPropagation(),
+          style: {
+            width: "min(520px, 100%)",
+            maxHeight: "min(78vh, 720px)",
+            overflow: "auto",
+            borderRadius: 16,
+            padding: 16,
+            background: isDarkMode ? "linear-gradient(135deg, rgba(15,23,42,0.98), rgba(30,41,59,0.96))" : "linear-gradient(135deg, rgba(255,255,255,0.98), rgba(248,250,252,0.96))",
+            border: `1px solid ${isDarkMode ? "rgba(148,163,184,0.25)" : "rgba(15,23,42,0.10)"}`,
+            color: isDarkMode ? "#e2e8f0" : "#0f172a",
+            boxShadow: "0 18px 48px rgba(2,6,23,.35)"
+          }
+        },
+        /* @__PURE__ */ import_react2.default.createElement(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              gap: 12,
+              marginBottom: 12
+            }
+          },
+          /* @__PURE__ */ import_react2.default.createElement("h3", { style: { margin: 0, fontSize: 16, fontWeight: 900 } }, guideContent.title),
+          /* @__PURE__ */ import_react2.default.createElement(
+            "button",
+            {
+              type: "button",
+              onClick: () => setShowGuide(false),
+              style: {
+                border: `1px solid ${isDarkMode ? "#475569" : "#cbd5e1"}`,
+                borderRadius: 10,
+                padding: "6px 10px",
+                cursor: "pointer",
+                fontWeight: 700,
+                fontSize: 12,
+                background: isDarkMode ? "#0f172a" : "#fff",
+                color: isDarkMode ? "#e2e8f0" : "#0f172a"
+              }
+            },
+            guideContent.close
+          )
+        ),
+        guideContent.sections.map((section) => /* @__PURE__ */ import_react2.default.createElement("div", { key: section.title, style: { marginBottom: 14 } }, /* @__PURE__ */ import_react2.default.createElement(
+          "div",
+          {
+            style: {
+              fontSize: 13,
+              fontWeight: 800,
+              marginBottom: 6,
+              color: isDarkMode ? "#93c5fd" : "#1d4ed8"
+            }
+          },
+          section.title
+        ), /* @__PURE__ */ import_react2.default.createElement(
+          "ul",
+          {
+            style: {
+              margin: 0,
+              paddingInlineStart: 18,
+              fontSize: 12,
+              lineHeight: 1.65
+            }
+          },
+          section.items.map((item) => /* @__PURE__ */ import_react2.default.createElement("li", { key: item, style: { marginBottom: 4 } }, item))
+        )))
+      )
+    ) : null,
+    /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        style: {
+          position: "absolute",
+          left: "50%",
+          bottom: 8,
+          transform: "translateX(-50%)",
+          zIndex: 99990,
+          pointerEvents: "none",
+          fontSize: 11,
+          fontWeight: 700,
+          letterSpacing: 0.4,
+          color: isDarkMode ? "rgba(148,163,184,.95)" : "rgba(15,23,42,.75)",
+          background: isDarkMode ? "rgba(2,6,23,.45)" : "rgba(255,255,255,.72)",
+          border: `1px solid ${isDarkMode ? "rgba(71,85,105,.45)" : "rgba(148,163,184,.45)"}`,
+          borderRadius: 999,
+          padding: "4px 10px",
+          backdropFilter: "blur(4px)"
+        }
+      },
+      FOOTER_TEXT
+    ),
+    hoverInfo.visible && hoverInfo.node && /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        dir: isFa ? "rtl" : "ltr",
+        style: {
+          position: "absolute",
+          left: hoverInfo.x,
+          top: hoverInfo.y,
+          transform: "translate(-50%, -100%)",
+          zIndex: 1e5,
+          pointerEvents: "none",
+          maxWidth: 360,
+          background: isDarkMode ? "rgba(2,6,23,0.96)" : "rgba(255,255,255,0.98)",
+          color: isDarkMode ? "#e2e8f0" : "#0f172a",
+          border: `1px solid ${isDarkMode ? "#334155" : "#cbd5e1"}`,
+          borderRadius: 10,
+          padding: 10,
+          boxShadow: "0 8px 24px rgba(0,0,0,.22)",
+          fontSize: 12,
+          lineHeight: 1.5,
+          whiteSpace: "pre-wrap",
+          wordBreak: "break-word"
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0634\u0646\u0627\u0633\u0647" : "ID", ":"), " ", S2(hoverInfo.node.id)),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0628\u0631\u0686\u0633\u0628" : "Label", ":"), " ", S2(hoverInfo.node.label || "-")),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0646\u0648\u0639" : "Type", ":"), " ", S2(hoverInfo.node.type || hoverInfo.node.group || "-")),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0622\u062F\u0631\u0633" : "Address", ":"), " ", S2(hoverInfo.node.address || hoverInfo.node.text || "-")),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0645\u062A\u0627\u062F\u06CC\u062A\u0627" : "Metadata", ":"), " ", S2(hoverInfo.node.metadata || "-")),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0631\u06CC\u062A" : "Rate", ":"), " ", S2(hoverInfo.node.rate ?? "-")),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0632\u06CC\u0631\u0645\u062A\u0646" : "Sub Text", ":"), " ", S2(hoverInfo.node.subText || "-")),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0646\u0647\u0627\u062F" : "Entity", ":"), " ", S2(((_a = hoverInfo.node.entity) == null ? void 0 : _a.name) || "-")),
+      /* @__PURE__ */ import_react2.default.createElement("details", null, /* @__PURE__ */ import_react2.default.createElement("summary", { style: { cursor: "default" } }, isFa ? "\u062F\u0627\u062F\u0647 \u062E\u0627\u0645" : "raw"), /* @__PURE__ */ import_react2.default.createElement("pre", { style: { margin: 0, fontSize: 11 } }, JSON.stringify(hoverInfo.node, null, 2)))
+    ),
+    showEdgeHoverInfo && edgeHoverInfo.visible ? /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        dir: isFa ? "rtl" : "ltr",
+        style: {
+          position: "absolute",
+          left: edgeHoverInfo.x,
+          top: edgeHoverInfo.y,
+          transform: "translate(-50%, -100%)",
+          zIndex: 1e5,
+          pointerEvents: "none",
+          maxWidth: 360,
+          background: isDarkMode ? "rgba(2,6,23,0.96)" : "rgba(255,255,255,0.98)",
+          color: isDarkMode ? "#e2e8f0" : "#0f172a",
+          border: `1px solid ${isDarkMode ? "#334155" : "#cbd5e1"}`,
+          borderRadius: 10,
+          padding: 10,
+          boxShadow: "0 8px 24px rgba(0,0,0,.22)",
+          fontSize: 12,
+          lineHeight: 1.5,
+          whiteSpace: "pre-wrap",
+          wordBreak: "break-word"
+        }
+      },
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0627\u0632" : "From", ":"), " ", getNodeLabelById(edgeHoverInfo.fromId)),
+      /* @__PURE__ */ import_react2.default.createElement("div", null, /* @__PURE__ */ import_react2.default.createElement("b", null, isFa ? "\u0628\u0647" : "To", ":"), " ", getNodeLabelById(edgeHoverInfo.toId)),
+      edgeHoverInfo.summary ? /* @__PURE__ */ import_react2.default.createElement("div", { style: { marginTop: 6 } }, edgeHoverInfo.summary) : /* @__PURE__ */ import_react2.default.createElement("div", { style: { marginTop: 6, opacity: 0.75 } }, isFa ? "\u0627\u0637\u0644\u0627\u0639\u0627\u062A \u06CC\u0627\u0644 \u0645\u0648\u062C\u0648\u062F \u0646\u06CC\u0633\u062A" : "No edge data available")
+    ) : null
+  );
+};
+var Graph_default = Nodalix_graph_engine;
+
+// src/index.js
+var __NODALIX_STORE__ = {
+  data: [],
+  setData: null,
+  // توسط Nodalix هنگام mount مقداردهی می‌شود
+  node: null,
+  // نود انتخاب شده
+  setNode: null,
+  // setter نود انتخاب شده
+  onNodeClick: null
+  // callback کلیک روی نود
+};
+var nodeClickHandlerRef = { current: null };
+var scheduleNodalixUpdate = (fn) => {
+  if (typeof queueMicrotask === "function") {
+    queueMicrotask(fn);
+    return;
+  }
+  Promise.resolve().then(fn);
+};
+function GetSelectedNode() {
+  return __NODALIX_STORE__.node ?? null;
+}
+function SetSelectedNode(node) {
+  if (typeof __NODALIX_STORE__.setNode !== "function") {
+    return { success: false, error: "Nodalix instance is not mounted yet." };
+  }
+  const next = node ?? null;
+  __NODALIX_STORE__.node = next;
+  __NODALIX_STORE__.setNode(next);
+  return { success: true, node: next };
+}
+function OnNodeClick(handler) {
+  if (handler != null && typeof handler !== "function") {
+    return { success: false, error: "handler must be a function or null." };
+  }
+  nodeClickHandlerRef.current = handler ?? null;
+  __NODALIX_STORE__.onNodeClick = nodeClickHandlerRef.current;
+  return { success: true };
+}
+function getSafeNodePosition(params = {}) {
+  const {
+    node = {},
+    nodes = [],
+    inputAnchorIds = [],
+    outputAnchorIds = [],
+    minGapY = 100,
+    yStep = 100
+  } = params;
+  const minGapX = params.minGapX ?? params.minGap ?? 300;
+  const positionedNodes = nodes.filter(
+    (n) => typeof (n == null ? void 0 : n.x) === "number" && typeof (n == null ? void 0 : n.y) === "number"
+  );
+  const baseWidth = typeof node.width === "number" ? node.width : 220;
+  const inputCount = Array.isArray(node.inputs) ? node.inputs.length : 0;
+  const outputCount = Array.isArray(node.outputs) ? node.outputs.length : 0;
+  const ioBoost = Math.min(inputCount + outputCount, 6) * 28;
+  const computedWidth = baseWidth + ioBoost;
+  const avg = (values) => values.reduce((sum, value) => sum + value, 0) / values.length;
+  const isPlacementSafe = (x2, y2) => positionedNodes.every(
+    (n) => Math.abs(n.x - x2) >= minGapX || Math.abs(n.y - y2) >= minGapY
+  );
+  if (!positionedNodes.length) {
+    return {
+      x: typeof node.x === "number" ? node.x : 0,
+      y: typeof node.y === "number" ? node.y : 0,
+      width: computedWidth
+    };
+  }
+  const resolveAnchors = (ids) => ids.map((id) => positionedNodes.find((n) => n.id === id)).filter(Boolean);
+  const inputAnchors = resolveAnchors(inputAnchorIds);
+  const outputAnchors = resolveAnchors(outputAnchorIds);
+  const connectedById = /* @__PURE__ */ new Map();
+  for (const anchor of [...inputAnchors, ...outputAnchors]) {
+    connectedById.set(anchor.id, anchor);
+  }
+  const connected = Array.from(connectedById.values());
+  const hasInput = inputAnchors.length > 0;
+  const hasOutput = outputAnchors.length > 0;
+  let x;
+  let baseY;
+  if (hasInput && hasOutput) {
+    x = avg(connected.map((n) => n.x));
+    baseY = avg(connected.map((n) => n.y));
+  } else if (hasInput) {
+    x = avg(inputAnchors.map((n) => n.x)) + minGapX;
+    baseY = avg(inputAnchors.map((n) => n.y));
+  } else if (hasOutput) {
+    x = avg(outputAnchors.map((n) => n.x)) - minGapX;
+    baseY = avg(outputAnchors.map((n) => n.y));
+  } else {
+    x = typeof node.x === "number" ? node.x : avg(positionedNodes.map((n) => n.x));
+    baseY = typeof node.y === "number" ? node.y : avg(positionedNodes.map((n) => n.y));
+  }
+  let y = baseY;
+  const maxSteps = 200;
+  for (let step = 0; step <= maxSteps && !isPlacementSafe(x, y); step++) {
+    y = baseY - step * yStep;
+  }
+  return { x, y, width: computedWidth };
+}
+var applyNodeLimit = (nodes) => enforceNodeLimit(nodes, NODALIX_MAX_NODES);
+function AddNewNode(rawNode, options = {}) {
+  const minGapX = options.minGapX ?? options.minGap ?? 300;
+  const minGapY = options.minGapY ?? 100;
+  const yStep = options.yStep ?? 100;
+  if (typeof __NODALIX_STORE__.setData !== "function") {
+    return { success: false, error: "Nodalix instance is not mounted yet." };
+  }
+  if (!rawNode || typeof rawNode !== "object") {
+    return { success: false, error: "Invalid node object." };
+  }
+  if (!rawNode.id || typeof rawNode.id !== "string" || !rawNode.id.trim()) {
+    return {
+      success: false,
+      error: "Node id is required and must be a non-empty string."
+    };
+  }
+  const current = Array.isArray(__NODALIX_STORE__.data) ? __NODALIX_STORE__.data : [];
+  if (!canAddGraphNode(current, NODALIX_MAX_NODES)) {
+    return { success: false, error: getNodeLimitError(NODALIX_MAX_NODES) };
+  }
+  if (current.some((n) => n.id === rawNode.id)) {
+    return { success: false, error: "Duplicate node id." };
+  }
+  const inEdges = Array.isArray(rawNode.inputs) ? rawNode.inputs.filter(Boolean) : [];
+  const outEdges = Array.isArray(rawNode.outputs) ? rawNode.outputs.filter(Boolean) : [];
+  const inputAnchorIds = inEdges.map((e) => e == null ? void 0 : e.id).filter((id) => id && current.some((n) => n.id === id));
+  const outputAnchorIds = outEdges.map((e) => e == null ? void 0 : e.id).filter((id) => id && current.some((n) => n.id === id));
+  const { x, y } = getSafeNodePosition({
+    node: rawNode,
+    nodes: current,
+    inputAnchorIds,
+    outputAnchorIds,
+    minGapX,
+    minGapY,
+    yStep
+  });
+  const newNode = {
+    ...rawNode,
+    x,
+    y,
+    inputs: inEdges,
+    outputs: outEdges
+  };
+  let updated = current.map((n) => ({ ...n }));
+  const indexById = new Map(updated.map((n, i) => [n.id, i]));
+  for (const e of newNode.inputs) {
+    const srcId = e == null ? void 0 : e.id;
+    if (!srcId || !indexById.has(srcId)) continue;
+    const srcNode = updated[indexById.get(srcId)];
+    const exists = Array.isArray(srcNode.outputs) ? srcNode.outputs.some((o) => (o == null ? void 0 : o.id) === newNode.id) : false;
+    if (!exists) {
+      const mirrored = mirrorEdgeRef(e, {
+        id: newNode.id,
+        time: (e == null ? void 0 : e.time) ?? Math.floor(Date.now() / 1e3)
+      });
+      srcNode.outputs = Array.isArray(srcNode.outputs) ? [...srcNode.outputs, mirrored] : [mirrored];
+    }
+  }
+  for (const e of newNode.outputs) {
+    const tgtId = e == null ? void 0 : e.id;
+    if (!tgtId || !indexById.has(tgtId)) continue;
+    const tgtNode = updated[indexById.get(tgtId)];
+    const exists = Array.isArray(tgtNode.inputs) ? tgtNode.inputs.some((i) => (i == null ? void 0 : i.id) === newNode.id) : false;
+    if (!exists) {
+      const mirrored = mirrorEdgeRef(e, {
+        id: newNode.id,
+        time: (e == null ? void 0 : e.time) ?? Math.floor(Date.now() / 1e3)
+      });
+      tgtNode.inputs = Array.isArray(tgtNode.inputs) ? [...tgtNode.inputs, mirrored] : [mirrored];
+    }
+  }
+  updated = [...updated, newNode];
+  updated = applyNodeLimit(updated);
+  const violates = updated.some(
+    (n) => n.id !== newNode.id && Math.abs(n.x - newNode.x) < minGapX && Math.abs(n.y - newNode.y) < minGapY
+  );
+  if (violates) {
+    return { success: false, error: "Failed to find a safe position for the new node." };
+  }
+  __NODALIX_STORE__.data = updated;
+  __NODALIX_STORE__.setData(updated);
+  return { success: true, node: newNode, data: updated, length: updated.length };
+}
+function Graph_Engine({
+  NewData,
+  onNodeClick,
+  edgeLabelFields = DEFAULT_EDGE_LABEL_FIELDS,
+  rateColorRanges = DEFAULT_RATE_COLOR_RANGES,
+  showEdgeHoverInfo = false,
+  showHelpButton = true,
+  gridUserConfigurable = true,
+  showGrid = true,
+  nodesDraggableUserConfigurable = true,
+  nodesDraggable = true,
+  edgeInfoNodesUserConfigurable = true,
+  showEdgeInfoNodes = true,
+  languageUserConfigurable = true,
+  language = "fa"
+}) {
+  const resolvedEdgeLabelFields = (0, import_react3.useMemo)(
+    () => normalizeEdgeLabelFields(edgeLabelFields),
+    [edgeLabelFields]
+  );
+  const resolvedRateColorRanges = (0, import_react3.useMemo)(
+    () => normalizeRateColorRanges(rateColorRanges),
+    [rateColorRanges]
+  );
+  const [data, setData] = (0, import_react3.useState)([]);
+  const [reload, setReload] = (0, import_react3.useState)(false);
+  const [nodesPosition, setNodesPosition] = (0, import_react3.useState)([]);
+  const [scale, setScale] = (0, import_react3.useState)(1);
+  const [xPosition, setXPosition] = (0, import_react3.useState)(0);
+  const [yPosition, setYPosition] = (0, import_react3.useState)(0);
+  const [selectedEdges, setSelectedEdges] = (0, import_react3.useState)([]);
+  const [selectedNodes, setSelectedNodes] = (0, import_react3.useState)([]);
+  const [Node, SetNode] = (0, import_react3.useState)(null);
+  const [PaintedEdges, SetPaintedEdges] = (0, import_react3.useState)([]);
+  (0, import_react3.useEffect)(() => {
+    setData(applyNodeLimit(Array.isArray(NewData) ? NewData : []));
+  }, [NewData]);
+  (0, import_react3.useEffect)(() => {
+    __NODALIX_STORE__.setData = (updater) => {
+      scheduleNodalixUpdate(() => {
+        if (typeof updater === "function") {
+          setData((prev) => {
+            const next = applyNodeLimit(updater(prev));
+            __NODALIX_STORE__.data = next;
+            return next;
+          });
+        } else {
+          const next = applyNodeLimit(updater);
+          setData(next);
+          __NODALIX_STORE__.data = next;
+        }
+      });
+    };
+    return () => {
+      if (__NODALIX_STORE__.setData) __NODALIX_STORE__.setData = null;
+    };
+  }, []);
+  (0, import_react3.useEffect)(() => {
+    __NODALIX_STORE__.data = data;
+  }, [data]);
+  (0, import_react3.useEffect)(() => {
+    __NODALIX_STORE__.setNode = (updater) => {
+      scheduleNodalixUpdate(() => {
+        if (typeof updater === "function") {
+          SetNode((prev) => {
+            const next = updater(prev);
+            __NODALIX_STORE__.node = next ?? null;
+            return next ?? null;
+          });
+        } else {
+          SetNode(updater ?? null);
+          __NODALIX_STORE__.node = updater ?? null;
+        }
+      });
+    };
+    return () => {
+      if (__NODALIX_STORE__.setNode) __NODALIX_STORE__.setNode = null;
+    };
+  }, []);
+  (0, import_react3.useEffect)(() => {
+    __NODALIX_STORE__.node = Node ?? null;
+  }, [Node]);
+  (0, import_react3.useEffect)(() => {
+    if (typeof onNodeClick === "function") {
+      OnNodeClick(onNodeClick);
+    }
+  }, [onNodeClick]);
+  return /* @__PURE__ */ import_react3.default.createElement("div", { style: { direction: "ltr", width: "100%", height: "100%" } }, /* @__PURE__ */ import_react3.default.createElement(
+    Graph_default,
+    {
+      Data: data,
+      SetData: setData,
+      Reload: reload,
+      SetReload: setReload,
+      NodesPosition: nodesPosition,
+      SetNodesPosition: setNodesPosition,
+      Scale: scale,
+      SetScale: setScale,
+      XPosition: xPosition,
+      SetXPosition: setXPosition,
+      YPosition: yPosition,
+      SetYPosition: setYPosition,
+      edgeLabelFields: resolvedEdgeLabelFields,
+      rateColorRanges: resolvedRateColorRanges,
+      showEdgeHoverInfo: !!showEdgeHoverInfo,
+      showHelpButton: !!showHelpButton,
+      gridUserConfigurable: !!gridUserConfigurable,
+      showGrid: !!showGrid,
+      nodesDraggableUserConfigurable: !!nodesDraggableUserConfigurable,
+      nodesDraggable: !!nodesDraggable,
+      edgeInfoNodesUserConfigurable: !!edgeInfoNodesUserConfigurable,
+      showEdgeInfoNodes: !!showEdgeInfoNodes,
+      languageUserConfigurable: !!languageUserConfigurable,
+      language,
+      TakeSceenShot: true,
+      SetSelectedEdges: setSelectedEdges,
+      setSelectedNodes,
+      PaintedEdges,
+      SetPaintedEdges,
+      SetNode,
+      onNodeClickRef: nodeClickHandlerRef
+    }
+  ));
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AddNewNode,
+  DEFAULT_EDGE_LABEL_FIELDS,
+  DEFAULT_NODE_IMAGE,
+  DEFAULT_RATE_COLOR_RANGES,
+  EDGE_LABEL_FIELDS,
+  EDGE_LINE_STYLE,
+  GRAPH_LANGUAGE,
+  GetSelectedNode,
+  Graph_Engine,
+  NODALIX_EDITION,
+  NODALIX_MAX_NODES,
+  NODE_TYPE,
+  OnNodeClick,
+  SetSelectedNode,
+  buildEdgeInfoLabel,
+  canAddGraphNode,
+  countGraphNodes,
+  enforceNodeLimit,
+  getGraphGuide,
+  getNodeDisplayLabel,
+  getNodeEntityImage,
+  getRateBorderColor,
+  getSafeNodePosition,
+  hasNodeLimit,
+  isBasicEdition,
+  isFullEdition,
+  isHelperNodeId,
+  mirrorEdgeRef,
+  normalizeEdgeLabelFields,
+  normalizeEdgeLineStyle,
+  normalizeGraphLanguage,
+  normalizeRateColorRanges,
+  resolveEdgeVisStyle
+});