Frontend: site chrome, demo shell, pages, and the contract gates
Five parallel lanes plus an integration pass. The header, gallery, router and sitemap are all generated from the demo registry, so adding src/demos/<slug>/ puts a demo everywhere with zero edits to shared files — which is the whole reason demo nine cannot break demo one. check-demos enforces the twelve contract rules: 142 checks over one live demo. Two worth naming. The shell may not mention a specific slug, because an 'if (slug === wordle)' in src/components/demo/ is a contract bug wearing a patch. And a spec-status demo must ship a real specification — task, actions, grader, counterweight, eval command — since a coming-soon card reads worse than an honest empty gallery. Bundle budget holds: entry 108.79 kB gzipped against a 160 kB ceiling, the demo chunk 21.15 kB against 90 kB. recharts is 108 kB gzipped and lives behind a lazy import so it never touches the entry. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_019mt6sHQHEnEYrJZvoMCJSB
This commit is contained in:
@@ -89,11 +89,23 @@ interface DemoModuleShape {
|
||||
readonly default?: unknown;
|
||||
}
|
||||
|
||||
const metaModules = import.meta.glob<MetaModuleShape>('../../demos/*/meta.ts', {
|
||||
eager: true,
|
||||
});
|
||||
/**
|
||||
* A leading underscore marks scaffolding, not a demo — the same convention
|
||||
* `scripts/_lib.mjs` uses for `demoSlugs()` and `scripts/new-demo.mjs` copies
|
||||
* from. It is excluded in the GLOB rather than filtered after, so the template
|
||||
* is never even imported: it holds unsubstituted `__slug__` tokens, which the
|
||||
* validator below would quarantine with a console error on every page load,
|
||||
* and an eager glob would ship it to every visitor to say so.
|
||||
*/
|
||||
const metaModules = import.meta.glob<MetaModuleShape>(
|
||||
['../../demos/*/meta.ts', '!../../demos/_*/meta.ts'],
|
||||
{ eager: true },
|
||||
);
|
||||
|
||||
const demoLoaders = import.meta.glob<DemoModuleShape>('../../demos/*/demo.tsx');
|
||||
const demoLoaders = import.meta.glob<DemoModuleShape>([
|
||||
'../../demos/*/demo.tsx',
|
||||
'!../../demos/_*/demo.tsx',
|
||||
]);
|
||||
|
||||
/** `../../demos/wordle-five/meta.ts` -> `wordle-five` */
|
||||
function slugFromPath(path: string): string | null {
|
||||
|
||||
Reference in New Issue
Block a user