react-kggraph 0.0.28 → 0.0.29

package/lib/index.es3.js

@@ -56,8 +56,8 @@ const lt = ({
     content: ""
   }), fe = De({ cyRef: g, setContextMenu: j, onPathAnalysis: (G = X.current) == null ? void 0 : G.onPathAnalysis, setPathNodes: V, actionCircle: le });
   D(() => {
-    const { pathNodes: n, pathLinks: s } = K || {};
-    ((n == null ? void 0 : n.length) > 0 || (s == null ? void 0 : s.length) > 0) && Oe(g, { pathNodes: n, pathLinks: s, isGrayed: !1 });
+    const { nodes: n, links: s } = K || {};
+    ((n == null ? void 0 : n.length) > 0 || (s == null ? void 0 : s.length) > 0) && Oe(g, { nodes: n, links: s, isGrayed: !1 });
   }, [L(K), L(p)]), D(() => {
     const n = [], s = [];
     p.forEach((l) => {

package/lib/index.es7.js

@@ -3,7 +3,7 @@ import K, { forwardRef as Re, useContext as et, useState as v, useRef as tt, use
 /* empty css           */
 import { Dropdown as lt, Flex as y, Modal as st, Drawer as at, Tabs as ce, Form as f, Input as O, Select as u, ColorPicker as _, Button as ge, Row as rt, message as F } from "antd";
 import { utils as P, writeFile as it } from "./index.es21.js";
-import { textPositionConfig as me, textLayout as ct, downloadData as dt, choiceConfig as ht, linkAnalysis as gt, layoutCongig as mt, handleCalcPath as pt, getCyData as de, donwnGraphData as ut } from "./index.es8.js";
+import { textPositionConfig as pe, textLayout as ct, downloadData as dt, choiceConfig as ht, linkAnalysis as gt, layoutCongig as pt, handleCalcPath as mt, getCyData as de, donwnGraphData as ut } from "./index.es8.js";
 import { GraphContext as ft } from "./index.es15.js";
 import { layout as bt, fixNodesToEdges as wt } from "./index.es9.js";
 import { defaultColors as H, nodeSize as q } from "./index.es10.js";
@@ -12,8 +12,8 @@ import Ct from "./index.es23.js";
 import vt from "./index.es24.js";
 import I from "./index.es17.js";
 import { downloadFile as he } from "./index.es12.js";
-import { actionList as xt, entityRelationList as Nt } from "./index.es4.js";
-import { DownOutlined as St, RightOutlined as Lt, UpOutlined as kt, LeftOutlined as Et } from "@ant-design/icons";
+import { actionList as xt, entityRelationList as St } from "./index.es4.js";
+import { DownOutlined as Nt, RightOutlined as Lt, UpOutlined as kt, LeftOutlined as Et } from "@ant-design/icons";
 const M = (b, c) => (k) => {
   k.stopPropagation(), b == null || b(c || "");
 }, Dt = (b) => {
@@ -35,11 +35,11 @@ const M = (b, c) => (k) => {
   graphInfo: b,
   cyRef: c,
   initNodeScale: k,
-  typeObj: S,
+  typeObj: N,
   relationObj: V,
-  colors: pe
+  colors: me
 }, ue) => {
-  const W = { ...H, ...pe }, { layoutType: fe, setLayoutType: be, queryStatisticsConfig: L, actionBar: x } = et(ft), Q = typeof x == "boolean" ? x : !0, J = (x == null ? void 0 : x.position) || "top-left", U = (x == null ? void 0 : x.actionList) ?? xt, [j, we] = v((x == null ? void 0 : x.isExpand) ?? !1), [D, ye] = v(""), [Ce, G] = v(!1), [X, ve] = v(k), [xe, A] = v(!1), [Ne, z] = v(!1), [Y, Se] = v(null), [Le, R] = v(!1), [ee, te] = v(!1), [ke, Ee] = v("node"), T = tt(null), De = Array.isArray(L) ? L.length > 0 : L, [oe, Ie] = v(De), [ne, Ve] = v(/* @__PURE__ */ new Set()), [le, Pe] = v(/* @__PURE__ */ new Set());
+  const W = { ...H, ...me }, { layoutType: fe, setLayoutType: be, queryStatisticsConfig: L, actionBar: x } = et(ft), Q = typeof x == "boolean" ? x : !0, J = (x == null ? void 0 : x.position) || "top-left", U = (x == null ? void 0 : x.actionList) ?? xt, [j, we] = v((x == null ? void 0 : x.isExpand) ?? !1), [D, ye] = v(""), [Ce, G] = v(!1), [X, ve] = v(k), [xe, A] = v(!1), [Se, z] = v(!1), [Y, Ne] = v(null), [Le, R] = v(!1), [ee, te] = v(!1), [ke, Ee] = v("node"), T = tt(null), De = Array.isArray(L) ? L.length > 0 : L, [oe, Ie] = v(De), [ne, Ve] = v(/* @__PURE__ */ new Set()), [le, Pe] = v(/* @__PURE__ */ new Set());
   ot(ue, () => ({
     onPathAnalysis: () => {
       ae();
@@ -55,8 +55,8 @@ const M = (b, c) => (k) => {
     }
     o == null || o.nodes().removeClass("highlight selected grayed highlighted path-node"), o.elements().removeClass("level-highlight level-selected grayed path-edge");
     const n = o.nodes().filter((l) => {
-      const i = (l.data("name") || "").toLowerCase(), s = (l.data("role") || "").toLowerCase(), h = (l.data("dept") || "").toLowerCase(), p = String(l.data("id") || "").toLowerCase();
-      return i.includes(D.toLowerCase()) || s.includes(D.toLowerCase()) || h.includes(D.toLowerCase()) || p.includes(D.toLowerCase());
+      const i = (l.data("name") || "").toLowerCase(), s = (l.data("role") || "").toLowerCase(), h = (l.data("dept") || "").toLowerCase(), m = String(l.data("id") || "").toLowerCase();
+      return i.includes(D.toLowerCase()) || s.includes(D.toLowerCase()) || h.includes(D.toLowerCase()) || m.includes(D.toLowerCase());
     });
     o.nodes().removeClass("highlight"), n.addClass("highlight"), n.length === 1 ? (console.log("matchedNodes:::", n), o.animate({
       center: {
@@ -99,7 +99,7 @@ const M = (b, c) => (k) => {
     const e = c.current;
     if (!e) return;
     const o = de(e);
-    Se(o), R(!0);
+    Ne(o), R(!0);
   }, re = (e, o) => {
     const n = e.current;
     if (!n) return;
@@ -114,29 +114,29 @@ const M = (b, c) => (k) => {
   }, Fe = () => {
     const e = c.current;
     if (!e) return;
-    const o = de(e), { nodes: n = [], edges: l = [] } = o, i = n.map((p) => {
-      var m, r;
-      const d = p.data || {}, N = d.properties || {};
+    const o = de(e), { nodes: n = [], edges: l = [] } = o, i = n.map((m) => {
+      var p, r;
+      const d = m.data || {}, S = d.properties || {};
       return {
         节点名称: d.name || d.label || "",
         节点ID: d.id || "",
         节点类型: d.types || "",
         URI: d.label || "",
-        X坐标: ((m = p.position) == null ? void 0 : m.x) || "",
-        Y坐标: ((r = p.position) == null ? void 0 : r.y) || "",
+        X坐标: ((p = m.position) == null ? void 0 : p.x) || "",
+        Y坐标: ((r = m.position) == null ? void 0 : r.y) || "",
         层级: d.level || "",
         宽度: d.baseWidth || "",
         高度: d.baseHeight || "",
         图片: d.image || "",
-        属性ID: N.id || "",
-        属性值: N.value || ""
+        属性ID: S.id || "",
+        属性值: S.value || ""
       };
-    }), s = l.map((p) => {
+    }), s = l.map((m) => {
       var r, a, w, E;
-      const d = p.data || {}, N = ((a = (r = d.source) == null ? void 0 : r.split("/#")[0]) == null ? void 0 : a.split("/").pop()) || d.source, m = ((E = (w = d.target) == null ? void 0 : w.split("/#")[0]) == null ? void 0 : E.split("/").pop()) || d.target;
+      const d = m.data || {}, S = ((a = (r = d.source) == null ? void 0 : r.split("/#")[0]) == null ? void 0 : a.split("/").pop()) || d.source, p = ((E = (w = d.target) == null ? void 0 : w.split("/#")[0]) == null ? void 0 : E.split("/").pop()) || d.target;
       return {
-        源节点: N,
-        目标节点: m,
+        源节点: S,
+        目标节点: p,
         源URI: d.source || "",
         目标URI: d.target || "",
         关系名称: d.name || d.label || "",
@@ -144,8 +144,8 @@ const M = (b, c) => (k) => {
       };
     }), h = P.book_new();
     if (i.length > 0) {
-      const p = P.json_to_sheet(i);
-      p["!cols"] = [
+      const m = P.json_to_sheet(i);
+      m["!cols"] = [
         { wch: 30 },
         // 节点名称
         { wch: 60 },
@@ -170,11 +170,11 @@ const M = (b, c) => (k) => {
         // 属性ID
         { wch: 40 }
         // 属性值
-      ], P.book_append_sheet(h, p, "节点");
+      ], P.book_append_sheet(h, m, "节点");
     }
     if (s.length > 0) {
-      const p = P.json_to_sheet(s);
-      p["!cols"] = [
+      const m = P.json_to_sheet(s);
+      m["!cols"] = [
         { wch: 30 },
         // 源节点
         { wch: 30 },
@@ -187,7 +187,7 @@ const M = (b, c) => (k) => {
         // 关系名称
         { wch: 40 }
         // 关系ID
-      ], P.book_append_sheet(h, p, "关系");
+      ], P.book_append_sheet(h, m, "关系");
     }
     it(h, `graph_${Date.now()}.xlsx`);
   }, He = (e, o) => {
@@ -255,17 +255,17 @@ const M = (b, c) => (k) => {
     const n = c.current;
     if (!n) return;
     n.elements().removeClass("level-highlight level-selected grayed path-edge");
-    const l = n.nodes().filter((m) => (m.data("name") || m.data("id") || "").toString().includes(e));
+    const l = n.nodes().filter((p) => (p.data("name") || p.data("id") || "").toString().includes(e));
     if (l.length === 0) {
       F.warning(`未找到节点: ${e}`);
       return;
     }
     const i = parseInt(o) || 1, s = n.collection(), h = [];
-    l.forEach((m) => {
-      m.addClass("level-selected"), s.merge(m);
+    l.forEach((p) => {
+      p.addClass("level-selected"), s.merge(p);
       let r = n.collection();
       const a = /* @__PURE__ */ new Set();
-      a.add(m.id()), i >= 1 && (r = m.neighborhood().nodes(), r.forEach((w) => {
+      a.add(p.id()), i >= 1 && (r = p.neighborhood().nodes(), r.forEach((w) => {
         a.add(w.id()), s.merge(w);
       }), h.push(r));
       for (let w = 2; w <= i; w++) {
@@ -276,10 +276,10 @@ const M = (b, c) => (k) => {
           });
         }), E.forEach(($) => s.merge($)), h.push(E), r = E;
       }
-    }), h.forEach((m) => {
-      m.addClass("level-highlight");
-    }), n.edges().filter((m) => {
-      const r = m.source(), a = m.target();
+    }), h.forEach((p) => {
+      p.addClass("level-highlight");
+    }), n.edges().filter((p) => {
+      const r = p.source(), a = p.target();
       return s.contains(r) && s.contains(a);
     }).addClass("path-edge");
     const d = n.elements().filter(".level-selected, .level-highlight, .path-edge");
@@ -306,8 +306,8 @@ const M = (b, c) => (k) => {
     console.log("saveNodeConfig values:", e), console.log("showLabel value:", e.showLabel);
     const n = typeof e.fontColor == "object" && ((s = (i = e.fontColor) == null ? void 0 : i.toHexString) == null ? void 0 : s.call(i)) || e.fontColor, l = e.showLabel === "show";
     console.log("showLabelValue:", l), o.nodes().forEach((h) => {
-      const p = l && (h.data("name") || h.data("label")) || "";
-      console.log("Setting node label:", p), h.style({
+      const m = l && (h.data("name") || h.data("label")) || "";
+      console.log("Setting node label:", m), h.style({
         width: e.nodeSize,
         height: e.nodeSize,
         "font-size": e.fontSize,
@@ -317,16 +317,16 @@ const M = (b, c) => (k) => {
         "text-valign": e.textPosition,
         "text-halign": "center",
         "text-margin-y": e.textOffset,
-        label: p,
-        "text-opacity": p ? 1 : 0
+        label: m,
+        "text-opacity": m ? 1 : 0
       });
     }), F.success("节点配置保存成功");
   }, Ge = (e) => {
-    var h, p, d, N, m, r;
+    var h, m, d, S, p, r;
     const o = c.current;
     if (!o) return;
     console.log("saveEdgeConfig values:", e), console.log("edge showLabel value:", e.showLabel);
-    const n = typeof e.edgeColor == "object" && ((p = (h = e.edgeColor) == null ? void 0 : h.toHexString) == null ? void 0 : p.call(h)) || e.edgeColor, l = typeof e.fontColor == "object" && ((N = (d = e.fontColor) == null ? void 0 : d.toHexString) == null ? void 0 : N.call(d)) || e.fontColor, i = typeof e.labelBgColor == "object" && ((r = (m = e.labelBgColor) == null ? void 0 : m.toHexString) == null ? void 0 : r.call(m)) || e.labelBgColor, s = e.showLabel === "show";
+    const n = typeof e.edgeColor == "object" && ((m = (h = e.edgeColor) == null ? void 0 : h.toHexString) == null ? void 0 : m.call(h)) || e.edgeColor, l = typeof e.fontColor == "object" && ((S = (d = e.fontColor) == null ? void 0 : d.toHexString) == null ? void 0 : S.call(d)) || e.fontColor, i = typeof e.labelBgColor == "object" && ((r = (p = e.labelBgColor) == null ? void 0 : p.toHexString) == null ? void 0 : r.call(p)) || e.labelBgColor, s = e.showLabel === "show";
     o.edges().forEach((a) => {
       const w = s && (a.data("label") || a.data("name")) || "";
       console.log("Setting edge label:", w), a.style({
@@ -347,12 +347,12 @@ const M = (b, c) => (k) => {
     }), F.success("连线配置保存成功");
   }, Xe = Dt(J), C = J === "left" || J === "right";
   if (console.log(1e3, Q, U), !Q) return null;
-  const Ye = Array.isArray(L) && (L == null ? void 0 : L.length) > 0 ? L : Nt, ie = () => /* @__PURE__ */ g(rt, { justify: "center", align: "middle", className: I("cursor", {
+  const Ye = Array.isArray(L) && (L == null ? void 0 : L.length) > 0 ? L : St, ie = () => /* @__PURE__ */ g(rt, { justify: "center", align: "middle", className: I("cursor", {
     "oprate-btn-vertical": C,
     "oprate-btn": !C
   }), onClick: () => we(!j), children: [
     "操作 ",
-    j ? C ? /* @__PURE__ */ t(St, {}) : /* @__PURE__ */ t(Lt, {}) : C ? /* @__PURE__ */ t(kt, {}) : /* @__PURE__ */ t(Et, {})
+    j ? C ? /* @__PURE__ */ t(Nt, {}) : /* @__PURE__ */ t(Lt, {}) : C ? /* @__PURE__ */ t(kt, {}) : /* @__PURE__ */ t(Et, {})
   ] });
   return /* @__PURE__ */ g(Z, { children: [
     /* @__PURE__ */ t("div", { className: I("graph-bar", { "graph-bar-vertical": C }), style: Xe, children: /* @__PURE__ */ g("div", { className: I("graph-bar-min", {
@@ -365,7 +365,7 @@ const M = (b, c) => (k) => {
         "collapsed-vertical": !j && C,
         collapsed: !j && !C
       }), children: U.map(({ key: e, title: o, icon: n, onClick: l }) => {
-        var p, d, N, m;
+        var m, d, S, p;
         const i = () => n && n.length > 0 ? n.length > 1 ? /* @__PURE__ */ t(y, { gap: "5px", children: n.map((r, a) => e === "nodeZoom" ? K.cloneElement(r, {
           onClick: () => $e(a === 0 ? "in" : "out"),
           key: a
@@ -394,7 +394,7 @@ const M = (b, c) => (k) => {
           let r = [];
           switch (e) {
             case "layout":
-              r = (p = mt) == null ? void 0 : p.map((a) => ({
+              r = (m = pt) == null ? void 0 : m.map((a) => ({
                 ...a,
                 label: /* @__PURE__ */ t("div", { className: I({ "text-[#145afd]": fe === a.key }), onClick: M(Ae, a.key), children: a.label })
               }));
@@ -421,10 +421,10 @@ const M = (b, c) => (k) => {
               r = (d = ht) == null ? void 0 : d.map((a) => ({ ...a, label: /* @__PURE__ */ t("div", { onClick: M(We, a.key), children: a.label }) }));
               break;
             case "downloadData":
-              r = (N = dt) == null ? void 0 : N.map((a) => ({ ...a, label: /* @__PURE__ */ t("div", { onClick: (w) => He(w, a.key), children: a.label }) }));
+              r = (S = dt) == null ? void 0 : S.map((a) => ({ ...a, label: /* @__PURE__ */ t("div", { onClick: (w) => He(w, a.key), children: a.label }) }));
               break;
             case "textPosition":
-              r = (m = me) == null ? void 0 : m.map((a) => ({ ...a, label: /* @__PURE__ */ t("div", { onClick: M(() => ct(c, a.key), a.key), children: a.label }) }));
+              r = (p = pe) == null ? void 0 : p.map((a) => ({ ...a, label: /* @__PURE__ */ t("div", { onClick: M(() => ct(c, a.key), a.key), children: a.label }) }));
               break;
           }
           return /* @__PURE__ */ t(lt, { trigger: ["hover"], placement: C ? "bottomRight" : "bottom", menu: { items: r }, children: /* @__PURE__ */ g(y, { wrap: !0, align: "center", justify: "center", className: "hove-active cursor bar-item", children: [
@@ -440,7 +440,7 @@ const M = (b, c) => (k) => {
       C && ie()
     ] }) }),
     /* @__PURE__ */ t(yt, { isVisible: xe, searchChange: (e) => Be(e), closeQuery: () => A(!1) }),
-    /* @__PURE__ */ t(Ct, { isVisible: Ne, analysis: (e) => pt(c, { pathNodes: e.map((o) => ({ id: o })) }), closePath: () => z(!1) }),
+    /* @__PURE__ */ t(Ct, { isVisible: Se, analysis: (e) => mt(c, { nodes: e.map((o) => ({ id: o })) }), closePath: () => z(!1) }),
     /* @__PURE__ */ t(vt, { ref: T, onLevelClick: Ze }),
     /* @__PURE__ */ t(
       st,
@@ -501,37 +501,37 @@ const M = (b, c) => (k) => {
           return e === "entity" ? {
             label: o,
             key: e,
-            children: /* @__PURE__ */ t(Z, { children: Object.keys(S).length > 0 ? /* @__PURE__ */ g("div", { className: "static-wraper", children: [
-              /* @__PURE__ */ g(y, { justify: "space-between", children: [
+            children: /* @__PURE__ */ t(Z, { children: Object.keys(N).length > 0 ? /* @__PURE__ */ g("div", { children: [
+              /* @__PURE__ */ g(y, { justify: "space-between", className: "font-12", children: [
                 /* @__PURE__ */ t("span", { children: "实体数量：" }),
-                /* @__PURE__ */ t("span", { className: "color-333", children: Object.values(S).reduce((s, h) => s + h.count, 0) })
+                /* @__PURE__ */ t("span", { children: Object.values(N).reduce((s, h) => s + h.count, 0) })
               ] }),
-              /* @__PURE__ */ g(y, { className: "my-4px", justify: "space-between", children: [
+              /* @__PURE__ */ g(y, { className: "my-4px font-12", justify: "space-between", children: [
                 /* @__PURE__ */ t("span", { children: "实体类型：" }),
-                /* @__PURE__ */ t("span", { className: "color-333", children: Object.keys(S).length })
+                /* @__PURE__ */ t("span", { children: Object.keys(N).length })
               ] }),
-              /* @__PURE__ */ t(y, { gap: "5px", justify: "start", className: "w-100", wrap: !0, children: Object.keys(S).map((s) => /* @__PURE__ */ g(y, { gap: "4px", justify: "space-between", className: `w-100 cursor ${ne.has(s) ? "opacity-30" : ""}`, onClick: () => Ke(s), children: [
+              /* @__PURE__ */ t(y, { gap: "5px", justify: "start", className: "w-100 static-wraper", wrap: !0, children: Object.keys(N).map((s) => /* @__PURE__ */ g(y, { gap: "4px", justify: "space-between", className: `w-100 cursor ${ne.has(s) ? "opacity-30" : ""}`, onClick: () => Ke(s), children: [
                 /* @__PURE__ */ g(y, { align: "center", gap: "2px", children: [
-                  /* @__PURE__ */ t("img", { className: "w-20px rounded-50", src: S[s].img, alt: "" }),
+                  /* @__PURE__ */ t("img", { className: "w-20px rounded-50", src: N[s].img, alt: "" }),
                   s,
                   "："
                 ] }),
-                /* @__PURE__ */ t("span", { className: "color-333", children: S[s].count })
+                /* @__PURE__ */ t("span", { className: "color-333", children: N[s].count })
               ] }, s)) })
             ] }) : /* @__PURE__ */ t("span", { className: "text-666", children: "暂无实体统计！" }) })
           } : e === "relation" ? {
             label: o,
             key: e,
-            children: /* @__PURE__ */ t(Z, { children: ((n = Object.keys(V)) == null ? void 0 : n.length) > 0 ? /* @__PURE__ */ g("div", { className: "static-wraper", children: [
-              /* @__PURE__ */ g(y, { justify: "space-between", children: [
+            children: /* @__PURE__ */ t(Z, { children: ((n = Object.keys(V)) == null ? void 0 : n.length) > 0 ? /* @__PURE__ */ g("div", { children: [
+              /* @__PURE__ */ g(y, { justify: "space-between", className: "font-12", children: [
                 /* @__PURE__ */ t("span", { children: "关系数量：" }),
-                /* @__PURE__ */ t("span", { className: "color-333", children: (l = Object.keys(V)) == null ? void 0 : l.length })
+                /* @__PURE__ */ t("span", { children: (l = Object.keys(V)) == null ? void 0 : l.length })
               ] }),
-              /* @__PURE__ */ g(y, { className: "my-4px", justify: "space-between", children: [
+              /* @__PURE__ */ g(y, { className: "my-4px font-12", justify: "space-between", children: [
                 /* @__PURE__ */ t("span", { children: "关系类型：" }),
-                /* @__PURE__ */ t("span", { className: "color-333", children: (i = Object.values(V)) == null ? void 0 : i.reduce((s, h) => s + h, 0) })
+                /* @__PURE__ */ t("span", { children: (i = Object.values(V)) == null ? void 0 : i.reduce((s, h) => s + h, 0) })
               ] }),
-              /* @__PURE__ */ t(y, { gap: "5px", justify: "start", className: "w-100", wrap: !0, children: Object.keys(V).map((s) => /* @__PURE__ */ g(y, { gap: "4px", justify: "space-between", className: `w-100 cursor ${le.has(s) ? "opacity-30" : ""}`, onClick: () => Me(s), children: [
+              /* @__PURE__ */ t(y, { gap: "5px", justify: "start", className: "w-100 static-wraper", wrap: !0, children: Object.keys(V).map((s) => /* @__PURE__ */ g(y, { gap: "4px", justify: "space-between", className: `w-100 cursor ${le.has(s) ? "opacity-30" : ""}`, onClick: () => Me(s), children: [
                 /* @__PURE__ */ g("span", { children: [
                   s,
                   "："
@@ -553,7 +553,7 @@ const M = (b, c) => (k) => {
         /* @__PURE__ */ t(u.Option, { value: "show", children: "显示" }),
         /* @__PURE__ */ t(u.Option, { value: "hide", children: "隐藏" })
       ] }) }),
-      /* @__PURE__ */ t(f.Item, { label: "字体位置", name: "textPosition", initialValue: "bottom", children: /* @__PURE__ */ t(u, { children: me.map((S) => /* @__PURE__ */ t(u.Option, { value: S.key, children: S.label }, S.key)) }) }),
+      /* @__PURE__ */ t(f.Item, { label: "字体位置", name: "textPosition", initialValue: "bottom", children: /* @__PURE__ */ t(u, { children: pe.map((N) => /* @__PURE__ */ t(u.Option, { value: N.key, children: N.label }, N.key)) }) }),
       /* @__PURE__ */ t(f.Item, { label: "字体偏移", name: "textOffset", initialValue: 5, children: /* @__PURE__ */ t(O, { type: "number", placeholder: "请输入字体偏移量" }) }),
       /* @__PURE__ */ t(f.Item, { label: "字体颜色", name: "fontColor", initialValue: c.nodeLabelColor, children: /* @__PURE__ */ t(_, { showText: !0 }) }),
       /* @__PURE__ */ t(f.Item, { label: "字体大小", name: "fontSize", initialValue: c.nodeLabelFontSize, children: /* @__PURE__ */ t(O, { type: "number", placeholder: "请输入字体大小" }) }),

package/lib/index.es8.js

@@ -1,86 +1,86 @@
 import { message as v } from "antd";
-import j from "./index.es25.js";
-import I from "./index.es26.js";
-import P from "./index.es27.js";
-import D from "./index.es28.js";
-import $ from "./index.es29.js";
-import J from "./index.es30.js";
-import R from "./index.es31.js";
-import A from "./index.es32.js";
-import G from "./index.es33.js";
+import O from "./index.es25.js";
+import j from "./index.es26.js";
+import I from "./index.es27.js";
+import P from "./index.es28.js";
+import D from "./index.es29.js";
+import $ from "./index.es30.js";
+import J from "./index.es31.js";
+import R from "./index.es32.js";
+import A from "./index.es33.js";
 import q from "./index.es34.js";
 import B from "./index.es35.js";
-import L from "./index.es36.js";
-import { jsonStringifyParse as T } from "./index.es12.js";
-const E = [j, I, P, D, $, J, R, A, G, q], U = (r) => {
+import T from "./index.es36.js";
+import { jsonStringifyParse as U } from "./index.es12.js";
+const N = [O, j, I, P, D, $, J, R, A, q], W = (s) => {
   let o = { _: { count: 0 } };
-  const l = {}, t = [];
-  return r.forEach((e) => {
-    var m;
+  const r = {}, t = [];
+  return s.forEach((e) => {
+    var y;
     const { group: c } = e;
     if (c === "nodes") {
-      const d = e.data, n = (m = d.properties) == null ? void 0 : m.type, a = d.type;
-      !a && n === "uri" ? o = { ...o, _: { ...o[a], count: o._.count + 1 } } : !t.includes(a) && n === "uri" ? (t.push(a), o = { ...o, [a]: { ...o[a], count: 1, img: d.image } }) : n === "uri" && a && (o = { ...o, [a]: { ...o[a], img: d.image, count: o[a].count + 1 } });
+      const d = e.data, a = (y = d.properties) == null ? void 0 : y.type, l = d.type;
+      !l && a === "uri" ? o = { ...o, _: { ...o[l], count: o._.count + 1 } } : !t.includes(l) && a === "uri" ? (t.push(l), o = { ...o, [l]: { ...o[l], count: 1, img: d.image } }) : a === "uri" && l && (o = { ...o, [l]: { ...o[l], img: d.image, count: o[l].count + 1 } });
     } else if (c === "edges") {
-      const d = e.data, { label: n } = d;
-      l[n] ? l[n] = l[n] + 1 : l[n] = 1;
+      const d = e.data, { label: a } = d;
+      r[a] ? r[a] = r[a] + 1 : r[a] = 1;
     } else
       console.log("nonono");
   }), {
     typeListArr: t,
     typeListObj: o,
-    relationListObj: l
+    relationListObj: r
   };
-}, ae = (r, { graphData: o = [], typeObj: l, zktype: t, graphInfo: e = {} }) => {
-  console.log(888, r);
-  let c = T(l);
-  const m = Object.keys(l), d = e.searchNodes || [], n = new Set(
-    (o == null ? void 0 : o.map((p) => {
-      var i, h, s;
-      return p.group === "nodes" ? (i = p.data) == null ? void 0 : i.id : ((h = p.data) == null ? void 0 : h.source) + "-" + ((s = p.data) == null ? void 0 : s.target);
+}, ne = (s, { graphData: o = [], typeObj: r, zktype: t, graphInfo: e = {} }) => {
+  console.log(888, s);
+  let c = U(r);
+  const y = Object.keys(r), d = e.searchNodes || [], a = new Set(
+    (o == null ? void 0 : o.map((g) => {
+      var i, f, n;
+      return g.group === "nodes" ? (i = g.data) == null ? void 0 : i.id : ((f = g.data) == null ? void 0 : f.source) + "-" + ((n = g.data) == null ? void 0 : n.target);
     }).filter(Boolean)) || []
-  ), { nodes: a = [], links: u = [] } = r || {}, y = [], g = (p) => {
-    p.forEach((i) => {
-      var h, s;
-      if (!n.has(i.id)) {
-        const x = (h = i.properties) == null ? void 0 : h.type, f = i.type, N = i.label.split("#").pop();
+  ), { nodes: l = [], links: p = [] } = s || {}, m = [], h = (g) => {
+    g.forEach((i) => {
+      var f, n;
+      if (!a.has(i.id)) {
+        const x = (f = i.properties) == null ? void 0 : f.type, C = i.type, E = i.label.split("#").pop();
         let w = -1;
-        if (!f && x === "uri")
-          w = i.image || E[0];
-        else if (!m.includes(f) && x === "uri") {
-          m.push(f);
-          const O = m.indexOf(f);
-          w = i.image || E[O] || E[0], c = { ...c, [f]: { ...c[f], img: w } };
-        } else x === "uri" && f ? w = (s = c[f]) == null ? void 0 : s.img : x === "typed-literal" && (w = B);
-        const S = {
+        if (!C && x === "uri")
+          w = i.image || N[0];
+        else if (!y.includes(C) && x === "uri") {
+          y.push(C);
+          const S = y.indexOf(C);
+          w = i.image || N[S] || N[0], c = { ...c, [C]: { ...c[C], img: w } };
+        } else x === "uri" && C ? w = (n = c[C]) == null ? void 0 : n.img : x === "typed-literal" && (w = B);
+        const L = {
           ...i,
-          name: N,
+          name: E,
           "properties-type": x,
-          image: d.includes(N) ? L : w,
+          image: d.includes(E) ? T : w,
           baseWidth: 80,
           // 保存基础宽度
           baseHeight: 80
           // 保存基础高度
         };
-        y.push({ group: "nodes", data: S });
+        m.push({ group: "nodes", data: L });
       }
     });
   };
-  ((p) => {
-    p.forEach((i) => {
-      const { label: h } = i, s = `${i.source}-${i.target}`;
-      n.has(s) || y.push({ group: "edges", data: { ...i, name: h, zktype: t } });
+  ((g) => {
+    g.forEach((i) => {
+      const { label: f } = i, n = `${i.source}-${i.target}`;
+      a.has(n) || m.push({ group: "edges", data: { ...i, name: f, zktype: t } });
     });
-  })(u), g(a);
-  const { typeListObj: k, relationListObj: C } = U([...y, ...o]);
+  })(p), h(l);
+  const { typeListObj: k, relationListObj: b } = W([...m, ...o]);
   return {
-    elements: y,
+    elements: m,
     typeListObj: k,
-    relationListObj: C
+    relationListObj: b
   };
-}, se = (r, o) => {
-  const l = r.current;
-  if (!l) return;
+}, se = (s, o) => {
+  const r = s.current;
+  if (!r) return;
   let t = {
     color: "#000"
   };
@@ -125,87 +125,87 @@ const E = [j, I, P, D, $, J, R, A, G, q], U = (r) => {
       };
       break;
   }
-  l.nodes().style(t), l.style().update();
-}, W = (r, o) => {
-  let l = r.collection(), t = r.collection();
-  o.forEach(({ source: e, target: c, label: m }) => {
-    const d = e ? r.nodes().filter((a) => a.data("id") === e) : r.collection(), n = c ? r.nodes().filter((a) => a.data("id") === c) : r.collection();
-    d.length > 0 && n.length > 0 && d.forEach((a) => {
-      n.forEach((u) => {
-        let y = a.edgesWith(u).filter((g) => {
-          const b = g.data("source") === a.id() && g.data("target") === u.id(), k = m ? g.data("label") === m : !0;
-          return b && k;
+  r.nodes().style(t), r.style().update();
+}, G = (s, o, r = !0) => {
+  let t = s.collection(), e = s.collection();
+  o.forEach(({ source: c, target: y, label: d }) => {
+    const a = c ? s.nodes().filter((p) => p.data("id") === c) : s.collection(), l = y ? s.nodes().filter((p) => p.data("id") === y) : s.collection();
+    a.length > 0 && l.length > 0 && a.forEach((p) => {
+      l.forEach((m) => {
+        let h = p.edgesWith(m).filter((u) => {
+          const k = u.data("source") === p.id() && u.data("target") === m.id(), b = d ? u.data("label") === d : !0;
+          return k && b;
         });
-        t = t.union(y), l = l.union(a).union(u);
+        e = e.union(h), t = t.union(p).union(m);
       });
     });
-  }), console.log(777, t.length), t.length > 0 ? (l.addClass("path-node"), t.addClass("path-edge"), isGrayed && (r.nodes().not(l).addClass("grayed"), r.edges().not(t).addClass("grayed"))) : v.warning("未找到匹配的路径边！");
-}, le = async (r, { pathNodes: o, isGrayed: l = !0, pathLinks: t }) => {
-  const e = r.current;
+  }), console.log(777, e.length), e.length > 0 ? (t.addClass("path-node"), e.addClass("path-edge"), r && (s.nodes().not(t).addClass("grayed"), s.edges().not(e).addClass("grayed"))) : v.warning("未找到匹配的路径边！");
+}, le = async (s, { nodes: o, isGrayed: r = !0, links: t }) => {
+  const e = s.current;
   let c = [];
   if (!e)
     return;
   if (e.nodes().removeClass("path-node").removeClass("grayed"), e.edges().removeClass("path-edge").removeClass("grayed"), (t == null ? void 0 : t.length) > 0) {
-    W(e, t);
+    G(e, t);
     return;
   }
   if (!((o == null ? void 0 : o.length) > 1)) {
     v.warning("请至少设置 2 个路径节点！");
     return;
   }
-  if ((t == null ? void 0 : t.length) > 0 || (c = o.map((n) => n.id)), console.log(856666, t, c), [...new Set(c)].length !== c.length) {
+  if ((t == null ? void 0 : t.length) > 0 || (c = o.map((a) => a.id)), [...new Set(c)].length !== c.length) {
     v.warning("路径中存在重复节点，请检查！");
     return;
   }
   const d = [];
-  for (const n of c) {
-    const a = e.nodes().filter((u) => u.data("name") === n);
-    if (a.length > 0)
-      d.push(a.id());
+  for (const a of c) {
+    const l = e.nodes().filter((p) => p.data("name") === a);
+    if (l.length > 0)
+      d.push(l.id());
     else {
-      e.nodes().removeClass("path-node"), e.edges().removeClass("path-edge"), v.warning(`找不到节点：${n}`);
+      e.nodes().removeClass("path-node"), e.edges().removeClass("path-edge"), v.warning(`找不到节点：${a}`);
       return;
     }
   }
   try {
     e.nodes().removeClass("path-node").removeClass("grayed"), e.edges().removeClass("path-edge").removeClass("grayed");
-    let n = e.collection(), a = 0, u = !0;
-    const y = [];
-    for (let g = 0; g < d.length - 1; g++) {
-      const b = d[g], k = d[g + 1], C = e.getElementById(b), p = e.getElementById(k), i = C.edgesWith(p).filter(function(s) {
-        return s.data("source") === b && s.data("target") === k;
-      }), h = p.edgesWith(C).filter(function(s) {
-        return s.data("source") === k && s.data("target") === b;
+    let a = e.collection(), l = 0, p = !0;
+    const m = [];
+    for (let h = 0; h < d.length - 1; h++) {
+      const u = d[h], k = d[h + 1], b = e.getElementById(u), g = e.getElementById(k), i = b.edgesWith(g).filter(function(n) {
+        return n.data("source") === u && n.data("target") === k;
+      }), f = g.edgesWith(b).filter(function(n) {
+        return n.data("source") === k && n.data("target") === u;
       });
-      if (i.length > 0 || h.length > 0) {
-        const s = i.add(h);
-        n = n.union(s).union(C).union(p), a += s.length, C.addClass("path-node"), p.addClass("path-node"), s.addClass("path-edge"), y.push(C.data("name"), p.data("name")), console.log(`找到直接连接的边：正向${i.length}条，反向${h.length}条`);
+      if (i.length > 0 || f.length > 0) {
+        const n = i.add(f);
+        a = a.union(n).union(b).union(g), l += n.length, b.addClass("path-node"), g.addClass("path-node"), n.addClass("path-edge"), m.push(b.data("name"), g.data("name")), console.log(`找到直接连接的边：正向${i.length}条，反向${f.length}条`);
       } else {
-        const s = e.elements().aStar({
-          root: C,
-          goal: p,
+        const n = e.elements().aStar({
+          root: b,
+          goal: g,
           directed: !1
         });
-        if (s.found && s.path) {
-          n = n.union(s.path), a += s.distance, s.path.nodes().addClass("path-node"), s.path.edges().addClass("path-edge");
-          const x = s.path.nodes().map((f) => f.data("name"));
-          y.push(...x);
+        if (n.found && n.path) {
+          a = a.union(n.path), l += n.distance, n.path.nodes().addClass("path-node"), n.path.edges().addClass("path-edge");
+          const x = n.path.nodes().map((C) => C.data("name"));
+          m.push(...x);
         } else {
-          u = !1, console.log(`节点 ${c[g]} 和 ${c[g + 1]} 之间没有路径`);
+          p = !1, console.log(`节点 ${c[h]} 和 ${c[h + 1]} 之间没有路径`);
           break;
         }
       }
     }
-    if (u && n.length > 0) {
-      const g = n.nodes(), b = n.edges();
-      g.addClass("path-node"), b.addClass("path-edge"), l && (e.nodes().not(g).addClass("grayed"), e.edges().not(b).addClass("grayed"));
+    if (p && a.length > 0) {
+      const h = a.nodes(), u = a.edges();
+      h.addClass("path-node"), u.addClass("path-edge"), r && (e.nodes().not(h).addClass("grayed"), e.edges().not(u).addClass("grayed"));
     } else
       v.warning("无法找到完整的路径！");
-  } catch (n) {
-    console.error(2e3, "计算路径时出错：", n), v.warning("计算路径时出错，请重试！");
+  } catch (a) {
+    console.error(2e3, "计算路径时出错：", a), v.warning("计算路径时出错，请重试！");
   }
-}, M = (r) => {
-  const o = r.nodes().map((e) => ({
+}, M = (s) => {
+  const o = s.nodes().map((e) => ({
     data: e.data(),
     position: e.position(),
     style: {
@@ -213,7 +213,7 @@ const E = [j, I, P, D, $, J, R, A, G, q], U = (r) => {
       height: e.style("height"),
       backgroundColor: e.style("background-color")
     }
-  })), l = r.edges().map((e) => ({
+  })), r = s.edges().map((e) => ({
     data: e.data(),
     style: {
       width: e.style("width"),
@@ -221,9 +221,9 @@ const E = [j, I, P, D, $, J, R, A, G, q], U = (r) => {
       "target-arrow-color": e.style("target-arrow-color")
     }
   }));
-  return { nodes: o, edges: l };
-}, re = (r) => {
-  const o = M(r), l = new Blob([JSON.stringify(o, null, 2)], { type: "application/json" }), t = URL.createObjectURL(l), e = document.createElement("a");
+  return { nodes: o, edges: r };
+}, re = (s) => {
+  const o = M(s), r = new Blob([JSON.stringify(o, null, 2)], { type: "application/json" }), t = URL.createObjectURL(r), e = document.createElement("a");
   e.href = t, e.download = `graph-data-${Date.now()}.json`, e.click(), URL.revokeObjectURL(t);
 }, ie = [
   {
@@ -336,10 +336,10 @@ export {
   ge as downloadData,
   M as getCyData,
   le as handleCalcPath,
-  E as imageMap,
+  N as imageMap,
   ie as layoutCongig,
   ce as linkAnalysis,
-  ae as resDetailData,
+  ne as resDetailData,
   se as textLayout,
   pe as textPositionConfig
 };

package/lib/src/components/Graph/utils/tools.d.ts

@@ -5,10 +5,10 @@ export declare const resDetailData: (data: any, { graphData: graphData, typeObj,
     relationListObj: any;
 };
 export declare const textLayout: (cyRef: any, type: string) => any;
-export declare const handleCalcPath: (cyRef: any, { pathNodes, isGrayed, pathLinks }: {
-    pathNodes: any;
+export declare const handleCalcPath: (cyRef: any, { nodes, isGrayed, links }: {
+    nodes: any;
     isGrayed?: boolean | undefined;
-    pathLinks: any;
+    links: any;
 }) => Promise<void>;
 export declare const typeListFunc: (data?: never[]) => any[];
 export declare const getCyData: (cy: any) => {

package/lib/style.css

@@ -1 +1 @@
-.cytoscape-container{width:100%;height:100%;margin:20px auto}.search-input{padding:8px 12px;width:300px;margin-bottom:10px;border:1px solid #ddd;border-radius:4px}.btn-group{margin-bottom:10px}.btn{padding:8px 16px;margin:0 5px;border:none;border-radius:4px;background:#4285f4;color:#fff;cursor:pointer}.btn:hover{background:#3367d6}.result-text{margin-bottom:10px;color:#333;font-size:14px}.cy-container{width:100%;height:100%}.cy-container :global(.grayed){opacity:.3!important;background-color:#bdbdbd!important;color:#757575!important}.cy-container :global(.highlighted){background-color:#ffeb3b!important;border-color:#fbc02d!important;color:#333!important}.cy-container :global(.selected){border-color:#4caf50!important;background-color:#a5d6a7!important;color:#1b5e20!important}.cy-container .cy-edge:selected{line-color:#ea4335;line-width:3px;line-style:solid}.cy-container .cy-node:hover:not(:selected){background-color:#3367d6}.cy-container .cy-edge:hover:not(:selected){line-color:#757575}.path-nodes-container{margin-bottom:15px}.path-nodes-container h3{margin:10px 0;font-size:16px;color:#333}.node-input-row{display:flex;align-items:center;margin-bottom:8px}.node-input-row span{margin-right:10px;min-width:60px}.node-input-row input{flex:1;margin-right:10px}.remove-node-btn{background:#f44336;padding:6px 12px;font-size:12px}.add-node-btn{background:#4caf50;padding:8px 16px;margin-top:10px}.menuBtn:nth-child(1){transform:rotate(0) skew(31deg)}.menuBtn:nth-child(2){transform:rotate(51deg) skew(31deg)}.menuBtn:nth-child(3){transform:rotate(102deg) skew(31deg)}.menuBtn:nth-child(4){transform:rotate(153deg) skew(31deg)}.menuBtn:nth-child(5){transform:rotate(204deg) skew(31deg)}.menuBtn:nth-child(6){transform:rotate(255deg) skew(31deg)}.menuBtn:nth-child(7){transform:rotate(306deg) skew(35deg)}.menuBtn .menu-item{color:#fff;display:block;width:50px;height:20px;position:absolute;text-align:center;font-size:12px}.menuBtn .menu-item:hover{background:transparent!important}.menuBtn .menu-item{bottom:5px;right:19px;transform:skew(-30deg) translate(-9%) rotate(2deg) translateY(0)}.menuCertent{width:60px;height:60px;display:flex;align-items:center;justify-content:center;position:absolute;top:50%;left:50%;margin-top:-15%;margin-left:-15%;z-index:999;border-radius:50%;color:#fff;text-align:center;font-size:16px;cursor:pointer;border:2px solid #c9cec9}.opacity-30{opacity:.3}.cursor{cursor:pointer}.my-4px{margin:4px 0}.z-10{z-index:10}.hidden{display:none}.w-20px{width:20px}.h-100{height:100%}.rounded-50{border-radius:10%}.relative{position:relative}.absolute{position:absolute}.w-100{width:100%}.graph-bar{position:absolute;display:flex;align-items:center;z-index:10}.graph-bar .graph-bar-min-vertical{padding:0!important}.graph-bar .graph-bar-min{display:flex;background:#fff;padding:4px;box-shadow:0 4px 20px #100dae33;border-radius:6px;flex-wrap:nowrap;gap:10px;width:auto;white-space:nowrap}.graph-bar .graph-bar-menu{position:relative;cursor:pointer;margin:0 10px;white-space:nowrap;display:flex;align-items:center}.graph-bar .graph-bar-menu:hover .grap-menu-dropdown-item{color:#145afd}.graph-bar .grap-menu-dropdown{background:#fff;box-shadow:0 4px 20px #0000003b;border-radius:6px;position:absolute;padding:5px 0;z-index:99;top:60px}.graph-bar .grap-menu-dropdown p{white-space:nowrap;padding:5px 15px}.graph-bar .grap-menu-dropdown p:hover{background:#f5f5f5;color:#145afd}.graph-bar .grap-menu-dropdown-item{display:flex;cursor:pointer;flex-direction:column;align-items:center}.graph-bar .hide{display:none}.graph-bar .show{display:block}.graph-bar .graph-bar-expand-wrapper-vertical{overflow:hidden;max-height:1000px;transition:max-height .3s ease-in-out,opacity .3s ease-in-out,margin .3s ease-in-out;opacity:1}.graph-bar .graph-bar-expand-wrapper{overflow:hidden;max-width:1000px;transition:max-height .3s ease-in-out,opacity .3s ease-in-out,margin .3s ease-in-out;opacity:1}.graph-bar .graph-bar-expand-wrapper.collapsed{max-width:0;opacity:0;margin:0!important}.graph-bar .graph-bar-expand-wrapper-vertical.collapsed-vertical{max-height:0;opacity:0;margin:0!important}.graph-bar .graph-bar-min:not(.graph-bar-min-vertical) .graph-bar-expand-wrapper{display:flex;align-items:center;gap:10px;margin-left:10px;margin-right:10px}.graph-bar.graph-bar-vertical{flex-direction:column}.graph-bar.graph-bar-vertical .graph-bar-min{flex-direction:column;align-items:flex-start;position:relative;padding-bottom:0!important}.graph-bar.graph-bar-vertical .graph-bar-expand-wrapper{flex-direction:column;width:100%}.graph-bar.graph-bar-vertical .cursor{align-self:flex-end;flex-shrink:0;position:relative}.graph-bar.graph-bar-vertical .cursor:before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}.graph-bar.graph-bar-vertical .grap-menu-dropdown{top:auto;left:60px;right:auto}.graph-bar .bar-item{color:#999;font-size:12px;margin:8px 0}.graph-bar .oprate-btn{width:76px;color:#145afd;border-right:1px solid #f0f0f0}.graph-bar .oprate-btn-vertical{width:76px;padding:10px 0;color:#145afd;border-top:1px solid #f0f0f0}.gtaph-statics{right:0;z-index:1;background:#fff;padding:10px 20px 20px;box-sizing:border-box;border-radius:10px;width:200px;box-shadow:0 4px 20px #0000003b}.hove-active{cursor:pointer;font-size:14px}.hove-active:hover{color:#145afd}.setting-form{display:flex;flex-direction:column;height:100%}.setting-form .setting-form-content{flex:1;overflow-y:auto;padding:16px}.setting-form .setting-form-footer{position:sticky;bottom:0;background:#fff;padding:16px;border-top:1px solid #f0f0f0;margin-top:auto}.setting-form .setting-form-footer .ant-form-item{margin-bottom:0}.static-wraper{font-size:12px;color:#666}.color-333{color:#333}.rounded-50{border-radius:50%!important}.text-666{color:#666;font-size:12px}.query-node{width:300px;position:absolute;background-color:#fff;right:0;top:20px;padding:10px 20px;border-radius:10px}.path-node{width:380px;position:absolute;background-color:#fff;right:0;padding:10px 20px;border-radius:10px;box-shadow:0 4px 20px #0000003b;z-index:10}.path-node .title{display:flex;justify-content:space-between;height:35px;align-items:center;margin-bottom:10px;font-weight:700;font-size:14px}.path-node .search-input{margin-bottom:0;padding-bottom:5px}.path-node .btn-group{display:flex;justify-content:flex-end;margin-top:20px}.path-node .ant-select-suffix{width:10px}.query-node{width:300px;position:absolute;background-color:#fff;right:0;padding:10px 20px;border-radius:10px;box-shadow:0 4px 20px #0000003b}.query-node .title{display:flex;justify-content:space-between;height:35px;align-items:center;margin-bottom:10px;font-weight:700;font-size:14px}.radial-menu{position:relative;display:inline-flex;align-items:center;justify-content:center}.radial-svg{position:absolute;top:0;left:0}.sector-group{cursor:pointer;transition:all .2s ease}.sector-group .sector-path{transition:all .2s ease}.sector-group:hover .sector-path{filter:brightness(1.15) drop-shadow(0 2px 4px rgba(0,0,0,.3))}.sector-label{pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.4);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.center-avatar{position:absolute;z-index:10;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 15px #0000004d;transition:all .3s ease;overflow:hidden;color:#fff;font-weight:500}.center-avatar img{width:100%;height:100%;object-fit:cover}.center-avatar .center-text{font-size:14px;text-align:center}.center-avatar:hover{transform:scale(1.08);box-shadow:0 6px 20px #0006}.center-avatar:active{transform:scale(.95)}.drawer-wraper,.knowledge-card-drawer{padding-bottom:20px}.drawer-wraper .title,.knowledge-card-drawer .title{font-weight:700;font-size:14px;color:#3d3d3d;position:relative;padding-left:8px}.drawer-wraper .title:before,.knowledge-card-drawer .title:before{position:absolute;left:0;transform:translateY(-50%);top:50%;content:"";width:3px;height:17px;background:#145afd}.drawer-wraper .graph-item,.knowledge-card-drawer .graph-item{height:26px;border-bottom:1px solid #E5E5E5;background:#edf3fe}.drawer-wraper .graph-item:hover,.knowledge-card-drawer .graph-item:hover{background:#edf3fe}.drawer-wraper .noraml-type,.knowledge-card-drawer .noraml-type{font-size:14px;color:#145afd;line-height:26px;text-align:center;border-right:1px solid #E5E5E5}.drawer-wraper .noraml-text,.knowledge-card-drawer .noraml-text{font-size:14px;color:#333;line-height:26px}.drawer-wraper .selected-item,.knowledge-card-drawer .selected-item{background:#edf3fe;color:#1890ff}.drawer-wraper .selected-item .noraml-type,.knowledge-card-drawer .selected-item .noraml-type{background:#347bfc;color:#fff}.drawer-wraper .drawer-card-title,.knowledge-card-drawer .drawer-card-title{font-weight:600;font-size:14px;color:#333;position:relative;padding-bottom:10px;margin:15px 0 10px;cursor:pointer}.drawer-wraper .drawer-card-title:hover,.knowledge-card-drawer .drawer-card-title:hover{color:#145afd}.drawer-wraper .drawer-card-title:after,.knowledge-card-drawer .drawer-card-title:after{content:"";position:absolute;border-bottom:1px solid #DFDFDF;width:100%;left:0;bottom:0}.drawer-wraper .drawer-card-title:before,.knowledge-card-drawer .drawer-card-title:before{content:"";position:absolute;border-bottom:1px solid #145AFD;width:64px;left:0;bottom:0;z-index:1}.collapse-wrap{border-color:#dfdfdf;border-radius:0;height:calc(100vh - 480px);overflow-y:auto}.collapse-wrap .ant-collapse-header{padding:9px 10px!important;background:#fff}.collapse-wrap .ant-collapse-item{border-color:#dfdfdf}.collapse-wrap .ant-collapse-title{font-size:14px;font-weight:700;color:#3d3d3d}.collapse-wrap .ant-collapse-body{max-height:calc(100vh - 550px);overflow-y:auto;width:298px;padding:0 16px 16px!important}.collapse-wrap .ant-collapse-body .ant-card-body{padding:0!important}.collapse-wrap .ant-collapse-body .ant-card{border:none}.property-section-wraper .section-item{display:flex;margin-top:4px}.property-section-wraper .detail-label{color:#333;font-size:14px;white-space:nowrap;flex-shrink:0}.property-section-wraper .detail-value{color:#383838;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-wraper .video-item{height:185px;position:relative;background:#333;border-radius:6px}.video-wraper .video-item-video{width:100%;height:100%;border-radius:6px;object-fit:cover}.relation-section-wraper{display:flex;flex-wrap:wrap;gap:10px}.relation-section-wraper .group{width:100%}.relation-section-wraper .section-card{width:100%;height:100%;border:1px solid #DFDFDF}.relation-section-wraper .section-title{margin-bottom:7px}.relation-section-wraper .entity-name-list{font-size:16px;font-weight:700}.relation-section-wraper .view-details-btn{color:#145afd}.relation-section-wraper .detail-item-tag{background-color:#e6f2ff;font-size:14px;border:1px solid #bdf;border-top-left-radius:10px;border-bottom-right-radius:10px;padding:0 13px;color:#1082fe;margin-right:3px}.relation-section-wraper .detail-item-tag1{background-color:#fff5df;font-size:14px;border:1px solid #FFE0B8;border-top-left-radius:10px;border-bottom-right-radius:10px;padding:0 13px;color:#ff9418}.relation-section-wraper .detail-item-list{margin-bottom:3px}.relation-section-wraper .detail-label{color:#676a6c;font-size:14px;white-space:nowrap;flex-shrink:0}.relation-section-wraper .detail-value{color:#383838;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.relation-section-wraper .mb-18px{margin-bottom:18px}.knowledge-card-click{height:100%;overflow:hidden}.knowledge-card-click .drawer-card-title2{font-weight:700;flex-wrap:nowrap;padding-bottom:10px;border-bottom:1px solid #e4e7ed;cursor:pointer;color:#333;margin:14px 0}.knowledge-card-click .drawer-card-title2:hover,.knowledge-card-click .drawer-card-title2.active{color:#145afd}.knowledge-card-click .card-item-click{flex-shrink:0;margin-right:10px;border-right:1px solid #e4e7ed;padding-right:10px;height:100%;background:#fff}.knowledge-card-click .knowledge-card-content{height:100%;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.knowledge-card-click .knowledge-card-content::-webkit-scrollbar{display:none}
+.cytoscape-container{width:100%;height:100%;margin:20px auto}.search-input{padding:8px 12px;width:300px;margin-bottom:10px;border:1px solid #ddd;border-radius:4px}.btn-group{margin-bottom:10px}.btn{padding:8px 16px;margin:0 5px;border:none;border-radius:4px;background:#4285f4;color:#fff;cursor:pointer}.btn:hover{background:#3367d6}.result-text{margin-bottom:10px;color:#333;font-size:14px}.cy-container{width:100%;height:100%}.cy-container :global(.grayed){opacity:.3!important;background-color:#bdbdbd!important;color:#757575!important}.cy-container :global(.highlighted){background-color:#ffeb3b!important;border-color:#fbc02d!important;color:#333!important}.cy-container :global(.selected){border-color:#4caf50!important;background-color:#a5d6a7!important;color:#1b5e20!important}.cy-container .cy-edge:selected{line-color:#ea4335;line-width:3px;line-style:solid}.cy-container .cy-node:hover:not(:selected){background-color:#3367d6}.cy-container .cy-edge:hover:not(:selected){line-color:#757575}.path-nodes-container{margin-bottom:15px}.path-nodes-container h3{margin:10px 0;font-size:16px;color:#333}.node-input-row{display:flex;align-items:center;margin-bottom:8px}.node-input-row span{margin-right:10px;min-width:60px}.node-input-row input{flex:1;margin-right:10px}.remove-node-btn{background:#f44336;padding:6px 12px;font-size:12px}.add-node-btn{background:#4caf50;padding:8px 16px;margin-top:10px}.menuBtn:nth-child(1){transform:rotate(0) skew(31deg)}.menuBtn:nth-child(2){transform:rotate(51deg) skew(31deg)}.menuBtn:nth-child(3){transform:rotate(102deg) skew(31deg)}.menuBtn:nth-child(4){transform:rotate(153deg) skew(31deg)}.menuBtn:nth-child(5){transform:rotate(204deg) skew(31deg)}.menuBtn:nth-child(6){transform:rotate(255deg) skew(31deg)}.menuBtn:nth-child(7){transform:rotate(306deg) skew(35deg)}.menuBtn .menu-item{color:#fff;display:block;width:50px;height:20px;position:absolute;text-align:center;font-size:12px}.menuBtn .menu-item:hover{background:transparent!important}.menuBtn .menu-item{bottom:5px;right:19px;transform:skew(-30deg) translate(-9%) rotate(2deg) translateY(0)}.menuCertent{width:60px;height:60px;display:flex;align-items:center;justify-content:center;position:absolute;top:50%;left:50%;margin-top:-15%;margin-left:-15%;z-index:999;border-radius:50%;color:#fff;text-align:center;font-size:16px;cursor:pointer;border:2px solid #c9cec9}.opacity-30{opacity:.3}.cursor{cursor:pointer}.my-4px{margin:4px 0}.z-10{z-index:10}.hidden{display:none}.w-20px{width:20px}.h-100{height:100%}.rounded-50{border-radius:10%}.relative{position:relative}.absolute{position:absolute}.w-100{width:100%}.graph-bar{position:absolute;display:flex;align-items:center;z-index:10}.graph-bar .graph-bar-min-vertical{padding:0!important}.graph-bar .graph-bar-min{display:flex;background:#fff;padding:4px;box-shadow:0 4px 20px #100dae33;border-radius:6px;flex-wrap:nowrap;gap:10px;width:auto;white-space:nowrap}.graph-bar .graph-bar-menu{position:relative;cursor:pointer;margin:0 10px;white-space:nowrap;display:flex;align-items:center}.graph-bar .graph-bar-menu:hover .grap-menu-dropdown-item{color:#145afd}.graph-bar .grap-menu-dropdown{background:#fff;box-shadow:0 4px 20px #0000003b;border-radius:6px;position:absolute;padding:5px 0;z-index:99;top:60px}.graph-bar .grap-menu-dropdown p{white-space:nowrap;padding:5px 15px}.graph-bar .grap-menu-dropdown p:hover{background:#f5f5f5;color:#145afd}.graph-bar .grap-menu-dropdown-item{display:flex;cursor:pointer;flex-direction:column;align-items:center}.graph-bar .hide{display:none}.graph-bar .show{display:block}.graph-bar .graph-bar-expand-wrapper-vertical{overflow:hidden;max-height:1000px;transition:max-height .3s ease-in-out,opacity .3s ease-in-out,margin .3s ease-in-out;opacity:1}.graph-bar .graph-bar-expand-wrapper{overflow:hidden;max-width:1000px;transition:max-height .3s ease-in-out,opacity .3s ease-in-out,margin .3s ease-in-out;opacity:1}.graph-bar .graph-bar-expand-wrapper.collapsed{max-width:0;opacity:0;margin:0!important}.graph-bar .graph-bar-expand-wrapper-vertical.collapsed-vertical{max-height:0;opacity:0;margin:0!important}.graph-bar .graph-bar-min:not(.graph-bar-min-vertical) .graph-bar-expand-wrapper{display:flex;align-items:center;gap:10px;margin-left:10px;margin-right:10px}.graph-bar.graph-bar-vertical{flex-direction:column}.graph-bar.graph-bar-vertical .graph-bar-min{flex-direction:column;align-items:flex-start;position:relative;padding-bottom:0!important}.graph-bar.graph-bar-vertical .graph-bar-expand-wrapper{flex-direction:column;width:100%}.graph-bar.graph-bar-vertical .cursor{align-self:flex-end;flex-shrink:0;position:relative}.graph-bar.graph-bar-vertical .cursor:before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}.graph-bar.graph-bar-vertical .grap-menu-dropdown{top:auto;left:60px;right:auto}.graph-bar .bar-item{color:#999;font-size:12px;margin:8px 0}.graph-bar .oprate-btn{width:76px;color:#145afd;border-right:1px solid #f0f0f0}.graph-bar .oprate-btn-vertical{width:76px;padding:10px 0;color:#145afd;border-top:1px solid #f0f0f0}.gtaph-statics{right:0;z-index:1;background:#fff;padding:10px 20px 20px;box-sizing:border-box;border-radius:10px;width:200px;box-shadow:0 4px 20px #0000003b}.hove-active{cursor:pointer;font-size:14px}.hove-active:hover{color:#145afd}.font-12{font-size:12px}.setting-form{display:flex;flex-direction:column;height:100%}.setting-form .setting-form-content{flex:1;overflow-y:auto;padding:16px}.setting-form .setting-form-footer{position:sticky;bottom:0;background:#fff;padding:16px;border-top:1px solid #f0f0f0;margin-top:auto}.setting-form .setting-form-footer .ant-form-item{margin-bottom:0}.static-wraper{font-size:12px;color:#666}.color-333{color:#333}.rounded-50{border-radius:50%!important}.text-666{color:#666;font-size:12px}.query-node{width:300px;position:absolute;background-color:#fff;right:0;top:20px;padding:10px 20px;border-radius:10px}.path-node{width:380px;position:absolute;background-color:#fff;right:0;padding:10px 20px;border-radius:10px;box-shadow:0 4px 20px #0000003b;z-index:10}.path-node .title{display:flex;justify-content:space-between;height:35px;align-items:center;margin-bottom:10px;font-weight:700;font-size:14px}.path-node .search-input{margin-bottom:0;padding-bottom:5px}.path-node .btn-group{display:flex;justify-content:flex-end;margin-top:20px}.path-node .ant-select-suffix{width:10px}.query-node{width:300px;position:absolute;background-color:#fff;right:0;padding:10px 20px;border-radius:10px;box-shadow:0 4px 20px #0000003b}.query-node .title{display:flex;justify-content:space-between;height:35px;align-items:center;margin-bottom:10px;font-weight:700;font-size:14px}.radial-menu{position:relative;display:inline-flex;align-items:center;justify-content:center}.radial-svg{position:absolute;top:0;left:0}.sector-group{cursor:pointer;transition:all .2s ease}.sector-group .sector-path{transition:all .2s ease}.sector-group:hover .sector-path{filter:brightness(1.15) drop-shadow(0 2px 4px rgba(0,0,0,.3))}.sector-label{pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.4);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.center-avatar{position:absolute;z-index:10;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 15px #0000004d;transition:all .3s ease;overflow:hidden;color:#fff;font-weight:500}.center-avatar img{width:100%;height:100%;object-fit:cover}.center-avatar .center-text{font-size:14px;text-align:center}.center-avatar:hover{transform:scale(1.08);box-shadow:0 6px 20px #0006}.center-avatar:active{transform:scale(.95)}.drawer-wraper,.knowledge-card-drawer{padding-bottom:20px}.drawer-wraper .title,.knowledge-card-drawer .title{font-weight:700;font-size:14px;color:#3d3d3d;position:relative;padding-left:8px}.drawer-wraper .title:before,.knowledge-card-drawer .title:before{position:absolute;left:0;transform:translateY(-50%);top:50%;content:"";width:3px;height:17px;background:#145afd}.drawer-wraper .graph-item,.knowledge-card-drawer .graph-item{height:26px;border-bottom:1px solid #E5E5E5;background:#edf3fe}.drawer-wraper .graph-item:hover,.knowledge-card-drawer .graph-item:hover{background:#edf3fe}.drawer-wraper .noraml-type,.knowledge-card-drawer .noraml-type{font-size:14px;color:#145afd;line-height:26px;text-align:center;border-right:1px solid #E5E5E5}.drawer-wraper .noraml-text,.knowledge-card-drawer .noraml-text{font-size:14px;color:#333;line-height:26px}.drawer-wraper .selected-item,.knowledge-card-drawer .selected-item{background:#edf3fe;color:#1890ff}.drawer-wraper .selected-item .noraml-type,.knowledge-card-drawer .selected-item .noraml-type{background:#347bfc;color:#fff}.drawer-wraper .drawer-card-title,.knowledge-card-drawer .drawer-card-title{font-weight:600;font-size:14px;color:#333;position:relative;padding-bottom:10px;margin:15px 0 10px;cursor:pointer}.drawer-wraper .drawer-card-title:hover,.knowledge-card-drawer .drawer-card-title:hover{color:#145afd}.drawer-wraper .drawer-card-title:after,.knowledge-card-drawer .drawer-card-title:after{content:"";position:absolute;border-bottom:1px solid #DFDFDF;width:100%;left:0;bottom:0}.drawer-wraper .drawer-card-title:before,.knowledge-card-drawer .drawer-card-title:before{content:"";position:absolute;border-bottom:1px solid #145AFD;width:64px;left:0;bottom:0;z-index:1}.collapse-wrap{border-color:#dfdfdf;border-radius:0;height:calc(100vh - 480px);overflow-y:auto}.collapse-wrap .ant-collapse-header{padding:9px 10px!important;background:#fff}.collapse-wrap .ant-collapse-item{border-color:#dfdfdf}.collapse-wrap .ant-collapse-title{font-size:14px;font-weight:700;color:#3d3d3d}.collapse-wrap .ant-collapse-body{max-height:calc(100vh - 550px);overflow-y:auto;width:298px;padding:0 16px 16px!important}.collapse-wrap .ant-collapse-body .ant-card-body{padding:0!important}.collapse-wrap .ant-collapse-body .ant-card{border:none}.property-section-wraper .section-item{display:flex;margin-top:4px}.property-section-wraper .detail-label{color:#333;font-size:14px;white-space:nowrap;flex-shrink:0}.property-section-wraper .detail-value{color:#383838;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-wraper .video-item{height:185px;position:relative;background:#333;border-radius:6px}.video-wraper .video-item-video{width:100%;height:100%;border-radius:6px;object-fit:cover}.relation-section-wraper{display:flex;flex-wrap:wrap;gap:10px}.relation-section-wraper .group{width:100%}.relation-section-wraper .section-card{width:100%;height:100%;border:1px solid #DFDFDF}.relation-section-wraper .section-title{margin-bottom:7px}.relation-section-wraper .entity-name-list{font-size:16px;font-weight:700}.relation-section-wraper .view-details-btn{color:#145afd}.relation-section-wraper .detail-item-tag{background-color:#e6f2ff;font-size:14px;border:1px solid #bdf;border-top-left-radius:10px;border-bottom-right-radius:10px;padding:0 13px;color:#1082fe;margin-right:3px}.relation-section-wraper .detail-item-tag1{background-color:#fff5df;font-size:14px;border:1px solid #FFE0B8;border-top-left-radius:10px;border-bottom-right-radius:10px;padding:0 13px;color:#ff9418}.relation-section-wraper .detail-item-list{margin-bottom:3px}.relation-section-wraper .detail-label{color:#676a6c;font-size:14px;white-space:nowrap;flex-shrink:0}.relation-section-wraper .detail-value{color:#383838;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.relation-section-wraper .mb-18px{margin-bottom:18px}.knowledge-card-click{height:100%;overflow:hidden}.knowledge-card-click .drawer-card-title2{font-weight:700;flex-wrap:nowrap;padding-bottom:10px;border-bottom:1px solid #e4e7ed;cursor:pointer;color:#333;margin:14px 0}.knowledge-card-click .drawer-card-title2:hover,.knowledge-card-click .drawer-card-title2.active{color:#145afd}.knowledge-card-click .card-item-click{flex-shrink:0;margin-right:10px;border-right:1px solid #e4e7ed;padding-right:10px;height:100%;background:#fff}.knowledge-card-click .knowledge-card-content{height:100%;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.knowledge-card-click .knowledge-card-content::-webkit-scrollbar{display:none}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-kggraph",
-  "version": "0.0.28",
+  "version": "0.0.29",
   "description": "A knowledge graph visualization component based on Cytoscape",
   "type": "module",
   "main": "./lib/index.es.js",