@tomehq/theme 0.3.4 → 0.4.0

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 (76) hide show
  1. package/CHANGELOG.md +31 -0
  2. package/dist/chunk-2APCPR2Y.js +2110 -0
  3. package/dist/chunk-2AXAEADQ.js +2525 -0
  4. package/dist/chunk-2WNOJXK3.js +2581 -0
  5. package/dist/chunk-37JI6XGT.js +1720 -0
  6. package/dist/chunk-3A2LPGUL.js +1991 -0
  7. package/dist/chunk-3I2QTWTW.js +1948 -0
  8. package/dist/chunk-3I4SJMER.js +2538 -0
  9. package/dist/chunk-45M5UIAB.js +2110 -0
  10. package/dist/chunk-462AGU3S.js +1959 -0
  11. package/dist/chunk-5GVQFIPI.js +2581 -0
  12. package/dist/chunk-7MUTU5D4.js +1720 -0
  13. package/dist/chunk-7NQ4IMDY.js +2294 -0
  14. package/dist/chunk-ABNPB6BB.js +2133 -0
  15. package/dist/chunk-BZGWSKT2.js +573 -0
  16. package/dist/chunk-BZIB2LMI.js +2519 -0
  17. package/dist/chunk-CMQCNCSY.js +2127 -0
  18. package/dist/chunk-CTPOZMMK.js +1703 -0
  19. package/dist/chunk-DKSQZLWR.js +2569 -0
  20. package/dist/chunk-DO544M3G.js +1702 -0
  21. package/dist/chunk-DPKZBFQP.js +1777 -0
  22. package/dist/chunk-EK7PZUEB.js +2147 -0
  23. package/dist/chunk-FMOLIHQF.js +2182 -0
  24. package/dist/chunk-FWBTK5TL.js +1444 -0
  25. package/dist/chunk-GDQIBNX5.js +1962 -0
  26. package/dist/chunk-GHQ2MODM.js +2127 -0
  27. package/dist/chunk-GR2WCRGK.js +2182 -0
  28. package/dist/chunk-H5XZVNBW.js +2291 -0
  29. package/dist/chunk-HNLKDQ64.js +2139 -0
  30. package/dist/chunk-INUMUXN5.js +2095 -0
  31. package/dist/chunk-IW3NHNOQ.js +2187 -0
  32. package/dist/chunk-JA4PMX6M.js +1500 -0
  33. package/dist/chunk-JSPFS7G5.js +2102 -0
  34. package/dist/chunk-JZRT4WNC.js +1441 -0
  35. package/dist/chunk-KQBY2JDB.js +2112 -0
  36. package/dist/chunk-LIMYFTPC.js +1468 -0
  37. package/dist/chunk-LIY62BGC.js +2519 -0
  38. package/dist/chunk-MEP7P6A7.js +1500 -0
  39. package/dist/chunk-MHYKO7KM.js +2570 -0
  40. package/dist/chunk-MSXVVBDW.js +2542 -0
  41. package/dist/chunk-NOZBIES7.js +1948 -0
  42. package/dist/chunk-O4GH3KYX.js +1712 -0
  43. package/dist/chunk-OEDJTH5F.js +2569 -0
  44. package/dist/chunk-OEXM3BEC.js +1702 -0
  45. package/dist/chunk-PGKSFQ7A.js +2459 -0
  46. package/dist/chunk-PIV6CPY2.js +2395 -0
  47. package/dist/chunk-Q7PYTVW3.js +1771 -0
  48. package/dist/chunk-QCWZYABW.js +1468 -0
  49. package/dist/chunk-RDF25WB2.js +2085 -0
  50. package/dist/chunk-RKTT3ZEX.js +1500 -0
  51. package/dist/chunk-S47BRMNQ.js +1715 -0
  52. package/dist/chunk-S4ZH5F56.js +1949 -0
  53. package/dist/chunk-SRD7NJHS.js +1949 -0
  54. package/dist/chunk-SWFYJO5H.js +2187 -0
  55. package/dist/chunk-TQDWPSTO.js +2087 -0
  56. package/dist/chunk-TTRXRPP6.js +1941 -0
  57. package/dist/chunk-UKYFJSUA.js +509 -0
  58. package/dist/chunk-VKEQHP2E.js +2133 -0
  59. package/dist/chunk-VUT2FMSI.js +1937 -0
  60. package/dist/chunk-VVCC5JHK.js +1949 -0
  61. package/dist/chunk-W732TVBK.js +1944 -0
  62. package/dist/chunk-X4VQYPKO.js +1768 -0
  63. package/dist/chunk-YX7HV4EP.js +2568 -0
  64. package/dist/chunk-YXKONM3A.js +2192 -0
  65. package/dist/chunk-YZ3P3TNS.js +1760 -0
  66. package/dist/chunk-ZVZ7JN3V.js +2568 -0
  67. package/dist/chunk-ZXW4STTN.js +2568 -0
  68. package/dist/entry.js +1 -1
  69. package/dist/index.js +1 -1
  70. package/package.json +3 -3
  71. package/src/Shell.test.tsx +25 -0
  72. package/src/Shell.tsx +8 -8
  73. package/src/entry-helpers.test.ts +60 -12
  74. package/src/entry-helpers.ts +56 -30
  75. package/src/entry.test.tsx +208 -3
  76. package/src/entry.tsx +27 -4
