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