react-kggraph 0.0.27 → 0.0.28

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.es8.js CHANGED
@@ -2,60 +2,61 @@ import { message as v } from "antd";
2
2
  import j from "./index.es25.js";
3
3
  import I from "./index.es26.js";
4
4
  import P from "./index.es27.js";
5
- import $ from "./index.es28.js";
6
- import D from "./index.es29.js";
5
+ import D from "./index.es28.js";
6
+ import $ from "./index.es29.js";
7
7
  import J from "./index.es30.js";
8
- import N from "./index.es31.js";
9
- import R from "./index.es32.js";
10
- import q from "./index.es33.js";
11
- import A from "./index.es34.js";
8
+ import R from "./index.es31.js";
9
+ import A from "./index.es32.js";
10
+ import G from "./index.es33.js";
11
+ import q from "./index.es34.js";
12
12
  import B from "./index.es35.js";
13
- import U from "./index.es36.js";
14
- import { jsonStringifyParse as G } from "./index.es12.js";
15
- const L = [j, I, P, $, D, J, N, R, q, A], T = (c) => {
13
+ import L from "./index.es36.js";
14
+ import { jsonStringifyParse as T } from "./index.es12.js";
15
+ const E = [j, I, P, D, $, J, R, A, G, q], U = (r) => {
16
16
  let o = { _: { count: 0 } };
17
- const s = {}, e = [];
18
- return c.forEach((n) => {
19
- var a;
20
- const { group: d } = n;
21
- if (d === "nodes") {
22
- const i = n.data, l = (a = i.properties) == null ? void 0 : a.type, r = i.type;
23
- !r && l === "uri" ? o = { ...o, _: { ...o[r], count: o._.count + 1 } } : !e.includes(r) && l === "uri" ? (e.push(r), o = { ...o, [r]: { ...o[r], count: 1, img: i.image } }) : l === "uri" && r && (o = { ...o, [r]: { ...o[r], img: i.image, count: o[r].count + 1 } });
24
- } else if (d === "edges") {
25
- const i = n.data, { label: l } = i;
26
- s[l] ? s[l] = s[l] + 1 : s[l] = 1;
17
+ const l = {}, t = [];
18
+ return r.forEach((e) => {
19
+ var m;
20
+ const { group: c } = e;
21
+ if (c === "nodes") {
22
+ const d = e.data, n = (m = d.properties) == null ? void 0 : m.type, a = d.type;
23
+ !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 } });
24
+ } else if (c === "edges") {
25
+ const d = e.data, { label: n } = d;
26
+ l[n] ? l[n] = l[n] + 1 : l[n] = 1;
27
27
  } else
28
28
  console.log("nonono");
29
29
  }), {
30
- typeListArr: e,
30
+ typeListArr: t,
31
31
  typeListObj: o,
32
- relationListObj: s
32
+ relationListObj: l
33
33
  };
34
- }, ne = (c, { graphData: o = [], typeObj: s, zktype: e, graphInfo: n = {} }) => {
35
- let d = G(s);
36
- const a = Object.keys(s), i = n.searchNodes || [], l = new Set(
37
- (o == null ? void 0 : o.map((g) => {
38
- var t, m, u;
39
- return g.group === "nodes" ? (t = g.data) == null ? void 0 : t.id : ((m = g.data) == null ? void 0 : m.source) + "-" + ((u = g.data) == null ? void 0 : u.target);
34
+ }, ae = (r, { graphData: o = [], typeObj: l, zktype: t, graphInfo: e = {} }) => {
35
+ console.log(888, r);
36
+ let c = T(l);
37
+ const m = Object.keys(l), d = e.searchNodes || [], n = new Set(
38
+ (o == null ? void 0 : o.map((p) => {
39
+ var i, h, s;
40
+ 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);
40
41
  }).filter(Boolean)) || []
41
- ), { nodes: r = [], links: p = [] } = c || {}, y = [], x = (g) => {
42
- g.forEach((t) => {
43
- var m, u;
44
- if (!l.has(t.id)) {
45
- const C = (m = t.properties) == null ? void 0 : m.type, f = t.type, E = t.label.split("#").pop();
46
- let k = -1;
47
- if (!f && C === "uri")
48
- k = t.image || L[0];
49
- else if (!a.includes(f) && C === "uri") {
50
- a.push(f);
51
- const O = a.indexOf(f);
52
- k = t.image || L[O] || L[0], d = { ...d, [f]: { ...d[f], img: k } };
53
- } else C === "uri" && f ? k = (u = d[f]) == null ? void 0 : u.img : C === "typed-literal" && (k = B);
42
+ ), { nodes: a = [], links: u = [] } = r || {}, y = [], g = (p) => {
43
+ p.forEach((i) => {
44
+ var h, s;
45
+ if (!n.has(i.id)) {
46
+ const x = (h = i.properties) == null ? void 0 : h.type, f = i.type, N = i.label.split("#").pop();
47
+ let w = -1;
48
+ if (!f && x === "uri")
49
+ w = i.image || E[0];
50
+ else if (!m.includes(f) && x === "uri") {
51
+ m.push(f);
52
+ const O = m.indexOf(f);
53
+ w = i.image || E[O] || E[0], c = { ...c, [f]: { ...c[f], img: w } };
54
+ } else x === "uri" && f ? w = (s = c[f]) == null ? void 0 : s.img : x === "typed-literal" && (w = B);
54
55
  const S = {
55
- ...t,
56
- name: E,
57
- "properties-type": C,
58
- image: i.includes(E) ? U : k,
56
+ ...i,
57
+ name: N,
58
+ "properties-type": x,
59
+ image: d.includes(N) ? L : w,
59
60
  baseWidth: 80,
60
61
  // 保存基础宽度
61
62
  baseHeight: 80
@@ -65,147 +66,166 @@ const L = [j, I, P, $, D, J, N, R, q, A], T = (c) => {
65
66
  }
66
67
  });
67
68
  };
68
- ((g) => {
69
- g.forEach((t) => {
70
- const { label: m } = t, u = `${t.source}-${t.target}`;
71
- l.has(u) || y.push({ group: "edges", data: { ...t, name: m, zktype: e } });
69
+ ((p) => {
70
+ p.forEach((i) => {
71
+ const { label: h } = i, s = `${i.source}-${i.target}`;
72
+ n.has(s) || y.push({ group: "edges", data: { ...i, name: h, zktype: t } });
72
73
  });
73
- })(p), x(r);
74
- const { typeListObj: h, relationListObj: w } = T([...y, ...o]);
74
+ })(u), g(a);
75
+ const { typeListObj: k, relationListObj: C } = U([...y, ...o]);
75
76
  return {
76
77
  elements: y,
77
- typeListObj: h,
78
- relationListObj: w
78
+ typeListObj: k,
79
+ relationListObj: C
79
80
  };
80
- }, ae = (c, o) => {
81
- const s = c.current;
82
- if (!s) return;
83
- let e = {
81
+ }, se = (r, o) => {
82
+ const l = r.current;
83
+ if (!l) return;
84
+ let t = {
84
85
  color: "#000"
85
86
  };
86
87
  switch (o) {
87
88
  case "center":
88
- e = {
89
+ t = {
89
90
  "text-halign": "center",
90
91
  "text-valign": "center"
91
92
  // 'color': '#fff',
92
93
  };
93
94
  break;
94
95
  case "left":
95
- e = {
96
- ...e,
96
+ t = {
97
+ ...t,
97
98
  "text-halign": "left",
98
99
  "text-valign": "center",
99
100
  "text-margin-x": "-5px"
100
101
  };
101
102
  break;
102
103
  case "right":
103
- e = {
104
- ...e,
104
+ t = {
105
+ ...t,
105
106
  "text-halign": "right",
106
107
  "text-valign": "center",
107
108
  "text-margin-x": "5px"
108
109
  };
109
110
  break;
110
111
  case "top":
111
- e = {
112
- ...e,
112
+ t = {
113
+ ...t,
113
114
  "text-halign": "center",
114
115
  "text-valign": "top",
115
116
  "text-margin-y": "-5px"
116
117
  };
117
118
  break;
118
119
  case "bottom":
119
- e = {
120
- ...e,
120
+ t = {
121
+ ...t,
121
122
  "text-halign": "center",
122
123
  "text-valign": "bottom",
123
124
  "text-margin-y": "5px"
124
125
  };
125
126
  break;
126
127
  }
127
- s.nodes().style(e), s.style().update();
128
- }, se = async (c, { pathNodes: o, isGrayed: s = !0 }) => {
129
- const e = c.current;
128
+ l.nodes().style(t), l.style().update();
129
+ }, W = (r, o) => {
130
+ let l = r.collection(), t = r.collection();
131
+ o.forEach(({ source: e, target: c, label: m }) => {
132
+ 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();
133
+ d.length > 0 && n.length > 0 && d.forEach((a) => {
134
+ n.forEach((u) => {
135
+ let y = a.edgesWith(u).filter((g) => {
136
+ const b = g.data("source") === a.id() && g.data("target") === u.id(), k = m ? g.data("label") === m : !0;
137
+ return b && k;
138
+ });
139
+ t = t.union(y), l = l.union(a).union(u);
140
+ });
141
+ });
142
+ }), 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("未找到匹配的路径边!");
143
+ }, le = async (r, { pathNodes: o, isGrayed: l = !0, pathLinks: t }) => {
144
+ const e = r.current;
145
+ let c = [];
130
146
  if (!e)
131
147
  return;
132
- if ((o == null ? void 0 : o.length) < 2) {
148
+ if (e.nodes().removeClass("path-node").removeClass("grayed"), e.edges().removeClass("path-edge").removeClass("grayed"), (t == null ? void 0 : t.length) > 0) {
149
+ W(e, t);
150
+ return;
151
+ }
152
+ if (!((o == null ? void 0 : o.length) > 1)) {
133
153
  v.warning("请至少设置 2 个路径节点!");
134
154
  return;
135
155
  }
136
- if ([...new Set(o)].length !== o.length) {
156
+ 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) {
137
157
  v.warning("路径中存在重复节点,请检查!");
138
158
  return;
139
159
  }
140
160
  const d = [];
141
- for (const a of o) {
142
- const i = e.nodes().filter((l) => l.data("name") === a);
143
- if (i.length > 0)
144
- d.push(i.id());
161
+ for (const n of c) {
162
+ const a = e.nodes().filter((u) => u.data("name") === n);
163
+ if (a.length > 0)
164
+ d.push(a.id());
145
165
  else {
146
- e.nodes().removeClass("path-node"), e.edges().removeClass("path-edge"), v.warning(`找不到节点:${a}`);
166
+ e.nodes().removeClass("path-node"), e.edges().removeClass("path-edge"), v.warning(`找不到节点:${n}`);
147
167
  return;
148
168
  }
149
169
  }
150
170
  try {
151
171
  e.nodes().removeClass("path-node").removeClass("grayed"), e.edges().removeClass("path-edge").removeClass("grayed");
152
- let a = e.collection(), i = 0, l = !0;
153
- const r = [];
154
- for (let p = 0; p < d.length - 1; p++) {
155
- const y = d[p], x = d[p + 1], b = e.getElementById(y), h = e.getElementById(x), w = b.edgesWith(h).filter(function(t) {
156
- return t.data("source") === y && t.data("target") === x;
157
- }), g = h.edgesWith(b).filter(function(t) {
158
- return t.data("source") === x && t.data("target") === y;
172
+ let n = e.collection(), a = 0, u = !0;
173
+ const y = [];
174
+ for (let g = 0; g < d.length - 1; g++) {
175
+ const b = d[g], k = d[g + 1], C = e.getElementById(b), p = e.getElementById(k), i = C.edgesWith(p).filter(function(s) {
176
+ return s.data("source") === b && s.data("target") === k;
177
+ }), h = p.edgesWith(C).filter(function(s) {
178
+ return s.data("source") === k && s.data("target") === b;
159
179
  });
160
- if (w.length > 0 || g.length > 0) {
161
- const t = w.add(g);
162
- a = a.union(t).union(b).union(h), i += t.length, b.addClass("path-node"), h.addClass("path-node"), t.addClass("path-edge"), r.push(b.data("name"), h.data("name")), console.log(`找到直接连接的边:正向${w.length}条,反向${g.length}条`);
180
+ if (i.length > 0 || h.length > 0) {
181
+ const s = i.add(h);
182
+ 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}条`);
163
183
  } else {
164
- const t = e.elements().aStar({
165
- root: b,
166
- goal: h,
184
+ const s = e.elements().aStar({
185
+ root: C,
186
+ goal: p,
167
187
  directed: !1
168
188
  });
169
- if (t.found && t.path) {
170
- a = a.union(t.path), i += t.distance, t.path.nodes().addClass("path-node"), t.path.edges().addClass("path-edge");
171
- const m = t.path.nodes().map((u) => u.data("name"));
172
- r.push(...m);
189
+ if (s.found && s.path) {
190
+ n = n.union(s.path), a += s.distance, s.path.nodes().addClass("path-node"), s.path.edges().addClass("path-edge");
191
+ const x = s.path.nodes().map((f) => f.data("name"));
192
+ y.push(...x);
173
193
  } else {
174
- l = !1, console.log(`节点 ${o[p]} 和 ${o[p + 1]} 之间没有路径`);
194
+ u = !1, console.log(`节点 ${c[g]} 和 ${c[g + 1]} 之间没有路径`);
175
195
  break;
176
196
  }
177
197
  }
178
198
  }
179
- if (l && a.length > 0) {
180
- const p = a.nodes(), y = a.edges();
181
- p.addClass("path-node"), y.addClass("path-edge"), s && (e.nodes().not(p).addClass("grayed"), e.edges().not(y).addClass("grayed"));
199
+ if (u && n.length > 0) {
200
+ const g = n.nodes(), b = n.edges();
201
+ g.addClass("path-node"), b.addClass("path-edge"), l && (e.nodes().not(g).addClass("grayed"), e.edges().not(b).addClass("grayed"));
182
202
  } else
183
203
  v.warning("无法找到完整的路径!");
184
- } catch (a) {
185
- console.error(2e3, "计算路径时出错:", a), v.warning("计算路径时出错,请重试!");
204
+ } catch (n) {
205
+ console.error(2e3, "计算路径时出错:", n), v.warning("计算路径时出错,请重试!");
186
206
  }
187
- }, W = (c) => {
188
- const o = c.nodes().map((n) => ({
189
- data: n.data(),
190
- position: n.position(),
207
+ }, M = (r) => {
208
+ const o = r.nodes().map((e) => ({
209
+ data: e.data(),
210
+ position: e.position(),
191
211
  style: {
192
- width: n.style("width"),
193
- height: n.style("height"),
194
- backgroundColor: n.style("background-color")
212
+ width: e.style("width"),
213
+ height: e.style("height"),
214
+ backgroundColor: e.style("background-color")
195
215
  }
196
- })), s = c.edges().map((n) => ({
197
- data: n.data(),
216
+ })), l = r.edges().map((e) => ({
217
+ data: e.data(),
198
218
  style: {
199
- width: n.style("width"),
200
- "line-color": n.style("line-color"),
201
- "target-arrow-color": n.style("target-arrow-color")
219
+ width: e.style("width"),
220
+ "line-color": e.style("line-color"),
221
+ "target-arrow-color": e.style("target-arrow-color")
202
222
  }
203
223
  }));
204
- return { nodes: o, edges: s };
205
- }, le = (c) => {
206
- const o = W(c), s = new Blob([JSON.stringify(o, null, 2)], { type: "application/json" }), e = URL.createObjectURL(s), n = document.createElement("a");
207
- n.href = e, n.download = `graph-data-${Date.now()}.json`, n.click(), URL.revokeObjectURL(e);
208
- }, re = [
224
+ return { nodes: o, edges: l };
225
+ }, re = (r) => {
226
+ const o = M(r), l = new Blob([JSON.stringify(o, null, 2)], { type: "application/json" }), t = URL.createObjectURL(l), e = document.createElement("a");
227
+ e.href = t, e.download = `graph-data-${Date.now()}.json`, e.click(), URL.revokeObjectURL(t);
228
+ }, ie = [
209
229
  {
210
230
  label: "网络布局",
211
231
  key: "cose-bilkent"
@@ -230,7 +250,7 @@ const L = [j, I, P, $, D, J, N, R, q, A], T = (c) => {
230
250
  label: "同心圆布局",
231
251
  key: "concentric"
232
252
  }
233
- ], ie = [
253
+ ], ce = [
234
254
  {
235
255
  label: "查询节点",
236
256
  key: "query",
@@ -246,7 +266,7 @@ const L = [j, I, P, $, D, J, N, R, q, A], T = (c) => {
246
266
  key: "path",
247
267
  func: "pathAnalysis"
248
268
  }
249
- ], ce = [
269
+ ], de = [
250
270
  {
251
271
  label: "全选",
252
272
  key: "all"
@@ -263,7 +283,7 @@ const L = [j, I, P, $, D, J, N, R, q, A], T = (c) => {
263
283
  label: "框选模式",
264
284
  key: "box"
265
285
  }
266
- ], de = [
286
+ ], ge = [
267
287
  {
268
288
  label: "下载JSON",
269
289
  key: "downloadJson"
@@ -288,7 +308,7 @@ const L = [j, I, P, $, D, J, N, R, q, A], T = (c) => {
288
308
  label: "下载PNG",
289
309
  key: "downloadPng"
290
310
  }
291
- ], ge = [
311
+ ], pe = [
292
312
  {
293
313
  label: "居中",
294
314
  key: "center"
@@ -311,15 +331,15 @@ const L = [j, I, P, $, D, J, N, R, q, A], T = (c) => {
311
331
  }
312
332
  ];
313
333
  export {
314
- ce as choiceConfig,
315
- le as donwnGraphData,
316
- de as downloadData,
317
- W as getCyData,
318
- se as handleCalcPath,
319
- L as imageMap,
320
- re as layoutCongig,
321
- ie as linkAnalysis,
322
- ne as resDetailData,
323
- ae as textLayout,
324
- ge as textPositionConfig
334
+ de as choiceConfig,
335
+ re as donwnGraphData,
336
+ ge as downloadData,
337
+ M as getCyData,
338
+ le as handleCalcPath,
339
+ E as imageMap,
340
+ ie as layoutCongig,
341
+ ce as linkAnalysis,
342
+ ae as resDetailData,
343
+ se as textLayout,
344
+ pe as textPositionConfig
325
345
  };
@@ -5,9 +5,10 @@ export declare const resDetailData: (data: any, { graphData: graphData, typeObj,
5
5
  relationListObj: any;
6
6
  };
7
7
  export declare const textLayout: (cyRef: any, type: string) => any;
8
- export declare const handleCalcPath: (cyRef: any, { pathNodes, isGrayed }: {
8
+ export declare const handleCalcPath: (cyRef: any, { pathNodes, isGrayed, pathLinks }: {
9
9
  pathNodes: any;
10
10
  isGrayed?: boolean | undefined;
11
+ pathLinks: any;
11
12
  }) => Promise<void>;
12
13
  export declare const typeListFunc: (data?: never[]) => any[];
13
14
  export declare const getCyData: (cy: any) => {
package/lib/style.css CHANGED
@@ -1 +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: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}.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
+ .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}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-kggraph",
3
- "version": "0.0.27",
3
+ "version": "0.0.28",
4
4
  "description": "A knowledge graph visualization component based on Cytoscape",
5
5
  "type": "module",
6
6
  "main": "./lib/index.es.js",
package/lib/index.es40.js DELETED
@@ -1,21 +0,0 @@
1
- import { jsx as o, jsxs as r } from "react/jsx-runtime";
2
- import { Row as i, Col as p } from "antd";
3
- const d = ({ properties: t, excludedKeys: l = [] }) => {
4
- const s = t.filter(
5
- (e) => !l.includes(e.propertyKey)
6
- );
7
- return /* @__PURE__ */ o(i, { className: "property-section-wraper", children: s.map((e, a) => /* @__PURE__ */ r(p, { span: 24, className: "section-item", children: [
8
- /* @__PURE__ */ r("div", { className: "detail-label", children: [
9
- e.propertyKey,
10
- ":"
11
- ] }),
12
- /* @__PURE__ */ r("div", { className: "detail-value", children: [
13
- " ",
14
- e.propertyValue,
15
- " "
16
- ] })
17
- ] }, a)) });
18
- };
19
- export {
20
- d as default
21
- };
package/lib/index.es41.js DELETED
@@ -1,43 +0,0 @@
1
- import { jsx as s, jsxs as o } from "react/jsx-runtime";
2
- import { Space as d, Button as i } from "antd";
3
- import { downloadFile as x } from "./index.es12.js";
4
- const w = ({ documents: l, forceSingleColumn: c = !1, source: r }) => {
5
- const a = (e) => e.toLowerCase().endsWith(".pdf") ? /* @__PURE__ */ s("span", { className: "w-24px h-30px i-custom-pdf-doc inline-block" }) : e.toLowerCase().endsWith(".docx") || e.toLowerCase().endsWith(".doc") ? /* @__PURE__ */ s("span", { className: "w-24px h-30px i-custom-doc-doc inline-block" }) : e.toLowerCase().endsWith(".pptx") || e.toLowerCase().endsWith(".ppt") ? /* @__PURE__ */ s("span", { className: "w-24px h-30px i-custom-ppt-doc inline-block" }) : e.toLowerCase().endsWith(".txt") ? /* @__PURE__ */ s("span", { className: "w-24px h-30px i-custom-txt-doc inline-block" }) : e.toLowerCase().endsWith(".csv") ? /* @__PURE__ */ s("span", { className: "w-24px h-30px i-custom-csv-doc inline-block" }) : e.toLowerCase().endsWith(".xls") || e.toLowerCase().endsWith(".xlsx") ? /* @__PURE__ */ s("span", { className: "w-24px h-30px i-custom-xls-doc inline-block" }) : /* @__PURE__ */ s("span", { className: "w-24px h-30px i-custom-else-doc inline-block" }), p = (e) => {
6
- const n = e.split("/");
7
- return n[n.length - 1];
8
- };
9
- return /* @__PURE__ */ s("div", { className: r === "qa-card" ? "grid grid-cols-1" : `grid ${c ? "grid-cols-1 gap-y-5" : "grid-cols-1 md:grid-cols-2 gap-x-100px gap-y-10px"}`, children: l.map((e, n) => {
10
- const t = p(e.propertyValue);
11
- return /* @__PURE__ */ o("div", { className: "flex items-center justify-between transition-all", children: [
12
- /* @__PURE__ */ o("div", { className: "flex items-center min-w-0 flex-1", children: [
13
- /* @__PURE__ */ s("div", { className: "mr-3 text-xl flex-shrink-0", children: a(t) }),
14
- /* @__PURE__ */ s("div", { className: "min-w-0", children: /* @__PURE__ */ s("div", { className: "truncate", title: decodeURIComponent(t), children: decodeURIComponent(t) }) })
15
- ] }),
16
- /* @__PURE__ */ o(d, { className: "flex-shrink-0", children: [
17
- /* @__PURE__ */ s(
18
- i,
19
- {
20
- className: "px-0px",
21
- type: "link",
22
- onClick: () => window.open(e.propertyValue, "_blank"),
23
- children: "查看"
24
- }
25
- ),
26
- /* @__PURE__ */ s(
27
- i,
28
- {
29
- type: "link",
30
- className: "px-0px",
31
- onClick: () => {
32
- x(e.propertyValue, t);
33
- },
34
- children: "下载"
35
- }
36
- )
37
- ] })
38
- ] }, n);
39
- }) });
40
- };
41
- export {
42
- w as default
43
- };
package/lib/index.es42.js DELETED
@@ -1,42 +0,0 @@
1
- import { jsx as e } from "react/jsx-runtime";
2
- import { useRef as s } from "react";
3
- import { Image as t } from "antd";
4
- const m = ({ images: o, forceSingleColumn: i = !1, source: d = "" }) => (s(0), /* @__PURE__ */ e("div", { className: d === "qa-card" ? "grid grid-cols-1" : `grid ${i ? "grid-cols-1 gap-y-3" : "grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-20px"}`, children: /* @__PURE__ */ e(
5
- t.PreviewGroup,
6
- {
7
- preview: {
8
- // onVisibleChange: (visible) => {
9
- // if (visible) {
10
- // handlePreviewOpen();
11
- // } else {
12
- // handlePreviewClose();
13
- // }
14
- // },
15
- mask: !0,
16
- zIndex: 9999,
17
- getContainer: () => document.getElementById("root") || document.body
18
- },
19
- children: o.map((r, a) => /* @__PURE__ */ e("div", { className: "group rounded-lg overflow-hidden transition-shadow", children: /* @__PURE__ */ e("div", { className: "h-185px relative overflow-hidden", children: /* @__PURE__ */ e(
20
- t,
21
- {
22
- src: r.propertyValue,
23
- alt: r.propertyKey,
24
- style: {
25
- width: "100%",
26
- height: "185px",
27
- objectFit: "cover"
28
- // cover 保证图片充满容器,可能会裁剪
29
- // 或者使用 'contain' 保证图片完整显示,可能会有留白
30
- // objectFit: 'contain',
31
- },
32
- className: "transition-transform duration-300 group-hover:scale-105 rounded-6px",
33
- preview: {
34
- cover: /* @__PURE__ */ e("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ e("div", { className: "text-white text-14px", children: "点击查看" }) })
35
- }
36
- }
37
- ) }) }, a))
38
- }
39
- ) }));
40
- export {
41
- m as default
42
- };