@servantcdh/ez-planet-cosmos 0.2.1 → 0.2.5
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/dist/index.js +375 -403
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,61 +1,98 @@
|
|
|
1
|
-
import { jsxs as p, jsx as t, Fragment as
|
|
2
|
-
import { memo as
|
|
3
|
-
import { Handle as
|
|
4
|
-
import { motion as
|
|
5
|
-
import { Canvas as
|
|
6
|
-
import { Points as
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import { jsxs as p, jsx as t, Fragment as St } from "react/jsx-runtime";
|
|
2
|
+
import { memo as tt, useRef as et, useMemo as W, useState as H, useCallback as f, useEffect as it } from "react";
|
|
3
|
+
import { Handle as Z, Position as Q, getBezierPath as Bt, BaseEdge as Y, ReactFlowProvider as zt, useReactFlow as Lt, useNodesState as $t, useEdgesState as Mt, ReactFlow as Dt, Background as Ft, BackgroundVariant as Rt, Controls as Tt, MiniMap as Wt } from "@xyflow/react";
|
|
4
|
+
import { motion as B, AnimatePresence as A } from "framer-motion";
|
|
5
|
+
import { Canvas as At, useFrame as ot } from "@react-three/fiber";
|
|
6
|
+
import { Points as at, PointMaterial as nt } from "@react-three/drei";
|
|
7
|
+
const Ot = "cc-root-eSR-1", Et = "cc-layerStarField-jOb4M", Ht = "cc-layerReactFlow-CeHI9", _t = "cc-sidePanel-PzU72", Gt = "cc-sidePanelHeader-cWPCq", Jt = "cc-sidePanelTitle-Yfh5N", Ut = "cc-sidePanelPlanetIcon-aRuLt", Kt = "cc-sidePanelName-TFFeE", Vt = "cc-sidePanelSubtitle-8fp2Y", jt = "cc-sidePanelClose-Sdg-J", qt = "cc-sidePanelContent-QIEEQ", Xt = "cc-sidePanelFooter-DVOHi", Zt = "cc-satelliteList--vkXn", Qt = "cc-satelliteItem-JGdmG", Yt = "cc-satelliteIcon-arUe3", te = "cc-satelliteInfo-NaKLd", ee = "cc-satelliteName-zfOPN", ie = "cc-satelliteSummary-XARVm", oe = "cc-enterButton-5Vnri", ae = "cc-zoomTransition-Wcju8", ne = "cc-zoomPlanetLabel-3SJT2", re = "cc-planetInterior-GlnW1", le = "cc-interiorBackButton-qJAiZ", se = "cc-interiorCenter-xdKsX", ce = "cc-interiorPlanet--XIzf", de = "cc-interiorPlanetLabel-e7yxq", ue = "cc-interiorPlanetSubtitle-e2vON", me = "cc-orbitRing-hbvmD", pe = "cc-satelliteNode-01STS", he = "cc-satelliteNodeIcon-Xq45f", ye = "cc-satelliteNodeLabel-LLOJ5", ge = "cc-satelliteNodeBadge-HsUFp", be = "cc-tutorialOverlay-3GHo7", fe = "cc-tutorialWelcome-21KDP", ve = "cc-tutorialWelcomeTitle-7GwS9", Ne = "cc-tutorialWelcomeDesc--pznv", Pe = "cc-tutorialActions-szJ0-", we = "cc-tutorialButton-wL9-p", Ce = "cc-tutorialCard-LGIkK", xe = "cc-tutorialChip-bUoEb", ke = "cc-tutorialCardTitle-r2Y1I", Ie = "cc-tutorialCardDesc-nOS-M", Se = "cc-tutorialProgress-wIAT9", Be = "cc-tutorialProgressBar-PFBdE", ze = "cc-tutorialCardFooter-bSdyM", Le = "cc-tutorialDots-8M0QU", $e = "cc-tutorialDot-518t4", Me = "cc-planetBody-kF0Jj", De = "cc-planetBodyRunning-cmLi4", Fe = "cc-planetOrbitRing-v7fZR", Re = "cc-planetStatusDot--M-6s", Te = "cc-planetHint-QUWAw", We = "cc-topBarSlot-EJGvM", i = {
|
|
8
|
+
root: Ot,
|
|
9
|
+
layerStarField: Et,
|
|
10
|
+
layerReactFlow: Ht,
|
|
11
|
+
sidePanel: _t,
|
|
12
|
+
sidePanelHeader: Gt,
|
|
13
|
+
sidePanelTitle: Jt,
|
|
14
|
+
sidePanelPlanetIcon: Ut,
|
|
15
|
+
sidePanelName: Kt,
|
|
16
|
+
sidePanelSubtitle: Vt,
|
|
17
|
+
sidePanelClose: jt,
|
|
18
|
+
sidePanelContent: qt,
|
|
19
|
+
sidePanelFooter: Xt,
|
|
20
|
+
satelliteList: Zt,
|
|
21
|
+
satelliteItem: Qt,
|
|
22
|
+
satelliteIcon: Yt,
|
|
23
|
+
satelliteInfo: te,
|
|
24
|
+
satelliteName: ee,
|
|
25
|
+
satelliteSummary: ie,
|
|
26
|
+
enterButton: oe,
|
|
27
|
+
zoomTransition: ae,
|
|
28
|
+
zoomPlanetLabel: ne,
|
|
29
|
+
planetInterior: re,
|
|
30
|
+
interiorBackButton: le,
|
|
31
|
+
interiorCenter: se,
|
|
32
|
+
interiorPlanet: ce,
|
|
33
|
+
interiorPlanetLabel: de,
|
|
34
|
+
interiorPlanetSubtitle: ue,
|
|
35
|
+
orbitRing: me,
|
|
36
|
+
satelliteNode: pe,
|
|
37
|
+
satelliteNodeIcon: he,
|
|
38
|
+
satelliteNodeLabel: ye,
|
|
39
|
+
satelliteNodeBadge: ge,
|
|
40
|
+
tutorialOverlay: be,
|
|
41
|
+
tutorialWelcome: fe,
|
|
42
|
+
tutorialWelcomeTitle: ve,
|
|
43
|
+
tutorialWelcomeDesc: Ne,
|
|
44
|
+
tutorialActions: Pe,
|
|
45
|
+
tutorialButton: we,
|
|
46
|
+
tutorialCard: Ce,
|
|
47
|
+
tutorialChip: xe,
|
|
48
|
+
tutorialCardTitle: ke,
|
|
49
|
+
tutorialCardDesc: Ie,
|
|
50
|
+
tutorialProgress: Se,
|
|
51
|
+
tutorialProgressBar: Be,
|
|
52
|
+
tutorialCardFooter: ze,
|
|
53
|
+
tutorialDots: Le,
|
|
54
|
+
tutorialDot: $e,
|
|
55
|
+
planetBody: Me,
|
|
56
|
+
planetBodyRunning: De,
|
|
57
|
+
planetOrbitRing: Fe,
|
|
58
|
+
planetStatusDot: Re,
|
|
59
|
+
planetHint: Te,
|
|
60
|
+
topBarSlot: We
|
|
61
|
+
};
|
|
62
|
+
function Ae({ data: e }) {
|
|
63
|
+
const { label: h, subtitle: u, color: s, status: o, isSelected: n } = e, d = n ? 35 : o === "running" ? 30 : o === "error" ? 20 : 15, l = n ? 110 : 100;
|
|
9
64
|
return /* @__PURE__ */ p("div", { style: { position: "relative", cursor: "pointer" }, children: [
|
|
10
65
|
/* @__PURE__ */ t(
|
|
11
|
-
|
|
66
|
+
Z,
|
|
12
67
|
{
|
|
13
68
|
type: "target",
|
|
14
|
-
position:
|
|
15
|
-
style: { background:
|
|
69
|
+
position: Q.Left,
|
|
70
|
+
style: { background: s, border: "none", width: 8, height: 8, opacity: 0.6 }
|
|
16
71
|
}
|
|
17
72
|
),
|
|
18
73
|
n && /* @__PURE__ */ t(
|
|
19
|
-
|
|
74
|
+
"div",
|
|
20
75
|
{
|
|
21
|
-
|
|
22
|
-
animate: { scale: 1, opacity: 1, rotate: 360 },
|
|
23
|
-
transition: {
|
|
24
|
-
rotate: { duration: 20, repeat: 1 / 0, ease: "linear" },
|
|
25
|
-
scale: { duration: 0.3 }
|
|
26
|
-
},
|
|
76
|
+
className: i.planetOrbitRing,
|
|
27
77
|
style: {
|
|
28
|
-
position: "absolute",
|
|
29
78
|
top: -12,
|
|
30
79
|
left: -12,
|
|
31
|
-
width:
|
|
32
|
-
height:
|
|
33
|
-
|
|
34
|
-
border: `1.5px dashed ${l}88`,
|
|
35
|
-
pointerEvents: "none"
|
|
80
|
+
width: l + 24,
|
|
81
|
+
height: l + 24,
|
|
82
|
+
border: `1.5px dashed ${s}88`
|
|
36
83
|
}
|
|
37
84
|
}
|
|
38
85
|
),
|
|
39
86
|
/* @__PURE__ */ p(
|
|
40
|
-
|
|
87
|
+
"div",
|
|
41
88
|
{
|
|
42
|
-
|
|
43
|
-
transition: { duration: 3, repeat: 1 / 0, ease: "easeInOut" },
|
|
44
|
-
whileHover: {
|
|
45
|
-
boxShadow: `0 0 ${c + 15}px ${l}aa, inset 0 0 25px rgba(255,255,255,0.15)`
|
|
46
|
-
},
|
|
89
|
+
className: o === "running" ? i.planetBodyRunning : i.planetBody,
|
|
47
90
|
style: {
|
|
48
|
-
width:
|
|
49
|
-
height:
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
display: "flex",
|
|
54
|
-
flexDirection: "column",
|
|
55
|
-
alignItems: "center",
|
|
56
|
-
justifyContent: "center",
|
|
57
|
-
border: `2px solid ${n ? `${l}aa` : `${l}66`}`,
|
|
58
|
-
transition: "width 0.3s, height 0.3s, border-color 0.3s"
|
|
91
|
+
width: l,
|
|
92
|
+
height: l,
|
|
93
|
+
background: `radial-gradient(circle at 35% 35%, ${s}cc, ${s}44)`,
|
|
94
|
+
boxShadow: `0 0 ${d}px ${s}88, inset 0 0 20px rgba(255,255,255,0.1)`,
|
|
95
|
+
border: `2px solid ${n ? `${s}aa` : `${s}66`}`
|
|
59
96
|
},
|
|
60
97
|
children: [
|
|
61
98
|
/* @__PURE__ */ t(
|
|
@@ -76,101 +113,75 @@ function Ot({ data: e }) {
|
|
|
76
113
|
}
|
|
77
114
|
),
|
|
78
115
|
o !== "idle" && o !== "disabled" && /* @__PURE__ */ t(
|
|
79
|
-
|
|
116
|
+
"div",
|
|
80
117
|
{
|
|
81
|
-
|
|
82
|
-
transition: { duration: 1.5, repeat: 1 / 0 },
|
|
118
|
+
className: i.planetStatusDot,
|
|
83
119
|
style: {
|
|
84
|
-
|
|
85
|
-
top: -4,
|
|
86
|
-
right: -4,
|
|
87
|
-
width: 14,
|
|
88
|
-
height: 14,
|
|
89
|
-
borderRadius: "50%",
|
|
90
|
-
background: o === "running" ? "#2ecc71" : o === "error" ? "#e74c3c" : "#27ae60",
|
|
91
|
-
border: "2px solid rgba(0,0,0,0.4)"
|
|
120
|
+
background: o === "running" ? "#2ecc71" : o === "error" ? "#e74c3c" : "#27ae60"
|
|
92
121
|
}
|
|
93
122
|
}
|
|
94
123
|
),
|
|
95
|
-
n && /* @__PURE__ */ t(
|
|
96
|
-
w.div,
|
|
97
|
-
{
|
|
98
|
-
initial: { opacity: 0, y: 8 },
|
|
99
|
-
animate: { opacity: 0.5, y: 0 },
|
|
100
|
-
style: {
|
|
101
|
-
position: "absolute",
|
|
102
|
-
bottom: -22,
|
|
103
|
-
left: "50%",
|
|
104
|
-
transform: "translateX(-50%)",
|
|
105
|
-
fontSize: 9,
|
|
106
|
-
color: "#fff",
|
|
107
|
-
whiteSpace: "nowrap",
|
|
108
|
-
fontFamily: "monospace",
|
|
109
|
-
letterSpacing: 0.5
|
|
110
|
-
},
|
|
111
|
-
children: "double-click to enter"
|
|
112
|
-
}
|
|
113
|
-
),
|
|
124
|
+
n && /* @__PURE__ */ t("div", { className: i.planetHint, children: "double-click to enter" }),
|
|
114
125
|
/* @__PURE__ */ t(
|
|
115
|
-
|
|
126
|
+
Z,
|
|
116
127
|
{
|
|
117
128
|
type: "source",
|
|
118
|
-
position:
|
|
119
|
-
style: { background:
|
|
129
|
+
position: Q.Right,
|
|
130
|
+
style: { background: s, border: "none", width: 8, height: 8, opacity: 0.6 }
|
|
120
131
|
}
|
|
121
132
|
)
|
|
122
133
|
] });
|
|
123
134
|
}
|
|
124
|
-
const
|
|
125
|
-
function
|
|
135
|
+
const Oe = tt(Ae);
|
|
136
|
+
function Ee({
|
|
126
137
|
id: e,
|
|
127
138
|
sourceX: h,
|
|
128
139
|
sourceY: u,
|
|
129
|
-
targetX:
|
|
140
|
+
targetX: s,
|
|
130
141
|
targetY: o,
|
|
131
142
|
sourcePosition: n,
|
|
132
|
-
targetPosition:
|
|
133
|
-
data:
|
|
134
|
-
style:
|
|
143
|
+
targetPosition: d,
|
|
144
|
+
data: l,
|
|
145
|
+
style: b = {}
|
|
135
146
|
}) {
|
|
136
|
-
const [m] =
|
|
147
|
+
const [m] = Bt({
|
|
137
148
|
sourceX: h,
|
|
138
149
|
sourceY: u,
|
|
139
150
|
sourcePosition: n,
|
|
140
|
-
targetX:
|
|
151
|
+
targetX: s,
|
|
141
152
|
targetY: o,
|
|
142
|
-
targetPosition:
|
|
143
|
-
}),
|
|
144
|
-
return /* @__PURE__ */ p(
|
|
153
|
+
targetPosition: d
|
|
154
|
+
}), y = (l == null ? void 0 : l.isActive) ?? !1, w = (l == null ? void 0 : l.isDimmed) ?? !1, $ = y ? "rgba(46, 204, 113, 0.25)" : "rgba(100, 149, 237, 0.15)", z = y ? "rgba(46, 204, 113, 0.7)" : w ? "rgba(100, 149, 237, 0.12)" : "rgba(100, 149, 237, 0.4)", r = y ? 3 : 2, C = y ? "12 4" : "8 4";
|
|
155
|
+
return /* @__PURE__ */ p(St, { children: [
|
|
145
156
|
/* @__PURE__ */ t(
|
|
146
|
-
|
|
157
|
+
Y,
|
|
147
158
|
{
|
|
148
159
|
id: `${e}-glow`,
|
|
149
160
|
path: m,
|
|
150
161
|
style: {
|
|
151
|
-
stroke:
|
|
152
|
-
strokeWidth:
|
|
153
|
-
filter: `blur(${
|
|
162
|
+
stroke: $,
|
|
163
|
+
strokeWidth: y ? 10 : 6,
|
|
164
|
+
filter: `blur(${y ? 5 : 3}px)`,
|
|
154
165
|
transition: "stroke 0.6s, stroke-width 0.6s",
|
|
155
|
-
...
|
|
166
|
+
...b
|
|
156
167
|
}
|
|
157
168
|
}
|
|
158
169
|
),
|
|
159
170
|
/* @__PURE__ */ t(
|
|
160
|
-
|
|
171
|
+
Y,
|
|
161
172
|
{
|
|
162
173
|
id: e,
|
|
163
174
|
path: m,
|
|
164
175
|
style: {
|
|
165
|
-
stroke:
|
|
176
|
+
stroke: z,
|
|
166
177
|
strokeWidth: r,
|
|
167
|
-
strokeDasharray:
|
|
178
|
+
strokeDasharray: C,
|
|
168
179
|
transition: "stroke 0.6s, stroke-width 0.6s",
|
|
169
|
-
...
|
|
180
|
+
...b
|
|
170
181
|
}
|
|
171
182
|
}
|
|
172
183
|
),
|
|
173
|
-
(
|
|
184
|
+
(l == null ? void 0 : l.label) && /* @__PURE__ */ t("text", { children: /* @__PURE__ */ t(
|
|
174
185
|
"textPath",
|
|
175
186
|
{
|
|
176
187
|
href: `#${e}`,
|
|
@@ -181,23 +192,23 @@ function Gt({
|
|
|
181
192
|
fill: "rgba(255, 255, 255, 0.4)",
|
|
182
193
|
fontFamily: "monospace"
|
|
183
194
|
},
|
|
184
|
-
children:
|
|
195
|
+
children: l.label
|
|
185
196
|
}
|
|
186
197
|
) })
|
|
187
198
|
] });
|
|
188
199
|
}
|
|
189
|
-
const
|
|
190
|
-
function
|
|
191
|
-
const h =
|
|
200
|
+
const He = tt(Ee);
|
|
201
|
+
function _e({ config: e }) {
|
|
202
|
+
const h = et(null), u = e.starCount ?? 2e3, s = e.rotationSpeed ?? 0.02, o = W(() => {
|
|
192
203
|
const n = new Float32Array(u * 3);
|
|
193
|
-
for (let
|
|
194
|
-
n[
|
|
204
|
+
for (let d = 0; d < u; d++)
|
|
205
|
+
n[d * 3] = (Math.random() - 0.5) * 50, n[d * 3 + 1] = (Math.random() - 0.5) * 50, n[d * 3 + 2] = (Math.random() - 0.5) * 50;
|
|
195
206
|
return n;
|
|
196
207
|
}, [u]);
|
|
197
|
-
return
|
|
198
|
-
h.current && (h.current.rotation.x -=
|
|
199
|
-
}), /* @__PURE__ */ t(
|
|
200
|
-
|
|
208
|
+
return ot((n, d) => {
|
|
209
|
+
h.current && (h.current.rotation.x -= d * s, h.current.rotation.y -= d * (s * 0.5));
|
|
210
|
+
}), /* @__PURE__ */ t(at, { ref: h, positions: o, stride: 3, frustumCulled: !1, children: /* @__PURE__ */ t(
|
|
211
|
+
nt,
|
|
201
212
|
{
|
|
202
213
|
transparent: !0,
|
|
203
214
|
color: e.starColor ?? "#6495ed",
|
|
@@ -208,19 +219,19 @@ function Jt({ config: e }) {
|
|
|
208
219
|
}
|
|
209
220
|
) });
|
|
210
221
|
}
|
|
211
|
-
function
|
|
212
|
-
const h =
|
|
222
|
+
function Ge({ config: e }) {
|
|
223
|
+
const h = et(null), u = e.nebulaCount ?? 500, s = W(() => {
|
|
213
224
|
const o = new Float32Array(u * 3);
|
|
214
225
|
for (let n = 0; n < u; n++) {
|
|
215
|
-
const
|
|
216
|
-
o[n * 3] = Math.cos(
|
|
226
|
+
const d = Math.random() * Math.PI * 2, l = Math.random() * 8 + 5;
|
|
227
|
+
o[n * 3] = Math.cos(d) * l + (Math.random() - 0.5) * 3, o[n * 3 + 1] = (Math.random() - 0.5) * 4, o[n * 3 + 2] = Math.sin(d) * l + (Math.random() - 0.5) * 3 - 15;
|
|
217
228
|
}
|
|
218
229
|
return o;
|
|
219
230
|
}, [u]);
|
|
220
|
-
return
|
|
231
|
+
return ot((o, n) => {
|
|
221
232
|
h.current && (h.current.rotation.y += n * 5e-3);
|
|
222
|
-
}), /* @__PURE__ */ t(
|
|
223
|
-
|
|
233
|
+
}), /* @__PURE__ */ t(at, { ref: h, positions: s, stride: 3, frustumCulled: !1, children: /* @__PURE__ */ t(
|
|
234
|
+
nt,
|
|
224
235
|
{
|
|
225
236
|
transparent: !0,
|
|
226
237
|
color: e.nebulaColor ?? "#9b59b6",
|
|
@@ -231,80 +242,32 @@ function Kt({ config: e }) {
|
|
|
231
242
|
}
|
|
232
243
|
) });
|
|
233
244
|
}
|
|
234
|
-
function
|
|
245
|
+
function Je({ config: e = {}, background: h }) {
|
|
235
246
|
return /* @__PURE__ */ p(
|
|
236
|
-
|
|
247
|
+
At,
|
|
237
248
|
{
|
|
238
249
|
camera: { position: [0, 0, 15], fov: 60 },
|
|
250
|
+
dpr: [1, 1.5],
|
|
251
|
+
gl: { antialias: !1, powerPreference: "low-power" },
|
|
239
252
|
style: { background: h ?? "radial-gradient(ellipse at center, #0a0a2e 0%, #000008 100%)", pointerEvents: "none" },
|
|
240
253
|
events: () => ({ enabled: !1, priority: 0, compute: () => {
|
|
241
254
|
} }),
|
|
242
255
|
children: [
|
|
243
256
|
/* @__PURE__ */ t("ambientLight", { intensity: 0.1 }),
|
|
244
|
-
/* @__PURE__ */ t(
|
|
245
|
-
/* @__PURE__ */ t(
|
|
257
|
+
/* @__PURE__ */ t(_e, { config: e }),
|
|
258
|
+
/* @__PURE__ */ t(Ge, { config: e })
|
|
246
259
|
]
|
|
247
260
|
}
|
|
248
261
|
);
|
|
249
262
|
}
|
|
250
|
-
|
|
251
|
-
root: Vt,
|
|
252
|
-
layerStarField: jt,
|
|
253
|
-
layerReactFlow: Xt,
|
|
254
|
-
sidePanel: qt,
|
|
255
|
-
sidePanelHeader: Zt,
|
|
256
|
-
sidePanelTitle: Qt,
|
|
257
|
-
sidePanelPlanetIcon: Yt,
|
|
258
|
-
sidePanelName: te,
|
|
259
|
-
sidePanelSubtitle: ee,
|
|
260
|
-
sidePanelClose: ie,
|
|
261
|
-
sidePanelContent: oe,
|
|
262
|
-
sidePanelFooter: ae,
|
|
263
|
-
satelliteList: ne,
|
|
264
|
-
satelliteItem: re,
|
|
265
|
-
satelliteIcon: le,
|
|
266
|
-
satelliteInfo: se,
|
|
267
|
-
satelliteName: ce,
|
|
268
|
-
satelliteSummary: de,
|
|
269
|
-
enterButton: ue,
|
|
270
|
-
zoomTransition: me,
|
|
271
|
-
zoomPlanetLabel: pe,
|
|
272
|
-
planetInterior: he,
|
|
273
|
-
interiorBackButton: ye,
|
|
274
|
-
interiorCenter: be,
|
|
275
|
-
interiorPlanet: ge,
|
|
276
|
-
interiorPlanetLabel: fe,
|
|
277
|
-
interiorPlanetSubtitle: ve,
|
|
278
|
-
orbitRing: Ne,
|
|
279
|
-
satelliteNode: Pe,
|
|
280
|
-
satelliteNodeIcon: we,
|
|
281
|
-
satelliteNodeLabel: xe,
|
|
282
|
-
satelliteNodeBadge: Ce,
|
|
283
|
-
tutorialOverlay: Ie,
|
|
284
|
-
tutorialWelcome: ke,
|
|
285
|
-
tutorialWelcomeTitle: Se,
|
|
286
|
-
tutorialWelcomeDesc: Be,
|
|
287
|
-
tutorialActions: ze,
|
|
288
|
-
tutorialButton: $e,
|
|
289
|
-
tutorialCard: Le,
|
|
290
|
-
tutorialChip: Me,
|
|
291
|
-
tutorialCardTitle: Fe,
|
|
292
|
-
tutorialCardDesc: De,
|
|
293
|
-
tutorialProgress: Te,
|
|
294
|
-
tutorialProgressBar: We,
|
|
295
|
-
tutorialCardFooter: Ae,
|
|
296
|
-
tutorialDots: Re,
|
|
297
|
-
tutorialDot: Ee,
|
|
298
|
-
topBarSlot: Oe
|
|
299
|
-
};
|
|
300
|
-
function _e({
|
|
263
|
+
function Ue({
|
|
301
264
|
planet: e,
|
|
302
265
|
onClose: h,
|
|
303
266
|
onEnterPlanet: u,
|
|
304
|
-
onSatelliteClick:
|
|
267
|
+
onSatelliteClick: s
|
|
305
268
|
}) {
|
|
306
269
|
return /* @__PURE__ */ p(
|
|
307
|
-
|
|
270
|
+
B.div,
|
|
308
271
|
{
|
|
309
272
|
className: i.sidePanel,
|
|
310
273
|
initial: { x: 340 },
|
|
@@ -339,7 +302,7 @@ function _e({
|
|
|
339
302
|
"div",
|
|
340
303
|
{
|
|
341
304
|
className: i.satelliteItem,
|
|
342
|
-
onClick: () =>
|
|
305
|
+
onClick: () => s == null ? void 0 : s({
|
|
343
306
|
planetId: e.id,
|
|
344
307
|
satelliteId: o.id,
|
|
345
308
|
satellite: o
|
|
@@ -374,39 +337,39 @@ function _e({
|
|
|
374
337
|
}
|
|
375
338
|
);
|
|
376
339
|
}
|
|
377
|
-
function
|
|
340
|
+
function Ke({
|
|
378
341
|
planet: e,
|
|
379
342
|
onExit: h,
|
|
380
343
|
onSatelliteClick: u,
|
|
381
|
-
renderCustom:
|
|
344
|
+
renderCustom: s
|
|
382
345
|
}) {
|
|
383
|
-
const [o, n] =
|
|
384
|
-
if (
|
|
346
|
+
const [o, n] = H(null);
|
|
347
|
+
if (s)
|
|
385
348
|
return /* @__PURE__ */ t(
|
|
386
|
-
|
|
349
|
+
B.div,
|
|
387
350
|
{
|
|
388
351
|
className: i.planetInterior,
|
|
389
352
|
initial: { opacity: 0 },
|
|
390
353
|
animate: { opacity: 1 },
|
|
391
354
|
exit: { opacity: 0 },
|
|
392
355
|
transition: { duration: 0.4 },
|
|
393
|
-
children:
|
|
356
|
+
children: s(e, h)
|
|
394
357
|
}
|
|
395
358
|
);
|
|
396
|
-
const
|
|
359
|
+
const d = e.satellites, l = Math.max(180, d.length * 35), b = f(
|
|
397
360
|
(m) => {
|
|
398
361
|
n(m);
|
|
399
|
-
const
|
|
362
|
+
const y = d.find((w) => w.id === m);
|
|
400
363
|
u == null || u({
|
|
401
364
|
planetId: e.id,
|
|
402
365
|
satelliteId: m,
|
|
403
|
-
satellite:
|
|
366
|
+
satellite: y
|
|
404
367
|
});
|
|
405
368
|
},
|
|
406
|
-
[e.id,
|
|
369
|
+
[e.id, d, u]
|
|
407
370
|
);
|
|
408
371
|
return /* @__PURE__ */ p(
|
|
409
|
-
|
|
372
|
+
B.div,
|
|
410
373
|
{
|
|
411
374
|
className: i.planetInterior,
|
|
412
375
|
initial: { opacity: 0 },
|
|
@@ -421,10 +384,10 @@ function Ge({
|
|
|
421
384
|
{
|
|
422
385
|
className: i.orbitRing,
|
|
423
386
|
style: {
|
|
424
|
-
width:
|
|
425
|
-
height:
|
|
426
|
-
top: `calc(50% - ${
|
|
427
|
-
left: `calc(50% - ${
|
|
387
|
+
width: l * m * 0.7,
|
|
388
|
+
height: l * m * 0.7,
|
|
389
|
+
top: `calc(50% - ${l * m * 0.7 / 2}px)`,
|
|
390
|
+
left: `calc(50% - ${l * m * 0.7 / 2}px)`
|
|
428
391
|
}
|
|
429
392
|
},
|
|
430
393
|
m
|
|
@@ -443,11 +406,11 @@ function Ge({
|
|
|
443
406
|
]
|
|
444
407
|
}
|
|
445
408
|
),
|
|
446
|
-
/* @__PURE__ */ t(
|
|
409
|
+
/* @__PURE__ */ t(A, { children: d.map((m, y) => {
|
|
447
410
|
var r;
|
|
448
|
-
const
|
|
411
|
+
const w = y / d.length * Math.PI * 2 - Math.PI / 2, $ = Math.cos(w) * l, z = Math.sin(w) * l;
|
|
449
412
|
return /* @__PURE__ */ p(
|
|
450
|
-
|
|
413
|
+
B.div,
|
|
451
414
|
{
|
|
452
415
|
className: i.satelliteNode,
|
|
453
416
|
initial: { scale: 0, opacity: 0 },
|
|
@@ -456,13 +419,13 @@ function Ge({
|
|
|
456
419
|
type: "spring",
|
|
457
420
|
damping: 15,
|
|
458
421
|
stiffness: 200,
|
|
459
|
-
delay:
|
|
422
|
+
delay: y * 0.08
|
|
460
423
|
},
|
|
461
424
|
style: {
|
|
462
|
-
left: `calc(50% + ${
|
|
463
|
-
top: `calc(50% + ${
|
|
425
|
+
left: `calc(50% + ${$}px - 32px)`,
|
|
426
|
+
top: `calc(50% + ${z}px - 40px)`
|
|
464
427
|
},
|
|
465
|
-
onClick: () =>
|
|
428
|
+
onClick: () => b(m.id),
|
|
466
429
|
children: [
|
|
467
430
|
/* @__PURE__ */ p(
|
|
468
431
|
"div",
|
|
@@ -489,9 +452,9 @@ function Ge({
|
|
|
489
452
|
}
|
|
490
453
|
);
|
|
491
454
|
}
|
|
492
|
-
function
|
|
455
|
+
function Ve({ planet: e }) {
|
|
493
456
|
return /* @__PURE__ */ t(
|
|
494
|
-
|
|
457
|
+
B.div,
|
|
495
458
|
{
|
|
496
459
|
className: i.zoomTransition,
|
|
497
460
|
initial: { opacity: 0 },
|
|
@@ -499,7 +462,7 @@ function He({ planet: e }) {
|
|
|
499
462
|
exit: { opacity: 0 },
|
|
500
463
|
transition: { duration: 0.9, ease: "easeInOut" },
|
|
501
464
|
children: /* @__PURE__ */ t(
|
|
502
|
-
|
|
465
|
+
B.span,
|
|
503
466
|
{
|
|
504
467
|
className: i.zoomPlanetLabel,
|
|
505
468
|
initial: { scale: 0.5, opacity: 0 },
|
|
@@ -516,46 +479,48 @@ function He({ planet: e }) {
|
|
|
516
479
|
}
|
|
517
480
|
);
|
|
518
481
|
}
|
|
519
|
-
function
|
|
482
|
+
function je({
|
|
520
483
|
steps: e,
|
|
521
484
|
planets: h,
|
|
522
485
|
onHighlightPlanet: u,
|
|
523
|
-
onStepChange:
|
|
486
|
+
onStepChange: s,
|
|
524
487
|
onFinish: o,
|
|
525
488
|
flyTo: n
|
|
526
489
|
}) {
|
|
527
|
-
const [
|
|
528
|
-
(
|
|
529
|
-
if (
|
|
530
|
-
m(
|
|
531
|
-
const
|
|
532
|
-
if (
|
|
533
|
-
u(
|
|
534
|
-
const O = h.find((
|
|
535
|
-
O && n &&
|
|
490
|
+
const [d, l] = H("welcome"), [b, m] = H(0), y = f(
|
|
491
|
+
(k) => {
|
|
492
|
+
if (k < 0 || k >= e.length) return;
|
|
493
|
+
m(k), s(k);
|
|
494
|
+
const N = e[k];
|
|
495
|
+
if (N.planetId) {
|
|
496
|
+
u(N.planetId);
|
|
497
|
+
const O = h.find((P) => P.id === N.planetId);
|
|
498
|
+
O && n && requestAnimationFrame(() => {
|
|
499
|
+
n(O.x + 50, O.y + 50, 1.5, 800);
|
|
500
|
+
});
|
|
536
501
|
}
|
|
537
502
|
},
|
|
538
|
-
[e, h,
|
|
539
|
-
),
|
|
540
|
-
|
|
541
|
-
}, [
|
|
542
|
-
|
|
543
|
-
}, [
|
|
544
|
-
|
|
545
|
-
}, [
|
|
546
|
-
|
|
547
|
-
}, [
|
|
548
|
-
|
|
549
|
-
if (
|
|
550
|
-
const
|
|
551
|
-
|
|
503
|
+
[e, h, s, u, n]
|
|
504
|
+
), w = f(() => {
|
|
505
|
+
l("stepping"), y(0);
|
|
506
|
+
}, [y]), $ = f(() => {
|
|
507
|
+
b < e.length - 1 ? y(b + 1) : (l("complete"), s(-1), u(null), n == null || n(800, 400, 0.8, 600), setTimeout(() => o(), 1500));
|
|
508
|
+
}, [b, e.length, y, s, u, o, n]), z = f(() => {
|
|
509
|
+
b > 0 && y(b - 1);
|
|
510
|
+
}, [b, y]), r = f(() => {
|
|
511
|
+
s(-1), u(null), n == null || n(800, 400, 0.8, 600), o();
|
|
512
|
+
}, [s, u, o, n]);
|
|
513
|
+
it(() => {
|
|
514
|
+
if (d !== "stepping") return;
|
|
515
|
+
const k = (N) => {
|
|
516
|
+
N.key === "ArrowRight" || N.key === "Enter" ? $() : N.key === "ArrowLeft" ? z() : N.key === "Escape" && r();
|
|
552
517
|
};
|
|
553
|
-
return window.addEventListener("keydown",
|
|
554
|
-
}, [
|
|
555
|
-
const
|
|
556
|
-
return /* @__PURE__ */ p(
|
|
557
|
-
|
|
558
|
-
|
|
518
|
+
return window.addEventListener("keydown", k), () => window.removeEventListener("keydown", k);
|
|
519
|
+
}, [d, $, z, r]);
|
|
520
|
+
const C = e[b], _ = e.length > 0 ? (b + 1) / e.length * 100 : 0;
|
|
521
|
+
return /* @__PURE__ */ p(A, { mode: "wait", children: [
|
|
522
|
+
d === "welcome" && /* @__PURE__ */ t(
|
|
523
|
+
B.div,
|
|
559
524
|
{
|
|
560
525
|
className: i.tutorialOverlay,
|
|
561
526
|
initial: { opacity: 0 },
|
|
@@ -563,7 +528,7 @@ function Je({
|
|
|
563
528
|
exit: { opacity: 0 },
|
|
564
529
|
children: /* @__PURE__ */ p("div", { className: i.tutorialWelcome, children: [
|
|
565
530
|
/* @__PURE__ */ t(
|
|
566
|
-
|
|
531
|
+
B.div,
|
|
567
532
|
{
|
|
568
533
|
initial: { scale: 0.8 },
|
|
569
534
|
animate: { scale: 1 },
|
|
@@ -589,7 +554,7 @@ function Je({
|
|
|
589
554
|
{
|
|
590
555
|
className: i.tutorialButton,
|
|
591
556
|
"data-variant": "primary",
|
|
592
|
-
onClick:
|
|
557
|
+
onClick: w,
|
|
593
558
|
children: "LET'S GO"
|
|
594
559
|
}
|
|
595
560
|
)
|
|
@@ -598,8 +563,8 @@ function Je({
|
|
|
598
563
|
},
|
|
599
564
|
"welcome"
|
|
600
565
|
),
|
|
601
|
-
|
|
602
|
-
|
|
566
|
+
d === "stepping" && C && /* @__PURE__ */ p(
|
|
567
|
+
B.div,
|
|
603
568
|
{
|
|
604
569
|
className: i.tutorialCard,
|
|
605
570
|
initial: { opacity: 0, y: 20 },
|
|
@@ -607,24 +572,24 @@ function Je({
|
|
|
607
572
|
exit: { opacity: 0, y: -10 },
|
|
608
573
|
transition: { duration: 0.25 },
|
|
609
574
|
children: [
|
|
610
|
-
|
|
575
|
+
C.chipText && /* @__PURE__ */ t(
|
|
611
576
|
"span",
|
|
612
577
|
{
|
|
613
578
|
className: i.tutorialChip,
|
|
614
579
|
style: {
|
|
615
|
-
background: `${
|
|
616
|
-
color:
|
|
580
|
+
background: `${C.chipColor ?? "#3b82f6"}22`,
|
|
581
|
+
color: C.chipColor ?? "#3b82f6"
|
|
617
582
|
},
|
|
618
|
-
children:
|
|
583
|
+
children: C.chipText
|
|
619
584
|
}
|
|
620
585
|
),
|
|
621
|
-
/* @__PURE__ */ t("h3", { className: i.tutorialCardTitle, children:
|
|
622
|
-
/* @__PURE__ */ t("p", { className: i.tutorialCardDesc, children:
|
|
586
|
+
/* @__PURE__ */ t("h3", { className: i.tutorialCardTitle, children: C.title }),
|
|
587
|
+
/* @__PURE__ */ t("p", { className: i.tutorialCardDesc, children: C.description }),
|
|
623
588
|
/* @__PURE__ */ t("div", { className: i.tutorialProgress, children: /* @__PURE__ */ t(
|
|
624
589
|
"div",
|
|
625
590
|
{
|
|
626
591
|
className: i.tutorialProgressBar,
|
|
627
|
-
style: { width: `${
|
|
592
|
+
style: { width: `${_}%` }
|
|
628
593
|
}
|
|
629
594
|
) }),
|
|
630
595
|
/* @__PURE__ */ p("div", { className: i.tutorialCardFooter, children: [
|
|
@@ -638,24 +603,24 @@ function Je({
|
|
|
638
603
|
children: "SKIP"
|
|
639
604
|
}
|
|
640
605
|
),
|
|
641
|
-
/* @__PURE__ */ t("div", { className: i.tutorialDots, children: e.map((
|
|
606
|
+
/* @__PURE__ */ t("div", { className: i.tutorialDots, children: e.map((k, N) => /* @__PURE__ */ t(
|
|
642
607
|
"div",
|
|
643
608
|
{
|
|
644
609
|
className: i.tutorialDot,
|
|
645
|
-
"data-active":
|
|
646
|
-
"data-done":
|
|
647
|
-
onClick: () =>
|
|
610
|
+
"data-active": N === b || void 0,
|
|
611
|
+
"data-done": N < b || void 0,
|
|
612
|
+
onClick: () => y(N)
|
|
648
613
|
},
|
|
649
|
-
|
|
614
|
+
N
|
|
650
615
|
)) }),
|
|
651
616
|
/* @__PURE__ */ p("div", { style: { display: "flex", gap: "0.5rem" }, children: [
|
|
652
|
-
|
|
617
|
+
b > 0 && /* @__PURE__ */ t(
|
|
653
618
|
"button",
|
|
654
619
|
{
|
|
655
620
|
className: i.tutorialButton,
|
|
656
621
|
"data-variant": "ghost",
|
|
657
622
|
style: { padding: "0.375rem 0.75rem", fontSize: "0.75rem" },
|
|
658
|
-
onClick:
|
|
623
|
+
onClick: z,
|
|
659
624
|
children: "←"
|
|
660
625
|
}
|
|
661
626
|
),
|
|
@@ -665,18 +630,18 @@ function Je({
|
|
|
665
630
|
className: i.tutorialButton,
|
|
666
631
|
"data-variant": "primary",
|
|
667
632
|
style: { padding: "0.375rem 0.75rem", fontSize: "0.75rem" },
|
|
668
|
-
onClick:
|
|
669
|
-
children:
|
|
633
|
+
onClick: $,
|
|
634
|
+
children: b === e.length - 1 ? "Finish" : "→"
|
|
670
635
|
}
|
|
671
636
|
)
|
|
672
637
|
] })
|
|
673
638
|
] })
|
|
674
639
|
]
|
|
675
640
|
},
|
|
676
|
-
`step-${
|
|
641
|
+
`step-${b}`
|
|
677
642
|
),
|
|
678
|
-
|
|
679
|
-
|
|
643
|
+
d === "complete" && /* @__PURE__ */ t(
|
|
644
|
+
B.div,
|
|
680
645
|
{
|
|
681
646
|
className: i.tutorialOverlay,
|
|
682
647
|
initial: { opacity: 0 },
|
|
@@ -684,7 +649,7 @@ function Je({
|
|
|
684
649
|
exit: { opacity: 0 },
|
|
685
650
|
transition: { duration: 1 },
|
|
686
651
|
children: /* @__PURE__ */ t(
|
|
687
|
-
|
|
652
|
+
B.h1,
|
|
688
653
|
{
|
|
689
654
|
className: i.tutorialWelcomeTitle,
|
|
690
655
|
initial: { scale: 0.8 },
|
|
@@ -698,38 +663,38 @@ function Je({
|
|
|
698
663
|
)
|
|
699
664
|
] });
|
|
700
665
|
}
|
|
701
|
-
const
|
|
702
|
-
function
|
|
666
|
+
const qe = { planet: Oe }, Xe = { orbit: He };
|
|
667
|
+
function Ze({
|
|
703
668
|
planets: e,
|
|
704
669
|
orbits: h,
|
|
705
670
|
onPlanetClick: u,
|
|
706
|
-
onPlanetEnter:
|
|
671
|
+
onPlanetEnter: s,
|
|
707
672
|
onPlanetExit: o,
|
|
708
673
|
onSatelliteClick: n,
|
|
709
|
-
onPlanetDrag:
|
|
710
|
-
tutorialSteps:
|
|
711
|
-
showTutorial:
|
|
674
|
+
onPlanetDrag: d,
|
|
675
|
+
tutorialSteps: l,
|
|
676
|
+
showTutorial: b,
|
|
712
677
|
onTutorialComplete: m,
|
|
713
|
-
initialView:
|
|
714
|
-
onViewChange:
|
|
715
|
-
renderPlanetInterior:
|
|
716
|
-
topBar:
|
|
678
|
+
initialView: y,
|
|
679
|
+
onViewChange: w,
|
|
680
|
+
renderPlanetInterior: $,
|
|
681
|
+
topBar: z,
|
|
717
682
|
theme: r,
|
|
718
|
-
starField:
|
|
719
|
-
nodeTypes:
|
|
720
|
-
edgeTypes:
|
|
721
|
-
className:
|
|
683
|
+
starField: C = !0,
|
|
684
|
+
nodeTypes: _,
|
|
685
|
+
edgeTypes: k,
|
|
686
|
+
className: N,
|
|
722
687
|
style: O
|
|
723
688
|
}) {
|
|
724
|
-
const [
|
|
689
|
+
const [P, rt] = H(y ?? { mode: "universe" }), [G, lt] = H(b ?? !1), { setCenter: x, fitView: J } = Lt(), I = f(
|
|
725
690
|
(a) => {
|
|
726
|
-
|
|
691
|
+
rt(a), w == null || w(a);
|
|
727
692
|
},
|
|
728
|
-
[
|
|
729
|
-
),
|
|
730
|
-
(a) => e.find((
|
|
693
|
+
[w]
|
|
694
|
+
), E = f(
|
|
695
|
+
(a) => e.find((c) => c.id === a),
|
|
731
696
|
[e]
|
|
732
|
-
),
|
|
697
|
+
), st = W(
|
|
733
698
|
() => e.map((a) => ({
|
|
734
699
|
id: a.id,
|
|
735
700
|
type: "planet",
|
|
@@ -743,9 +708,9 @@ function Ve({
|
|
|
743
708
|
}
|
|
744
709
|
})),
|
|
745
710
|
[e]
|
|
746
|
-
),
|
|
747
|
-
() => h.map((a,
|
|
748
|
-
id: `orbit-${
|
|
711
|
+
), ct = W(
|
|
712
|
+
() => h.map((a, c) => ({
|
|
713
|
+
id: `orbit-${c}`,
|
|
749
714
|
source: a.source,
|
|
750
715
|
target: a.target,
|
|
751
716
|
type: "orbit",
|
|
@@ -753,134 +718,139 @@ function Ve({
|
|
|
753
718
|
animated: !0
|
|
754
719
|
})),
|
|
755
720
|
[h]
|
|
756
|
-
), [
|
|
721
|
+
), [K, M, dt] = $t(st), [ut, V, mt] = Mt(ct), L = f(
|
|
757
722
|
(a) => {
|
|
758
|
-
|
|
759
|
-
(
|
|
723
|
+
M(
|
|
724
|
+
(c) => c.map((g) => ({
|
|
760
725
|
...g,
|
|
761
726
|
data: { ...g.data, isSelected: g.id === a }
|
|
762
727
|
}))
|
|
763
728
|
);
|
|
764
729
|
},
|
|
765
|
-
[
|
|
766
|
-
),
|
|
767
|
-
|
|
768
|
-
(a) => a.map((
|
|
769
|
-
const g = e.find((
|
|
770
|
-
return g ? { ...
|
|
730
|
+
[M]
|
|
731
|
+
), pt = f(() => {
|
|
732
|
+
M(
|
|
733
|
+
(a) => a.map((c) => {
|
|
734
|
+
const g = e.find((D) => D.id === c.id);
|
|
735
|
+
return g ? { ...c, position: { x: g.x, y: g.y } } : c;
|
|
771
736
|
})
|
|
772
737
|
), setTimeout(() => J({ duration: 600, padding: 0.2 }), 50);
|
|
773
|
-
}, [e,
|
|
774
|
-
const a =
|
|
738
|
+
}, [e, M, J]), ht = f(() => {
|
|
739
|
+
const a = K.length;
|
|
775
740
|
if (a === 0) return;
|
|
776
|
-
const
|
|
777
|
-
|
|
778
|
-
(
|
|
779
|
-
const
|
|
741
|
+
const c = 800, g = 400, D = Math.max(200, a * 40);
|
|
742
|
+
M(
|
|
743
|
+
(U) => U.map((S, v) => {
|
|
744
|
+
const F = 2 * Math.PI * v / a - Math.PI / 2;
|
|
780
745
|
return {
|
|
781
|
-
...
|
|
746
|
+
...S,
|
|
782
747
|
position: {
|
|
783
|
-
x:
|
|
784
|
-
y: g +
|
|
748
|
+
x: c + D * Math.cos(F),
|
|
749
|
+
y: g + D * Math.sin(F)
|
|
785
750
|
}
|
|
786
751
|
};
|
|
787
752
|
})
|
|
788
753
|
), setTimeout(() => J({ duration: 600, padding: 0.2 }), 50);
|
|
789
|
-
}, [
|
|
754
|
+
}, [K.length, M, J]), yt = f(
|
|
790
755
|
(a) => {
|
|
791
|
-
var
|
|
792
|
-
if (!
|
|
756
|
+
var U;
|
|
757
|
+
if (!l) return;
|
|
793
758
|
if (a < 0) {
|
|
794
|
-
|
|
795
|
-
(
|
|
796
|
-
...
|
|
797
|
-
data: { ...
|
|
759
|
+
M(
|
|
760
|
+
(S) => S.map((v) => ({
|
|
761
|
+
...v,
|
|
762
|
+
data: { ...v.data, status: "idle", isSelected: !1 }
|
|
798
763
|
}))
|
|
799
|
-
),
|
|
800
|
-
(
|
|
801
|
-
...
|
|
764
|
+
), V(
|
|
765
|
+
(S) => S.map((v) => ({
|
|
766
|
+
...v,
|
|
802
767
|
animated: !0,
|
|
803
|
-
data: { ...
|
|
768
|
+
data: { ...v.data, isActive: !1, isDimmed: !1 }
|
|
804
769
|
}))
|
|
805
770
|
);
|
|
806
771
|
return;
|
|
807
772
|
}
|
|
808
|
-
const
|
|
809
|
-
|
|
810
|
-
(
|
|
811
|
-
let
|
|
812
|
-
return
|
|
813
|
-
...
|
|
814
|
-
data: { ...
|
|
773
|
+
const c = new Set(l.slice(0, a).map((S) => S.planetId)), g = (U = l[a]) == null ? void 0 : U.planetId;
|
|
774
|
+
M(
|
|
775
|
+
(S) => S.map((v) => {
|
|
776
|
+
let F = "idle";
|
|
777
|
+
return v.id === g ? F = "running" : c.has(v.id) && (F = "success"), {
|
|
778
|
+
...v,
|
|
779
|
+
data: { ...v.data, status: F, isSelected: v.id === g }
|
|
815
780
|
};
|
|
816
781
|
})
|
|
817
782
|
);
|
|
818
|
-
const
|
|
819
|
-
|
|
820
|
-
(
|
|
821
|
-
const
|
|
783
|
+
const D = /* @__PURE__ */ new Set([...c, g]);
|
|
784
|
+
V(
|
|
785
|
+
(S) => S.map((v) => {
|
|
786
|
+
const F = c.has(v.source), It = D.has(v.target), X = F && It;
|
|
822
787
|
return {
|
|
823
|
-
...
|
|
824
|
-
animated:
|
|
825
|
-
data: { ...
|
|
788
|
+
...v,
|
|
789
|
+
animated: X,
|
|
790
|
+
data: { ...v.data, isActive: X, isDimmed: !X }
|
|
826
791
|
};
|
|
827
792
|
})
|
|
828
793
|
);
|
|
829
794
|
},
|
|
830
|
-
[
|
|
831
|
-
),
|
|
832
|
-
(a, s) => {
|
|
833
|
-
const g = Date.now(), L = g - Z.current < 300 && Q.current === s.id;
|
|
834
|
-
Z.current = g, Q.current = s.id;
|
|
835
|
-
const D = U(s.id);
|
|
836
|
-
L && D ? Y(D) : N.mode === "inspecting" && N.planetId === s.id ? (k({ mode: "universe" }), B(null), x(800, 400, { zoom: 0.8, duration: 600 })) : (k({ mode: "inspecting", planetId: s.id }), B(s.id), x(s.position.x + 50, s.position.y + 50, { zoom: 1.5, duration: 600 }), D && (u == null || u(D)));
|
|
837
|
-
},
|
|
838
|
-
[N, B, U, k, u, x]
|
|
839
|
-
), Y = v(
|
|
795
|
+
[l, M, V]
|
|
796
|
+
), j = f(
|
|
840
797
|
(a) => {
|
|
841
|
-
|
|
842
|
-
|
|
798
|
+
I({ mode: "entering", planetId: a.id }), L(null), s == null || s(a), x(a.x + 50, a.y + 50, { zoom: 6, duration: 800 }), setTimeout(() => {
|
|
799
|
+
I({ mode: "planet", planetId: a.id });
|
|
843
800
|
}, 900);
|
|
844
801
|
},
|
|
845
|
-
[x,
|
|
846
|
-
),
|
|
847
|
-
|
|
802
|
+
[x, L, I, s]
|
|
803
|
+
), gt = f(
|
|
804
|
+
(a, c) => {
|
|
805
|
+
I({ mode: "inspecting", planetId: c.id }), L(c.id), x(c.position.x + 50, c.position.y + 50, { zoom: 1.5, duration: 600 });
|
|
806
|
+
const g = E(c.id);
|
|
807
|
+
g && (u == null || u(g));
|
|
808
|
+
},
|
|
809
|
+
[L, E, I, u, x]
|
|
810
|
+
), bt = f(
|
|
811
|
+
(a, c) => {
|
|
812
|
+
const g = E(c.id);
|
|
813
|
+
g && j(g);
|
|
814
|
+
},
|
|
815
|
+
[E, j]
|
|
816
|
+
), q = f(() => {
|
|
817
|
+
I({ mode: "universe" }), o == null || o(), setTimeout(() => {
|
|
848
818
|
x(800, 400, { zoom: 0.8, duration: 600 });
|
|
849
819
|
}, 100);
|
|
850
|
-
}, [x,
|
|
851
|
-
(a,
|
|
852
|
-
|
|
820
|
+
}, [x, I, o]), ft = f(
|
|
821
|
+
(a, c) => {
|
|
822
|
+
d == null || d(c.id, { x: c.position.x, y: c.position.y });
|
|
853
823
|
},
|
|
854
|
-
[
|
|
855
|
-
),
|
|
856
|
-
|
|
857
|
-
}, [
|
|
858
|
-
(a,
|
|
859
|
-
x(a,
|
|
824
|
+
[d]
|
|
825
|
+
), vt = f(() => {
|
|
826
|
+
P.mode === "inspecting" && (I({ mode: "universe" }), L(null), x(800, 400, { zoom: 0.8, duration: 600 }));
|
|
827
|
+
}, [P, L, I, x]), Nt = f(
|
|
828
|
+
(a, c, g, D) => {
|
|
829
|
+
x(a, c, { zoom: g, duration: D });
|
|
860
830
|
},
|
|
861
831
|
[x]
|
|
862
832
|
);
|
|
863
|
-
|
|
864
|
-
const a = (
|
|
865
|
-
|
|
833
|
+
it(() => {
|
|
834
|
+
const a = (c) => {
|
|
835
|
+
c.key === "Escape" && (G || (P.mode === "inspecting" ? (I({ mode: "universe" }), L(null), x(800, 400, { zoom: 0.8, duration: 600 })) : P.mode === "planet" && q()));
|
|
866
836
|
};
|
|
867
837
|
return window.addEventListener("keydown", a), () => window.removeEventListener("keydown", a);
|
|
868
|
-
}, [
|
|
869
|
-
const
|
|
870
|
-
() => ({ ...
|
|
871
|
-
[
|
|
872
|
-
), Ct =
|
|
873
|
-
() => ({ ...
|
|
874
|
-
[
|
|
875
|
-
),
|
|
876
|
-
return r != null && r.background && (
|
|
838
|
+
}, [P, G, I, L, x, q]);
|
|
839
|
+
const R = P.mode !== "universe" ? E(P.planetId) : void 0, Pt = P.mode !== "planet", wt = W(
|
|
840
|
+
() => ({ ...qe, ..._ }),
|
|
841
|
+
[_]
|
|
842
|
+
), Ct = W(
|
|
843
|
+
() => ({ ...Xe, ...k }),
|
|
844
|
+
[k]
|
|
845
|
+
), xt = C !== !1, kt = typeof C == "object" ? C : {}, T = {};
|
|
846
|
+
return r != null && r.background && (T["--cc-bg"] = r.background), r != null && r.textColor && (T["--cc-text"] = r.textColor), r != null && r.panelBackground && (T["--cc-panel-bg"] = r.panelBackground), r != null && r.panelBorder && (T["--cc-panel-border"] = r.panelBorder), r != null && r.controlsBackground && (T["--cc-controls-bg"] = r.controlsBackground), r != null && r.fontFamily && (T["--cc-font-family"] = r.fontFamily), /* @__PURE__ */ p(
|
|
877
847
|
"div",
|
|
878
848
|
{
|
|
879
|
-
className: `${i.root} ${
|
|
880
|
-
style: { ...
|
|
849
|
+
className: `${i.root} ${N ?? ""}`,
|
|
850
|
+
style: { ...T, ...O },
|
|
881
851
|
children: [
|
|
882
|
-
|
|
883
|
-
|
|
852
|
+
xt && /* @__PURE__ */ t("div", { className: i.layerStarField, children: /* @__PURE__ */ t(
|
|
853
|
+
Je,
|
|
884
854
|
{
|
|
885
855
|
config: kt,
|
|
886
856
|
background: r == null ? void 0 : r.background
|
|
@@ -890,21 +860,23 @@ function Ve({
|
|
|
890
860
|
"div",
|
|
891
861
|
{
|
|
892
862
|
className: i.layerReactFlow,
|
|
893
|
-
"data-hidden": !
|
|
863
|
+
"data-hidden": !Pt || void 0,
|
|
894
864
|
children: /* @__PURE__ */ p(
|
|
895
865
|
Dt,
|
|
896
866
|
{
|
|
897
|
-
nodes:
|
|
898
|
-
edges:
|
|
899
|
-
onNodesChange:
|
|
900
|
-
onEdgesChange:
|
|
901
|
-
onNodeClick:
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
867
|
+
nodes: K,
|
|
868
|
+
edges: ut,
|
|
869
|
+
onNodesChange: dt,
|
|
870
|
+
onEdgesChange: mt,
|
|
871
|
+
onNodeClick: gt,
|
|
872
|
+
onNodeDoubleClick: bt,
|
|
873
|
+
onNodeDragStop: ft,
|
|
874
|
+
onPaneClick: vt,
|
|
875
|
+
nodeTypes: wt,
|
|
905
876
|
edgeTypes: Ct,
|
|
906
877
|
nodesDraggable: !0,
|
|
907
|
-
|
|
878
|
+
selectNodesOnDrag: !1,
|
|
879
|
+
nodeDragThreshold: 10,
|
|
908
880
|
fitView: !0,
|
|
909
881
|
proOptions: { hideAttribution: !0 },
|
|
910
882
|
style: { background: "transparent" },
|
|
@@ -912,16 +884,16 @@ function Ve({
|
|
|
912
884
|
maxZoom: 8,
|
|
913
885
|
children: [
|
|
914
886
|
/* @__PURE__ */ t(
|
|
915
|
-
|
|
887
|
+
Ft,
|
|
916
888
|
{
|
|
917
|
-
variant:
|
|
889
|
+
variant: Rt.Dots,
|
|
918
890
|
gap: 50,
|
|
919
891
|
size: 1,
|
|
920
892
|
color: "rgba(255, 255, 255, 0.05)"
|
|
921
893
|
}
|
|
922
894
|
),
|
|
923
895
|
/* @__PURE__ */ p(
|
|
924
|
-
|
|
896
|
+
Tt,
|
|
925
897
|
{
|
|
926
898
|
style: { top: 60 },
|
|
927
899
|
showInteractive: !1,
|
|
@@ -930,7 +902,7 @@ function Ve({
|
|
|
930
902
|
"button",
|
|
931
903
|
{
|
|
932
904
|
className: "react-flow__controls-button",
|
|
933
|
-
onClick:
|
|
905
|
+
onClick: pt,
|
|
934
906
|
title: "Reset layout",
|
|
935
907
|
children: /* @__PURE__ */ t("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "currentColor", children: /* @__PURE__ */ t("path", { d: "M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z" }) })
|
|
936
908
|
}
|
|
@@ -939,7 +911,7 @@ function Ve({
|
|
|
939
911
|
"button",
|
|
940
912
|
{
|
|
941
913
|
className: "react-flow__controls-button",
|
|
942
|
-
onClick:
|
|
914
|
+
onClick: ht,
|
|
943
915
|
title: "Auto layout",
|
|
944
916
|
children: /* @__PURE__ */ p("svg", { viewBox: "0 0 24 24", width: "16", height: "16", fill: "currentColor", children: [
|
|
945
917
|
/* @__PURE__ */ t("circle", { cx: "12", cy: "3", r: "2" }),
|
|
@@ -955,11 +927,11 @@ function Ve({
|
|
|
955
927
|
}
|
|
956
928
|
),
|
|
957
929
|
/* @__PURE__ */ t(
|
|
958
|
-
|
|
930
|
+
Wt,
|
|
959
931
|
{
|
|
960
932
|
nodeColor: (a) => {
|
|
961
|
-
var
|
|
962
|
-
return ((
|
|
933
|
+
var c;
|
|
934
|
+
return ((c = a.data) == null ? void 0 : c.color) || "#666";
|
|
963
935
|
},
|
|
964
936
|
maskColor: "rgba(10, 10, 26, 0.7)",
|
|
965
937
|
style: {
|
|
@@ -972,55 +944,55 @@ function Ve({
|
|
|
972
944
|
)
|
|
973
945
|
}
|
|
974
946
|
),
|
|
975
|
-
/* @__PURE__ */ t(
|
|
976
|
-
/* @__PURE__ */ t(
|
|
977
|
-
|
|
947
|
+
/* @__PURE__ */ t(A, { children: P.mode === "entering" && R && /* @__PURE__ */ t(Ve, { planet: R }) }),
|
|
948
|
+
/* @__PURE__ */ t(A, { children: P.mode === "planet" && R && /* @__PURE__ */ t(
|
|
949
|
+
Ke,
|
|
978
950
|
{
|
|
979
|
-
planet:
|
|
980
|
-
onExit:
|
|
951
|
+
planet: R,
|
|
952
|
+
onExit: q,
|
|
981
953
|
onSatelliteClick: n,
|
|
982
|
-
renderCustom:
|
|
954
|
+
renderCustom: $
|
|
983
955
|
}
|
|
984
956
|
) }),
|
|
985
|
-
/* @__PURE__ */ t(
|
|
986
|
-
|
|
957
|
+
/* @__PURE__ */ t(A, { children: P.mode === "inspecting" && R && /* @__PURE__ */ t(
|
|
958
|
+
Ue,
|
|
987
959
|
{
|
|
988
|
-
planet:
|
|
960
|
+
planet: R,
|
|
989
961
|
onClose: () => {
|
|
990
|
-
|
|
962
|
+
I({ mode: "universe" }), L(null), x(800, 400, { zoom: 0.8, duration: 600 });
|
|
991
963
|
},
|
|
992
|
-
onEnterPlanet: () =>
|
|
964
|
+
onEnterPlanet: () => j(R),
|
|
993
965
|
onSatelliteClick: n
|
|
994
966
|
}
|
|
995
967
|
) }),
|
|
996
|
-
|
|
997
|
-
/* @__PURE__ */ t(
|
|
998
|
-
|
|
968
|
+
z && !G && P.mode !== "planet" && P.mode !== "entering" && /* @__PURE__ */ t("div", { className: i.topBarSlot, children: z }),
|
|
969
|
+
/* @__PURE__ */ t(A, { children: G && l && l.length > 0 && /* @__PURE__ */ t(
|
|
970
|
+
je,
|
|
999
971
|
{
|
|
1000
|
-
steps:
|
|
972
|
+
steps: l,
|
|
1001
973
|
planets: e,
|
|
1002
|
-
onHighlightPlanet:
|
|
1003
|
-
onStepChange:
|
|
974
|
+
onHighlightPlanet: L,
|
|
975
|
+
onStepChange: yt,
|
|
1004
976
|
onFinish: () => {
|
|
1005
|
-
|
|
977
|
+
lt(!1), m == null || m();
|
|
1006
978
|
},
|
|
1007
|
-
flyTo:
|
|
979
|
+
flyTo: Nt
|
|
1008
980
|
}
|
|
1009
981
|
) })
|
|
1010
982
|
]
|
|
1011
983
|
}
|
|
1012
984
|
);
|
|
1013
985
|
}
|
|
1014
|
-
function
|
|
1015
|
-
return /* @__PURE__ */ t(
|
|
986
|
+
function ai(e) {
|
|
987
|
+
return /* @__PURE__ */ t(zt, { children: /* @__PURE__ */ t(Ze, { ...e }) });
|
|
1016
988
|
}
|
|
1017
989
|
export {
|
|
1018
|
-
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
990
|
+
ai as CosmosCanvas,
|
|
991
|
+
je as CosmosTutorial,
|
|
992
|
+
He as OrbitEdge,
|
|
993
|
+
Ke as PlanetInterior,
|
|
994
|
+
Oe as PlanetNode,
|
|
995
|
+
Ue as SidePanel,
|
|
996
|
+
Je as StarField,
|
|
997
|
+
Ve as ZoomTransition
|
|
1026
998
|
};
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.cc-root-eSR-1{position:relative;width:100%;height:100%;overflow:hidden;font-family:var(--cc-font-family, system-ui, -apple-system, sans-serif);color:var(--cc-text, #fff)}.cc-layerStarField-jOb4M{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.cc-layerReactFlow-CeHI9{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;transition:opacity .4s ease}.cc-layerReactFlow-CeHI9[data-hidden=true]{opacity:0;pointer-events:none}.cc-sidePanel-PzU72{position:absolute;right:0;top:0;bottom:0;width:340px;z-index:15;background:var(--cc-panel-bg, rgba(10, 10, 30, .92));border-left:1px solid var(--cc-panel-border, rgba(255, 255, 255, .08));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;flex-direction:column;overflow-y:auto}.cc-sidePanelHeader-cWPCq{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1rem;border-bottom:1px solid rgba(255,255,255,.06)}.cc-sidePanelTitle-Yfh5N{display:flex;align-items:center;gap:.75rem}.cc-sidePanelPlanetIcon-aRuLt{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.25rem}.cc-sidePanelName-TFFeE{font-size:1.125rem;font-weight:700;letter-spacing:.5px}.cc-sidePanelSubtitle-8fp2Y{font-size:.75rem;color:#ffffff80;margin-top:.125rem}.cc-sidePanelClose-Sdg-J{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;background:#ffffff0f;color:#ffffff80;border-radius:.375rem;cursor:pointer;font-size:1rem;transition:background .15s}.cc-sidePanelClose-Sdg-J:hover{background:#ffffff1f;color:#fff}.cc-sidePanelContent-QIEEQ{padding:1rem;flex:1}.cc-sidePanelFooter-DVOHi{padding:1rem;border-top:1px solid rgba(255,255,255,.06)}.cc-satelliteList--vkXn{display:flex;flex-direction:column;gap:.5rem}.cc-satelliteItem-JGdmG{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.06);cursor:pointer;transition:background .15s,border-color .15s}.cc-satelliteItem-JGdmG:hover{background:#ffffff14;border-color:#ffffff1f}.cc-satelliteIcon-arUe3{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.125rem;background:#ffffff0f;flex-shrink:0}.cc-satelliteInfo-NaKLd{flex:1;min-width:0}.cc-satelliteName-zfOPN{font-size:.875rem;font-weight:500}.cc-satelliteSummary-XARVm{font-size:.6875rem;color:#fff6;margin-top:.125rem}.cc-enterButton-5Vnri{width:100%;padding:.625rem;border:1px solid rgba(255,255,255,.15);border-radius:.5rem;background:#ffffff0f;color:#fff;font-size:.875rem;font-weight:600;letter-spacing:.5px;cursor:pointer;transition:background .15s,border-color .2s}.cc-enterButton-5Vnri:hover{background:#ffffff1f;border-color:#ffffff40}.cc-layerReactFlow-CeHI9 .react-flow__controls{background:#0a0a1ed9;border:1px solid rgba(255,255,255,.1);border-radius:.5rem;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 4px 20px #0006;overflow:hidden}.cc-layerReactFlow-CeHI9 .react-flow__controls-button{background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.06);color:#fff9;fill:#fff9;width:32px;height:32px;transition:background .15s,color .15s}.cc-layerReactFlow-CeHI9 .react-flow__controls-button:hover{background:#ffffff1a;color:#fff;fill:#fff}.cc-layerReactFlow-CeHI9 .react-flow__controls-button:last-child{border-bottom:none}.cc-layerReactFlow-CeHI9 .react-flow__controls-button svg{fill:inherit}.cc-layerReactFlow-CeHI9 .react-flow__minimap{border-radius:.5rem;overflow:hidden;box-shadow:0 4px 20px #0006}.cc-zoomTransition-Wcju8{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,transparent 0%,rgba(0,0,10,.8) 100%);pointer-events:none}.cc-zoomPlanetLabel-3SJT2{font-size:3rem;font-weight:800;letter-spacing:6px;text-transform:uppercase;text-shadow:0 0 40px var(--planet-color, #fff)}.cc-planetInterior-GlnW1{position:absolute;top:0;right:0;bottom:0;left:0;z-index:25;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#0a0a28f2,#000008fa)}.cc-interiorBackButton-qJAiZ{position:absolute;top:1rem;left:1rem;padding:.5rem 1rem;border:1px solid rgba(255,255,255,.2);border-radius:.5rem;background:#ffffff0f;color:#fff;font-size:.8125rem;cursor:pointer;z-index:10;transition:background .15s}.cc-interiorBackButton-qJAiZ:hover{background:#ffffff1f}.cc-interiorCenter-xdKsX{position:relative;display:flex;align-items:center;justify-content:center}.cc-interiorPlanet--XIzf{width:120px;height:120px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2}.cc-interiorPlanetLabel-e7yxq{font-size:1rem;font-weight:700;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}.cc-interiorPlanetSubtitle-e2vON{font-size:.6875rem;color:#fff9;margin-top:.125rem}.cc-orbitRing-hbvmD{position:absolute;border-radius:50%;border:1px dashed rgba(255,255,255,.08);pointer-events:none}.cc-satelliteNode-01STS{position:absolute;display:flex;flex-direction:column;align-items:center;gap:.375rem;cursor:pointer;transition:transform .2s}.cc-satelliteNode-01STS:hover{transform:scale(1.12)}.cc-satelliteNodeIcon-Xq45f{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;border:2px solid rgba(255,255,255,.15);background:#ffffff0f;transition:border-color .2s,box-shadow .2s}.cc-satelliteNode-01STS:hover .cc-satelliteNodeIcon-Xq45f{border-color:#ffffff4d}.cc-satelliteNodeLabel-LLOJ5{font-size:.6875rem;color:#ffffffb3;white-space:nowrap;max-width:80px;overflow:hidden;text-overflow:ellipsis;text-align:center}.cc-satelliteNodeBadge-HsUFp{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:#2ecc71;color:#fff;font-size:.625rem;font-weight:700;display:flex;align-items:center;justify-content:center}.cc-tutorialOverlay-3GHo7{position:absolute;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#00000ab3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.cc-tutorialWelcome-21KDP{text-align:center;max-width:480px}.cc-tutorialWelcomeTitle-7GwS9{font-size:2rem;font-weight:800;letter-spacing:2px;margin-bottom:1rem}.cc-tutorialWelcomeDesc--pznv{font-size:1rem;color:#fff9;line-height:1.6;margin-bottom:2rem}.cc-tutorialActions-szJ0-{display:flex;align-items:center;justify-content:center;gap:1rem}.cc-tutorialButton-wL9-p{padding:.625rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s,transform .1s}.cc-tutorialButton-wL9-p:active{transform:scale(.97)}.cc-tutorialButton-wL9-p[data-variant=primary]{background:#fff;color:#0a0a2e;border:none}.cc-tutorialButton-wL9-p[data-variant=primary]:hover{background:#e2e8f0}.cc-tutorialButton-wL9-p[data-variant=ghost]{background:transparent;color:#ffffff80;border:1px solid rgba(255,255,255,.15)}.cc-tutorialButton-wL9-p[data-variant=ghost]:hover{background:#ffffff0f}.cc-tutorialCard-LGIkK{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);z-index:50;width:420px;padding:1.5rem;background:#0a0a1ef2;border:1px solid rgba(255,255,255,.1);border-radius:.75rem;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.cc-tutorialChip-bUoEb{display:inline-block;padding:.25rem .625rem;border-radius:9999px;font-size:.6875rem;font-weight:600;letter-spacing:.5px;margin-bottom:.75rem}.cc-tutorialCardTitle-r2Y1I{font-size:1.125rem;font-weight:700;margin-bottom:.5rem}.cc-tutorialCardDesc-nOS-M{font-size:.8125rem;color:#fff9;line-height:1.5;margin-bottom:1.25rem}.cc-tutorialProgress-wIAT9{width:100%;height:3px;background:#ffffff1a;border-radius:2px;margin-bottom:1rem}.cc-tutorialProgressBar-PFBdE{height:100%;border-radius:2px;background:#fff;transition:width .3s ease}.cc-tutorialCardFooter-bSdyM{display:flex;align-items:center;justify-content:space-between}.cc-tutorialStepCounter-i7c5G{font-size:.75rem;color:#fff6;font-family:monospace}.cc-tutorialDots-8M0QU{display:flex;gap:.375rem}.cc-tutorialDot-518t4{width:6px;height:6px;border-radius:50%;background:#fff3;cursor:pointer;transition:background .15s}.cc-tutorialDot-518t4[data-active=true]{background:#fff}.cc-tutorialDot-518t4[data-done=true]{background:#ffffff80}.cc-topBarSlot-EJGvM{position:absolute;top:0;left:0;right:0;z-index:50}
|
|
1
|
+
.cc-root-eSR-1{position:relative;width:100%;height:100%;overflow:hidden;font-family:var(--cc-font-family, system-ui, -apple-system, sans-serif);color:var(--cc-text, #fff)}.cc-layerStarField-jOb4M{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.cc-layerReactFlow-CeHI9{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;transition:opacity .4s ease}.cc-layerReactFlow-CeHI9[data-hidden=true]{opacity:0;pointer-events:none}.cc-sidePanel-PzU72{position:absolute;right:0;top:0;bottom:0;width:340px;z-index:55;background:var(--cc-panel-bg, rgba(10, 10, 30, .92));border-left:1px solid var(--cc-panel-border, rgba(255, 255, 255, .08));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;flex-direction:column;overflow-y:auto;will-change:transform}.cc-sidePanelHeader-cWPCq{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1rem;border-bottom:1px solid rgba(255,255,255,.06)}.cc-sidePanelTitle-Yfh5N{display:flex;align-items:center;gap:.75rem}.cc-sidePanelPlanetIcon-aRuLt{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.25rem}.cc-sidePanelName-TFFeE{font-size:1.125rem;font-weight:700;letter-spacing:.5px}.cc-sidePanelSubtitle-8fp2Y{font-size:.75rem;color:#ffffff80;margin-top:.125rem}.cc-sidePanelClose-Sdg-J{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;background:#ffffff0f;color:#ffffff80;border-radius:.375rem;cursor:pointer;font-size:1rem;transition:background .15s}.cc-sidePanelClose-Sdg-J:hover{background:#ffffff1f;color:#fff}.cc-sidePanelContent-QIEEQ{padding:1rem;flex:1}.cc-sidePanelFooter-DVOHi{padding:1rem;border-top:1px solid rgba(255,255,255,.06)}.cc-satelliteList--vkXn{display:flex;flex-direction:column;gap:.5rem}.cc-satelliteItem-JGdmG{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.06);cursor:pointer;transition:background .15s,border-color .15s}.cc-satelliteItem-JGdmG:hover{background:#ffffff14;border-color:#ffffff1f}.cc-satelliteIcon-arUe3{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.125rem;background:#ffffff0f;flex-shrink:0}.cc-satelliteInfo-NaKLd{flex:1;min-width:0}.cc-satelliteName-zfOPN{font-size:.875rem;font-weight:500}.cc-satelliteSummary-XARVm{font-size:.6875rem;color:#fff6;margin-top:.125rem}.cc-enterButton-5Vnri{width:100%;padding:.625rem;border:1px solid rgba(255,255,255,.15);border-radius:.5rem;background:#ffffff0f;color:#fff;font-size:.875rem;font-weight:600;letter-spacing:.5px;cursor:pointer;transition:background .15s,border-color .2s}.cc-enterButton-5Vnri:hover{background:#ffffff1f;border-color:#ffffff40}.cc-layerReactFlow-CeHI9 .react-flow__controls{background:#0a0a1ed9;border:1px solid rgba(255,255,255,.1);border-radius:.5rem;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 4px 20px #0006;overflow:hidden}.cc-layerReactFlow-CeHI9 .react-flow__controls-button{background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.06);color:#fff9;fill:#fff9;width:32px;height:32px;transition:background .15s,color .15s}.cc-layerReactFlow-CeHI9 .react-flow__controls-button:hover{background:#ffffff1a;color:#fff;fill:#fff}.cc-layerReactFlow-CeHI9 .react-flow__controls-button:last-child{border-bottom:none}.cc-layerReactFlow-CeHI9 .react-flow__controls-button svg{fill:inherit}.cc-layerReactFlow-CeHI9 .react-flow__minimap{border-radius:.5rem;overflow:hidden;box-shadow:0 4px 20px #0006}.cc-zoomTransition-Wcju8{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,transparent 0%,rgba(0,0,10,.8) 100%);pointer-events:none}.cc-zoomPlanetLabel-3SJT2{font-size:3rem;font-weight:800;letter-spacing:6px;text-transform:uppercase;text-shadow:0 0 40px var(--planet-color, #fff)}.cc-planetInterior-GlnW1{position:absolute;top:0;right:0;bottom:0;left:0;z-index:25;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#0a0a28f2,#000008fa)}.cc-interiorBackButton-qJAiZ{position:absolute;top:1rem;left:1rem;padding:.5rem 1rem;border:1px solid rgba(255,255,255,.2);border-radius:.5rem;background:#ffffff0f;color:#fff;font-size:.8125rem;cursor:pointer;z-index:10;transition:background .15s}.cc-interiorBackButton-qJAiZ:hover{background:#ffffff1f}.cc-interiorCenter-xdKsX{position:relative;display:flex;align-items:center;justify-content:center}.cc-interiorPlanet--XIzf{width:120px;height:120px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2}.cc-interiorPlanetLabel-e7yxq{font-size:1rem;font-weight:700;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}.cc-interiorPlanetSubtitle-e2vON{font-size:.6875rem;color:#fff9;margin-top:.125rem}.cc-orbitRing-hbvmD{position:absolute;border-radius:50%;border:1px dashed rgba(255,255,255,.08);pointer-events:none}.cc-satelliteNode-01STS{position:absolute;display:flex;flex-direction:column;align-items:center;gap:.375rem;cursor:pointer;transition:transform .2s}.cc-satelliteNode-01STS:hover{transform:scale(1.12)}.cc-satelliteNodeIcon-Xq45f{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;border:2px solid rgba(255,255,255,.15);background:#ffffff0f;transition:border-color .2s,box-shadow .2s}.cc-satelliteNode-01STS:hover .cc-satelliteNodeIcon-Xq45f{border-color:#ffffff4d}.cc-satelliteNodeLabel-LLOJ5{font-size:.6875rem;color:#ffffffb3;white-space:nowrap;max-width:80px;overflow:hidden;text-overflow:ellipsis;text-align:center}.cc-satelliteNodeBadge-HsUFp{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:#2ecc71;color:#fff;font-size:.625rem;font-weight:700;display:flex;align-items:center;justify-content:center}.cc-tutorialOverlay-3GHo7{position:absolute;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#00000ab3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.cc-tutorialWelcome-21KDP{text-align:center;max-width:480px}.cc-tutorialWelcomeTitle-7GwS9{font-size:2rem;font-weight:800;letter-spacing:2px;margin-bottom:1rem}.cc-tutorialWelcomeDesc--pznv{font-size:1rem;color:#fff9;line-height:1.6;margin-bottom:2rem}.cc-tutorialActions-szJ0-{display:flex;align-items:center;justify-content:center;gap:1rem}.cc-tutorialButton-wL9-p{padding:.625rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s,transform .1s}.cc-tutorialButton-wL9-p:active{transform:scale(.97)}.cc-tutorialButton-wL9-p[data-variant=primary]{background:#fff;color:#0a0a2e;border:none}.cc-tutorialButton-wL9-p[data-variant=primary]:hover{background:#e2e8f0}.cc-tutorialButton-wL9-p[data-variant=ghost]{background:transparent;color:#ffffff80;border:1px solid rgba(255,255,255,.15)}.cc-tutorialButton-wL9-p[data-variant=ghost]:hover{background:#ffffff0f}.cc-tutorialCard-LGIkK{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);z-index:50;width:420px;padding:1.5rem;background:#0a0a1ef2;border:1px solid rgba(255,255,255,.1);border-radius:.75rem;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.cc-tutorialChip-bUoEb{display:inline-block;padding:.25rem .625rem;border-radius:9999px;font-size:.6875rem;font-weight:600;letter-spacing:.5px;margin-bottom:.75rem}.cc-tutorialCardTitle-r2Y1I{font-size:1.125rem;font-weight:700;margin-bottom:.5rem}.cc-tutorialCardDesc-nOS-M{font-size:.8125rem;color:#fff9;line-height:1.5;margin-bottom:1.25rem}.cc-tutorialProgress-wIAT9{width:100%;height:3px;background:#ffffff1a;border-radius:2px;margin-bottom:1rem}.cc-tutorialProgressBar-PFBdE{height:100%;border-radius:2px;background:#fff;transition:width .3s ease}.cc-tutorialCardFooter-bSdyM{display:flex;align-items:center;justify-content:space-between}.cc-tutorialStepCounter-i7c5G{font-size:.75rem;color:#fff6;font-family:monospace}.cc-tutorialDots-8M0QU{display:flex;gap:.375rem}.cc-tutorialDot-518t4{width:6px;height:6px;border-radius:50%;background:#fff3;cursor:pointer;transition:background .15s}.cc-tutorialDot-518t4[data-active=true]{background:#fff}.cc-tutorialDot-518t4[data-done=true]{background:#ffffff80}@keyframes cc-planetPulse-dWUhB{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes cc-planetPulseRunning-wwsW1{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes cc-orbitSpin-2ZKCf{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes cc-statusBlink-Lun9j{0%,to{opacity:.5}50%{opacity:1}}@keyframes cc-fadeSlideUp-aScc8{0%{opacity:0;transform:translate(-50%) translateY(8px)}to{opacity:.5;transform:translate(-50%) translateY(0)}}.cc-planetBody-kF0Jj{border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:width .3s,height .3s,border-color .3s;animation:cc-planetPulse-dWUhB 3s ease-in-out infinite;will-change:transform}.cc-planetBody-kF0Jj:hover{filter:brightness(1.2)}.cc-planetBodyRunning-cmLi4{border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:width .3s,height .3s,border-color .3s;animation:cc-planetPulseRunning-wwsW1 3s ease-in-out infinite;will-change:transform}.cc-planetBodyRunning-cmLi4:hover{filter:brightness(1.2)}.cc-planetOrbitRing-v7fZR{position:absolute;border-radius:50%;pointer-events:none;animation:cc-orbitSpin-2ZKCf 20s linear infinite;will-change:transform}.cc-planetStatusDot--M-6s{position:absolute;top:-4px;right:-4px;width:14px;height:14px;border-radius:50%;border:2px solid rgba(0,0,0,.4);animation:cc-statusBlink-Lun9j 1.5s ease-in-out infinite;will-change:opacity}.cc-planetHint-QUWAw{position:absolute;bottom:-22px;left:50%;transform:translate(-50%);font-size:9px;color:#fff;white-space:nowrap;font-family:monospace;letter-spacing:.5px;animation:cc-fadeSlideUp-aScc8 .3s ease-out forwards}.cc-topBarSlot-EJGvM{position:absolute;top:0;left:0;right:0;z-index:50}
|