@cfbender/cesium 0.5.2 → 0.6.1

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.
@@ -3,7 +3,7 @@
3
3
  import type { IndexEntry } from "./index-cache.ts";
4
4
  import type { ThemeTokens } from "../render/theme.ts";
5
5
  import { faviconLinkTag, faviconEmblemSvg } from "../render/favicon.ts";
6
- import { fallbackCss } from "../render/fallback.ts";
6
+ import { buildThemeCss } from "./theme-write.ts";
7
7
 
8
8
  export interface RenderProjectIndexArgs {
9
9
  projectSlug: string;
@@ -267,7 +267,7 @@ function renderEntryCard(entry: IndexEntry): string {
267
267
  // ─── renderProjectIndex ──────────────────────────────────────────────────────
268
268
 
269
269
  export function renderProjectIndex(args: RenderProjectIndexArgs): string {
270
- const { projectSlug, projectName, entries } = args;
270
+ const { projectSlug, projectName, entries, theme } = args;
271
271
  const href =
272
272
  args.themeCssHref === undefined
273
273
  ? "../../theme.css"
@@ -276,7 +276,9 @@ export function renderProjectIndex(args: RenderProjectIndexArgs): string {
276
276
  : args.themeCssHref;
277
277
  const suppressLink = args.themeCssHref === null;
278
278
 
279
- const fallback = fallbackCss();
279
+ // Bake the full theme CSS into the index so it's self-contained when opened
280
+ // standalone; the <link> below still loads and overrides when served.
281
+ const themeCss = buildThemeCss(theme);
280
282
  const iCss = indexCss();
281
283
  const iJs = indexJs();
282
284
 
@@ -359,8 +361,7 @@ ${cardsHtml}
359
361
  <meta charset="utf-8">
360
362
  <meta name="viewport" content="width=device-width, initial-scale=1">
361
363
  <title>${esc(projectName)} · cesium</title>
362
- <style>/* fallback — standalone-readable; full styles served from /theme.css */
363
- ${fallback}${iCss}</style>${linkTag}${faviconTag}
364
+ <style>${themeCss}${iCss}</style>${linkTag}${faviconTag}
364
365
  </head>
365
366
  <body>
366
367
  <div class="page">
@@ -381,7 +382,7 @@ ${fallback}${iCss}</style>${linkTag}${faviconTag}
381
382
  // ─── renderGlobalIndex ───────────────────────────────────────────────────────
382
383
 
383
384
  export function renderGlobalIndex(args: RenderGlobalIndexArgs): string {
384
- const { projects } = args;
385
+ const { projects, theme } = args;
385
386
  const href =
386
387
  args.themeCssHref === undefined
387
388
  ? "theme.css"
@@ -390,7 +391,9 @@ export function renderGlobalIndex(args: RenderGlobalIndexArgs): string {
390
391
  : args.themeCssHref;
391
392
  const suppressLink = args.themeCssHref === null;
392
393
 
393
- const fallback = fallbackCss();
394
+ // Bake the full theme CSS into the index so it's self-contained when opened
395
+ // standalone; the <link> below still loads and overrides when served.
396
+ const themeCss = buildThemeCss(theme);
394
397
  const iCss = indexCss();
395
398
 
396
399
  const linkTag = suppressLink ? "" : `\n <link rel="stylesheet" href="${href}">`;
@@ -447,8 +450,7 @@ export function renderGlobalIndex(args: RenderGlobalIndexArgs): string {
447
450
  <meta charset="utf-8">
448
451
  <meta name="viewport" content="width=device-width, initial-scale=1">
449
452
  <title>All projects · cesium</title>
450
- <style>/* fallback — standalone-readable; full styles served from /theme.css */
451
- ${fallback}${iCss}</style>${linkTag}${faviconTag}
453
+ <style>${themeCss}${iCss}</style>${linkTag}${faviconTag}
452
454
  </head>
453
455
  <body>
454
456
  <div class="page">
@@ -1,7 +1,15 @@
1
1
  // Writes theme.css to the state directory for dynamic theme support.
2
+ //
3
+ // Produces the same content as `assets.ts:ensureThemeCss` — tokens + framework
4
+ // rules. The two writers were split during the v1 design (when theme.css held
5
+ // tokens only and framework CSS was inlined into every artifact) and were never
6
+ // re-unified after the phase 1 refactor promoted theme.css to carry the full
7
+ // framework. Keeping them aligned is now an invariant: if they disagree,
8
+ // `cesium theme apply` will clobber the CSS that the server / publish flow
9
+ // just wrote, and artifacts will render unstyled.
2
10
 
3
11
  import { join } from "node:path";
4
- import { themeTokensCss } from "../render/theme.ts";
12
+ import { themeTokensCss, frameworkRulesCss } from "../render/theme.ts";
5
13
  import type { ThemeTokens } from "../render/theme.ts";
6
14
  import { atomicWrite } from "./write.ts";
7
15
 
@@ -10,10 +18,16 @@ export function themeCssPath(stateDir: string): string {
10
18
  return join(stateDir, "theme.css");
11
19
  }
12
20
 
13
- /** Writes <stateDir>/theme.css with token definitions only (no framework rules).
21
+ /** Returns the full theme.css content (tokens + framework rules) for a theme.
22
+ * Must stay byte-identical to `assets.ts:buildCss` — see module docstring. */
23
+ export function buildThemeCss(theme: ThemeTokens): string {
24
+ return themeTokensCss(theme) + "\n" + frameworkRulesCss();
25
+ }
26
+
27
+ /** Writes <stateDir>/theme.css with the full framework CSS (tokens + rules).
14
28
  * Atomic. Returns the absolute path. */
15
29
  export async function writeThemeCss(stateDir: string, theme: ThemeTokens): Promise<string> {
16
30
  const path = themeCssPath(stateDir);
17
- await atomicWrite(path, themeTokensCss(theme) + "\n");
31
+ await atomicWrite(path, buildThemeCss(theme));
18
32
  return path;
19
33
  }
package/src/tools/wait.ts CHANGED
@@ -87,6 +87,7 @@ async function resolveArtifactPath(stateDir: string, id: string): Promise<string
87
87
  const indexPath = join(projectsDir, projectSlug, "index.json");
88
88
  let entries;
89
89
  try {
90
+ // eslint-disable-next-line no-await-in-loop -- short-circuit on first project containing the id
90
91
  entries = await loadIndex(indexPath);
91
92
  } catch {
92
93
  continue;
@@ -1,18 +0,0 @@
1
- // Minimal inline fallback CSS — ~8 lines, ≤500 bytes minified.
2
- // Goal: standalone .html files opened via file:// look "plain but readable,"
3
- // not broken. Full styling comes from the served /theme.css.
4
-
5
- /** Returns a compact CSS block covering typography, color tokens, and basic
6
- * component borders. Used as the inline <style> fallback in every artifact.
7
- * Budget: ≤500 bytes minified. */
8
- export function fallbackCss(): string {
9
- return (
10
- ":root{font-family:system-ui,sans-serif;line-height:1.6;}" +
11
- "body{max-width:900px;margin:0 auto;padding:24px;}" +
12
- "@media(prefers-color-scheme:dark){body{background:#180810;color:#ddd;}}" +
13
- "pre,code{font-family:ui-monospace,monospace;font-size:.875em;}" +
14
- ".card,.tldr{border:1.5px solid #ccc;border-radius:8px;padding:14px 18px;}" +
15
- ".callout{border:1.5px solid #ccc;border-radius:6px;padding:12px 16px;}" +
16
- "table{border-collapse:collapse;width:100%;}th,td{border:1px solid #ccc;padding:8px;}"
17
- );
18
- }