Skip to content

Commit ad653e4

Browse files
committed
fix usage + improve stuff
1 parent 3e4f3b2 commit ad653e4

File tree

6 files changed

+164
-123
lines changed

6 files changed

+164
-123
lines changed

packages/js-api-generator/assets/pico.slate.min.css

Lines changed: 4 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/js-api-generator/build.ts

Lines changed: 21 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Application, TSConfigReader, LogLevel, DefaultTheme, type TypeDocOptions } from 'typedoc';
2-
import { existsSync, mkdirSync, writeFileSync, readdirSync } from 'node:fs';
2+
import { existsSync, mkdirSync, writeFileSync, readdirSync, readFileSync, cpSync } from 'node:fs';
33
import { resolve, join, dirname } from 'node:path';
44
import { fileURLToPath } from 'node:url';
55

@@ -108,7 +108,7 @@ async function generator() {
108108
}
109109

110110
async function generateDocs(options: Partial<TypeDocOptions>) {
111-
console.log(`Generating docs for ${options.name || 'unknown'}`);
111+
// console.log(`Generating docs for ${options.name}`);
112112

113113
const outDir = options.out as string;
114114
if (!existsSync(outDir)) {
@@ -149,110 +149,31 @@ async function generateIndexPage() {
149149
.join('');
150150
}
151151

152-
// TODO: move this to a file and improve layout
153-
// TODO: copy assets to the output directory
152+
// TODO: improve layout
154153
// TODO: improve theme switcher
155154
// TODO: link to docs
156155
// TODO: make docs link to here
157-
const indexContent = `
158-
<!DOCTYPE html>
159-
<html lang="en">
160-
<head>
161-
<meta charset="UTF-8">
162-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
163-
<meta name="color-scheme" content="light dark">
164-
<title>Tauri JS API Reference</title>
165-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.slate.min.css">
166-
<style>
167-
.grid {
168-
--grid-min-value: 16rem;
169-
grid-template-columns: repeat(auto-fit, minmax(var(--grid-min-value), 1fr));
170-
}
171-
.tauri-logo {
172-
height: 2rem;
173-
vertical-align: middle;
174-
margin-right: 0.5rem;
175-
}
176-
.logo-light { display: none; }
177-
.logo-dark { display: none; }
178-
@media (prefers-color-scheme: dark) {
179-
.logo-dark { display: inline; }
180-
.logo-light { display: none; }
181-
}
182-
@media (prefers-color-scheme: light), (prefers-color-scheme: no-preference) {
183-
.logo-light { display: inline; }
184-
.logo-dark { display: none; }
185-
}
186-
[data-theme="dark"] .logo-dark { display: inline; }
187-
[data-theme="dark"] .logo-light { display: none; }
188-
[data-theme="light"] .logo-light { display: inline; }
189-
[data-theme="light"] .logo-dark { display: none; }
190-
</style>
191-
</head>
192-
<body>
193-
<header class="container">
194-
<nav>
195-
<ul>
196-
<li>
197-
<img src="./assets/logo_light.svg" alt="Tauri Logo" class="tauri-logo logo-light" loading="lazy">
198-
<img src="./assets/logo.svg" alt="Tauri Logo" class="tauri-logo logo-dark" loading="lazy">
199-
</li>
200-
</ul>
201-
<ul>
202-
<li>
203-
<select id="theme-switcher" aria-label="Theme">
204-
<option value="light">Light</option>
205-
<option value="dark">Dark</option>
206-
<option value="auto" selected>Auto</option>
207-
</select>
208-
</li>
209-
</ul>
210-
</nav>
211-
</header>
212-
<main class="container">
213-
<hgroup>
214-
<h1>Javascript Reference</h1>
215-
<p>API reference for Tauri core and plugins</p>
216-
</hgroup>
217-
<section>
218-
<div>${cardTemplate('Tauri Core API', './core/index.html')}</div>
219-
<h3>Plugins</h3>
220-
<div class="grid">
221-
${pluginsGridHtml}
222-
</div>
223-
</section>
224-
</main>
225-
<footer class="container">
226-
<small>&copy; 2025 Tauri Apps. All rights reserved.</small>
227-
</footer>
228-
<script>
229-
const themeSwitcher = document.getElementById('theme-switcher');
230-
function setTheme(theme) {
231-
if (theme === 'auto') {
232-
document.documentElement.removeAttribute('data-theme');
233-
localStorage.removeItem('theme');
234-
} else {
235-
document.documentElement.setAttribute('data-theme', theme);
236-
localStorage.setItem('theme', theme);
237-
}
238-
}
239-
themeSwitcher.value = localStorage.getItem('theme') || 'auto';
240-
setTheme(themeSwitcher.value);
241-
themeSwitcher.addEventListener('change', (e) => {
242-
setTheme(e.target.value);
243-
});
244-
</script>
245-
</body>
246-
</html>
247-
`;
248-
249-
const cssDir = join(BASE_OUTPUT_DIR, 'assets');
250-
if (!existsSync(cssDir)) {
251-
mkdirSync(cssDir, { recursive: true });
156+
const indexTemplatePath = join(__dirname, 'indexTemplate.html');
157+
const indexContent = readFileSync(indexTemplatePath, 'utf-8')
158+
.replace('{{ pluginsGridHtml }}', pluginsGridHtml || '')
159+
.replace('{{ tauriCard }}', cardTemplate('Tauri Core API', './core/index.html'));
160+
161+
const assetsDir = join(BASE_OUTPUT_DIR, 'assets');
162+
if (!existsSync(assetsDir)) {
163+
mkdirSync(assetsDir, { recursive: true });
164+
}
165+
const distAssetsDir = join(__dirname, 'assets');
166+
if (existsSync(distAssetsDir)) {
167+
try {
168+
cpSync(distAssetsDir, assetsDir, { recursive: true, force: true });
169+
} catch (err) {
170+
console.error('Failed to copy assets:', err);
171+
}
172+
} else {
173+
console.warn(`Assets directory not found at ${distAssetsDir}`);
252174
}
253175
try {
254176
writeFileSync(indexPath, indexContent);
255-
console.log(`Generated index page at ${indexPath}`);
256177
} catch (error) {
257178
console.error('Failed to write index files:', error);
258179
}
Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta name="color-scheme" content="light dark">
8+
<title>Tauri JS API Reference</title>
9+
<link rel="stylesheet" href="./assets/pico.slate.min.css">
10+
<style>
11+
.grid {
12+
--grid-min-value: 16rem;
13+
grid-template-columns: repeat(auto-fit, minmax(var(--grid-min-value), 1fr));
14+
}
15+
16+
.tauri-logo {
17+
height: 2rem;
18+
vertical-align: middle;
19+
margin-right: 0.5rem;
20+
}
21+
22+
.logo-light {
23+
display: none;
24+
}
25+
26+
.logo-dark {
27+
display: none;
28+
}
29+
30+
@media (prefers-color-scheme: dark) {
31+
.logo-dark {
32+
display: inline;
33+
}
34+
35+
.logo-light {
36+
display: none;
37+
}
38+
}
39+
40+
@media (prefers-color-scheme: light),
41+
(prefers-color-scheme: no-preference) {
42+
.logo-light {
43+
display: inline;
44+
}
45+
46+
.logo-dark {
47+
display: none;
48+
}
49+
}
50+
51+
[data-theme="dark"] .logo-dark {
52+
display: inline;
53+
}
54+
55+
[data-theme="dark"] .logo-light {
56+
display: none;
57+
}
58+
59+
[data-theme="light"] .logo-light {
60+
display: inline;
61+
}
62+
63+
[data-theme="light"] .logo-dark {
64+
display: none;
65+
}
66+
</style>
67+
</head>
68+
69+
<body>
70+
<header class="container">
71+
<nav>
72+
<ul>
73+
<li>
74+
<img src="./assets/logo_light.svg" alt="Tauri Logo" class="tauri-logo logo-light" loading="lazy">
75+
<img src="./assets/logo.svg" alt="Tauri Logo" class="tauri-logo logo-dark" loading="lazy">
76+
</li>
77+
</ul>
78+
<ul>
79+
<li>
80+
<select id="theme-switcher" aria-label="Theme">
81+
<option value="light">Light</option>
82+
<option value="dark">Dark</option>
83+
<option value="auto" selected>Auto</option>
84+
</select>
85+
</li>
86+
</ul>
87+
</nav>
88+
</header>
89+
<main class="container">
90+
<hgroup>
91+
<h1>Javascript Reference</h1>
92+
<p>API reference for Tauri core and plugins</p>
93+
</hgroup>
94+
<section>
95+
<div>{{ tauriCard }}</div>
96+
<h3>Plugins</h3>
97+
<div class="grid">
98+
{{ pluginsGridHtml }}
99+
</div>
100+
</section>
101+
</main>
102+
<footer class="container">
103+
<small>&copy; 2025 Tauri Apps. All rights reserved.</small>
104+
</footer>
105+
<script>
106+
const themeSwitcher = document.getElementById('theme-switcher');
107+
function setTheme(theme) {
108+
if (theme === 'auto') {
109+
document.documentElement.removeAttribute('data-theme');
110+
localStorage.removeItem('theme');
111+
} else {
112+
document.documentElement.setAttribute('data-theme', theme);
113+
localStorage.setItem('theme', theme);
114+
}
115+
}
116+
themeSwitcher.value = localStorage.getItem('theme') || 'auto';
117+
setTheme(themeSwitcher.value);
118+
themeSwitcher.addEventListener('change', (e) => {
119+
setTheme(e.target.value);
120+
});
121+
</script>
122+
</body>
123+
124+
</html>

packages/js-api-generator/package.json

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,16 +5,14 @@
55
"type": "module",
66
"main": "build.js",
77
"scripts": {
8-
"build": "tsm ./build.ts"
8+
"build": "npx tsc && node build.js"
99
},
1010
"keywords": [],
1111
"author": "",
1212
"license": "MIT",
1313
"private": "true",
1414
"dependencies": {
15-
"tsm": "^2.3.0",
1615
"typedoc": "^0.28.7",
17-
"typedoc-plugin-mdn-links": "^5.0.5",
18-
"typescript": "5.4.5"
16+
"typedoc-plugin-mdn-links": "^5.0.5"
1917
}
2018
}
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"compilerOptions": {
3+
"module": "nodenext",
4+
"moduleResolution": "nodenext",
5+
"strict": true,
6+
}
7+
}

pnpm-lock.yaml

Lines changed: 6 additions & 19 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)