react-kggraph 0.0.30 → 0.0.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/index.es25.js CHANGED
@@ -1,28 +1,28 @@
1
- import { jsxs as y, Fragment as S, jsx as a } from "react/jsx-runtime";
1
+ import { jsxs as y, Fragment as S, jsx as n } from "react/jsx-runtime";
2
2
  import { forwardRef as oe, useState as d, useImperativeHandle as ie } from "react";
3
- import { Form as s, message as z, Select as B, Input as h, Button as x, Table as k, Modal as se, Tabs as ce, Tooltip as pe } from "antd";
3
+ import { Form as s, message as $, Select as B, Input as u, Button as x, Table as k, Modal as se, Tabs as ce, Tooltip as pe } from "antd";
4
4
  import { SearchOutlined as F } from "@ant-design/icons";
5
- const ge = oe((de, N) => {
5
+ const me = oe((de, N) => {
6
6
  const [R, b] = d(!1), [T, M] = d({}), [O, P] = d("entity"), [j, v] = d([]), [G, A] = d([]), [H, K] = d([]), [q, J] = d([]), [I, p] = d(!1), [Q] = s.useForm(), [U] = s.useForm(), [W] = s.useForm();
7
7
  ie(N, () => ({
8
8
  open: (e) => {
9
9
  b(!0);
10
10
  const r = [], l = [];
11
- e.forEach((n) => {
12
- n.group === "nodes" && r.push(n.data), n.group === "edges" && l.push(n.data);
11
+ e.forEach((a) => {
12
+ a.group === "nodes" && r.push(a.data), a.group === "edges" && l.push(a.data);
13
13
  }), M({ nodes: r, links: l }), X({ nodes: r, links: l });
14
14
  },
15
15
  close: () => b(!1)
16
16
  }));
17
- const f = (e) => {
17
+ const h = (e) => {
18
18
  const r = [], l = /* @__PURE__ */ new Map();
19
19
  e.nodes.forEach((t) => {
20
20
  l.set(t.id, t);
21
21
  });
22
- const n = /* @__PURE__ */ new Set();
22
+ const a = /* @__PURE__ */ new Set();
23
23
  return e.links.forEach((t) => {
24
24
  var c;
25
- n.add(t.source), n.add(t.target);
25
+ a.add(t.source), a.add(t.target);
26
26
  const o = l.get(t.target);
27
27
  r.push({
28
28
  source: ((c = l.get(t.source)) == null ? void 0 : c.label) || t.source,
@@ -31,7 +31,7 @@ const ge = oe((de, N) => {
31
31
  targetType: o == null ? void 0 : o.types
32
32
  });
33
33
  }), e.nodes.forEach((t) => {
34
- n.has(t.id) || r.push({
34
+ a.has(t.id) || r.push({
35
35
  source: t.label,
36
36
  relation: "-",
37
37
  target: "-"
@@ -41,45 +41,42 @@ const ge = oe((de, N) => {
41
41
  p(!0);
42
42
  try {
43
43
  if (!e) {
44
- z.warning("未找到数据"), p(!1);
44
+ $.warning("未找到数据"), p(!1);
45
45
  return;
46
46
  }
47
- console.log(99, e);
48
- const r = e, { links: l = [], nodes: n = [] } = r, t = f(r);
49
- console.log(99911, t);
50
- const o = n.map((i) => {
51
- var _, E, L;
52
- const m = t.filter(($) => $.source === i.label && $.targetType === "typed-literal"), ae = ((L = (E = (_ = i == null ? void 0 : i.properties) == null ? void 0 : _.value) == null ? void 0 : E.split("/")) == null ? void 0 : L[0]) || "";
47
+ const r = e, { links: l = [], nodes: a = [] } = r, t = h(r), o = a.map((i) => {
48
+ var C, _, E;
49
+ const g = t.filter((L) => L.source === i.label && L.targetType === "typed-literal"), ne = ((E = (_ = (C = i == null ? void 0 : i.properties) == null ? void 0 : C.value) == null ? void 0 : _.split("/")) == null ? void 0 : E[0]) || "";
53
50
  return {
54
51
  ...i,
55
- num: m.length || 0,
56
- typeVale: ae
52
+ num: g.length || 0,
53
+ typeVale: ne
57
54
  };
58
- }), c = t.filter((i) => i.targetType === "uri"), w = t.filter((i) => i.targetType === "typed-literal"), u = o.filter((i) => i.types === "uri"), g = [...new Set(u.map((i) => i.typeVale).filter(Boolean))];
59
- J(g), console.log(444111, u), V(o), D(c), C(w);
55
+ }), c = t.filter((i) => i.targetType === "uri"), w = t.filter((i) => i.targetType === "typed-literal"), f = o.filter((i) => i.types === "uri"), m = [...new Set(f.map((i) => i.typeVale).filter(Boolean))];
56
+ J(m), D(o), V(c), z(w);
60
57
  } catch (r) {
61
- console.error("数据加载失败:", r), z.error("数据加载失败");
58
+ console.error("数据加载失败:", r), $.error("数据加载失败");
62
59
  }
63
60
  p(!1);
64
- }, V = (e) => {
65
- const l = e.filter((n) => n.types === "uri").map((n, t) => ({
66
- key: n.id || String(t),
67
- typeVale: n.typeVale || "",
68
- label: n.label || "",
69
- num: n.length || 0
70
- }));
71
- console.log(566, l), v(l);
72
61
  }, D = (e) => {
73
- const r = e.map((l, n) => ({
74
- key: `${l.source}-${l.relation}-${l.target}-${n}`,
62
+ const l = e.filter((a) => a.types === "uri").map((a, t) => ({
63
+ key: a.id || String(t),
64
+ typeVale: a.typeVale || "",
65
+ label: a.label || "",
66
+ num: a.num || 0
67
+ }));
68
+ v(l);
69
+ }, V = (e) => {
70
+ const r = e.map((l, a) => ({
71
+ key: `${l.source}-${l.relation}-${l.target}-${a}`,
75
72
  source: l.source || "",
76
73
  relation: l.relation || "-",
77
74
  target: l.target || ""
78
75
  }));
79
76
  A(r);
80
- }, C = (e) => {
81
- const r = e.map((l, n) => ({
82
- key: `${l.source}-${l.relation}-${l.target}-${n}`,
77
+ }, z = (e) => {
78
+ const r = e.map((l, a) => ({
79
+ key: `${l.source}-${l.relation}-${l.target}-${a}`,
83
80
  source: l.source || "",
84
81
  relation: l.relation || "-",
85
82
  target: l.target || ""
@@ -90,10 +87,10 @@ const ge = oe((de, N) => {
90
87
  try {
91
88
  const r = T;
92
89
  if (!r) return;
93
- const { nodes: l = [] } = r, n = f(r);
90
+ const { nodes: l = [] } = r, a = h(r);
94
91
  let t = l.map((o) => {
95
- var u, g, i;
96
- const c = n.filter((m) => m.source === o.label && m.targetType === "typed-literal"), w = ((i = (g = (u = o == null ? void 0 : o.properties) == null ? void 0 : u.value) == null ? void 0 : g.split("/")) == null ? void 0 : i[0]) || "";
92
+ var f, m, i;
93
+ const c = a.filter((g) => g.source === o.label && g.targetType === "typed-literal"), w = ((i = (m = (f = o == null ? void 0 : o.properties) == null ? void 0 : f.value) == null ? void 0 : m.split("/")) == null ? void 0 : i[0]) || "";
97
94
  return {
98
95
  ...o,
99
96
  num: c.length || 0,
@@ -103,7 +100,7 @@ const ge = oe((de, N) => {
103
100
  e.entityType && (t = t.filter((o) => o.typeVale === e.entityType)), e.entityValue && (t = t.filter((o) => {
104
101
  var c;
105
102
  return (c = o.label) == null ? void 0 : c.includes(e.entityValue);
106
- })), V(t);
103
+ })), D(t);
107
104
  } catch (r) {
108
105
  console.error("搜索失败:", r);
109
106
  }
@@ -113,13 +110,13 @@ const ge = oe((de, N) => {
113
110
  try {
114
111
  const r = T;
115
112
  if (!r) return;
116
- let n = f(r).filter((t) => t.targetType === "uri");
117
- e.entity && (n = n.filter(
113
+ let a = h(r).filter((t) => t.targetType === "uri");
114
+ e.entity && (a = a.filter(
118
115
  (t) => {
119
116
  var o, c;
120
117
  return ((o = t.source) == null ? void 0 : o.includes(e.entity)) || ((c = t.target) == null ? void 0 : c.includes(e.entity));
121
118
  }
122
- )), e.relation && (n = n.filter((t) => t.relation === e.relation)), D(n);
119
+ )), e.relation && (a = a.filter((t) => t.relation === e.relation)), V(a);
123
120
  } catch (r) {
124
121
  console.error("搜索失败:", r);
125
122
  }
@@ -129,14 +126,14 @@ const ge = oe((de, N) => {
129
126
  try {
130
127
  const r = T;
131
128
  if (!r) return;
132
- let n = f(r).filter((t) => t.targetType === "typed-literal");
133
- e.entity && (n = n.filter((t) => {
129
+ let a = h(r).filter((t) => t.targetType === "typed-literal");
130
+ e.entity && (a = a.filter((t) => {
134
131
  var o;
135
132
  return (o = t.source) == null ? void 0 : o.includes(e.entity);
136
- })), e.property && (n = n.filter((t) => {
133
+ })), e.property && (a = a.filter((t) => {
137
134
  var o;
138
135
  return (o = t.target) == null ? void 0 : o.includes(e.property);
139
- })), C(n);
136
+ })), z(a);
140
137
  } catch (r) {
141
138
  console.error("搜索失败:", r);
142
139
  }
@@ -151,10 +148,10 @@ const ge = oe((de, N) => {
151
148
  { title: "实体", dataIndex: "source", key: "source" },
152
149
  { title: "关系", dataIndex: "relation", key: "relation" },
153
150
  { title: "实体", dataIndex: "target", key: "target" }
154
- ], le = [
151
+ ], ae = [
155
152
  { title: "序号", render: (e, r, l) => l + 1, width: 20 },
156
- { title: "实体", dataIndex: "source", key: "source", width: 80 },
157
- { title: "属性名", dataIndex: "relation", key: "relation", width: 80 },
153
+ { title: "实体", dataIndex: "source", key: "source", width: 60 },
154
+ { title: "属性名", dataIndex: "relation", key: "relation", width: 40 },
158
155
  {
159
156
  title: "属性值",
160
157
  dataIndex: "target",
@@ -163,9 +160,9 @@ const ge = oe((de, N) => {
163
160
  ellipsis: {
164
161
  showTitle: !1
165
162
  },
166
- render: (e) => /* @__PURE__ */ a(pe, { placement: "topLeft", title: e, children: e })
163
+ render: (e) => /* @__PURE__ */ n(pe, { placement: "topLeft", title: e, children: e })
167
164
  }
168
- ], ne = [
165
+ ], le = [
169
166
  {
170
167
  key: "entity",
171
168
  label: "实体表",
@@ -178,20 +175,21 @@ const ge = oe((de, N) => {
178
175
  onFinish: Y,
179
176
  style: { paddingTop: 20, marginBottom: 20 },
180
177
  children: [
181
- /* @__PURE__ */ a(s.Item, { name: "entityType", label: "实体类型", children: /* @__PURE__ */ a(B, { placeholder: "请选择", style: { width: 150 }, allowClear: !0, children: q.map((e) => /* @__PURE__ */ a(B.Option, { value: e, children: e }, e)) }) }),
182
- /* @__PURE__ */ a(s.Item, { name: "entityValue", label: "实体值", children: /* @__PURE__ */ a(h, { placeholder: "请输入名称" }) }),
183
- /* @__PURE__ */ a(s.Item, { children: /* @__PURE__ */ a(x, { type: "primary", htmlType: "submit", icon: /* @__PURE__ */ a(F, {}), children: "搜索" }) })
178
+ /* @__PURE__ */ n(s.Item, { name: "entityType", label: "实体类型", children: /* @__PURE__ */ n(B, { placeholder: "请选择", style: { width: 150 }, allowClear: !0, children: q.map((e) => /* @__PURE__ */ n(B.Option, { value: e, children: e }, e)) }) }),
179
+ /* @__PURE__ */ n(s.Item, { name: "entityValue", label: "实体值", children: /* @__PURE__ */ n(u, { placeholder: "请输入名称" }) }),
180
+ /* @__PURE__ */ n(s.Item, { children: /* @__PURE__ */ n(x, { type: "primary", htmlType: "submit", icon: /* @__PURE__ */ n(F, {}), children: "搜索" }) })
184
181
  ]
185
182
  }
186
183
  ),
187
- /* @__PURE__ */ a(
184
+ /* @__PURE__ */ n(
188
185
  k,
189
186
  {
190
187
  columns: te,
191
188
  dataSource: j,
192
189
  loading: I,
193
190
  pagination: { pageSize: 10, showSizeChanger: !0 },
194
- scroll: { x: !0 }
191
+ scroll: { x: !0 },
192
+ size: "small"
195
193
  }
196
194
  )
197
195
  ] })
@@ -208,20 +206,21 @@ const ge = oe((de, N) => {
208
206
  onFinish: Z,
209
207
  style: { paddingTop: 20, marginBottom: 20 },
210
208
  children: [
211
- /* @__PURE__ */ a(s.Item, { name: "entity", label: "实体", children: /* @__PURE__ */ a(h, { placeholder: "请输入名称", style: { width: 200 } }) }),
212
- /* @__PURE__ */ a(s.Item, { name: "relation", label: "关系", children: /* @__PURE__ */ a(h, { placeholder: "请输入名称", style: { width: 200 } }) }),
213
- /* @__PURE__ */ a(s.Item, { children: /* @__PURE__ */ a(x, { type: "primary", htmlType: "submit", icon: /* @__PURE__ */ a(F, {}), children: "搜索" }) })
209
+ /* @__PURE__ */ n(s.Item, { name: "entity", label: "实体", children: /* @__PURE__ */ n(u, { placeholder: "请输入名称", style: { width: 200 } }) }),
210
+ /* @__PURE__ */ n(s.Item, { name: "relation", label: "关系", children: /* @__PURE__ */ n(u, { placeholder: "请输入名称", style: { width: 200 } }) }),
211
+ /* @__PURE__ */ n(s.Item, { children: /* @__PURE__ */ n(x, { type: "primary", htmlType: "submit", icon: /* @__PURE__ */ n(F, {}), children: "搜索" }) })
214
212
  ]
215
213
  }
216
214
  ),
217
- /* @__PURE__ */ a(
215
+ /* @__PURE__ */ n(
218
216
  k,
219
217
  {
220
218
  columns: re,
221
219
  dataSource: G,
222
220
  loading: I,
223
221
  pagination: { pageSize: 10, showSizeChanger: !0 },
224
- scroll: { x: !0 }
222
+ scroll: { x: !0 },
223
+ size: "small"
225
224
  }
226
225
  )
227
226
  ] })
@@ -238,36 +237,37 @@ const ge = oe((de, N) => {
238
237
  onFinish: ee,
239
238
  style: { paddingTop: 20, marginBottom: 20 },
240
239
  children: [
241
- /* @__PURE__ */ a(s.Item, { name: "entity", label: "实体", children: /* @__PURE__ */ a(h, { placeholder: "请输入名称", style: { width: 200 } }) }),
242
- /* @__PURE__ */ a(s.Item, { name: "property", label: "属性值", children: /* @__PURE__ */ a(h, { placeholder: "请输入名称", style: { width: 200 } }) }),
243
- /* @__PURE__ */ a(s.Item, { children: /* @__PURE__ */ a(x, { type: "primary", htmlType: "submit", icon: /* @__PURE__ */ a(F, {}), children: "搜索" }) })
240
+ /* @__PURE__ */ n(s.Item, { name: "entity", label: "实体", children: /* @__PURE__ */ n(u, { placeholder: "请输入名称", style: { width: 200 } }) }),
241
+ /* @__PURE__ */ n(s.Item, { name: "property", label: "属性值", children: /* @__PURE__ */ n(u, { placeholder: "请输入名称", style: { width: 200 } }) }),
242
+ /* @__PURE__ */ n(s.Item, { children: /* @__PURE__ */ n(x, { type: "primary", htmlType: "submit", icon: /* @__PURE__ */ n(F, {}), children: "搜索" }) })
244
243
  ]
245
244
  }
246
245
  ),
247
- /* @__PURE__ */ a(
246
+ /* @__PURE__ */ n(
248
247
  k,
249
248
  {
250
- columns: le,
249
+ columns: ae,
251
250
  dataSource: H,
252
251
  loading: I,
253
- pagination: { pageSize: 10, showSizeChanger: !0 }
252
+ pagination: { pageSize: 10, showSizeChanger: !0 },
253
+ size: "small"
254
254
  }
255
255
  )
256
256
  ] })
257
257
  }
258
258
  ];
259
- return /* @__PURE__ */ a(se, { open: R, onCancel: () => {
259
+ return /* @__PURE__ */ n(se, { open: R, onCancel: () => {
260
260
  b(!1);
261
- }, footer: null, width: 900, children: /* @__PURE__ */ a("div", { style: { padding: "0 20px", background: "#fff" }, children: /* @__PURE__ */ a(
261
+ }, footer: null, width: 900, children: /* @__PURE__ */ n("div", { style: { padding: "0 20px", background: "#fff" }, children: /* @__PURE__ */ n(
262
262
  ce,
263
263
  {
264
264
  activeKey: O,
265
265
  onChange: P,
266
- items: ne,
266
+ items: le,
267
267
  style: { background: "#fff" }
268
268
  }
269
269
  ) }) });
270
270
  });
271
271
  export {
272
- ge as default
272
+ me as default
273
273
  };
package/lib/index.es45.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { jsx as i } from "react/jsx-runtime";
2
2
  import { useState as m, useEffect as w } from "react";
3
- import h from "./index.es47.js";
3
+ import h from "./index.es50.js";
4
4
  const k = ({ relations: t, kgIds: s, viewMode: a = "list", source: c = "" }) => {
5
5
  const [d, l] = m(t);
6
6
  w(() => {
package/lib/style.css CHANGED
@@ -1 +1 @@
1
- *{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden}.cytoscape-container{width:100%;height:100%}.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:12px 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}
1
+ *{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0}.cytoscape-container{width:100%;height:100%}.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:12px 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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-kggraph",
3
- "version": "0.0.30",
3
+ "version": "0.0.31",
4
4
  "description": "A knowledge graph visualization component based on Cytoscape",
5
5
  "type": "module",
6
6
  "main": "./lib/index.es.js",
File without changes