1044 lines
37 KiB
JavaScript
1044 lines
37 KiB
JavaScript
/*
|
||
* Extracted from browser-delivered Turbopack chunk: fd0220e4d10052af.701bdafa2d.js
|
||
* Module id: 891180
|
||
* For reading/searching only; this factory depends on the original Turbopack runtime.
|
||
*/
|
||
|
||
const moduleFactory = (e) => {
|
||
"use strict";
|
||
var t = e.i(802913),
|
||
n = e.i(295903),
|
||
i = e.i(414356),
|
||
r = e.i(54936),
|
||
a = e.i(385951),
|
||
o = e.i(549997),
|
||
s = e.i(303665),
|
||
c = e.i(10357),
|
||
l = e.i(367656),
|
||
u = e.i(616439),
|
||
h = e.i(39676),
|
||
f = e.i(411664),
|
||
d = e.i(649517),
|
||
p = e.i(961258);
|
||
e.i(693558);
|
||
let g = {
|
||
custom: (0, o.wrapSelfVirtualizing)(n.default),
|
||
text: (0, o.wrapSelfVirtualizing)(l.default),
|
||
image: (0, o.wrapSelfVirtualizing)(r.default),
|
||
video: (0, o.wrapSelfVirtualizing)(d.default),
|
||
audio: (0, o.wrapSelfVirtualizing)(t.default),
|
||
temp: c.default,
|
||
group: (0, o.wrapSelfVirtualizing)(i.default),
|
||
script: (0, o.wrapSelfVirtualizing)(a.default),
|
||
storyboard: (0, o.wrapSelfVirtualizing)(a.default),
|
||
"video-story": (0, o.wrapSelfVirtualizing)(f.default),
|
||
video_group: (0, o.wrapSelfVirtualizing)(h.default),
|
||
"video-clip": (0, o.wrapSelfVirtualizing)(u.default),
|
||
"space-scene-720": (0, o.wrapSelfVirtualizing)(s.default),
|
||
};
|
||
e.s(["nodeTypes", 0, g], 272776);
|
||
var b = e.i(462214),
|
||
m = e.i(358379),
|
||
w = e.i(955595),
|
||
v = e.i(532527),
|
||
x = e.i(41671),
|
||
y = e.i(216257);
|
||
let _ = {
|
||
backgroundColor: "var(--canvas-controls-bg)",
|
||
border: "0.5px solid var(--canvas-controls-border)",
|
||
backdropFilter: "blur(8px)",
|
||
boxShadow: "0px 2px 5px rgba(0, 0, 0, 0.15)",
|
||
},
|
||
S = { backgroundColor: "#3b82f6", color: "#ffffff" },
|
||
E = (0, m.memo)(function ({
|
||
outlierNodes: e,
|
||
onNavigateToNode: t,
|
||
onDismiss: n,
|
||
}) {
|
||
let [i, r] = (0, m.useState)(0),
|
||
a = (0, y.useCanvasStore)((e) => e.nodes),
|
||
o = (0, m.useMemo)(() => {
|
||
let t = new Set(a.map((e) => e.id));
|
||
return e.filter((e) => t.has(e.id));
|
||
}, [e, a]),
|
||
s = o.length;
|
||
(0, m.useEffect)(() => {
|
||
0 === s && n();
|
||
}, [s, n]);
|
||
let c = i % s,
|
||
l = (0, m.useCallback)(() => {
|
||
0 === s || (t(o[c]), s > 1 && r((e) => (e + 1) % s));
|
||
}, [o, c, s, t]);
|
||
return (0, b.jsx)(w.AnimatePresence, {
|
||
children:
|
||
s > 0 &&
|
||
(0, b.jsxs)(v.motion.div, {
|
||
initial: { opacity: 0, y: 12 },
|
||
animate: { opacity: 1, y: 0 },
|
||
exit: { opacity: 0, y: 12 },
|
||
transition: { duration: 0.2 },
|
||
className:
|
||
"absolute bottom-4 left-1/2 z-20 flex -translate-x-1/2 items-center gap-3 rounded-full px-4 py-2.5",
|
||
style: _,
|
||
children: [
|
||
(0, b.jsxs)("span", {
|
||
className: "text-[13px] text-white",
|
||
children: ["有 ", s, " 个离群节点"],
|
||
}),
|
||
(0, b.jsx)("button", {
|
||
type: "button",
|
||
onClick: l,
|
||
className:
|
||
"shrink-0 rounded-full px-4 py-1.5 text-[13px] font-medium transition-opacity hover:opacity-90",
|
||
style: S,
|
||
children: 1 === s ? "定位节点" : `定位下一个 (${c + 1}/${s})`,
|
||
}),
|
||
(0, b.jsx)("button", {
|
||
type: "button",
|
||
onClick: n,
|
||
className:
|
||
"flex shrink-0 items-center justify-center rounded-full p-1 transition-colors hover:bg-white/10",
|
||
"aria-label": "关闭",
|
||
children: (0, b.jsx)(x.Icons.x, {
|
||
width: 14,
|
||
height: 14,
|
||
color: "rgba(255,255,255,0.6)",
|
||
}),
|
||
}),
|
||
],
|
||
}),
|
||
});
|
||
});
|
||
e.s(["default", 0, E], 140778);
|
||
var M = e.i(911872),
|
||
T = e.i(529833),
|
||
k = e.i(292002),
|
||
C = e.i(768924),
|
||
A = e.i(722573),
|
||
N = e.i(233038),
|
||
I = e.i(641153),
|
||
P = e.i(713118);
|
||
function R(e, t) {
|
||
let n = e,
|
||
i = new Set();
|
||
for (let e = 0; e < 256; e++) {
|
||
let e = t.get(n);
|
||
if (!e?.parentId || i.has(n)) break;
|
||
i.add(n), (n = e.parentId);
|
||
}
|
||
return n;
|
||
}
|
||
P.NODE_GAP;
|
||
let L = 1.5 * P.NODE_GAP;
|
||
function D(e) {
|
||
return Math.round(e / P.SNAP_GRID_SIZE) * P.SNAP_GRID_SIZE;
|
||
}
|
||
function j(e) {
|
||
return new Map(e.map((e) => [e.id, e]));
|
||
}
|
||
function O(e, t) {
|
||
let n = e,
|
||
i = new Set();
|
||
for (let e = 0; e < 256; e++) {
|
||
let e = t.get(n);
|
||
if (!e?.parentId || i.has(n)) break;
|
||
i.add(n), (n = e.parentId);
|
||
}
|
||
return n;
|
||
}
|
||
function F(e) {
|
||
let t = 1 / 0,
|
||
n = 1 / 0;
|
||
for (let i of e.values()) (t = Math.min(t, i.x)), (n = Math.min(n, i.y));
|
||
if (Number.isFinite(t) && Number.isFinite(n))
|
||
for (let i of e.values()) (i.x -= t), (i.y -= n);
|
||
}
|
||
let U = new I.default();
|
||
async function B(e, t) {
|
||
let n = e.filter((e) => !e.parentId);
|
||
if (n.length <= 1) return [];
|
||
let i = j(e),
|
||
r = (function (e, t) {
|
||
let n = e.filter((e) => !e.parentId);
|
||
if (0 === n.length) return [];
|
||
let i = new Map(e.map((e) => [e.id, e])),
|
||
r = new Set(n.map((e) => e.id)),
|
||
a = (function (e) {
|
||
let t = new Map();
|
||
for (let n of e) t.set(n, n);
|
||
let n = (e) => {
|
||
let n = e;
|
||
for (; t.get(n) !== n; ) n = t.get(n);
|
||
let i = e;
|
||
for (; t.get(i) !== n; ) {
|
||
let e = t.get(i);
|
||
t.set(i, n), (i = e);
|
||
}
|
||
return n;
|
||
};
|
||
return {
|
||
find: n,
|
||
union: (e, i) => {
|
||
let r = n(e),
|
||
a = n(i);
|
||
r !== a && t.set(r, a);
|
||
},
|
||
};
|
||
})([...r]);
|
||
for (let e of t) {
|
||
let t = R(e.source, i),
|
||
n = R(e.target, i);
|
||
t !== n && r.has(t) && r.has(n) && a.union(t, n);
|
||
}
|
||
let o = new Map();
|
||
for (let e of n) {
|
||
let t = a.find(e.id);
|
||
o.has(t) || o.set(t, []), o.get(t).push(e);
|
||
}
|
||
let s = [...o.values()].map(
|
||
(e) => (
|
||
e.sort((e, t) => {
|
||
let n = e.position.y - t.position.y;
|
||
return Math.abs(n) > 1 ? n : e.position.x - t.position.x;
|
||
}),
|
||
e
|
||
),
|
||
);
|
||
return (
|
||
s.sort((e, t) => {
|
||
let n = Math.min(...e.map((e) => e.position.y)),
|
||
i = Math.min(...t.map((e) => e.position.y));
|
||
return Math.abs(n - i) > 1
|
||
? n - i
|
||
: Math.min(...e.map((e) => e.position.x)) -
|
||
Math.min(...t.map((e) => e.position.x));
|
||
}),
|
||
s
|
||
);
|
||
})(e, t),
|
||
a = [];
|
||
for (let e of r) {
|
||
let n,
|
||
r = new Set(e.map((e) => e.id)),
|
||
o = e.map((e) => {
|
||
let { width: t, height: n } = (0, N.getNodeFlowSize)(e);
|
||
return { id: e.id, width: Math.max(1, t), height: Math.max(1, n) };
|
||
}),
|
||
s = new Set(),
|
||
c = [];
|
||
for (let e of t) {
|
||
let t = O(e.source, i),
|
||
n = O(e.target, i);
|
||
if (t === n || !r.has(t) || !r.has(n)) continue;
|
||
let a = `${t}->${n}`;
|
||
s.has(a) ||
|
||
(s.add(a),
|
||
c.push({ id: `e-${t}-${n}`, sources: [t], targets: [n] }));
|
||
}
|
||
let l = {
|
||
id: "root",
|
||
layoutOptions: {
|
||
"elk.algorithm": "layered",
|
||
"elk.direction": "RIGHT",
|
||
"elk.spacing.nodeNode": String(P.NODE_GAP),
|
||
"elk.layered.spacing.nodeNodeBetweenLayers": String(2 * P.NODE_GAP),
|
||
"elk.padding": "[ top=0, left=0, bottom=0, right=0 ]",
|
||
},
|
||
children: o,
|
||
edges: c,
|
||
};
|
||
try {
|
||
n = await U.layout(l);
|
||
} catch (e) {
|
||
console.error("[computeElkRootNodeUpdates] elk.layout failed", e);
|
||
continue;
|
||
}
|
||
let u = new Map();
|
||
for (let e of n.children ?? [])
|
||
e.id && u.set(e.id, { x: e.x ?? 0, y: e.y ?? 0 });
|
||
F(u);
|
||
let { w: h, h: f } = (function (e, t) {
|
||
let n = 0,
|
||
i = 0;
|
||
for (let [r, a] of e) {
|
||
let e = t.get(r);
|
||
if (!e) continue;
|
||
let { width: o, height: s } = (0, N.getNodeFlowSize)(e);
|
||
(n = Math.max(n, a.x + o)), (i = Math.max(i, a.y + s));
|
||
}
|
||
return { w: n, h: i };
|
||
})(u, i);
|
||
u.size > 0 && a.push({ pos: u, w: h, h: f });
|
||
}
|
||
let o = 1 / 0,
|
||
s = 1 / 0;
|
||
for (let e of n)
|
||
(o = Math.min(o, e.position.x)), (s = Math.min(s, e.position.y));
|
||
let c = D(o),
|
||
l = D(s),
|
||
u = [],
|
||
h = c,
|
||
f = l,
|
||
d = 0;
|
||
for (let e of a) {
|
||
for (let [t, n] of (h > c &&
|
||
h + e.w > c + 3200 &&
|
||
((f += d + L), (h = c), (d = 0)),
|
||
e.pos)) {
|
||
let e = i.get(t);
|
||
if (!e) continue;
|
||
let r = D(h + n.x),
|
||
a = D(f + n.y);
|
||
(Math.abs(r - e.position.x) > 0.5 ||
|
||
Math.abs(a - e.position.y) > 0.5) &&
|
||
u.push({ id: t, updates: { position: { x: r, y: a } } });
|
||
}
|
||
(h += e.w + L), (d = Math.max(d, e.h));
|
||
}
|
||
return u;
|
||
}
|
||
function H(e, t, n, i) {
|
||
let r = new Set(t.map((e) => e.id));
|
||
if (!r.has(e)) return new Set([e]);
|
||
let a = new Map();
|
||
for (let e of r) a.set(e, new Set());
|
||
for (let e of n) {
|
||
let t = O(e.source, i),
|
||
n = O(e.target, i);
|
||
t !== n && r.has(t) && r.has(n) && (a.get(t).add(n), a.get(n).add(t));
|
||
}
|
||
let o = new Set(),
|
||
s = [e];
|
||
for (o.add(e); s.length > 0; ) {
|
||
let e = s.pop();
|
||
for (let t of a.get(e) ?? []) o.has(t) || (o.add(t), s.push(t));
|
||
}
|
||
return o;
|
||
}
|
||
function z(e, t, n) {
|
||
let i = j(e),
|
||
r = e.filter((e) => !e.parentId),
|
||
a = O(n, i);
|
||
if (!r.some((e) => e.id === a)) return !1;
|
||
let o = H(a, r, t, i);
|
||
return r.filter((e) => o.has(e.id)).length >= 2;
|
||
}
|
||
async function G(e, t, n) {
|
||
let i,
|
||
r = j(e),
|
||
a = e.filter((e) => !e.parentId),
|
||
o = O(n, r);
|
||
if (!a.some((e) => e.id === o)) return { updates: [], focusRootIds: [] };
|
||
let s = H(o, a, t, r),
|
||
c = a.filter((e) => s.has(e.id));
|
||
if (0 === c.length) return { updates: [], focusRootIds: [] };
|
||
let l = new Set(c.map((e) => e.id)),
|
||
u = c.map((e) => {
|
||
let { width: t, height: n } = (0, N.getNodeFlowSize)(e);
|
||
return { id: e.id, width: Math.max(1, t), height: Math.max(1, n) };
|
||
}),
|
||
h = new Set(),
|
||
f = [];
|
||
for (let e of t) {
|
||
let t = O(e.source, r),
|
||
n = O(e.target, r);
|
||
if (t === n || !l.has(t) || !l.has(n)) continue;
|
||
let i = `${t}->${n}`;
|
||
h.has(i) ||
|
||
(h.add(i), f.push({ id: `e-${t}-${n}`, sources: [t], targets: [n] }));
|
||
}
|
||
let d = {
|
||
id: "root",
|
||
layoutOptions: {
|
||
"elk.algorithm": "layered",
|
||
"elk.direction": "RIGHT",
|
||
"elk.spacing.nodeNode": String(P.NODE_GAP),
|
||
"elk.layered.spacing.nodeNodeBetweenLayers": String(2 * P.NODE_GAP),
|
||
"elk.padding": "[ top=0, left=0, bottom=0, right=0 ]",
|
||
},
|
||
children: u,
|
||
edges: f,
|
||
};
|
||
try {
|
||
i = await U.layout(d);
|
||
} catch (e) {
|
||
return (
|
||
console.error(
|
||
"[computeElkSubgraphLayoutForSeedNode] elk.layout failed",
|
||
e,
|
||
),
|
||
{ updates: [], focusRootIds: Array.from(l) }
|
||
);
|
||
}
|
||
let p = new Map();
|
||
for (let e of i.children ?? [])
|
||
e.id && p.set(e.id, { x: e.x ?? 0, y: e.y ?? 0 });
|
||
F(p);
|
||
let g = 1 / 0,
|
||
b = 1 / 0;
|
||
for (let e of c)
|
||
(g = Math.min(g, e.position.x)), (b = Math.min(b, e.position.y));
|
||
(Number.isFinite(g) && Number.isFinite(b)) || ((g = 0), (b = 0));
|
||
let m = D(g),
|
||
w = D(b),
|
||
v = [];
|
||
for (let [e, t] of p) {
|
||
let n = r.get(e);
|
||
if (!n) continue;
|
||
let i = D(m + t.x),
|
||
a = D(w + t.y);
|
||
(Math.abs(i - n.position.x) > 0.5 ||
|
||
Math.abs(a - n.position.y) > 0.5) &&
|
||
v.push({ id: e, updates: { position: { x: i, y: a } } });
|
||
}
|
||
return { updates: v, focusRootIds: c.map((e) => e.id) };
|
||
}
|
||
function $(e) {
|
||
let t = {
|
||
mainClusterNodeIds: e.map((e) => e.id),
|
||
outlierNodes: [],
|
||
needsClustering: !1,
|
||
};
|
||
if (e.length <= 1) return t;
|
||
let n = e.map((e) => {
|
||
let t = e.measured?.width ?? e.width ?? 300,
|
||
n = e.measured?.height ?? e.height ?? 200;
|
||
return {
|
||
id: e.id,
|
||
cx: e.position.x + t / 2,
|
||
cy: e.position.y + n / 2,
|
||
};
|
||
}),
|
||
i = e.reduce(
|
||
(e, t) => {
|
||
let n = t.measured?.width ?? t.width ?? 300,
|
||
i = t.measured?.height ?? t.height ?? 200;
|
||
return {
|
||
minX: Math.min(e.minX, t.position.x),
|
||
minY: Math.min(e.minY, t.position.y),
|
||
maxX: Math.max(e.maxX, t.position.x + n),
|
||
maxY: Math.max(e.maxY, t.position.y + i),
|
||
};
|
||
},
|
||
{ minX: 1 / 0, minY: 1 / 0, maxX: -1 / 0, maxY: -1 / 0 },
|
||
),
|
||
r = i.maxX - i.minX,
|
||
a = i.maxY - i.minY;
|
||
if (
|
||
Math.min(window.innerWidth / (2 * r), window.innerHeight / (2 * a)) >=
|
||
p.CANVAS_ZOOM.min
|
||
)
|
||
return t;
|
||
let o =
|
||
0.8 *
|
||
Math.max(
|
||
window.innerWidth / p.CANVAS_ZOOM.min,
|
||
window.innerHeight / p.CANVAS_ZOOM.min,
|
||
),
|
||
s = new Map(),
|
||
c = (e) => {
|
||
let t = e;
|
||
for (; s.get(t) !== t; ) t = s.get(t);
|
||
let n = e;
|
||
for (; n !== t; ) {
|
||
let e = s.get(n);
|
||
s.set(n, t), (n = e);
|
||
}
|
||
return t;
|
||
},
|
||
l = (e, t) => {
|
||
let n = c(e),
|
||
i = c(t);
|
||
n !== i && s.set(n, i);
|
||
};
|
||
for (let e of n) s.set(e.id, e.id);
|
||
for (let e = 0; e < n.length; e++)
|
||
for (let t = e + 1; t < n.length; t++) {
|
||
let i = n[e].cx - n[t].cx,
|
||
r = n[e].cy - n[t].cy;
|
||
Math.abs(i) < o && Math.abs(r) < o && l(n[e].id, n[t].id);
|
||
}
|
||
let u = new Map(),
|
||
h = new Map(e.map((e) => [e.id, e]));
|
||
for (let e of n) {
|
||
let t = c(e.id);
|
||
u.has(t) ||
|
||
u.set(t, {
|
||
nodeIds: [],
|
||
minX: 1 / 0,
|
||
minY: 1 / 0,
|
||
maxX: -1 / 0,
|
||
maxY: -1 / 0,
|
||
});
|
||
let n = u.get(t);
|
||
n.nodeIds.push(e.id);
|
||
let i = h.get(e.id),
|
||
r = i.measured?.width ?? i.width ?? 300,
|
||
a = i.measured?.height ?? i.height ?? 200;
|
||
(n.minX = Math.min(n.minX, i.position.x)),
|
||
(n.minY = Math.min(n.minY, i.position.y)),
|
||
(n.maxX = Math.max(n.maxX, i.position.x + r)),
|
||
(n.maxY = Math.max(n.maxY, i.position.y + a));
|
||
}
|
||
let f = null;
|
||
for (let e of u.values())
|
||
(!f || e.nodeIds.length > f.nodeIds.length) && (f = e);
|
||
if (!f || u.size <= 1) return t;
|
||
let d = new Set(f.nodeIds),
|
||
g = new Map(n.map((e) => [e.id, e])),
|
||
b = e
|
||
.filter((e) => !d.has(e.id))
|
||
.map((e) => {
|
||
let t = g.get(e.id),
|
||
n = e.data,
|
||
i = n?.name || e.id.slice(0, 8);
|
||
return { id: e.id, name: i, cx: t.cx, cy: t.cy };
|
||
});
|
||
return {
|
||
mainClusterNodeIds: f.nodeIds,
|
||
outlierNodes: b,
|
||
needsClustering: !0,
|
||
};
|
||
}
|
||
e.s(
|
||
[
|
||
"computeElkRootNodeUpdates",
|
||
() => B,
|
||
"computeElkSubgraphLayoutForSeedNode",
|
||
() => G,
|
||
"isElkSubgraphLayoutApplicableForSeedNode",
|
||
() => z,
|
||
],
|
||
135088,
|
||
),
|
||
e.s(["clusterNodes", () => $], 302562);
|
||
var V = e.i(722851),
|
||
W = e.i(33725);
|
||
let K = "var(--canvas-controls-icon)",
|
||
q = {
|
||
backgroundColor: "var(--canvas-controls-bg)",
|
||
border: "0.5px solid var(--canvas-controls-border)",
|
||
backdropFilter: "blur(8px)",
|
||
boxShadow: "var(--canvas-shadow-panel)",
|
||
},
|
||
X = {
|
||
width: 150,
|
||
height: 110,
|
||
backgroundColor: "var(--canvas-minimap-bg)",
|
||
backdropFilter: "blur(16px)",
|
||
border: "0.5px solid var(--canvas-controls-border)",
|
||
boxShadow: "var(--canvas-shadow-dropdown)",
|
||
overflow: "hidden",
|
||
},
|
||
Y = {
|
||
position: "static",
|
||
width: 150,
|
||
height: 110,
|
||
margin: 0,
|
||
padding: 0,
|
||
backgroundColor: "transparent",
|
||
border: "none",
|
||
borderRadius: 12,
|
||
},
|
||
J = {
|
||
initial: { opacity: 0, height: 0 },
|
||
animate: { opacity: 1, height: "auto" },
|
||
exit: { opacity: 0, height: 0 },
|
||
transition: { duration: 0.25, ease: "easeInOut" },
|
||
},
|
||
Z = { width: 14, height: 14 },
|
||
Q = (e) => e.transform[2],
|
||
ee = (0, m.memo)(function ({
|
||
onOutlierDetected: e,
|
||
takeSnapshot: t,
|
||
} = {}) {
|
||
let {
|
||
zoomIn: n,
|
||
zoomOut: i,
|
||
zoomTo: r,
|
||
fitView: a,
|
||
setViewport: o,
|
||
getViewport: s,
|
||
} = (0, C.useReactFlow)(),
|
||
c = Math.round(100 * (0, C.useStore)(Q)),
|
||
[l, u] = (0, m.useState)(!1),
|
||
[h, f] = (0, m.useState)(!1),
|
||
[d, g] = (0, m.useState)(null),
|
||
_ = (0, m.useRef)(0),
|
||
S = (0, y.useCanvasStore)((e) => e.snapToGrid),
|
||
E = (0, y.useCanvasStore)((e) => e.setSnapToGrid),
|
||
I = (0, y.useCanvasStore)((e) => e.canvasLocked),
|
||
P = (0, y.useCanvasStore)((e) => e.isReadonly),
|
||
R = (0, y.useCanvasStore)((e) => e.isMarkMode),
|
||
L = (0, y.useCanvasStore)((e) => e.updateNodes),
|
||
D = (0, m.useCallback)(() => u((e) => !e), []),
|
||
j = (0, m.useCallback)(() => E(!S), [S, E]),
|
||
O = (0, m.useCallback)(() => {
|
||
I || i();
|
||
}, [i, I]),
|
||
F = (0, m.useCallback)(() => {
|
||
I || n();
|
||
}, [n, I]),
|
||
U = (0, m.useCallback)(() => {
|
||
if (I) return;
|
||
let t = $(y.stores.canvas?.nodes ?? []);
|
||
t.needsClustering
|
||
? (a({
|
||
duration: 300,
|
||
minZoom: p.CANVAS_ZOOM.min,
|
||
maxZoom: p.CANVAS_ZOOM.max,
|
||
nodes: t.mainClusterNodeIds.map((e) => ({ id: e })),
|
||
}),
|
||
e?.(t))
|
||
: (a({
|
||
duration: 300,
|
||
minZoom: p.CANVAS_ZOOM.min,
|
||
maxZoom: p.CANVAS_ZOOM.max,
|
||
}),
|
||
e?.(null));
|
||
}, [a, I, e]),
|
||
H = (0, m.useCallback)(() => {
|
||
if (I) return;
|
||
let t = y.stores.canvas?.nodes ?? [],
|
||
n = document.querySelector(".react-flow");
|
||
if (!n || 0 === t.length) return;
|
||
let { width: i, height: r } = n.getBoundingClientRect();
|
||
if (i <= 0 || r <= 0) return;
|
||
let a = (0, k.getNodesBounds)(t);
|
||
if (a.width <= 0 || a.height <= 0) return;
|
||
let { zoom: s } = (0, k.getViewportForBounds)(
|
||
a,
|
||
i,
|
||
r,
|
||
p.CANVAS_ZOOM.min,
|
||
p.CANVAS_ZOOM.max,
|
||
0.12,
|
||
);
|
||
o({ x: 48 - a.x * s, y: 48 - a.y * s, zoom: s }, { duration: 300 });
|
||
let c = $(t);
|
||
e?.(c.needsClustering ? c : null);
|
||
}, [I, o, e]),
|
||
z = (0, m.useCallback)(async () => {
|
||
if (I || P) return;
|
||
let e = y.stores.canvas?.nodes ?? [],
|
||
n = y.stores.canvas?.edges ?? [],
|
||
i = await B(e, n);
|
||
if (i.length > 0) {
|
||
let n = {},
|
||
r = new Map(e.map((e) => [e.id, e]));
|
||
for (let e of i) {
|
||
let t = r.get(e.id);
|
||
t && (n[e.id] = { ...t.position });
|
||
}
|
||
t?.(), L(i), g(n);
|
||
}
|
||
requestAnimationFrame(() => {
|
||
H();
|
||
});
|
||
}, [H, I, P, t, L]),
|
||
G = (0, m.useCallback)(() => {
|
||
g(null);
|
||
}, []),
|
||
ee = (0, m.useCallback)(() => {
|
||
if (!d) return;
|
||
let e = Object.entries(d).map(([e, t]) => ({
|
||
id: e,
|
||
updates: { position: t },
|
||
}));
|
||
t?.(),
|
||
L(e),
|
||
g(null),
|
||
requestAnimationFrame(() => {
|
||
H();
|
||
});
|
||
}, [H, d, t, L]);
|
||
(0, m.useEffect)(() => {
|
||
f((0, V.getIsMac)());
|
||
}, []),
|
||
(0, m.useEffect)(() => {
|
||
let e = (e) => {
|
||
e.repeat ||
|
||
(0, N.isInputElement)(e.target) ||
|
||
I ||
|
||
P ||
|
||
R ||
|
||
null !== d ||
|
||
!e.altKey ||
|
||
!e.shiftKey ||
|
||
e.ctrlKey ||
|
||
e.metaKey ||
|
||
("KeyF" === e.code &&
|
||
(e.preventDefault(), e.stopPropagation(), z()));
|
||
};
|
||
return (
|
||
window.addEventListener("keydown", e, !0),
|
||
() => window.removeEventListener("keydown", e, !0)
|
||
);
|
||
}, [z, I, R, P, d]);
|
||
let et = (0, m.useCallback)(
|
||
(e, t) => {
|
||
if (I) return;
|
||
cancelAnimationFrame(_.current);
|
||
let n = s(),
|
||
i = n.zoom,
|
||
r = document.querySelector(".react-flow");
|
||
if (!r) return;
|
||
let { width: a, height: c } = r.getBoundingClientRect(),
|
||
l = a / 2 - t.x * i,
|
||
u = c / 2 - t.y * i,
|
||
h = n.x,
|
||
f = n.y,
|
||
d = performance.now(),
|
||
p = (e) => {
|
||
let t = Math.min((e - d) / 300, 1),
|
||
n = t < 0.5 ? 2 * t * t : 1 - (-2 * t + 2) ** 2 / 2;
|
||
o({ x: h + (l - h) * n, y: f + (u - f) * n, zoom: i }),
|
||
t < 1 && (_.current = requestAnimationFrame(p));
|
||
};
|
||
_.current = requestAnimationFrame(p);
|
||
},
|
||
[s, o, I],
|
||
);
|
||
return (0, b.jsxs)("div", {
|
||
className: "flex flex-col items-start gap-1",
|
||
children: [
|
||
(0, b.jsx)(w.AnimatePresence, {
|
||
children:
|
||
l &&
|
||
(0, b.jsx)(v.motion.div, {
|
||
...J,
|
||
className: "overflow-hidden",
|
||
children: (0, b.jsx)("div", {
|
||
className: "rounded-xl",
|
||
style: X,
|
||
children: (0, b.jsx)(C.MiniMap, {
|
||
style: Y,
|
||
nodeColor: "var(--canvas-minimap-node)",
|
||
maskColor: "var(--canvas-minimap-mask)",
|
||
maskStrokeColor: "var(--canvas-minimap-mask-stroke)",
|
||
maskStrokeWidth: 1,
|
||
nodeBorderRadius: 2,
|
||
pannable: !I,
|
||
zoomable: !I,
|
||
onClick: et,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, b.jsxs)("div", {
|
||
className: "flex items-center gap-1 rounded-xl p-1.5",
|
||
style: q,
|
||
children: [
|
||
(0, b.jsxs)(T.Popover, {
|
||
position: "top",
|
||
offset: 8,
|
||
withinPortal: !0,
|
||
trapFocus: !0,
|
||
closeOnClickOutside: !1,
|
||
closeOnEscape: !0,
|
||
opened: null !== d,
|
||
onClose: G,
|
||
styles: {
|
||
dropdown: {
|
||
backgroundColor: "rgba(31, 31, 31, 0.95)",
|
||
backdropFilter: "blur(16px)",
|
||
WebkitBackdropFilter: "blur(16px)",
|
||
border: "1px solid rgba(255,255,255,0.1)",
|
||
borderRadius: "12px",
|
||
padding: "12px",
|
||
maxWidth: "260px",
|
||
boxShadow:
|
||
"0 8px 32px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3), inset 0 0 0 0.5px rgba(255,255,255,0.04)",
|
||
},
|
||
},
|
||
children: [
|
||
(0, b.jsx)(T.Popover.Target, {
|
||
children: (0, b.jsx)(A.Tooltip, {
|
||
label: (0, b.jsxs)("span", {
|
||
className: "inline-flex items-center gap-1",
|
||
children: [
|
||
(0, b.jsx)("span", { children: "整理画布" }),
|
||
(0, b.jsx)("span", {
|
||
className: "opacity-60",
|
||
children: h ? "⌥⇧F" : "Alt+Shift+F",
|
||
}),
|
||
],
|
||
}),
|
||
position: "top",
|
||
withArrow: !0,
|
||
disabled: null !== d,
|
||
children: (0, b.jsx)("button", {
|
||
onClick: () => {
|
||
z();
|
||
},
|
||
disabled: I || P,
|
||
className: `flex items-center justify-center rounded-lg transition-colors ${I || P ? "cursor-not-allowed opacity-50" : "hover:bg-white/10"}`,
|
||
style: { width: 28, height: 28 },
|
||
"aria-label": h
|
||
? "整理画布，Option+Shift+F"
|
||
: "整理画布，Alt+Shift+F",
|
||
type: "button",
|
||
children: (0, b.jsx)("span", {
|
||
className:
|
||
"flex items-center justify-center overflow-hidden",
|
||
style: Z,
|
||
children: (0, b.jsx)(x.Icons.Computing, {
|
||
width: 14,
|
||
height: 14,
|
||
color: K,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, b.jsxs)(T.Popover.Dropdown, {
|
||
onMouseDown: (e) => e.stopPropagation(),
|
||
children: [
|
||
(0, b.jsx)("p", {
|
||
className:
|
||
"mb-3 text-[13px] leading-snug text-white/90",
|
||
children: "是否保留此次整理结果？",
|
||
}),
|
||
(0, b.jsxs)("div", {
|
||
className: "flex justify-end gap-2",
|
||
children: [
|
||
(0, b.jsx)("button", {
|
||
type: "button",
|
||
className:
|
||
"rounded-lg px-3 py-1.5 text-[13px] text-white/80 transition-colors hover:bg-white/10",
|
||
onClick: ee,
|
||
children: "还原",
|
||
}),
|
||
(0, b.jsx)("button", {
|
||
type: "button",
|
||
className:
|
||
"rounded-lg bg-white/15 px-3 py-1.5 text-[13px] text-white transition-colors hover:bg-white/20",
|
||
onClick: G,
|
||
children: "保留",
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
(0, b.jsx)(W.CanvasTooltip, {
|
||
label: "画布小地图",
|
||
position: "top",
|
||
withArrow: !0,
|
||
children: (0, b.jsx)("button", {
|
||
onClick: D,
|
||
className: `flex items-center justify-center rounded-lg transition-colors ${l ? "bg-canvas-controls-active" : "hover:bg-canvas-controls-hover"}`,
|
||
style: { width: 28, height: 28 },
|
||
"aria-label": "切换小地图",
|
||
children: (0, b.jsx)("span", {
|
||
className:
|
||
"flex items-center justify-center overflow-hidden",
|
||
style: Z,
|
||
children: (0, b.jsx)(x.Icons.MapPinned, {
|
||
width: 13,
|
||
height: 13,
|
||
color: K,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, b.jsx)(W.CanvasTooltip, {
|
||
label: "网格吸附",
|
||
position: "top",
|
||
withArrow: !0,
|
||
children: (0, b.jsx)("button", {
|
||
onClick: () => {
|
||
j();
|
||
},
|
||
className: `flex items-center justify-center rounded-lg transition-colors ${S ? "bg-canvas-controls-active" : "hover:bg-canvas-controls-hover"}`,
|
||
style: { width: 28, height: 28 },
|
||
"aria-label": "网格吸附",
|
||
children: (0, b.jsx)("span", {
|
||
className:
|
||
"flex items-center justify-center overflow-hidden",
|
||
style: Z,
|
||
children: (0, b.jsx)(x.Icons.magnet, {
|
||
width: 14,
|
||
height: 14,
|
||
color: K,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, b.jsx)("button", {
|
||
onClick: () => {
|
||
O();
|
||
},
|
||
disabled: I,
|
||
className: `flex items-center justify-center rounded-lg transition-colors ${I ? "cursor-not-allowed opacity-50" : "hover:bg-canvas-controls-hover"}`,
|
||
style: { width: 28, height: 28 },
|
||
"aria-label": "缩小",
|
||
children: (0, b.jsx)("span", {
|
||
className:
|
||
"flex items-center justify-center overflow-hidden",
|
||
style: Z,
|
||
children: (0, b.jsx)(x.Icons.minus, {
|
||
width: 10,
|
||
height: 10,
|
||
color: K,
|
||
}),
|
||
}),
|
||
}),
|
||
(0, b.jsxs)(M.Menu, {
|
||
trigger: "click",
|
||
position: "top",
|
||
offset: 8,
|
||
shadow: "xl",
|
||
withinPortal: !0,
|
||
classNames: { item: "hover:bg-canvas-controls-hover" },
|
||
styles: {
|
||
dropdown: {
|
||
backgroundColor: "var(--canvas-controls-bg)",
|
||
backdropFilter: "blur(16px)",
|
||
WebkitBackdropFilter: "blur(16px)",
|
||
border: "0.5px solid var(--canvas-controls-border)",
|
||
borderRadius: "12px",
|
||
padding: "6px",
|
||
minWidth: "180px",
|
||
boxShadow: "var(--canvas-shadow-menu)",
|
||
},
|
||
item: {
|
||
borderRadius: "8px",
|
||
fontSize: "13px",
|
||
color: "var(--canvas-controls-text)",
|
||
padding: "8px 10px",
|
||
gap: "8px",
|
||
},
|
||
divider: {
|
||
borderColor: "var(--canvas-controls-border)",
|
||
margin: "4px",
|
||
},
|
||
},
|
||
children: [
|
||
(0, b.jsx)(M.Menu.Target, {
|
||
children: (0, b.jsxs)("button", {
|
||
className:
|
||
"hover:bg-canvas-controls-hover flex items-center justify-center rounded-lg px-1 text-[13px] leading-normal transition-colors",
|
||
style: {
|
||
height: 28,
|
||
color: "var(--canvas-controls-text)",
|
||
},
|
||
"aria-label": "缩放选项",
|
||
children: [c, "%"],
|
||
}),
|
||
}),
|
||
(0, b.jsxs)(M.Menu.Dropdown, {
|
||
children: [
|
||
(0, b.jsx)(M.Menu.Item, {
|
||
disabled: I,
|
||
onClick: () => {
|
||
F();
|
||
},
|
||
children: (0, b.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between",
|
||
children: [
|
||
(0, b.jsx)("span", { children: "放大" }),
|
||
(0, b.jsx)("span", {
|
||
className: "text-xs opacity-40",
|
||
children: "⌘ +",
|
||
}),
|
||
],
|
||
}),
|
||
}),
|
||
(0, b.jsx)(M.Menu.Item, {
|
||
disabled: I,
|
||
onClick: () => {
|
||
O();
|
||
},
|
||
children: (0, b.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between",
|
||
children: [
|
||
(0, b.jsx)("span", { children: "缩小" }),
|
||
(0, b.jsx)("span", {
|
||
className: "text-xs opacity-40",
|
||
children: "⌘ -",
|
||
}),
|
||
],
|
||
}),
|
||
}),
|
||
(0, b.jsx)(M.Menu.Item, {
|
||
disabled: I,
|
||
onClick: () => {
|
||
U();
|
||
},
|
||
children: (0, b.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between",
|
||
children: [
|
||
(0, b.jsx)("span", { children: "适合屏幕" }),
|
||
(0, b.jsx)("span", {
|
||
className: "text-xs opacity-40",
|
||
children: "⇧ 1",
|
||
}),
|
||
],
|
||
}),
|
||
}),
|
||
(0, b.jsx)(M.Menu.Divider, {}),
|
||
(0, b.jsx)(M.Menu.Item, {
|
||
disabled: I,
|
||
onClick: () => {
|
||
r(0.5, { duration: 300 });
|
||
},
|
||
children: (0, b.jsx)("span", {
|
||
children: "缩放至50%",
|
||
}),
|
||
}),
|
||
(0, b.jsx)(M.Menu.Item, {
|
||
disabled: I,
|
||
onClick: () => {
|
||
r(1, { duration: 300 });
|
||
},
|
||
children: (0, b.jsx)("span", {
|
||
children: "缩放至100%",
|
||
}),
|
||
}),
|
||
(0, b.jsx)(M.Menu.Item, {
|
||
disabled: I,
|
||
onClick: () => {
|
||
r(2, { duration: 300 });
|
||
},
|
||
children: (0, b.jsx)("span", {
|
||
children: "缩放至200%",
|
||
}),
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
(0, b.jsx)("button", {
|
||
onClick: () => {
|
||
F();
|
||
},
|
||
disabled: I,
|
||
className: `flex items-center justify-center rounded-lg transition-colors ${I ? "cursor-not-allowed opacity-50" : "hover:bg-canvas-controls-hover"}`,
|
||
style: { width: 28, height: 28 },
|
||
"aria-label": "放大",
|
||
children: (0, b.jsx)("span", {
|
||
className:
|
||
"flex items-center justify-center overflow-hidden",
|
||
style: Z,
|
||
children: (0, b.jsx)(x.Icons.plus, {
|
||
width: 10,
|
||
height: 10,
|
||
color: K,
|
||
}),
|
||
}),
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
});
|
||
});
|
||
e.s(["default", 0, ee], 891180);
|
||
};
|
||
|
||
export default moduleFactory;
|