@@ -0,0 +1,2085 @@
1
+ // src/entry.tsx
2
+ import { useState as useState3, useEffect as useEffect3, useCallback as useCallback3 } from "react";
3
+ import { createRoot } from "react-dom/client";
4
+
5
+ // src/Shell.tsx
6
+ import { useState as useState2, useEffect as useEffect2, useRef as useRef2, useCallback as useCallback2 } from "react";
7
+
8
+ // src/presets.ts
9
+ var THEME_PRESETS = {
10
+ amber: {
11
+ dark: {
12
+ bg: "#09090b",
13
+ sf: "#111114",
14
+ sfH: "#18181c",
15
+ bd: "#1e1e24",
16
+ tx: "#e4e4e7",
17
+ tx2: "#a1a1aa",
18
+ txM: "#919199",
19
+ ac: "#e8a845",
20
+ acD: "rgba(232,168,69,0.12)",
21
+ acT: "#fbbf24",
22
+ cdBg: "#0c0c0f",
23
+ cdTx: "#c4c4cc",
24
+ sbBg: "#0c0c0e",
25
+ hdBg: "rgba(9,9,11,0.85)"
26
+ },
27
+ light: {
28
+ bg: "#fafaf9",
29
+ sf: "#ffffff",
30
+ sfH: "#f5f5f4",
31
+ bd: "#e7e5e4",
32
+ tx: "#1c1917",
33
+ tx2: "#57534e",
34
+ txM: "#706b66",
35
+ ac: "#96640a",
36
+ acD: "rgba(150,100,10,0.08)",
37
+ acT: "#7a5208",
38
+ cdBg: "#f5f3f0",
39
+ cdTx: "#2c2520",
40
+ sbBg: "#f5f5f3",
41
+ hdBg: "rgba(250,250,249,0.85)"
42
+ },
43
+ fonts: { heading: "Instrument Serif", body: "DM Sans", code: "JetBrains Mono" }
44
+ },
45
+ editorial: {
46
+ dark: {
47
+ bg: "#080c1f",
48
+ sf: "#0e1333",
49
+ sfH: "#141940",
50
+ bd: "#1a2050",
51
+ tx: "#e8e6f0",
52
+ tx2: "#b5b1c8",
53
+ txM: "#9490ae",
54
+ ac: "#ff6b4a",
55
+ acD: "rgba(255,107,74,0.1)",
56
+ acT: "#ff8a70",
57
+ cdBg: "#0a0e27",
58
+ cdTx: "#b8b4cc",
59
+ sbBg: "#0a0e27",
60
+ hdBg: "rgba(8,12,31,0.9)"
61
+ },
62
+ light: {
63
+ bg: "#f6f4f0",
64
+ sf: "#ffffff",
65
+ sfH: "#eeece6",
66
+ bd: "#ddd9d0",
67
+ tx: "#1a1716",
68
+ tx2: "#4a443e",
69
+ txM: "#706960",
70
+ ac: "#b83d22",
71
+ acD: "rgba(184,61,34,0.07)",
72
+ acT: "#9c3019",
73
+ cdBg: "#edeae4",
74
+ cdTx: "#3a3530",
75
+ sbBg: "#f0ede8",
76
+ hdBg: "rgba(246,244,240,0.92)"
77
+ },
78
+ fonts: { heading: "Cormorant Garamond", body: "Bricolage Grotesque", code: "Fira Code" }
79
+ }
80
+ };
81
+
82
+ // src/AiChat.tsx
83
+ import { useState, useRef, useEffect, useCallback } from "react";
84
+ import { jsx, jsxs } from "react/jsx-runtime";
85
+ var ChatIcon = () => /* @__PURE__ */ jsx(
86
+ "svg",
87
+ {
88
+ width: 22,
89
+ height: 22,
90
+ viewBox: "0 0 24 24",
91
+ fill: "none",
92
+ stroke: "currentColor",
93
+ strokeWidth: "1.5",
94
+ strokeLinecap: "round",
95
+ strokeLinejoin: "round",
96
+ children: /* @__PURE__ */ jsx("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" })
97
+ }
98
+ );
99
+ var CloseIcon = () => /* @__PURE__ */ jsx(
100
+ "svg",
101
+ {
102
+ width: 18,
103
+ height: 18,
104
+ viewBox: "0 0 24 24",
105
+ fill: "none",
106
+ stroke: "currentColor",
107
+ strokeWidth: "1.5",
108
+ strokeLinecap: "round",
109
+ strokeLinejoin: "round",
110
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6L6 18M6 6l12 12" })
111
+ }
112
+ );
113
+ var SendIcon = () => /* @__PURE__ */ jsx(
114
+ "svg",
115
+ {
116
+ width: 16,
117
+ height: 16,
118
+ viewBox: "0 0 24 24",
119
+ fill: "none",
120
+ stroke: "currentColor",
121
+ strokeWidth: "2",
122
+ strokeLinecap: "round",
123
+ strokeLinejoin: "round",
124
+ children: /* @__PURE__ */ jsx("path", { d: "M22 2L11 13M22 2l-7 20-4-9-9-4z" })
125
+ }
126
+ );
127
+ function buildSystemPrompt(context) {
128
+ let prompt = "You are a helpful documentation assistant. Answer questions accurately based on the documentation provided below. If the answer isn't in the documentation, say so clearly. Keep answers concise and reference specific sections when possible.";
129
+ if (context) {
130
+ const trimmed = context.length > 1e5 ? context.slice(0, 1e5) + "\n\n[Documentation truncated...]" : context;
131
+ prompt += `
132
+
133
+ Documentation:
134
+ ${trimmed}`;
135
+ }
136
+ return prompt;
137
+ }
138
+ async function callOpenAI(messages, apiKey, model, context) {
139
+ const res = await fetch("https://api.openai.com/v1/chat/completions", {
140
+ method: "POST",
141
+ headers: {
142
+ "Content-Type": "application/json",
143
+ "Authorization": `Bearer ${apiKey}`
144
+ },
145
+ body: JSON.stringify({
146
+ model,
147
+ messages: [
148
+ { role: "system", content: buildSystemPrompt(context) },
149
+ ...messages.map((m) => ({ role: m.role, content: m.content }))
150
+ ]
151
+ })
152
+ });
153
+ if (!res.ok) {
154
+ const err = await res.text();
155
+ throw new Error(`OpenAI API error (${res.status}): ${err}`);
156
+ }
157
+ const data = await res.json();
158
+ return data.choices?.[0]?.message?.content || "No response.";
159
+ }
160
+ async function callAnthropic(messages, apiKey, model, context) {
161
+ const res = await fetch("https://api.anthropic.com/v1/messages", {
162
+ method: "POST",
163
+ headers: {
164
+ "Content-Type": "application/json",
165
+ "x-api-key": apiKey,
166
+ "anthropic-version": "2023-06-01",
167
+ "anthropic-dangerous-direct-browser-access": "true"
168
+ },
169
+ body: JSON.stringify({
170
+ model,
171
+ max_tokens: 1024,
172
+ system: buildSystemPrompt(context),
173
+ messages: messages.map((m) => ({ role: m.role, content: m.content }))
174
+ })
175
+ });
176
+ if (!res.ok) {
177
+ const err = await res.text();
178
+ throw new Error(`Anthropic API error (${res.status}): ${err}`);
179
+ }
180
+ const data = await res.json();
181
+ return data.content?.[0]?.text || "No response.";
182
+ }
183
+ function getDefaultModel(provider) {
184
+ if (provider === "openai") return "gpt-4o-mini";
185
+ return "claude-sonnet-4-20250514";
186
+ }
187
+ function AiChat({ provider, model, apiKey, context }) {
188
+ const [open, setOpen] = useState(false);
189
+ const [messages, setMessages] = useState([]);
190
+ const [input, setInput] = useState("");
191
+ const [loading, setLoading] = useState(false);
192
+ const [error, setError] = useState(null);
193
+ const messagesEndRef = useRef(null);
194
+ const inputRef = useRef(null);
195
+ const resolvedKey = apiKey || (typeof window !== "undefined" ? window.__TOME_AI_API_KEY__ : void 0);
196
+ const resolvedModel = model || getDefaultModel(provider);
197
+ useEffect(() => {
198
+ messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
199
+ }, [messages]);
200
+ useEffect(() => {
201
+ if (open) {
202
+ setTimeout(() => inputRef.current?.focus(), 100);
203
+ }
204
+ }, [open]);
205
+ const sendMessage = useCallback(async () => {
206
+ const text = input.trim();
207
+ if (!text || loading) return;
208
+ if (!resolvedKey) return;
209
+ const userMsg = { role: "user", content: text };
210
+ const updatedMessages = [...messages, userMsg];
211
+ setMessages(updatedMessages);
212
+ setInput("");
213
+ setLoading(true);
214
+ setError(null);
215
+ try {
216
+ let response;
217
+ if (provider === "openai") {
218
+ response = await callOpenAI(updatedMessages, resolvedKey, resolvedModel, context);
219
+ } else {
220
+ response = await callAnthropic(updatedMessages, resolvedKey, resolvedModel, context);
221
+ }
222
+ setMessages((prev) => [...prev, { role: "assistant", content: response }]);
223
+ } catch (err) {
224
+ setError(err instanceof Error ? err.message : "Failed to get response");
225
+ } finally {
226
+ setLoading(false);
227
+ }
228
+ }, [input, loading, messages, provider, resolvedKey, resolvedModel, context]);
229
+ const handleKeyDown = useCallback(
230
+ (e) => {
231
+ if (e.key === "Enter" && !e.shiftKey) {
232
+ e.preventDefault();
233
+ sendMessage();
234
+ }
235
+ },
236
+ [sendMessage]
237
+ );
238
+ if (!open) {
239
+ return /* @__PURE__ */ jsx(
240
+ "button",
241
+ {
242
+ "data-testid": "ai-chat-button",
243
+ onClick: () => setOpen(true),
244
+ "aria-label": "Open AI chat",
245
+ style: {
246
+ position: "fixed",
247
+ bottom: 24,
248
+ right: 24,
249
+ zIndex: 900,
250
+ width: 48,
251
+ height: 48,
252
+ borderRadius: "50%",
253
+ background: "var(--ac)",
254
+ color: "#fff",
255
+ border: "none",
256
+ cursor: "pointer",
257
+ display: "flex",
258
+ alignItems: "center",
259
+ justifyContent: "center",
260
+ boxShadow: "0 4px 16px rgba(0,0,0,0.25)",
261
+ transition: "transform 0.15s"
262
+ },
263
+ children: /* @__PURE__ */ jsx(ChatIcon, {})
264
+ }
265
+ );
266
+ }
267
+ return /* @__PURE__ */ jsxs(
268
+ "div",
269
+ {
270
+ "data-testid": "ai-chat-panel",
271
+ style: {
272
+ position: "fixed",
273
+ bottom: 24,
274
+ right: 24,
275
+ zIndex: 900,
276
+ width: 380,
277
+ maxWidth: "calc(100vw - 48px)",
278
+ height: 520,
279
+ maxHeight: "calc(100vh - 48px)",
280
+ background: "var(--sf)",
281
+ border: "1px solid var(--bd)",
282
+ borderRadius: 12,
283
+ boxShadow: "0 16px 64px rgba(0,0,0,0.3)",
284
+ display: "flex",
285
+ flexDirection: "column",
286
+ overflow: "hidden",
287
+ fontFamily: "var(--font-body)"
288
+ },
289
+ children: [
290
+ /* @__PURE__ */ jsxs(
291
+ "div",
292
+ {
293
+ style: {
294
+ display: "flex",
295
+ alignItems: "center",
296
+ justifyContent: "space-between",
297
+ padding: "12px 16px",
298
+ borderBottom: "1px solid var(--bd)",
299
+ flexShrink: 0
300
+ },
301
+ children: [
302
+ /* @__PURE__ */ jsx(
303
+ "span",
304
+ {
305
+ style: {
306
+ fontSize: 14,
307
+ fontWeight: 600,
308
+ color: "var(--tx)"
309
+ },
310
+ children: "Ask AI"
311
+ }
312
+ ),
313
+ /* @__PURE__ */ jsx(
314
+ "button",
315
+ {
316
+ "data-testid": "ai-chat-close",
317
+ onClick: () => setOpen(false),
318
+ "aria-label": "Close AI chat",
319
+ style: {
320
+ background: "none",
321
+ border: "none",
322
+ color: "var(--txM)",
323
+ cursor: "pointer",
324
+ display: "flex",
325
+ padding: 4
326
+ },
327
+ children: /* @__PURE__ */ jsx(CloseIcon, {})
328
+ }
329
+ )
330
+ ]
331
+ }
332
+ ),
333
+ /* @__PURE__ */ jsxs(
334
+ "div",
335
+ {
336
+ style: {
337
+ flex: 1,
338
+ overflow: "auto",
339
+ padding: "12px 16px"
340
+ },
341
+ children: [
342
+ !resolvedKey && /* @__PURE__ */ jsxs(
343
+ "div",
344
+ {
345
+ "data-testid": "ai-chat-no-key",
346
+ style: {
347
+ textAlign: "center",
348
+ color: "var(--txM)",
349
+ fontSize: 13,
350
+ padding: "24px 8px",
351
+ lineHeight: 1.6
352
+ },
353
+ children: [
354
+ /* @__PURE__ */ jsx("p", { style: { marginBottom: 8, fontWeight: 500, color: "var(--tx)" }, children: "AI not configured" }),
355
+ /* @__PURE__ */ jsxs("p", { style: { marginBottom: 8 }, children: [
356
+ "To enable AI chat, set the ",
357
+ /* @__PURE__ */ jsx("code", { style: {
358
+ fontFamily: "var(--font-code)",
359
+ fontSize: "0.88em",
360
+ background: "var(--cdBg)",
361
+ padding: "0.15em 0.4em",
362
+ borderRadius: 4
363
+ }, children: "apiKeyEnv" }),
364
+ " in ",
365
+ /* @__PURE__ */ jsx("code", { style: {
366
+ fontFamily: "var(--font-code)",
367
+ fontSize: "0.88em",
368
+ background: "var(--cdBg)",
369
+ padding: "0.15em 0.4em",
370
+ borderRadius: 4
371
+ }, children: "tome.config.js" }),
372
+ " and provide the environment variable at build time."
373
+ ] }),
374
+ /* @__PURE__ */ jsxs("p", { style: { fontSize: 11.5, color: "var(--txM)" }, children: [
375
+ "Example: ",
376
+ /* @__PURE__ */ jsx("code", { style: {
377
+ fontFamily: "var(--font-code)",
378
+ fontSize: "0.88em",
379
+ background: "var(--cdBg)",
380
+ padding: "0.15em 0.4em",
381
+ borderRadius: 4
382
+ }, children: "TOME_AI_KEY=sk-... tome build" })
383
+ ] })
384
+ ]
385
+ }
386
+ ),
387
+ messages.map((msg, i) => /* @__PURE__ */ jsx(
388
+ "div",
389
+ {
390
+ "data-testid": `ai-chat-message-${msg.role}`,
391
+ style: {
392
+ marginBottom: 12,
393
+ display: "flex",
394
+ justifyContent: msg.role === "user" ? "flex-end" : "flex-start"
395
+ },
396
+ children: /* @__PURE__ */ jsx(
397
+ "div",
398
+ {
399
+ style: {
400
+ maxWidth: "85%",
401
+ padding: "8px 12px",
402
+ borderRadius: 10,
403
+ fontSize: 13,
404
+ lineHeight: 1.55,
405
+ whiteSpace: "pre-wrap",
406
+ wordBreak: "break-word",
407
+ background: msg.role === "user" ? "var(--ac)" : "var(--cdBg)",
408
+ color: msg.role === "user" ? "#fff" : "var(--tx)"
409
+ },
410
+ children: msg.content
411
+ }
412
+ )
413
+ },
414
+ i
415
+ )),
416
+ loading && /* @__PURE__ */ jsx(
417
+ "div",
418
+ {
419
+ "data-testid": "ai-chat-loading",
420
+ style: {
421
+ display: "flex",
422
+ justifyContent: "flex-start",
423
+ marginBottom: 12
424
+ },
425
+ children: /* @__PURE__ */ jsx(
426
+ "div",
427
+ {
428
+ style: {
429
+ padding: "8px 12px",
430
+ borderRadius: 10,
431
+ fontSize: 13,
432
+ background: "var(--cdBg)",
433
+ color: "var(--txM)"
434
+ },
435
+ children: "Thinking..."
436
+ }
437
+ )
438
+ }
439
+ ),
440
+ error && /* @__PURE__ */ jsx(
441
+ "div",
442
+ {
443
+ "data-testid": "ai-chat-error",
444
+ style: {
445
+ padding: "8px 12px",
446
+ borderRadius: 8,
447
+ fontSize: 12,
448
+ background: "rgba(220,50,50,0.1)",
449
+ color: "#d44",
450
+ marginBottom: 12
451
+ },
452
+ children: error
453
+ }
454
+ ),
455
+ /* @__PURE__ */ jsx("div", { ref: messagesEndRef })
456
+ ]
457
+ }
458
+ ),
459
+ /* @__PURE__ */ jsxs(
460
+ "div",
461
+ {
462
+ style: {
463
+ display: "flex",
464
+ alignItems: "center",
465
+ gap: 8,
466
+ padding: "10px 12px",
467
+ borderTop: "1px solid var(--bd)",
468
+ flexShrink: 0
469
+ },
470
+ children: [
471
+ /* @__PURE__ */ jsx(
472
+ "input",
473
+ {
474
+ ref: inputRef,
475
+ "data-testid": "ai-chat-input",
476
+ value: input,
477
+ onChange: (e) => setInput(e.target.value),
478
+ onKeyDown: handleKeyDown,
479
+ placeholder: resolvedKey ? "Ask a question..." : "API key required",
480
+ disabled: !resolvedKey,
481
+ style: {
482
+ flex: 1,
483
+ background: "var(--cdBg)",
484
+ border: "1px solid var(--bd)",
485
+ borderRadius: 8,
486
+ padding: "8px 12px",
487
+ color: "var(--tx)",
488
+ fontSize: 13,
489
+ fontFamily: "var(--font-body)",
490
+ outline: "none"
491
+ }
492
+ }
493
+ ),
494
+ /* @__PURE__ */ jsx(
495
+ "button",
496
+ {
497
+ "data-testid": "ai-chat-send",
498
+ onClick: sendMessage,
499
+ disabled: !resolvedKey || !input.trim() || loading,
500
+ "aria-label": "Send message",
501
+ style: {
502
+ width: 34,
503
+ height: 34,
504
+ borderRadius: 8,
505
+ background: resolvedKey && input.trim() ? "var(--ac)" : "var(--cdBg)",
506
+ color: resolvedKey && input.trim() ? "#fff" : "var(--txM)",
507
+ border: "none",
508
+ cursor: resolvedKey && input.trim() ? "pointer" : "default",
509
+ display: "flex",
510
+ alignItems: "center",
511
+ justifyContent: "center",
512
+ flexShrink: 0
513
+ },
514
+ children: /* @__PURE__ */ jsx(SendIcon, {})
515
+ }
516
+ )
517
+ ]
518
+ }
519
+ )
520
+ ]
521
+ }
522
+ );
523
+ }
524
+
525
+ // src/Shell.tsx
526
+ import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
527
+ function hexToRgb(hex) {
528
+ const m = /^#([0-9a-f]{6})$/i.exec(hex.trim());
529
+ if (!m) return null;
530
+ const n = parseInt(m[1], 16);
531
+ return [n >> 16 & 255, n >> 8 & 255, n & 255];
532
+ }
533
+ function buildAccentOverride(hex, isDark) {
534
+ const rgb = hexToRgb(hex);
535
+ if (!rgb) return null;
536
+ const [r, g, b] = rgb;
537
+ const acD = `rgba(${r},${g},${b},${isDark ? 0.12 : 0.08})`;
538
+ const factor = isDark ? 1.15 : 0.85;
539
+ const tr = Math.min(255, Math.round(r * factor));
540
+ const tg = Math.min(255, Math.round(g * factor));
541
+ const tb = Math.min(255, Math.round(b * factor));
542
+ const acT = `rgb(${tr},${tg},${tb})`;
543
+ return { ac: hex, acD, acT };
544
+ }
545
+ var Icon = ({ d, size = 16 }) => /* @__PURE__ */ jsx2(
546
+ "svg",
547
+ {
548
+ width: size,
549
+ height: size,
550
+ viewBox: "0 0 24 24",
551
+ fill: "none",
552
+ stroke: "currentColor",
553
+ strokeWidth: "1.5",
554
+ strokeLinecap: "round",
555
+ strokeLinejoin: "round",
556
+ children: /* @__PURE__ */ jsx2("path", { d })
557
+ }
558
+ );
559
+ var SearchIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M11 19a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM21 21l-4.3-4.3" });
560
+ var ChevRight = () => /* @__PURE__ */ jsx2(Icon, { d: "M9 18l6-6-6-6", size: 14 });
561
+ var ChevDown = () => /* @__PURE__ */ jsx2(Icon, { d: "M6 9l6 6 6-6", size: 14 });
562
+ var MenuIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M3 12h18M3 6h18M3 18h18", size: 20 });
563
+ var XIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M18 6L6 18M6 6l12 12", size: 18 });
564
+ var MoonIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" });
565
+ var SunIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Zm0-4a1 1 0 0 1 1-1v-1a1 1 0 0 1-2 0v1a1 1 0 0 1 1 1Zm0 16a1 1 0 0 1 1 1v1a1 1 0 0 1-2 0v-1a1 1 0 0 1 1-1ZM4 12a1 1 0 0 1-1 1H2a1 1 0 0 1 0-2h1a1 1 0 0 1 1 1Zm18-1h-1a1 1 0 0 1 0 2h1a1 1 0 0 1 0-2ZM6.34 6.34a1 1 0 0 1-1.41 0l-.71-.71a1 1 0 0 1 1.41-1.41l.71.71a1 1 0 0 1 0 1.41Zm12.73-2.12-.71.71a1 1 0 0 1-1.41-1.41l.71-.71a1 1 0 1 1 1.41 1.41ZM6.34 17.66l-.71.71a1 1 0 0 1-1.41-1.41l.71-.71a1 1 0 0 1 1.41 1.41Zm12.73 2.12-.71-.71a1 1 0 0 1 1.41-1.41l.71.71a1 1 0 0 1-1.41 1.41Z" });
566
+ var ArrowLeft = () => /* @__PURE__ */ jsx2(Icon, { d: "M19 12H5M12 19l-7-7 7-7", size: 14 });
567
+ var ArrowRight = () => /* @__PURE__ */ jsx2(Icon, { d: "M5 12h14M12 5l7 7-7 7", size: 14 });
568
+ var PencilIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M17 3a2.83 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z", size: 13 });
569
+ function formatRelativeDate(isoDate) {
570
+ const date = new Date(isoDate);
571
+ const now = /* @__PURE__ */ new Date();
572
+ const diffMs = now.getTime() - date.getTime();
573
+ if (isNaN(diffMs)) return "";
574
+ const seconds = Math.floor(diffMs / 1e3);
575
+ const minutes = Math.floor(seconds / 60);
576
+ const hours = Math.floor(minutes / 60);
577
+ const days = Math.floor(hours / 24);
578
+ const months = Math.floor(days / 30);
579
+ const years = Math.floor(days / 365);
580
+ if (seconds < 60) return "just now";
581
+ if (minutes < 60) return `${minutes} minute${minutes === 1 ? "" : "s"} ago`;
582
+ if (hours < 24) return `${hours} hour${hours === 1 ? "" : "s"} ago`;
583
+ if (days < 30) return `${days} day${days === 1 ? "" : "s"} ago`;
584
+ if (months < 12) return `${months} month${months === 1 ? "" : "s"} ago`;
585
+ if (years >= 1) return `${years} year${years === 1 ? "" : "s"} ago`;
586
+ return date.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
587
+ }
588
+ var pagefindInstance = null;
589
+ var PAGEFIND_PATH = "/_pagefind/pagefind.js";
590
+ async function initPagefind() {
591
+ if (pagefindInstance) return pagefindInstance;
592
+ try {
593
+ pagefindInstance = await import(
594
+ /* @vite-ignore */
595
+ PAGEFIND_PATH
596
+ );
597
+ await pagefindInstance.init();
598
+ return pagefindInstance;
599
+ } catch {
600
+ return null;
601
+ }
602
+ }
603
+ var docSearchLoaded = null;
604
+ function loadDocSearch() {
605
+ if (docSearchLoaded) return docSearchLoaded;
606
+ docSearchLoaded = import("@docsearch/react").catch(() => null);
607
+ return docSearchLoaded;
608
+ }
609
+ function AlgoliaSearchModal({
610
+ appId,
611
+ apiKey,
612
+ indexName,
613
+ onNavigate,
614
+ onClose
615
+ }) {
616
+ const [DocSearchComponent, setDocSearchComponent] = useState2(null);
617
+ const [loadFailed, setLoadFailed] = useState2(false);
618
+ useEffect2(() => {
619
+ loadDocSearch().then((mod) => {
620
+ if (mod && mod.DocSearch) {
621
+ setDocSearchComponent(() => mod.DocSearch);
622
+ } else if (mod && mod.default) {
623
+ setDocSearchComponent(() => mod.default);
624
+ } else {
625
+ setLoadFailed(true);
626
+ }
627
+ });
628
+ }, []);
629
+ const extractPageId = useCallback2((url) => {
630
+ try {
631
+ const parsed = new URL(url, "http://localhost");
632
+ let pathname = parsed.pathname;
633
+ if (basePath) {
634
+ const bp = basePath.replace(/\/$/, "");
635
+ if (pathname.startsWith(bp)) pathname = pathname.slice(bp.length);
636
+ }
637
+ return pathname.replace(/^\//, "").replace(/\/index\.html$/, "").replace(/\.html$/, "") || "index";
638
+ } catch {
639
+ return "index";
640
+ }
641
+ }, [basePath]);
642
+ if (loadFailed) {
643
+ return /* @__PURE__ */ jsx2("div", { onClick: onClose, style: {
644
+ position: "fixed",
645
+ inset: 0,
646
+ zIndex: 1e3,
647
+ background: "rgba(0,0,0,0.55)",
648
+ backdropFilter: "blur(6px)",
649
+ display: "flex",
650
+ alignItems: "flex-start",
651
+ justifyContent: "center",
652
+ paddingTop: "12vh"
653
+ }, children: /* @__PURE__ */ jsx2("div", { onClick: (e) => e.stopPropagation(), style: {
654
+ background: "var(--sf)",
655
+ border: "1px solid var(--bd)",
656
+ borderRadius: 12,
657
+ width: "100%",
658
+ maxWidth: 520,
659
+ boxShadow: "0 24px 80px rgba(0,0,0,0.4)",
660
+ padding: "32px 18px",
661
+ textAlign: "center",
662
+ color: "var(--txM)",
663
+ fontSize: 14
664
+ }, children: "Algolia DocSearch is not available. Install @docsearch/react to enable it." }) });
665
+ }
666
+ if (!DocSearchComponent) {
667
+ return /* @__PURE__ */ jsx2("div", { onClick: onClose, style: {
668
+ position: "fixed",
669
+ inset: 0,
670
+ zIndex: 1e3,
671
+ background: "rgba(0,0,0,0.55)",
672
+ backdropFilter: "blur(6px)",
673
+ display: "flex",
674
+ alignItems: "flex-start",
675
+ justifyContent: "center",
676
+ paddingTop: "12vh"
677
+ }, children: /* @__PURE__ */ jsx2("div", { style: {
678
+ background: "var(--sf)",
679
+ border: "1px solid var(--bd)",
680
+ borderRadius: 12,
681
+ width: "100%",
682
+ maxWidth: 520,
683
+ boxShadow: "0 24px 80px rgba(0,0,0,0.4)",
684
+ padding: "32px 18px",
685
+ textAlign: "center",
686
+ color: "var(--txM)",
687
+ fontSize: 14
688
+ }, children: "Loading search..." }) });
689
+ }
690
+ return /* @__PURE__ */ jsx2("div", { "data-testid": "algolia-search-modal", children: /* @__PURE__ */ jsx2(
691
+ DocSearchComponent,
692
+ {
693
+ appId,
694
+ apiKey,
695
+ indexName,
696
+ navigator: {
697
+ navigate({ itemUrl }) {
698
+ const pageId = extractPageId(itemUrl);
699
+ onNavigate(pageId);
700
+ }
701
+ },
702
+ hitComponent: ({ hit, children }) => /* @__PURE__ */ jsx2("a", { href: hit.url, onClick: (e) => {
703
+ e.preventDefault();
704
+ const pageId = extractPageId(hit.url);
705
+ onNavigate(pageId);
706
+ }, children })
707
+ }
708
+ ) });
709
+ }
710
+ var VersionIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M12 8v4l3 3m6-3a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z", size: 14 });
711
+ var GlobeIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18ZM3.6 9h16.8M3.6 15h16.8M12 3a15 15 0 0 1 4 9 15 15 0 0 1-4 9 15 15 0 0 1-4-9 15 15 0 0 1 4-9Z", size: 14 });
712
+ var ExtLinkIcon = () => /* @__PURE__ */ jsx2(Icon, { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14L21 3", size: 11 });
713
+ var CHANGELOG_SECTION_COLORS = {
714
+ Added: "#22c55e",
715
+ Changed: "#3b82f6",
716
+ Deprecated: "#f59e0b",
717
+ Removed: "#ef4444",
718
+ Fixed: "#8b5cf6",
719
+ Security: "#f97316"
720
+ };
721
+ function ChangelogView({ entries }) {
722
+ const [showAll, setShowAll] = useState2(entries.length <= 5);
723
+ const visible = showAll ? entries : entries.slice(0, 5);
724
+ return /* @__PURE__ */ jsxs2("div", { "data-testid": "changelog-timeline", style: { position: "relative" }, children: [
725
+ /* @__PURE__ */ jsx2("div", { style: { position: "absolute", left: 15, top: 8, bottom: 8, width: 2, background: "var(--bd)" } }),
726
+ visible.map((entry, i) => /* @__PURE__ */ jsxs2(
727
+ "div",
728
+ {
729
+ "data-testid": `changelog-entry-${entry.version}`,
730
+ style: { position: "relative", paddingLeft: 44, paddingBottom: i < visible.length - 1 ? 32 : 0 },
731
+ children: [
732
+ /* @__PURE__ */ jsx2("div", { style: {
733
+ position: "absolute",
734
+ left: 8,
735
+ top: 6,
736
+ width: 16,
737
+ height: 16,
738
+ borderRadius: "50%",
739
+ background: entry.version === "Unreleased" ? "var(--txM)" : "var(--ac)",
740
+ border: "3px solid var(--bg, #1a1a1a)"
741
+ } }),
742
+ /* @__PURE__ */ jsxs2("div", { style: { display: "flex", alignItems: "baseline", gap: 12, marginBottom: 12 }, children: [
743
+ /* @__PURE__ */ jsx2("span", { style: { fontSize: 18, fontWeight: 700, color: "var(--tx)", fontFamily: "var(--font-heading, inherit)" }, children: entry.url ? /* @__PURE__ */ jsx2("a", { href: entry.url, target: "_blank", rel: "noopener noreferrer", style: { color: "inherit", textDecoration: "none" }, children: entry.version }) : entry.version }),
744
+ entry.date && /* @__PURE__ */ jsx2("span", { style: { fontSize: 13, color: "var(--txM)", fontFamily: "var(--font-code, monospace)" }, children: entry.date })
745
+ ] }),
746
+ entry.sections.map((section) => {
747
+ const sColor = CHANGELOG_SECTION_COLORS[section.type] || "#6b7280";
748
+ return /* @__PURE__ */ jsxs2("div", { style: { marginBottom: 16 }, children: [
749
+ /* @__PURE__ */ jsxs2("div", { style: { display: "inline-flex", alignItems: "center", gap: 6, marginBottom: 8 }, children: [
750
+ /* @__PURE__ */ jsx2("span", { style: { display: "inline-block", width: 8, height: 8, borderRadius: "50%", background: sColor } }),
751
+ /* @__PURE__ */ jsx2("span", { style: { fontSize: 12, fontWeight: 600, textTransform: "uppercase", letterSpacing: ".06em", color: sColor, fontFamily: "var(--font-code, monospace)" }, children: section.type })
752
+ ] }),
753
+ /* @__PURE__ */ jsx2("ul", { style: { margin: 0, paddingLeft: 18, listStyleType: "disc", color: "var(--tx2)" }, children: section.items.map((item, j) => /* @__PURE__ */ jsx2("li", { style: { fontSize: 14, lineHeight: 1.7, color: "var(--tx2)", marginBottom: 2 }, children: item }, j)) })
754
+ ] }, section.type);
755
+ })
756
+ ]
757
+ },
758
+ entry.version
759
+ )),
760
+ !showAll && entries.length > 5 && /* @__PURE__ */ jsx2("div", { style: { textAlign: "center", marginTop: 24 }, children: /* @__PURE__ */ jsxs2(
761
+ "button",
762
+ {
763
+ "data-testid": "changelog-show-more",
764
+ onClick: () => setShowAll(true),
765
+ style: { background: "none", border: "1px solid var(--bd)", borderRadius: 2, padding: "8px 20px", color: "var(--tx2)", fontSize: 13, fontFamily: "var(--font-body, inherit)", cursor: "pointer" },
766
+ children: [
767
+ "Show all ",
768
+ entries.length,
769
+ " releases"
770
+ ]
771
+ }
772
+ ) })
773
+ ] });
774
+ }
775
+ function Shell({
776
+ config: config2,
777
+ navigation: navigation2,
778
+ currentPageId,
779
+ pageHtml,
780
+ pageComponent,
781
+ mdxComponents,
782
+ pageTitle,
783
+ pageDescription,
784
+ headings,
785
+ tocEnabled = true,
786
+ editUrl,
787
+ lastUpdated,
788
+ changelogEntries,
789
+ onNavigate,
790
+ allPages,
791
+ versioning,
792
+ currentVersion,
793
+ i18n,
794
+ currentLocale,
795
+ docContext: docContext2,
796
+ basePath: basePath3 = ""
797
+ }) {
798
+ const themeMode = config2.theme?.mode || "auto";
799
+ const [isDark, setDark] = useState2(() => {
800
+ if (themeMode === "dark") return true;
801
+ if (themeMode === "light") return false;
802
+ return window.matchMedia?.("(prefers-color-scheme: dark)").matches ?? true;
803
+ });
804
+ const [mobile, setMobile] = useState2(() => typeof window !== "undefined" && window.innerWidth < 768);
805
+ const [sbOpen, setSb] = useState2(() => typeof window !== "undefined" && window.innerWidth >= 768);
806
+ const [searchOpen, setSearch] = useState2(false);
807
+ const [versionDropdownOpen, setVersionDropdown] = useState2(false);
808
+ const [localeDropdownOpen, setLocaleDropdown] = useState2(false);
809
+ const [zoomSrc, setZoomSrc] = useState2(null);
810
+ const [feedbackGiven, setFeedbackGiven] = useState2({});
811
+ const [bannerDismissed, setBannerDismissed] = useState2(() => {
812
+ if (!config2.banner?.text) return true;
813
+ try {
814
+ const hash = Array.from(config2.banner.text).reduce((h, c) => (h << 5) - h + c.charCodeAt(0) | 0, 0).toString(36);
815
+ return localStorage.getItem("tome-banner-dismissed") === hash;
816
+ } catch {
817
+ return false;
818
+ }
819
+ });
820
+ const isOldVersion = versioning && currentVersion && currentVersion !== versioning.current;
821
+ const [expanded, setExpanded] = useState2(navigation2.map((n) => n.section));
822
+ const contentRef = useRef2(null);
823
+ const [wide, setWide] = useState2(() => typeof window !== "undefined" && window.innerWidth > 1100);
824
+ const preset = config2.theme?.preset || "amber";
825
+ const baseTokens = THEME_PRESETS[preset]?.[isDark ? "dark" : "light"] || THEME_PRESETS.amber.dark;
826
+ const accentOverride = config2.theme?.accent ? buildAccentOverride(config2.theme.accent, isDark) : null;
827
+ const t = accentOverride ? { ...baseTokens, ...accentOverride } : baseTokens;
828
+ const presetFonts = THEME_PRESETS[preset]?.fonts || THEME_PRESETS.amber.fonts;
829
+ const fonts = {
830
+ heading: config2.theme?.fonts?.heading || presetFonts.heading,
831
+ body: config2.theme?.fonts?.body || presetFonts.body,
832
+ code: config2.theme?.fonts?.code || presetFonts.code
833
+ };
834
+ useEffect2(() => {
835
+ if (themeMode !== "auto") return;
836
+ const mq = window.matchMedia("(prefers-color-scheme: dark)");
837
+ const handler = (e) => setDark(e.matches);
838
+ mq.addEventListener("change", handler);
839
+ return () => mq.removeEventListener("change", handler);
840
+ }, [themeMode]);
841
+ useEffect2(() => {
842
+ document.documentElement.classList.toggle("dark", isDark);
843
+ }, [isDark]);
844
+ useEffect2(() => {
845
+ const handleResize = () => {
846
+ const w = window.innerWidth;
847
+ setWide(w > 1100);
848
+ setMobile(w < 768);
849
+ };
850
+ handleResize();
851
+ window.addEventListener("resize", handleResize);
852
+ return () => window.removeEventListener("resize", handleResize);
853
+ }, []);
854
+ useEffect2(() => {
855
+ if (mobile && sbOpen) {
856
+ document.body.style.overflow = "hidden";
857
+ return () => {
858
+ document.body.style.overflow = "";
859
+ };
860
+ }
861
+ }, [mobile, sbOpen]);
862
+ useEffect2(() => {
863
+ contentRef.current?.scrollTo(0, 0);
864
+ }, [currentPageId]);
865
+ useEffect2(() => {
866
+ const el = contentRef.current;
867
+ if (!el) return;
868
+ const handler = (e) => {
869
+ const target = e.target;
870
+ if (target.tagName === "IMG" && target.closest(".tome-content")) {
871
+ setZoomSrc(target.src);
872
+ }
873
+ };
874
+ el.addEventListener("click", handler);
875
+ return () => el.removeEventListener("click", handler);
876
+ }, []);
877
+ useEffect2(() => {
878
+ const el = contentRef.current;
879
+ if (!el) return;
880
+ const handler = (e) => {
881
+ const anchor = e.target.closest("a");
882
+ if (!anchor) return;
883
+ const href = anchor.getAttribute("href");
884
+ if (!href) return;
885
+ if (href.startsWith("http://") || href.startsWith("https://") || href.startsWith("mailto:") || href.startsWith("tel:") || href.startsWith("//")) return;
886
+ if (href.startsWith("#")) return;
887
+ e.preventDefault();
888
+ let pageId = href.replace(/^\.\//, "").replace(/^\//, "").replace(/\.mdx?$/, "").replace(/\/$/, "");
889
+ if (basePath3) {
890
+ const normalized = basePath3.replace(/^\//, "").replace(/\/$/, "");
891
+ if (normalized && pageId.startsWith(normalized + "/")) {
892
+ pageId = pageId.slice(normalized.length + 1);
893
+ } else if (normalized && pageId === normalized) {
894
+ pageId = "index";
895
+ }
896
+ }
897
+ if (!pageId) pageId = "index";
898
+ onNavigate(pageId);
899
+ };
900
+ el.addEventListener("click", handler);
901
+ return () => el.removeEventListener("click", handler);
902
+ }, [onNavigate, basePath3]);
903
+ useEffect2(() => {
904
+ if (!zoomSrc) return;
905
+ const handler = (e) => {
906
+ if (e.key === "Escape") setZoomSrc(null);
907
+ };
908
+ window.addEventListener("keydown", handler);
909
+ return () => window.removeEventListener("keydown", handler);
910
+ }, [zoomSrc]);
911
+ const tocConfig = config2.toc;
912
+ const tocDepth = tocConfig?.depth ?? 3;
913
+ const tocGlobalEnabled = tocConfig?.enabled !== false;
914
+ const showToc = tocGlobalEnabled && tocEnabled;
915
+ const filteredHeadings = headings.filter((h) => h.depth <= tocDepth);
916
+ const [activeHeadingId, setActiveHeadingId] = useState2("");
917
+ useEffect2(() => {
918
+ if (!showToc || filteredHeadings.length < 2) return;
919
+ const scrollRoot = contentRef.current;
920
+ if (!scrollRoot) return;
921
+ const timerId = setTimeout(() => {
922
+ const headingElements = [];
923
+ for (const h of filteredHeadings) {
924
+ const el = scrollRoot.querySelector(`#${CSS.escape(h.id)}`);
925
+ if (el) headingElements.push(el);
926
+ }
927
+ if (headingElements.length === 0) return;
928
+ const observer = new IntersectionObserver(
929
+ (entries) => {
930
+ const visible = entries.filter((e) => e.isIntersecting).sort((a, b) => a.boundingClientRect.top - b.boundingClientRect.top);
931
+ if (visible.length > 0) {
932
+ setActiveHeadingId(visible[0].target.id);
933
+ }
934
+ },
935
+ {
936
+ root: scrollRoot,
937
+ // Trigger when heading enters the top 20% of the scroll container
938
+ rootMargin: "0px 0px -80% 0px",
939
+ threshold: 0
940
+ }
941
+ );
942
+ for (const el of headingElements) observer.observe(el);
943
+ observerRef.current = observer;
944
+ }, 100);
945
+ return () => {
946
+ clearTimeout(timerId);
947
+ observerRef.current?.disconnect();
948
+ observerRef.current = null;
949
+ };
950
+ }, [currentPageId, showToc, filteredHeadings.map((h) => h.id).join(",")]);
951
+ const observerRef = useRef2(null);
952
+ useEffect2(() => {
953
+ setActiveHeadingId("");
954
+ }, [currentPageId]);
955
+ const scrollToHeading = useCallback2((e, id) => {
956
+ e.preventDefault();
957
+ const scrollRoot = contentRef.current;
958
+ if (!scrollRoot) return;
959
+ const target = scrollRoot.querySelector(`#${CSS.escape(id)}`);
960
+ if (target) {
961
+ target.scrollIntoView({ behavior: "smooth", block: "start" });
962
+ setActiveHeadingId(id);
963
+ }
964
+ }, []);
965
+ useEffect2(() => {
966
+ const h = (e) => {
967
+ if ((e.metaKey || e.ctrlKey) && e.key === "k") {
968
+ e.preventDefault();
969
+ setSearch(true);
970
+ }
971
+ if (e.key === "Escape") setSearch(false);
972
+ };
973
+ window.addEventListener("keydown", h);
974
+ return () => window.removeEventListener("keydown", h);
975
+ }, []);
976
+ const allNavPages = navigation2.flatMap((g) => g.pages);
977
+ const idx = allNavPages.findIndex((p) => p.id === currentPageId);
978
+ const prev = idx > 0 ? allNavPages[idx - 1] : null;
979
+ const next = idx < allNavPages.length - 1 ? allNavPages[idx + 1] : null;
980
+ const togSec = (s) => setExpanded((p) => p.includes(s) ? p.filter((x) => x !== s) : [...p, s]);
981
+ const cssVars = {
982
+ "--bg": t.bg,
983
+ "--sf": t.sf,
984
+ "--sfH": t.sfH,
985
+ "--bd": t.bd,
986
+ "--tx": t.tx,
987
+ "--tx2": t.tx2,
988
+ "--txM": t.txM,
989
+ "--ac": t.ac,
990
+ "--acD": t.acD,
991
+ "--acT": t.acT,
992
+ "--cdBg": t.cdBg,
993
+ "--cdTx": t.cdTx,
994
+ "--sbBg": t.sbBg,
995
+ "--hdBg": t.hdBg,
996
+ "--font-heading": `"${fonts.heading}", serif`,
997
+ "--font-body": `"${fonts.body}", sans-serif`,
998
+ "--font-code": `"${fonts.code}", monospace`
999
+ };
1000
+ const PageComponent = pageComponent;
1001
+ const bannerLink = config2.banner?.link;
1002
+ const bannerIsInternal = bannerLink ? bannerLink.startsWith("#") || basePath3 && bannerLink.startsWith(basePath3 + "/") : false;
1003
+ return /* @__PURE__ */ jsxs2("div", { className: "tome-grain", style: { ...cssVars, color: "var(--tx)", background: "var(--bg)", fontFamily: "var(--font-body)", minHeight: "100vh", overflow: "hidden" }, children: [
1004
+ config2.banner?.text && !bannerDismissed && /* @__PURE__ */ jsxs2("div", { style: {
1005
+ display: "flex",
1006
+ alignItems: "center",
1007
+ justifyContent: "center",
1008
+ gap: 12,
1009
+ background: "var(--ac)",
1010
+ color: "#fff",
1011
+ padding: "8px 16px",
1012
+ fontSize: 13,
1013
+ fontFamily: "var(--font-body)",
1014
+ fontWeight: 500,
1015
+ textAlign: "center",
1016
+ width: "100%",
1017
+ boxSizing: "border-box"
1018
+ }, children: [
1019
+ config2.banner.link ? /* @__PURE__ */ jsx2(
1020
+ "a",
1021
+ {
1022
+ href: bannerIsInternal && bannerLink.startsWith("#") ? basePath3 + "/" + bannerLink.slice(1) : bannerLink,
1023
+ ...bannerIsInternal ? {} : { target: "_blank", rel: "noopener noreferrer" },
1024
+ style: { color: "#fff", textDecoration: "underline" },
1025
+ onClick: bannerIsInternal ? (e) => {
1026
+ e.preventDefault();
1027
+ const bp = basePath3.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
1028
+ const pageId = bannerLink.startsWith("#") ? bannerLink.slice(1) : bannerLink.replace(new RegExp("^" + bp + "/?"), "");
1029
+ onNavigate(pageId || "index");
1030
+ } : void 0,
1031
+ children: config2.banner.text
1032
+ }
1033
+ ) : /* @__PURE__ */ jsx2("span", { children: config2.banner.text }),
1034
+ config2.banner.dismissible !== false && /* @__PURE__ */ jsx2(
1035
+ "button",
1036
+ {
1037
+ onClick: () => {
1038
+ setBannerDismissed(true);
1039
+ try {
1040
+ const hash = Array.from(config2.banner.text).reduce((h, c) => (h << 5) - h + c.charCodeAt(0) | 0, 0).toString(36);
1041
+ localStorage.setItem("tome-banner-dismissed", hash);
1042
+ } catch {
1043
+ }
1044
+ },
1045
+ "aria-label": "Dismiss banner",
1046
+ style: { background: "none", border: "none", color: "#fff", cursor: "pointer", fontSize: 16, lineHeight: 1, padding: 0, opacity: 0.8 },
1047
+ children: "\xD7"
1048
+ }
1049
+ )
1050
+ ] }),
1051
+ searchOpen && config2.search?.provider === "algolia" && config2.search.appId && config2.search.apiKey && config2.search.indexName ? /* @__PURE__ */ jsx2(
1052
+ AlgoliaSearchModal,
1053
+ {
1054
+ appId: config2.search.appId,
1055
+ apiKey: config2.search.apiKey,
1056
+ indexName: config2.search.indexName,
1057
+ onNavigate: (id) => {
1058
+ onNavigate(id);
1059
+ setSearch(false);
1060
+ },
1061
+ onClose: () => setSearch(false)
1062
+ }
1063
+ ) : searchOpen ? /* @__PURE__ */ jsx2(
1064
+ SearchModal,
1065
+ {
1066
+ allPages,
1067
+ onNavigate: (id) => {
1068
+ onNavigate(id);
1069
+ setSearch(false);
1070
+ },
1071
+ onClose: () => setSearch(false),
1072
+ mobile
1073
+ }
1074
+ ) : null,
1075
+ /* @__PURE__ */ jsxs2("div", { style: { display: "flex", flex: 1, height: config2.banner?.text && !bannerDismissed ? "calc(100vh - 32px)" : "100vh" }, children: [
1076
+ mobile && sbOpen && /* @__PURE__ */ jsx2("div", { onClick: () => setSb(false), style: {
1077
+ position: "fixed",
1078
+ inset: 0,
1079
+ zIndex: 200,
1080
+ background: "rgba(0,0,0,0.4)",
1081
+ backdropFilter: "blur(2px)"
1082
+ } }),
1083
+ /* @__PURE__ */ jsxs2("aside", { style: {
1084
+ width: sbOpen ? 270 : 0,
1085
+ minWidth: sbOpen ? 270 : 0,
1086
+ background: "var(--sbBg)",
1087
+ borderRight: "1px solid var(--bd)",
1088
+ display: "flex",
1089
+ flexDirection: "column",
1090
+ transition: "width .2s, min-width .2s",
1091
+ overflow: "hidden",
1092
+ ...mobile ? { position: "fixed", top: 0, left: 0, bottom: 0, zIndex: 201 } : {}
1093
+ }, children: [
1094
+ /* @__PURE__ */ jsxs2("a", { href: "/", style: { padding: "18px 20px", display: "flex", alignItems: "baseline", gap: 6, borderBottom: "1px solid var(--bd)", textDecoration: "none", color: "inherit" }, children: [
1095
+ /* @__PURE__ */ jsx2("span", { style: { fontFamily: "var(--font-heading)", fontSize: 22, fontWeight: 700, fontStyle: "italic" }, children: config2.name }),
1096
+ /* @__PURE__ */ jsx2("span", { style: { width: 5, height: 5, borderRadius: "50%", background: "var(--ac)", display: "inline-block" } })
1097
+ ] }),
1098
+ /* @__PURE__ */ jsx2("div", { style: { padding: "12px 14px" }, children: /* @__PURE__ */ jsxs2("button", { onClick: () => {
1099
+ setSearch(true);
1100
+ if (mobile) setSb(false);
1101
+ }, style: {
1102
+ display: "flex",
1103
+ alignItems: "center",
1104
+ gap: 8,
1105
+ width: "100%",
1106
+ background: "var(--cdBg)",
1107
+ border: "1px solid var(--bd)",
1108
+ borderRadius: 2,
1109
+ padding: "8px 12px",
1110
+ cursor: "pointer",
1111
+ color: "var(--txM)",
1112
+ fontSize: 12.5,
1113
+ fontFamily: "var(--font-body)"
1114
+ }, children: [
1115
+ /* @__PURE__ */ jsx2(SearchIcon, {}),
1116
+ /* @__PURE__ */ jsx2("span", { style: { flex: 1, textAlign: "left" }, children: "Search..." }),
1117
+ /* @__PURE__ */ jsx2("kbd", { style: { fontFamily: "var(--font-code)", fontSize: 9, background: "var(--sf)", border: "1px solid var(--bd)", borderRadius: 2, padding: "2px 6px" }, children: "\u2318K" })
1118
+ ] }) }),
1119
+ /* @__PURE__ */ jsx2("nav", { style: { flex: 1, overflow: "auto", padding: "4px 10px 20px" }, children: navigation2.map((sec) => /* @__PURE__ */ jsxs2("div", { style: { marginBottom: 8 }, children: [
1120
+ /* @__PURE__ */ jsxs2("button", { onClick: () => togSec(sec.section), style: {
1121
+ display: "flex",
1122
+ alignItems: "center",
1123
+ gap: 6,
1124
+ width: "100%",
1125
+ background: "none",
1126
+ border: "none",
1127
+ padding: "8px 10px",
1128
+ cursor: "pointer",
1129
+ borderRadius: 2,
1130
+ color: "var(--txM)",
1131
+ fontSize: 10,
1132
+ fontWeight: 600,
1133
+ textTransform: "uppercase",
1134
+ letterSpacing: ".1em",
1135
+ fontFamily: "var(--font-code)"
1136
+ }, children: [
1137
+ expanded.includes(sec.section) ? /* @__PURE__ */ jsx2(ChevDown, {}) : /* @__PURE__ */ jsx2(ChevRight, {}),
1138
+ sec.section
1139
+ ] }),
1140
+ expanded.includes(sec.section) && /* @__PURE__ */ jsx2("div", { style: { marginLeft: 8, borderLeft: "1px solid var(--bd)", paddingLeft: 0 }, children: sec.pages.map((p) => {
1141
+ const active = currentPageId === p.id;
1142
+ return /* @__PURE__ */ jsx2("button", { onClick: () => {
1143
+ onNavigate(p.id);
1144
+ if (mobile) setSb(false);
1145
+ }, style: {
1146
+ display: "flex",
1147
+ alignItems: "center",
1148
+ gap: 10,
1149
+ width: "100%",
1150
+ textAlign: "left",
1151
+ background: "none",
1152
+ border: "none",
1153
+ borderRadius: 0,
1154
+ borderLeft: active ? "2px solid var(--ac)" : "2px solid transparent",
1155
+ padding: "7px 14px",
1156
+ cursor: "pointer",
1157
+ color: active ? "var(--ac)" : "var(--tx2)",
1158
+ fontSize: 13,
1159
+ fontWeight: active ? 500 : 400,
1160
+ fontFamily: "var(--font-body)",
1161
+ transition: "all .12s"
1162
+ }, children: p.title }, p.id);
1163
+ }) })
1164
+ ] }, sec.section)) }),
1165
+ versioning && mobile && /* @__PURE__ */ jsx2("div", { style: { padding: "8px 16px", borderTop: "1px solid var(--bd)", display: "flex", gap: 6 }, children: versioning.versions.map((v) => /* @__PURE__ */ jsxs2(
1166
+ "button",
1167
+ {
1168
+ onClick: () => {
1169
+ const targetId = v === versioning.current ? "index" : `${v}/index`;
1170
+ onNavigate(targetId);
1171
+ },
1172
+ style: {
1173
+ flex: 1,
1174
+ padding: "6px 0",
1175
+ textAlign: "center",
1176
+ background: v === (currentVersion || versioning.current) ? "var(--acD)" : "var(--sf)",
1177
+ border: "1px solid var(--bd)",
1178
+ borderRadius: 2,
1179
+ cursor: "pointer",
1180
+ color: v === (currentVersion || versioning.current) ? "var(--ac)" : "var(--tx2)",
1181
+ fontSize: 12,
1182
+ fontFamily: "var(--font-code)",
1183
+ fontWeight: v === versioning.current ? 600 : 400
1184
+ },
1185
+ children: [
1186
+ v,
1187
+ v === versioning.current ? " (latest)" : ""
1188
+ ]
1189
+ },
1190
+ v
1191
+ )) }),
1192
+ /* @__PURE__ */ jsxs2("div", { style: { padding: "12px 16px", borderTop: "1px solid var(--bd)", display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
1193
+ themeMode === "auto" ? /* @__PURE__ */ jsx2("button", { "aria-label": isDark ? "Switch to light mode" : "Switch to dark mode", onClick: () => setDark((d) => !d), style: { background: "none", border: "none", color: "var(--txM)", cursor: "pointer", display: "flex" }, children: isDark ? /* @__PURE__ */ jsx2(SunIcon, {}) : /* @__PURE__ */ jsx2(MoonIcon, {}) }) : /* @__PURE__ */ jsx2("div", {}),
1194
+ /* @__PURE__ */ jsxs2("span", { style: { fontSize: 11, color: "var(--txM)", letterSpacing: 0.2 }, children: [
1195
+ "Built with ",
1196
+ "\u2661",
1197
+ " by Tome"
1198
+ ] }),
1199
+ /* @__PURE__ */ jsx2("span", { style: { fontFamily: "var(--font-code)", fontSize: 10, color: "var(--txM)" }, children: typeof __TOME_VERSION__ !== "undefined" && __TOME_VERSION__ ? `v${__TOME_VERSION__}` : "v0.1.0" })
1200
+ ] })
1201
+ ] }),
1202
+ /* @__PURE__ */ jsxs2("div", { style: { flex: 1, display: "flex", flexDirection: "column", overflow: "hidden" }, children: [
1203
+ /* @__PURE__ */ jsxs2("header", { style: {
1204
+ display: "flex",
1205
+ alignItems: "center",
1206
+ gap: mobile ? 8 : 12,
1207
+ padding: mobile ? "8px 12px" : "10px 24px",
1208
+ borderBottom: "1px solid var(--bd)",
1209
+ background: "var(--hdBg)",
1210
+ backdropFilter: "blur(12px)",
1211
+ maxWidth: "100vw",
1212
+ overflow: "visible",
1213
+ position: "relative",
1214
+ zIndex: 200
1215
+ }, children: [
1216
+ /* @__PURE__ */ jsx2("button", { "aria-label": sbOpen ? "Close sidebar" : "Open sidebar", onClick: () => setSb(!sbOpen), style: { background: "none", border: "none", color: "var(--txM)", cursor: "pointer", display: "flex" }, children: sbOpen ? /* @__PURE__ */ jsx2(XIcon, {}) : /* @__PURE__ */ jsx2(MenuIcon, {}) }),
1217
+ mobile ? /* @__PURE__ */ jsx2("span", { style: { fontSize: 13, color: "var(--ac)", fontFamily: "var(--font-code)", flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: navigation2.flatMap((s) => s.pages).find((p) => p.id === currentPageId)?.title || "" }) : /* @__PURE__ */ jsx2("div", { style: { display: "flex", alignItems: "center", gap: 8, fontFamily: "var(--font-code)", fontSize: 11, color: "var(--txM)", letterSpacing: ".03em", flex: 1 }, children: navigation2.map((s) => {
1218
+ const f = s.pages.find((p) => p.id === currentPageId);
1219
+ if (!f) return null;
1220
+ return /* @__PURE__ */ jsxs2("span", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
1221
+ /* @__PURE__ */ jsx2("span", { children: s.section }),
1222
+ /* @__PURE__ */ jsx2(ChevRight, {}),
1223
+ /* @__PURE__ */ jsx2("span", { style: { color: "var(--ac)" }, children: f.title })
1224
+ ] }, s.section);
1225
+ }) }),
1226
+ config2.topNav && config2.topNav.length > 0 && !mobile && /* @__PURE__ */ jsxs2("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
1227
+ config2.topNav.map((link) => {
1228
+ const isInternal = link.href.startsWith("#") || basePath3 && link.href.startsWith(basePath3 + "/");
1229
+ const isExternal = !isInternal;
1230
+ return /* @__PURE__ */ jsxs2(
1231
+ "a",
1232
+ {
1233
+ href: isInternal && link.href.startsWith("#") ? basePath3 + "/" + link.href.slice(1) : link.href,
1234
+ ...isExternal ? { target: "_blank", rel: "noopener noreferrer" } : {},
1235
+ onClick: isInternal ? (e) => {
1236
+ e.preventDefault();
1237
+ const pageId = link.href.startsWith("#") ? link.href.slice(1) : link.href.replace(new RegExp("^" + basePath3.replace(/[.*+?^${}()|[\]\\]/g, "\\$&") + "/?"), "");
1238
+ onNavigate(pageId);
1239
+ } : void 0,
1240
+ style: {
1241
+ display: "flex",
1242
+ alignItems: "center",
1243
+ gap: 4,
1244
+ color: "var(--txM)",
1245
+ textDecoration: "none",
1246
+ fontSize: 12,
1247
+ fontFamily: "var(--font-body)",
1248
+ fontWeight: 500,
1249
+ transition: "color .15s"
1250
+ },
1251
+ onMouseOver: (e) => e.currentTarget.style.color = "var(--ac)",
1252
+ onMouseOut: (e) => e.currentTarget.style.color = "var(--txM)",
1253
+ children: [
1254
+ link.label,
1255
+ isExternal && /* @__PURE__ */ jsx2(ExtLinkIcon, {})
1256
+ ]
1257
+ },
1258
+ link.label
1259
+ );
1260
+ }),
1261
+ /* @__PURE__ */ jsx2("span", { style: { width: 1, height: 16, background: "var(--bd)" } })
1262
+ ] }),
1263
+ mobile && themeMode === "auto" && /* @__PURE__ */ jsx2("button", { "aria-label": isDark ? "Switch to light mode" : "Switch to dark mode", onClick: () => setDark((d) => !d), style: { background: "none", border: "none", color: "var(--txM)", cursor: "pointer", display: "flex", flexShrink: 0 }, children: isDark ? /* @__PURE__ */ jsx2(SunIcon, {}) : /* @__PURE__ */ jsx2(MoonIcon, {}) }),
1264
+ versioning && !mobile && /* @__PURE__ */ jsxs2("div", { style: { position: "relative" }, children: [
1265
+ /* @__PURE__ */ jsxs2(
1266
+ "button",
1267
+ {
1268
+ "data-testid": "version-switcher",
1269
+ onClick: () => setVersionDropdown((o) => !o),
1270
+ style: {
1271
+ display: "flex",
1272
+ alignItems: "center",
1273
+ gap: 6,
1274
+ background: "var(--sf)",
1275
+ border: "1px solid var(--bd)",
1276
+ borderRadius: 2,
1277
+ padding: "5px 10px",
1278
+ cursor: "pointer",
1279
+ color: "var(--tx2)",
1280
+ fontSize: 12,
1281
+ fontFamily: "var(--font-code)"
1282
+ },
1283
+ children: [
1284
+ /* @__PURE__ */ jsx2(VersionIcon, {}),
1285
+ currentVersion || versioning.current,
1286
+ /* @__PURE__ */ jsx2(ChevDown, {})
1287
+ ]
1288
+ }
1289
+ ),
1290
+ versionDropdownOpen && /* @__PURE__ */ jsx2(
1291
+ "div",
1292
+ {
1293
+ "data-testid": "version-dropdown",
1294
+ style: {
1295
+ position: "absolute",
1296
+ top: "100%",
1297
+ right: 0,
1298
+ marginTop: 4,
1299
+ background: "var(--sf)",
1300
+ border: "1px solid var(--bd)",
1301
+ borderRadius: 2,
1302
+ boxShadow: "0 8px 32px rgba(0,0,0,0.2)",
1303
+ overflow: "hidden",
1304
+ zIndex: 100,
1305
+ minWidth: 120
1306
+ },
1307
+ children: versioning.versions.map((v) => /* @__PURE__ */ jsxs2(
1308
+ "button",
1309
+ {
1310
+ onClick: () => {
1311
+ setVersionDropdown(false);
1312
+ const targetId = v === versioning.current ? "index" : `${v}/index`;
1313
+ onNavigate(targetId);
1314
+ },
1315
+ style: {
1316
+ display: "block",
1317
+ width: "100%",
1318
+ textAlign: "left",
1319
+ background: v === (currentVersion || versioning.current) ? "var(--acD)" : "none",
1320
+ border: "none",
1321
+ padding: "8px 14px",
1322
+ cursor: "pointer",
1323
+ color: v === (currentVersion || versioning.current) ? "var(--ac)" : "var(--tx2)",
1324
+ fontSize: 12,
1325
+ fontFamily: "var(--font-code)",
1326
+ fontWeight: v === versioning.current ? 600 : 400
1327
+ },
1328
+ children: [
1329
+ v,
1330
+ v === versioning.current ? " (latest)" : ""
1331
+ ]
1332
+ },
1333
+ v
1334
+ ))
1335
+ }
1336
+ )
1337
+ ] }),
1338
+ i18n && i18n.locales.length > 1 && !mobile && /* @__PURE__ */ jsxs2("div", { style: { position: "relative" }, children: [
1339
+ /* @__PURE__ */ jsxs2(
1340
+ "button",
1341
+ {
1342
+ "data-testid": "language-switcher",
1343
+ onClick: () => setLocaleDropdown((o) => !o),
1344
+ style: {
1345
+ display: "flex",
1346
+ alignItems: "center",
1347
+ gap: 6,
1348
+ background: "var(--sf)",
1349
+ border: "1px solid var(--bd)",
1350
+ borderRadius: 2,
1351
+ padding: "5px 10px",
1352
+ cursor: "pointer",
1353
+ color: "var(--tx2)",
1354
+ fontSize: 12,
1355
+ fontFamily: "var(--font-body)"
1356
+ },
1357
+ children: [
1358
+ /* @__PURE__ */ jsx2(GlobeIcon, {}),
1359
+ i18n.localeNames?.[currentLocale || i18n.defaultLocale] || currentLocale || i18n.defaultLocale,
1360
+ /* @__PURE__ */ jsx2(ChevDown, {})
1361
+ ]
1362
+ }
1363
+ ),
1364
+ localeDropdownOpen && /* @__PURE__ */ jsx2(
1365
+ "div",
1366
+ {
1367
+ "data-testid": "language-dropdown",
1368
+ style: {
1369
+ position: "absolute",
1370
+ top: "100%",
1371
+ right: 0,
1372
+ marginTop: 4,
1373
+ background: "var(--sf)",
1374
+ border: "1px solid var(--bd)",
1375
+ borderRadius: 2,
1376
+ boxShadow: "0 8px 32px rgba(0,0,0,0.2)",
1377
+ overflow: "hidden",
1378
+ zIndex: 100,
1379
+ minWidth: 120
1380
+ },
1381
+ children: i18n.locales.map((locale) => {
1382
+ const isActive = locale === (currentLocale || i18n.defaultLocale);
1383
+ const displayName = i18n.localeNames?.[locale] || locale;
1384
+ const activeLocale = currentLocale || i18n.defaultLocale;
1385
+ let basePageId = currentPageId;
1386
+ if (activeLocale !== i18n.defaultLocale && currentPageId.startsWith(`${activeLocale}/`)) {
1387
+ basePageId = currentPageId.slice(activeLocale.length + 1);
1388
+ }
1389
+ const targetId = locale === i18n.defaultLocale ? basePageId : `${locale}/${basePageId}`;
1390
+ return /* @__PURE__ */ jsx2(
1391
+ "button",
1392
+ {
1393
+ onClick: () => {
1394
+ setLocaleDropdown(false);
1395
+ onNavigate(targetId);
1396
+ },
1397
+ style: {
1398
+ display: "block",
1399
+ width: "100%",
1400
+ textAlign: "left",
1401
+ background: isActive ? "var(--acD)" : "none",
1402
+ border: "none",
1403
+ padding: "8px 14px",
1404
+ cursor: "pointer",
1405
+ color: isActive ? "var(--ac)" : "var(--tx2)",
1406
+ fontSize: 12,
1407
+ fontFamily: "var(--font-body)",
1408
+ fontWeight: isActive ? 600 : 400
1409
+ },
1410
+ children: displayName
1411
+ },
1412
+ locale
1413
+ );
1414
+ })
1415
+ }
1416
+ )
1417
+ ] })
1418
+ ] }),
1419
+ isOldVersion && /* @__PURE__ */ jsxs2(
1420
+ "div",
1421
+ {
1422
+ "data-testid": "old-version-banner",
1423
+ style: {
1424
+ display: "flex",
1425
+ alignItems: "center",
1426
+ justifyContent: "center",
1427
+ gap: 8,
1428
+ background: "var(--acD)",
1429
+ borderBottom: "1px solid var(--bd)",
1430
+ padding: "8px 24px",
1431
+ fontSize: 13,
1432
+ color: "var(--tx2)"
1433
+ },
1434
+ children: [
1435
+ /* @__PURE__ */ jsxs2("span", { children: [
1436
+ "You're viewing docs for ",
1437
+ currentVersion,
1438
+ "."
1439
+ ] }),
1440
+ /* @__PURE__ */ jsx2(
1441
+ "button",
1442
+ {
1443
+ onClick: () => {
1444
+ onNavigate("index");
1445
+ },
1446
+ style: {
1447
+ background: "none",
1448
+ border: "none",
1449
+ color: "var(--ac)",
1450
+ cursor: "pointer",
1451
+ fontWeight: 600,
1452
+ fontSize: 13,
1453
+ fontFamily: "var(--font-body)",
1454
+ textDecoration: "underline"
1455
+ },
1456
+ children: "Switch to latest."
1457
+ }
1458
+ )
1459
+ ]
1460
+ }
1461
+ ),
1462
+ /* @__PURE__ */ jsxs2("div", { ref: contentRef, style: { flex: 1, overflow: "auto", display: "flex" }, children: [
1463
+ /* @__PURE__ */ jsxs2("main", { style: { flex: 1, maxWidth: mobile ? "100%" : 760, padding: mobile ? "24px 16px 60px" : "40px 48px 80px", margin: "0 auto", minWidth: 0 }, children: [
1464
+ /* @__PURE__ */ jsx2("h1", { style: { fontFamily: "var(--font-heading)", fontSize: mobile ? 26 : 38, fontWeight: 400, fontStyle: "italic", lineHeight: 1.15, marginBottom: 8 }, children: pageTitle }),
1465
+ pageDescription && /* @__PURE__ */ jsx2("p", { style: { fontSize: 16, color: "var(--tx2)", lineHeight: 1.6, marginBottom: 32 }, children: pageDescription }),
1466
+ /* @__PURE__ */ jsx2("div", { style: { borderTop: "1px solid var(--bd)", paddingTop: 28 }, children: changelogEntries && changelogEntries.length > 0 ? /* @__PURE__ */ jsx2(ChangelogView, { entries: changelogEntries }) : PageComponent ? /* @__PURE__ */ jsx2("div", { className: "tome-content", children: /* @__PURE__ */ jsx2(PageComponent, { components: mdxComponents || {} }) }) : /* @__PURE__ */ jsx2(
1467
+ "div",
1468
+ {
1469
+ className: "tome-content",
1470
+ dangerouslySetInnerHTML: { __html: (pageHtml || "").replace(/<h1[^>]*>[\s\S]*?<\/h1>\s*/, "") }
1471
+ }
1472
+ ) }),
1473
+ (editUrl || lastUpdated) && /* @__PURE__ */ jsxs2("div", { style: { marginTop: 40, display: "flex", flexDirection: mobile ? "column" : "row", alignItems: mobile ? "flex-start" : "center", justifyContent: "space-between", gap: mobile ? 8 : 16 }, children: [
1474
+ editUrl && /* @__PURE__ */ jsx2("div", { "data-testid": "edit-page-link", children: /* @__PURE__ */ jsxs2(
1475
+ "a",
1476
+ {
1477
+ href: editUrl,
1478
+ target: "_blank",
1479
+ rel: "noopener noreferrer",
1480
+ style: {
1481
+ display: "inline-flex",
1482
+ alignItems: "center",
1483
+ gap: 6,
1484
+ color: "var(--txM)",
1485
+ textDecoration: "none",
1486
+ fontSize: 13,
1487
+ fontFamily: "var(--font-body)",
1488
+ transition: "color .15s"
1489
+ },
1490
+ onMouseOver: (e) => e.currentTarget.style.color = "var(--ac)",
1491
+ onMouseOut: (e) => e.currentTarget.style.color = "var(--txM)",
1492
+ children: [
1493
+ /* @__PURE__ */ jsx2(PencilIcon, {}),
1494
+ " Edit this page on GitHub"
1495
+ ]
1496
+ }
1497
+ ) }),
1498
+ lastUpdated && /* @__PURE__ */ jsxs2("div", { "data-testid": "last-updated", style: { fontSize: 12, color: "var(--txM)", fontFamily: "var(--font-body)" }, children: [
1499
+ "Last updated ",
1500
+ formatRelativeDate(lastUpdated)
1501
+ ] })
1502
+ ] }),
1503
+ /* @__PURE__ */ jsx2("div", { style: { display: "flex", alignItems: "center", gap: 12, marginTop: 24, padding: "12px 0" }, children: feedbackGiven[currentPageId] ? /* @__PURE__ */ jsx2("span", { style: { fontSize: 13, color: "var(--txM)", fontFamily: "var(--font-body)" }, children: "Thanks for your feedback!" }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
1504
+ /* @__PURE__ */ jsx2("span", { style: { fontSize: 13, color: "var(--txM)", fontFamily: "var(--font-body)" }, children: "Was this helpful?" }),
1505
+ /* @__PURE__ */ jsx2("button", { onClick: () => {
1506
+ setFeedbackGiven((prev2) => ({ ...prev2, [currentPageId]: true }));
1507
+ try {
1508
+ localStorage.setItem(`tome-feedback-${currentPageId}`, "up");
1509
+ } catch {
1510
+ }
1511
+ }, style: {
1512
+ background: "none",
1513
+ border: "1px solid var(--bd)",
1514
+ borderRadius: 2,
1515
+ padding: "4px 10px",
1516
+ cursor: "pointer",
1517
+ fontSize: 13,
1518
+ color: "var(--txM)",
1519
+ transition: "border-color .15s"
1520
+ }, children: "\u{1F44D}" }),
1521
+ /* @__PURE__ */ jsx2("button", { onClick: () => {
1522
+ setFeedbackGiven((prev2) => ({ ...prev2, [currentPageId]: true }));
1523
+ try {
1524
+ localStorage.setItem(`tome-feedback-${currentPageId}`, "down");
1525
+ } catch {
1526
+ }
1527
+ }, style: {
1528
+ background: "none",
1529
+ border: "1px solid var(--bd)",
1530
+ borderRadius: 2,
1531
+ padding: "4px 10px",
1532
+ cursor: "pointer",
1533
+ fontSize: 13,
1534
+ color: "var(--txM)",
1535
+ transition: "border-color .15s"
1536
+ }, children: "\u{1F44E}" })
1537
+ ] }) }),
1538
+ /* @__PURE__ */ jsxs2("div", { style: { display: "flex", flexDirection: mobile ? "column" : "row", justifyContent: "space-between", marginTop: 16, paddingTop: 24, borderTop: "1px solid var(--bd)", gap: mobile ? 12 : 16 }, children: [
1539
+ prev ? /* @__PURE__ */ jsxs2("button", { onClick: () => onNavigate(prev.id), style: {
1540
+ display: "flex",
1541
+ alignItems: "center",
1542
+ gap: 8,
1543
+ background: "none",
1544
+ border: "1px solid var(--bd)",
1545
+ borderRadius: 2,
1546
+ padding: "10px 16px",
1547
+ cursor: "pointer",
1548
+ color: "var(--tx2)",
1549
+ fontSize: 13,
1550
+ fontFamily: "var(--font-body)",
1551
+ transition: "border-color .15s, color .15s"
1552
+ }, children: [
1553
+ /* @__PURE__ */ jsx2(ArrowLeft, {}),
1554
+ " ",
1555
+ prev.title
1556
+ ] }) : /* @__PURE__ */ jsx2("div", {}),
1557
+ next ? /* @__PURE__ */ jsxs2("button", { onClick: () => onNavigate(next.id), style: {
1558
+ display: "flex",
1559
+ alignItems: "center",
1560
+ gap: 8,
1561
+ background: "none",
1562
+ border: "1px solid var(--bd)",
1563
+ borderRadius: 2,
1564
+ padding: "10px 16px",
1565
+ cursor: "pointer",
1566
+ color: "var(--tx2)",
1567
+ fontSize: 13,
1568
+ fontFamily: "var(--font-body)",
1569
+ transition: "border-color .15s, color .15s"
1570
+ }, children: [
1571
+ next.title,
1572
+ " ",
1573
+ /* @__PURE__ */ jsx2(ArrowRight, {})
1574
+ ] }) : /* @__PURE__ */ jsx2("div", {})
1575
+ ] })
1576
+ ] }),
1577
+ showToc && filteredHeadings.length >= 2 && wide && /* @__PURE__ */ jsxs2("aside", { "data-testid": "toc-sidebar", style: { width: 200, padding: "40px 16px 40px 0", position: "sticky", top: 0, alignSelf: "flex-start", flexShrink: 0 }, children: [
1578
+ /* @__PURE__ */ jsx2("div", { style: { fontSize: 10, fontWeight: 600, textTransform: "uppercase", letterSpacing: ".1em", color: "var(--txM)", marginBottom: 12, fontFamily: "var(--font-code)" }, children: "On this page" }),
1579
+ /* @__PURE__ */ jsx2("nav", { "aria-label": "Table of contents", style: { borderLeft: "1px solid var(--bd)", paddingLeft: 0 }, children: filteredHeadings.map((h, i) => {
1580
+ const isActive = activeHeadingId === h.id;
1581
+ return /* @__PURE__ */ jsx2(
1582
+ "a",
1583
+ {
1584
+ href: `#${h.id}`,
1585
+ onClick: (e) => scrollToHeading(e, h.id),
1586
+ "data-testid": `toc-link-${h.id}`,
1587
+ style: {
1588
+ display: "block",
1589
+ fontSize: 12,
1590
+ color: isActive ? "var(--ac)" : "var(--txM)",
1591
+ fontWeight: isActive ? 500 : 400,
1592
+ textDecoration: "none",
1593
+ padding: "4px 12px",
1594
+ paddingLeft: 12 + (h.depth - 2) * 12,
1595
+ lineHeight: 1.4,
1596
+ transition: "color .15s, font-weight .15s",
1597
+ borderLeft: isActive ? "2px solid var(--ac)" : "2px solid transparent",
1598
+ marginLeft: -1
1599
+ },
1600
+ children: h.text
1601
+ },
1602
+ i
1603
+ );
1604
+ }) })
1605
+ ] })
1606
+ ] })
1607
+ ] })
1608
+ ] }),
1609
+ config2.ai?.enabled && /* @__PURE__ */ jsx2(
1610
+ AiChat,
1611
+ {
1612
+ provider: config2.ai.provider || "anthropic",
1613
+ model: config2.ai.model,
1614
+ apiKey: typeof __TOME_AI_API_KEY__ !== "undefined" && __TOME_AI_API_KEY__ ? __TOME_AI_API_KEY__ : void 0,
1615
+ context: docContext2?.map((d) => `## ${d.title}
1616
+ ${d.content}`).join("\n\n") ?? allPages.map((p) => `- ${p.title}${p.description ? ": " + p.description : ""}`).join("\n")
1617
+ }
1618
+ ),
1619
+ zoomSrc && /* @__PURE__ */ jsx2("div", { onClick: () => setZoomSrc(null), style: {
1620
+ position: "fixed",
1621
+ inset: 0,
1622
+ zIndex: 9999,
1623
+ display: "flex",
1624
+ alignItems: "center",
1625
+ justifyContent: "center",
1626
+ background: "rgba(0,0,0,0.7)",
1627
+ backdropFilter: "blur(8px)",
1628
+ cursor: "zoom-out"
1629
+ }, children: /* @__PURE__ */ jsx2("img", { src: zoomSrc, alt: "", style: { maxWidth: "90vw", maxHeight: "90vh", objectFit: "contain", borderRadius: 4, boxShadow: "0 16px 64px rgba(0,0,0,0.4)" } }) })
1630
+ ] });
1631
+ }
1632
+ function SearchModal({ allPages, onNavigate, onClose, mobile }) {
1633
+ const [q, setQ] = useState2("");
1634
+ const [results, setResults] = useState2([]);
1635
+ const [selected, setSelected] = useState2(0);
1636
+ const [pagefindReady, setPagefindReady] = useState2(null);
1637
+ const inputRef = useRef2(null);
1638
+ const debounceRef = useRef2(void 0);
1639
+ useEffect2(() => {
1640
+ initPagefind().then((pf) => setPagefindReady(!!pf));
1641
+ setTimeout(() => inputRef.current?.focus(), 50);
1642
+ }, []);
1643
+ const fallbackSearch = useCallback2((query) => {
1644
+ if (!query.trim()) return [];
1645
+ const ql = query.toLowerCase();
1646
+ return allPages.filter((p) => p.title.toLowerCase().includes(ql) || (p.description || "").toLowerCase().includes(ql)).slice(0, 8).map((p) => ({ id: p.id, title: p.title, excerpt: p.description }));
1647
+ }, [allPages]);
1648
+ const doSearch = useCallback2(async (query) => {
1649
+ if (!query.trim()) {
1650
+ setResults([]);
1651
+ setSelected(0);
1652
+ return;
1653
+ }
1654
+ const pf = pagefindInstance;
1655
+ if (pf) {
1656
+ try {
1657
+ const search = await pf.search(query);
1658
+ const items = [];
1659
+ for (const result of search.results.slice(0, 8)) {
1660
+ const data = await result.data();
1661
+ const url = data.url || "";
1662
+ const id = url.replace(/^\//, "").replace(/\/index\.html$/, "").replace(/\.html$/, "") || "index";
1663
+ items.push({
1664
+ id,
1665
+ title: data.meta?.title || id,
1666
+ excerpt: data.excerpt || void 0
1667
+ });
1668
+ }
1669
+ setResults(items);
1670
+ setSelected(0);
1671
+ return;
1672
+ } catch {
1673
+ }
1674
+ }
1675
+ setResults(fallbackSearch(query));
1676
+ setSelected(0);
1677
+ }, [fallbackSearch]);
1678
+ useEffect2(() => {
1679
+ if (debounceRef.current) clearTimeout(debounceRef.current);
1680
+ debounceRef.current = setTimeout(() => doSearch(q), 120);
1681
+ return () => {
1682
+ if (debounceRef.current) clearTimeout(debounceRef.current);
1683
+ };
1684
+ }, [q, doSearch]);
1685
+ const handleKeyDown = useCallback2((e) => {
1686
+ if (e.key === "ArrowDown") {
1687
+ e.preventDefault();
1688
+ setSelected((i) => Math.min(i + 1, results.length - 1));
1689
+ } else if (e.key === "ArrowUp") {
1690
+ e.preventDefault();
1691
+ setSelected((i) => Math.max(i - 1, 0));
1692
+ } else if (e.key === "Enter" && results.length > 0) {
1693
+ e.preventDefault();
1694
+ onNavigate(results[selected].id);
1695
+ }
1696
+ }, [results, selected, onNavigate]);
1697
+ return /* @__PURE__ */ jsx2("div", { onClick: onClose, style: {
1698
+ position: "fixed",
1699
+ inset: 0,
1700
+ zIndex: 1e3,
1701
+ background: "rgba(0,0,0,0.55)",
1702
+ backdropFilter: "blur(6px)",
1703
+ display: "flex",
1704
+ alignItems: mobile ? "stretch" : "flex-start",
1705
+ justifyContent: "center",
1706
+ paddingTop: mobile ? 0 : "12vh"
1707
+ }, children: /* @__PURE__ */ jsxs2("div", { onClick: (e) => e.stopPropagation(), style: {
1708
+ background: "var(--sf)",
1709
+ border: mobile ? "none" : "1px solid var(--bd)",
1710
+ borderRadius: mobile ? 0 : 2,
1711
+ width: "100%",
1712
+ maxWidth: mobile ? "100%" : 520,
1713
+ boxShadow: mobile ? "none" : "0 24px 80px rgba(0,0,0,0.4)",
1714
+ overflow: "hidden",
1715
+ display: "flex",
1716
+ flexDirection: "column",
1717
+ ...mobile ? { height: "100%" } : {}
1718
+ }, children: [
1719
+ /* @__PURE__ */ jsxs2("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "14px 18px", borderBottom: "1px solid var(--bd)" }, children: [
1720
+ /* @__PURE__ */ jsx2(SearchIcon, {}),
1721
+ /* @__PURE__ */ jsx2(
1722
+ "input",
1723
+ {
1724
+ ref: inputRef,
1725
+ value: q,
1726
+ onChange: (e) => setQ(e.target.value),
1727
+ onKeyDown: handleKeyDown,
1728
+ placeholder: "Search documentation...",
1729
+ style: { flex: 1, background: "none", border: "none", outline: "none", color: "var(--tx)", fontSize: 15, fontFamily: "var(--font-body)" }
1730
+ }
1731
+ ),
1732
+ /* @__PURE__ */ jsx2("kbd", { style: { fontFamily: "var(--font-code)", fontSize: 10, color: "var(--txM)", background: "var(--cdBg)", padding: "2px 6px", borderRadius: 2, border: "1px solid var(--bd)" }, children: "ESC" })
1733
+ ] }),
1734
+ results.length > 0 && /* @__PURE__ */ jsx2("div", { style: { padding: 6, maxHeight: mobile ? "none" : 360, overflow: "auto", flex: mobile ? 1 : void 0 }, children: results.map((r, i) => /* @__PURE__ */ jsxs2(
1735
+ "button",
1736
+ {
1737
+ onClick: () => onNavigate(r.id),
1738
+ style: {
1739
+ display: "block",
1740
+ width: "100%",
1741
+ textAlign: "left",
1742
+ background: i === selected ? "var(--acD)" : "none",
1743
+ border: "none",
1744
+ borderRadius: 2,
1745
+ padding: "10px 14px",
1746
+ cursor: "pointer",
1747
+ color: "var(--tx)",
1748
+ fontFamily: "var(--font-body)"
1749
+ },
1750
+ onMouseEnter: () => setSelected(i),
1751
+ children: [
1752
+ /* @__PURE__ */ jsx2("div", { style: { fontWeight: 500, fontSize: 14, marginBottom: 2 }, children: r.title }),
1753
+ r.excerpt && /* @__PURE__ */ jsx2("div", { style: {
1754
+ fontSize: 12,
1755
+ color: "var(--txM)",
1756
+ lineHeight: 1.3
1757
+ }, dangerouslySetInnerHTML: { __html: r.excerpt } })
1758
+ ]
1759
+ },
1760
+ r.id + i
1761
+ )) }),
1762
+ q && !results.length && /* @__PURE__ */ jsx2("div", { style: { padding: "32px 18px", textAlign: "center", color: "var(--txM)", fontSize: 14 }, children: "No results found" }),
1763
+ pagefindReady === false && q && results.length > 0 && /* @__PURE__ */ jsx2("div", { style: { padding: "6px 18px 10px", fontSize: 11, color: "var(--txM)", textAlign: "center" }, children: "Showing title matches. Build your site for full-text search." })
1764
+ ] }) });
1765
+ }
1766
+
1767
+ // src/entry.tsx
1768
+ import config from "virtual:tome/config";
1769
+ import { routes, navigation, versions } from "virtual:tome/routes";
1770
+ import loadPageModule from "virtual:tome/page-loader";
1771
+ import docContext from "virtual:tome/doc-context";
1772
+ import {
1773
+ Callout,
1774
+ Tabs,
1775
+ Card,
1776
+ CardGroup,
1777
+ Steps,
1778
+ Accordion,
1779
+ ChangelogTimeline,
1780
+ PackageManager,
1781
+ TypeTable,
1782
+ FileTree
1783
+ } from "@tomehq/components";
1784
+ import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
1785
+ var MDX_COMPONENTS = {
1786
+ Callout,
1787
+ Tabs,
1788
+ Card,
1789
+ CardGroup,
1790
+ Steps,
1791
+ Accordion,
1792
+ ChangelogTimeline,
1793
+ PackageManager,
1794
+ TypeTable,
1795
+ FileTree
1796
+ // Sub-components accessible as <FileTree.File /> and <FileTree.Folder /> in MDX
1797
+ };
1798
+ var contentStyles = `
1799
+ @import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@300;400;500;600;700&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400;1,700&family=Fira+Code:wght@400;500;600&display=swap');
1800
+
1801
+ .tome-content h1 { display: none; }
1802
+ .tome-content h2 { font-family: var(--font-body); font-size: 1.35em; font-weight: 600; margin-top: 2em; margin-bottom: 0.5em; display: flex; align-items: center; gap: 10px; letter-spacing: 0.01em; }
1803
+ .tome-content h2::before { content: "#"; font-family: var(--font-heading); font-size: 1.2em; font-weight: 300; font-style: italic; color: var(--ac); opacity: 0.5; }
1804
+ .tome-content h3 { font-family: var(--font-body); font-size: 1.15em; font-weight: 600; margin-top: 1.5em; margin-bottom: 0.5em; }
1805
+ .tome-content h4 { font-family: var(--font-body); font-size: 1.05em; font-weight: 600; margin-top: 1.2em; margin-bottom: 0.5em; }
1806
+ .tome-content p { color: var(--tx2); line-height: 1.8; margin-bottom: 1em; font-size: 14.5px; }
1807
+ .tome-content a { color: var(--ac); text-decoration: none; }
1808
+ .tome-content a:hover { text-decoration: underline; }
1809
+ .tome-content .heading-anchor { display: none; }
1810
+ .tome-content ul, .tome-content ol { color: var(--tx2); padding-left: 1.5em; margin-bottom: 1em; }
1811
+ .tome-content li { margin-bottom: 0.3em; line-height: 1.7; }
1812
+ .tome-content code { font-family: var(--font-code); font-size: 0.88em; background: var(--cdBg); padding: 0.15em 0.4em; border-radius: 2px; color: var(--ac); }
1813
+ .tome-content pre { margin-bottom: 1.2em; border-radius: 2px; overflow-x: auto; border: 1px solid var(--bd); }
1814
+ .tome-content pre code { background: none; padding: 1em 1.2em; display: block; font-size: 12.5px; line-height: 1.7; color: var(--cdTx); }
1815
+ .tome-content blockquote { border-left: 3px solid var(--ac); padding: 0.5em 1em; margin: 1em 0; background: var(--acD); border-radius: 0 2px 2px 0; }
1816
+ .tome-content blockquote p { color: var(--tx2); margin: 0; }
1817
+ .tome-content table { width: 100%; border-collapse: collapse; margin-bottom: 1em; }
1818
+ .tome-content th, .tome-content td { padding: 0.5em 0.8em; border: 1px solid var(--bd); text-align: left; font-size: 0.9em; }
1819
+ .tome-content th { background: var(--sf); font-weight: 600; }
1820
+ .tome-content img { max-width: 100%; border-radius: 2px; cursor: zoom-in; }
1821
+ .tome-content hr { border: none; border-top: 1px solid var(--bd); margin: 2em 0; }
1822
+ .tome-mermaid { margin: 1.2em 0; text-align: center; overflow-x: auto; }
1823
+ .tome-mermaid svg { max-width: 100%; height: auto; overflow: visible; }
1824
+ .tome-mermaid svg .nodeLabel { overflow: visible; white-space: nowrap; }
1825
+
1826
+ /* Mobile responsive content */
1827
+ @media (max-width: 767px) {
1828
+ .tome-content h2 { font-size: 1.2em; margin-top: 1.5em; }
1829
+ .tome-content h3 { font-size: 1.05em; }
1830
+ .tome-content pre code { font-size: 12px; padding: 0.8em 1em; }
1831
+ .tome-content table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
1832
+ .tome-content blockquote { margin: 0.8em 0; }
1833
+ }
1834
+
1835
+ /* Selection style */
1836
+ ::selection { background: var(--acD); color: var(--ac); }
1837
+
1838
+ /* Scrollbar style */
1839
+ ::-webkit-scrollbar { width: 5px; height: 5px; }
1840
+ ::-webkit-scrollbar-track { background: transparent; }
1841
+ ::-webkit-scrollbar-thumb { background: var(--bd); border-radius: 10px; }
1842
+
1843
+ /* Grain overlay */
1844
+ .tome-grain::before {
1845
+ content: ""; position: fixed; inset: 0; z-index: 9999; pointer-events: none;
1846
+ opacity: .35;
1847
+ background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
1848
+ background-repeat: repeat; background-size: 256px;
1849
+ }
1850
+
1851
+ /* Shiki dual-theme support */
1852
+ .shiki { background: var(--cdBg) !important; }
1853
+
1854
+ /* Dark mode: switch Shiki tokens from light-theme inline colors to --shiki-dark CSS vars */
1855
+ html.dark .shiki,
1856
+ html.dark .shiki span {
1857
+ color: var(--shiki-dark) !important;
1858
+ }
1859
+
1860
+ /* Brighten dim comment tokens (github-dark #6A737D is too low-contrast on dark backgrounds) */
1861
+ html.dark .shiki span[style*="--shiki-dark:#6A737D"] {
1862
+ --shiki-dark: #a0aab5 !important;
1863
+ }
1864
+
1865
+ /* Light mode: darken low-contrast github-light tokens for WCAG AA on --cdBg backgrounds */
1866
+ html:not(.dark) .shiki span[style*="color:#6A737D"] { color: #57606a !important; }
1867
+ html:not(.dark) .shiki span[style*="color:#E36209"] { color: #b35405 !important; }
1868
+ html:not(.dark) .shiki span[style*="color:#6F42C1"] { color: #5a32a3 !important; }
1869
+ html:not(.dark) .shiki span[style*="color:#22863A"] { color: #1a6e2e !important; }
1870
+ html:not(.dark) .shiki span[style*="color:#D73A49"] { color: #b62324 !important; }
1871
+ html:not(.dark) .shiki span[style*="color:#005CC5"] { color: #0349b4 !important; }
1872
+ `;
1873
+ async function loadPage(id) {
1874
+ try {
1875
+ const route = routes.find((r) => r.id === id);
1876
+ const mod = await loadPageModule(id);
1877
+ if (route?.isMdx && mod.meta) {
1878
+ return {
1879
+ isMdx: true,
1880
+ component: mod.default,
1881
+ frontmatter: mod.meta.frontmatter,
1882
+ headings: mod.meta.headings
1883
+ };
1884
+ }
1885
+ if (!mod.default) return null;
1886
+ if (mod.isChangelog && mod.changelogEntries) {
1887
+ return { isMdx: false, ...mod.default, changelogEntries: mod.changelogEntries };
1888
+ }
1889
+ return { isMdx: false, ...mod.default };
1890
+ } catch (err) {
1891
+ console.error(`Failed to load page: ${id}`, err);
1892
+ return null;
1893
+ }
1894
+ }
1895
+ var basePath2 = (config.basePath || "/").replace(/\/$/, "");
1896
+ function pathnameToPageId(pathname) {
1897
+ let relative = pathname;
1898
+ if (basePath2 && relative.startsWith(basePath2)) {
1899
+ relative = relative.slice(basePath2.length);
1900
+ }
1901
+ const id = relative.replace(/^\//, "").replace(/\/index\.html$/, "").replace(/\.html$/, "").replace(/\/$/, "") || "index";
1902
+ const route = routes.find((r) => r.id === id);
1903
+ return route ? id : null;
1904
+ }
1905
+ function pageIdToPath(id) {
1906
+ const route = routes.find((r) => r.id === id);
1907
+ if (route) return basePath2 + route.urlPath;
1908
+ return basePath2 + "/" + id;
1909
+ }
1910
+ function App() {
1911
+ const [currentPageId, setCurrentPageId] = useState3(() => {
1912
+ const resolved = pathnameToPageId(window.location.pathname);
1913
+ if (resolved) return resolved;
1914
+ const hash = window.location.hash.slice(1);
1915
+ if (hash && routes.some((r) => r.id === hash)) return hash;
1916
+ return routes[0]?.id || "index";
1917
+ });
1918
+ const [pageData, setPageData] = useState3(null);
1919
+ const [loading, setLoading] = useState3(true);
1920
+ const navigateTo = useCallback3(async (id, opts) => {
1921
+ setLoading(true);
1922
+ setCurrentPageId(id);
1923
+ const fullPath = pageIdToPath(id);
1924
+ if (opts?.replace) {
1925
+ window.history.replaceState(null, "", fullPath);
1926
+ } else {
1927
+ window.history.pushState(null, "", fullPath);
1928
+ }
1929
+ const data = await loadPage(id);
1930
+ setPageData(data);
1931
+ setLoading(false);
1932
+ if (!opts?.skipScroll) {
1933
+ const anchor = window.location.hash.slice(1);
1934
+ if (anchor) {
1935
+ requestAnimationFrame(() => {
1936
+ const el = document.getElementById(anchor);
1937
+ if (el) el.scrollIntoView({ behavior: "smooth", block: "start" });
1938
+ });
1939
+ } else {
1940
+ window.scrollTo(0, 0);
1941
+ }
1942
+ }
1943
+ }, []);
1944
+ useEffect3(() => {
1945
+ const hash = window.location.hash.slice(1);
1946
+ if (hash && routes.some((r) => r.id === hash)) {
1947
+ const fullPath = pageIdToPath(hash);
1948
+ window.history.replaceState(null, "", fullPath);
1949
+ navigateTo(hash, { replace: true });
1950
+ } else {
1951
+ navigateTo(currentPageId, { replace: true, skipScroll: true });
1952
+ }
1953
+ }, []);
1954
+ useEffect3(() => {
1955
+ const onPopState = () => {
1956
+ const id = pathnameToPageId(window.location.pathname);
1957
+ if (id && id !== currentPageId) {
1958
+ navigateTo(id, { replace: true, skipScroll: true });
1959
+ }
1960
+ };
1961
+ window.addEventListener("popstate", onPopState);
1962
+ return () => window.removeEventListener("popstate", onPopState);
1963
+ }, [currentPageId, navigateTo]);
1964
+ useEffect3(() => {
1965
+ const els = document.querySelectorAll(".tome-mermaid[data-mermaid]");
1966
+ if (els.length === 0) return;
1967
+ let cancelled = false;
1968
+ const MERMAID_CDN = "https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs";
1969
+ (async () => {
1970
+ try {
1971
+ const { default: mermaid } = await import(
1972
+ /* @vite-ignore */
1973
+ MERMAID_CDN
1974
+ );
1975
+ if (cancelled) return;
1976
+ const isDark = document.documentElement.classList.contains("dark");
1977
+ const resolvedFont = getComputedStyle(document.documentElement).getPropertyValue("--font-body").trim() || "sans-serif";
1978
+ mermaid.initialize({
1979
+ startOnLoad: false,
1980
+ theme: isDark ? "dark" : "default",
1981
+ fontFamily: resolvedFont,
1982
+ flowchart: { padding: 15, nodeSpacing: 30, rankSpacing: 40 }
1983
+ });
1984
+ for (let i = 0; i < els.length; i++) {
1985
+ const el = els[i];
1986
+ if (el.querySelector("svg")) continue;
1987
+ const encoded = el.getAttribute("data-mermaid");
1988
+ if (!encoded) continue;
1989
+ try {
1990
+ const code = atob(encoded);
1991
+ const { svg } = await mermaid.render(`tome-mermaid-${i}-${Date.now()}`, code);
1992
+ if (!cancelled) {
1993
+ try {
1994
+ const DOMPurify = (await import(
1995
+ /* @vite-ignore */
1996
+ "https://cdn.jsdelivr.net/npm/dompurify@3/dist/purify.es.mjs"
1997
+ )).default;
1998
+ el.innerHTML = DOMPurify.sanitize(svg, { USE_PROFILES: { svg: true, svgFilters: true } });
1999
+ } catch {
2000
+ el.innerHTML = svg;
2001
+ }
2002
+ }
2003
+ } catch (err) {
2004
+ console.warn("[tome] Mermaid render failed:", err);
2005
+ el.textContent = "Diagram rendering failed";
2006
+ el.style.cssText = "padding:16px;color:var(--txM);font-size:13px;border:1px dashed var(--bd);border-radius:2px;text-align:center;";
2007
+ }
2008
+ }
2009
+ } catch (err) {
2010
+ console.warn("[tome] Failed to load mermaid from CDN:", err);
2011
+ els.forEach((el) => {
2012
+ el.textContent = "Failed to load diagram renderer";
2013
+ el.style.cssText = "padding:16px;color:var(--txM);font-size:13px;border:1px dashed var(--bd);border-radius:2px;text-align:center;";
2014
+ });
2015
+ }
2016
+ })();
2017
+ return () => {
2018
+ cancelled = true;
2019
+ };
2020
+ }, [pageData, loading]);
2021
+ const allPages = routes.map((r) => ({
2022
+ id: r.id,
2023
+ title: r.frontmatter.title,
2024
+ description: r.frontmatter.description
2025
+ }));
2026
+ const currentRoute = routes.find((r) => r.id === currentPageId);
2027
+ const currentVersion = currentRoute?.version || (versions?.current ?? void 0);
2028
+ let editUrl;
2029
+ if (config.editLink && currentRoute?.filePath) {
2030
+ const { repo, branch = "main", dir = "" } = config.editLink;
2031
+ const dirPrefix = dir ? `${dir.replace(/\/$/, "")}/` : "";
2032
+ editUrl = `https://github.com/${repo}/edit/${branch}/${dirPrefix}${currentRoute.filePath}`;
2033
+ }
2034
+ useEffect3(() => {
2035
+ if (!config.math) return;
2036
+ const id = "tome-katex-css";
2037
+ if (document.getElementById(id)) return;
2038
+ const link = document.createElement("link");
2039
+ link.id = id;
2040
+ link.rel = "stylesheet";
2041
+ link.href = "https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.css";
2042
+ link.crossOrigin = "anonymous";
2043
+ document.head.appendChild(link);
2044
+ }, []);
2045
+ return /* @__PURE__ */ jsxs3(Fragment2, { children: [
2046
+ /* @__PURE__ */ jsx3("style", { children: contentStyles }),
2047
+ /* @__PURE__ */ jsx3(
2048
+ Shell,
2049
+ {
2050
+ config,
2051
+ navigation,
2052
+ currentPageId,
2053
+ pageHtml: !pageData?.isMdx ? loading ? "<p>Loading...</p>" : pageData?.html || "<p>Page not found</p>" : void 0,
2054
+ pageComponent: pageData?.isMdx ? pageData.component : void 0,
2055
+ mdxComponents: MDX_COMPONENTS,
2056
+ pageTitle: pageData?.frontmatter.title || (loading ? "Loading..." : "Not Found"),
2057
+ pageDescription: pageData?.frontmatter.description,
2058
+ headings: pageData?.headings || [],
2059
+ tocEnabled: pageData?.frontmatter.toc !== false,
2060
+ editUrl,
2061
+ lastUpdated: currentRoute?.lastUpdated,
2062
+ changelogEntries: !pageData?.isMdx ? pageData?.changelogEntries : void 0,
2063
+ onNavigate: navigateTo,
2064
+ allPages,
2065
+ docContext,
2066
+ versioning: versions || void 0,
2067
+ currentVersion,
2068
+ basePath: basePath2
2069
+ }
2070
+ )
2071
+ ] });
2072
+ }
2073
+ var container = document.getElementById("tome-root");
2074
+ if (container) {
2075
+ const root = createRoot(container);
2076
+ root.render(/* @__PURE__ */ jsx3(App, {}));
2077
+ }
2078
+ var entry_default = App;
2079
+
2080
+ export {
2081
+ THEME_PRESETS,
2082
+ AiChat,
2083
+ Shell,
2084
+ entry_default
2085
+ };