create-refrakt 0.3.0 → 0.5.0

package/dist/bin.js

@@ -1,9 +1,11 @@
 #!/usr/bin/env node
-import { scaffold } from './scaffold.js';
+import { scaffold, scaffoldTheme } from './scaffold.js';
 import * as path from 'node:path';
 const args = process.argv.slice(2);
 let projectName;
-let theme = '@refrakt-md/theme-lumina';
+let theme = '@refrakt-md/lumina';
+let type = 'site';
+let scope;
 for (let i = 0; i < args.length; i++) {
     const arg = args[i];
     if (arg === '--theme' || arg === '-t') {
@@ -13,6 +15,24 @@ for (let i = 0; i < args.length; i++) {
             process.exit(1);
         }
     }
+    else if (arg === '--type') {
+        const val = args[++i];
+        if (val !== 'site' && val !== 'theme') {
+            console.error('Error: --type must be "site" or "theme"');
+            process.exit(1);
+        }
+        type = val;
+    }
+    else if (arg === '--scope' || arg === '-s') {
+        scope = args[++i];
+        if (!scope) {
+            console.error('Error: --scope requires a value');
+            process.exit(1);
+        }
+        if (!scope.startsWith('@')) {
+            scope = `@${scope}`;
+        }
+    }
     else if (arg === '--help' || arg === '-h') {
         printUsage();
         process.exit(0);
@@ -38,26 +58,56 @@ if (!projectName) {
 }
 function printUsage() {
     console.log(`
-Usage: create-refrakt <project-name> [options]
+Usage: create-refrakt <name> [options]
 
 Options:
-  --theme, -t <package>  Theme package to use (default: @refrakt-md/theme-lumina)
+  --type <site|theme>    What to create (default: site)
+  --theme, -t <package>  Theme package to use (sites only, default: @refrakt-md/lumina)
+  --scope, -s <scope>    npm scope for the package (themes only, e.g., @my-org)
   --help, -h             Show this help message
 
-Example:
+Examples:
   npx create-refrakt my-site
-  npx create-refrakt my-site --theme @refrakt-md/theme-aurora
+  npx create-refrakt my-site --theme @refrakt-md/aurora
+  npx create-refrakt my-theme --type theme
+  npx create-refrakt my-theme --type theme --scope @my-org
 `);
 }
 const targetDir = path.resolve(process.cwd(), projectName);
 try {
-    scaffold({ projectName, targetDir, theme });
+    if (type === 'theme') {
+        scaffoldTheme({ themeName: projectName, targetDir, scope });
+    }
+    else {
+        scaffold({ projectName, targetDir, theme });
+    }
 }
 catch (err) {
     console.error(`\nError: ${err.message}`);
     process.exit(1);
 }
-console.log(`
+if (type === 'theme') {
+    console.log(`
+Done! Your refrakt.md theme package is ready.
+
+Next steps:
+
+  cd ${projectName}
+  npm install
+  npm run build
+
+Then use it in a site:
+
+  {
+    "theme": "${scope ? `${scope}/${projectName}` : projectName}",
+    "target": "svelte"
+  }
+
+Run \`refrakt scaffold-css\` to generate CSS stubs for all runes.
+`);
+}
+else {
+    console.log(`
 Done! Your refrakt.md site is ready.
 
 Next steps:
@@ -66,4 +116,5 @@ Next steps:
   npm install
   npm run dev
 `);
+}
 //# sourceMappingURL=bin.js.map

package/dist/bin.js.map

@@ -1 +1 @@
-{"version":3,"file":"bin.js","sourceRoot":"","sources":["../src/bin.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAC;AAElC,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AAEnC,IAAI,WAA+B,CAAC;AACpC,IAAI,KAAK,GAAG,0BAA0B,CAAC;AAEvC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;IACtC,MAAM,GAAG,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;IACpB,IAAI,GAAG,KAAK,SAAS,IAAI,GAAG,KAAK,IAAI,EAAE,CAAC;QACvC,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;QAClB,IAAI,CAAC,KAAK,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,iCAAiC,CAAC,CAAC;YACjD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACjB,CAAC;IACF,CAAC;SAAM,IAAI,GAAG,KAAK,QAAQ,IAAI,GAAG,KAAK,IAAI,EAAE,CAAC;QAC7C,UAAU,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC;SAAM,IAAI,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;QAChC,OAAO,CAAC,KAAK,CAAC,wBAAwB,GAAG,KAAK,CAAC,CAAC;QAChD,UAAU,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC;SAAM,IAAI,CAAC,WAAW,EAAE,CAAC;QACzB,WAAW,GAAG,GAAG,CAAC;IACnB,CAAC;SAAM,CAAC;QACP,OAAO,CAAC,KAAK,CAAC,+BAA+B,GAAG,KAAK,CAAC,CAAC;QACvD,UAAU,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC;AACF,CAAC;AAED,IAAI,CAAC,WAAW,EAAE,CAAC;IAClB,OAAO,CAAC,KAAK,CAAC,+BAA+B,CAAC,CAAC;IAC/C,UAAU,EAAE,CAAC;IACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACjB,CAAC;AAED,SAAS,UAAU;IAClB,OAAO,CAAC,GAAG,CAAC;;;;;;;;;;CAUZ,CAAC,CAAC;AACH,CAAC;AAED,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,WAAW,CAAC,CAAC;AAE3D,IAAI,CAAC;IACJ,QAAQ,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;AAC7C,CAAC;AAAC,OAAO,GAAG,EAAE,CAAC;IACd,OAAO,CAAC,KAAK,CAAC,YAAa,GAAa,CAAC,OAAO,EAAE,CAAC,CAAC;IACpD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACjB,CAAC;AAED,OAAO,CAAC,GAAG,CAAC;;;;;OAKL,WAAW;;;CAGjB,CAAC,CAAC"}
+{"version":3,"file":"bin.js","sourceRoot":"","sources":["../src/bin.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACxD,OAAO,KAAK,IAAI,MAAM,WAAW,CAAC;AAElC,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AAEnC,IAAI,WAA+B,CAAC;AACpC,IAAI,KAAK,GAAG,oBAAoB,CAAC;AACjC,IAAI,IAAI,GAAqB,MAAM,CAAC;AACpC,IAAI,KAAyB,CAAC;AAE9B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;IACtC,MAAM,GAAG,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;IACpB,IAAI,GAAG,KAAK,SAAS,IAAI,GAAG,KAAK,IAAI,EAAE,CAAC;QACvC,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;QAClB,IAAI,CAAC,KAAK,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,iCAAiC,CAAC,CAAC;YACjD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACjB,CAAC;IACF,CAAC;SAAM,IAAI,GAAG,KAAK,QAAQ,EAAE,CAAC;QAC7B,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;QACtB,IAAI,GAAG,KAAK,MAAM,IAAI,GAAG,KAAK,OAAO,EAAE,CAAC;YACvC,OAAO,CAAC,KAAK,CAAC,yCAAyC,CAAC,CAAC;YACzD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACjB,CAAC;QACD,IAAI,GAAG,GAAG,CAAC;IACZ,CAAC;SAAM,IAAI,GAAG,KAAK,SAAS,IAAI,GAAG,KAAK,IAAI,EAAE,CAAC;QAC9C,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;QAClB,IAAI,CAAC,KAAK,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,iCAAiC,CAAC,CAAC;YACjD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACjB,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;YAC5B,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;QACrB,CAAC;IACF,CAAC;SAAM,IAAI,GAAG,KAAK,QAAQ,IAAI,GAAG,KAAK,IAAI,EAAE,CAAC;QAC7C,UAAU,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC;SAAM,IAAI,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;QAChC,OAAO,CAAC,KAAK,CAAC,wBAAwB,GAAG,KAAK,CAAC,CAAC;QAChD,UAAU,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC;SAAM,IAAI,CAAC,WAAW,EAAE,CAAC;QACzB,WAAW,GAAG,GAAG,CAAC;IACnB,CAAC;SAAM,CAAC;QACP,OAAO,CAAC,KAAK,CAAC,+BAA+B,GAAG,KAAK,CAAC,CAAC;QACvD,UAAU,EAAE,CAAC;QACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC;AACF,CAAC;AAED,IAAI,CAAC,WAAW,EAAE,CAAC;IAClB,OAAO,CAAC,KAAK,CAAC,+BAA+B,CAAC,CAAC;IAC/C,UAAU,EAAE,CAAC;IACb,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACjB,CAAC;AAED,SAAS,UAAU;IAClB,OAAO,CAAC,GAAG,CAAC;;;;;;;;;;;;;;CAcZ,CAAC,CAAC;AACH,CAAC;AAED,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,WAAW,CAAC,CAAC;AAE3D,IAAI,CAAC;IACJ,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;QACtB,aAAa,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7D,CAAC;SAAM,CAAC;QACP,QAAQ,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7C,CAAC;AACF,CAAC;AAAC,OAAO,GAAG,EAAE,CAAC;IACd,OAAO,CAAC,KAAK,CAAC,YAAa,GAAa,CAAC,OAAO,EAAE,CAAC,CAAC;IACpD,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACjB,CAAC;AAED,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;IACtB,OAAO,CAAC,GAAG,CAAC;;;;;OAKN,WAAW;;;;;;;gBAOF,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,WAAW,EAAE,CAAC,CAAC,CAAC,WAAW;;;;;CAK9D,CAAC,CAAC;AACH,CAAC;KAAM,CAAC;IACP,OAAO,CAAC,GAAG,CAAC;;;;;OAKN,WAAW;;;CAGjB,CAAC,CAAC;AACH,CAAC"}

package/dist/scaffold.d.ts

@@ -4,4 +4,10 @@ export interface ScaffoldOptions {
     theme: string;
 }
 export declare function scaffold(options: ScaffoldOptions): void;
+export interface ThemeScaffoldOptions {
+    themeName: string;
+    targetDir: string;
+    scope?: string;
+}
+export declare function scaffoldTheme(options: ThemeScaffoldOptions): void;
 //# sourceMappingURL=scaffold.d.ts.map

package/dist/scaffold.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scaffold.d.ts","sourceRoot":"","sources":["../src/scaffold.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,eAAe;IAC/B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,QAAQ,CAAC,OAAO,EAAE,eAAe,GAAG,IAAI,CAoDvD"}
+{"version":3,"file":"scaffold.d.ts","sourceRoot":"","sources":["../src/scaffold.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,eAAe;IAC/B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,QAAQ,CAAC,OAAO,EAAE,eAAe,GAAG,IAAI,CAoDvD;AAwED,MAAM,WAAW,oBAAoB;IACpC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,aAAa,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAqFjE"}

package/dist/scaffold.js

@@ -44,11 +44,13 @@ function generatePackageJson(projectName, theme) {
             check: 'svelte-kit sync && svelte-check --tsconfig ./tsconfig.json',
         },
         dependencies: {
-            '@refrakt-md/content': '^0.1.0',
-            '@refrakt-md/runes': '^0.1.0',
-            '@refrakt-md/svelte': '^0.1.0',
-            '@refrakt-md/sveltekit': '^0.1.0',
-            [theme]: '^0.1.0',
+            '@refrakt-md/content': '^0.4.0',
+            '@refrakt-md/highlight': '^0.4.0',
+            '@refrakt-md/runes': '^0.4.0',
+            '@refrakt-md/svelte': '^0.4.0',
+            '@refrakt-md/sveltekit': '^0.4.0',
+            '@refrakt-md/types': '^0.4.0',
+            [theme]: '^0.4.0',
             '@markdoc/markdoc': '^0.4.0',
         },
         devDependencies: {
@@ -69,7 +71,7 @@ function generateRefraktConfig(theme) {
     const config = {
         contentDir: './content',
         theme,
-        target: 'sveltekit',
+        target: 'svelte',
     };
     return JSON.stringify(config, null, '\t') + '\n';
 }
@@ -93,4 +95,477 @@ npm run preview
 \`\`\`
 `;
 }
+export function scaffoldTheme(options) {
+    const { themeName, targetDir, scope } = options;
+    if (existsSync(targetDir)) {
+        throw new Error(`Directory "${targetDir}" already exists`);
+    }
+    const packageName = scope ? `${scope}/${themeName}` : themeName;
+    mkdirSync(path.join(targetDir, 'src'), { recursive: true });
+    mkdirSync(path.join(targetDir, 'svelte', 'layouts'), { recursive: true });
+    mkdirSync(path.join(targetDir, 'tokens'), { recursive: true });
+    mkdirSync(path.join(targetDir, 'styles', 'runes'), { recursive: true });
+    mkdirSync(path.join(targetDir, 'test'), { recursive: true });
+    mkdirSync(path.join(targetDir, 'preview'), { recursive: true });
+    writeFileSync(path.join(targetDir, 'package.json'), generateThemePackageJson(packageName));
+    writeFileSync(path.join(targetDir, 'src', 'config.ts'), generateThemeConfig());
+    writeFileSync(path.join(targetDir, 'svelte', 'index.ts'), generateThemeSvelteIndex());
+    writeFileSync(path.join(targetDir, 'manifest.json'), generateThemeManifest(packageName));
+    writeFileSync(path.join(targetDir, 'index.css'), generateThemeIndexCss());
+    writeFileSync(path.join(targetDir, 'tokens', 'base.css'), generateThemeBaseTokens());
+    writeFileSync(path.join(targetDir, 'tokens', 'dark.css'), generateThemeDarkTokens());
+    writeFileSync(path.join(targetDir, 'styles', 'global.css'), generateThemeGlobalCss());
+    writeFileSync(path.join(targetDir, 'tsconfig.json'), generateThemeTsconfig());
+    writeFileSync(path.join(targetDir, 'svelte', 'layouts', 'DefaultLayout.svelte'), generateThemeDefaultLayout());
+    writeFileSync(path.join(targetDir, 'test', 'css-coverage.test.ts'), generateThemeCssCoverageTest());
+    writeFileSync(path.join(targetDir, 'preview', 'kitchen-sink.md'), generateThemeKitchenSink());
+    writeFileSync(path.join(targetDir, 'base.css'), generateThemeBaseCss());
+    writeFileSync(path.join(targetDir, 'svelte', 'tokens.css'), generateThemeTokensBridge());
+}
+function generateThemePackageJson(packageName) {
+    const pkg = {
+        name: packageName,
+        version: '0.1.0',
+        type: 'module',
+        main: 'dist/config.js',
+        types: 'dist/config.d.ts',
+        exports: {
+            '.': './index.css',
+            './base.css': './base.css',
+            './transform': {
+                types: './dist/config.d.ts',
+                default: './dist/config.js',
+            },
+            './svelte': {
+                svelte: './svelte/index.ts',
+                default: './svelte/index.ts',
+            },
+            './manifest': './manifest.json',
+            './styles/runes/*.css': './styles/runes/*.css',
+            './svelte/tokens.css': './svelte/tokens.css',
+        },
+        files: [
+            'dist',
+            'base.css',
+            'index.css',
+            'tokens',
+            'styles',
+            'manifest.json',
+            'svelte',
+        ],
+        scripts: {
+            build: 'tsc',
+            test: 'vitest run',
+        },
+        dependencies: {
+            '@refrakt-md/theme-base': '^0.4.0',
+            '@refrakt-md/transform': '^0.4.0',
+            '@refrakt-md/types': '^0.4.0',
+            '@refrakt-md/svelte': '^0.4.0',
+        },
+        devDependencies: {
+            vitest: '^3.0.0',
+            postcss: '^8.4.0',
+        },
+    };
+    return JSON.stringify(pkg, null, '\t') + '\n';
+}
+function generateThemeConfig() {
+    return `import { baseConfig, mergeThemeConfig } from '@refrakt-md/theme-base';
+
+export const themeConfig = mergeThemeConfig(baseConfig, {
+\t// Provide icon SVGs for runes that display them (e.g., Hint)
+\ticons: {
+\t\t// hint: {
+\t\t//   note: '<svg xmlns="http://www.w3.org/2000/svg" ...>...</svg>',
+\t\t//   warning: '<svg ...>...</svg>',
+\t\t//   caution: '<svg ...>...</svg>',
+\t\t//   check: '<svg ...>...</svg>',
+\t\t// },
+\t},
+
+\t// Override specific rune configs (optional)
+\trunes: {},
+});
+`;
+}
+function generateThemeSvelteIndex() {
+    return `import type { SvelteTheme } from '@refrakt-md/svelte';
+import manifest from '../manifest.json';
+import { registry } from '@refrakt-md/theme-base/svelte/registry';
+import { elements } from '@refrakt-md/theme-base/svelte/elements';
+import DefaultLayout from './layouts/DefaultLayout.svelte';
+
+export { default as manifest } from '../manifest.json';
+
+export const theme: SvelteTheme = {
+\tmanifest: manifest as any,
+\tlayouts: { default: DefaultLayout },
+\tcomponents: registry,
+\telements,
+};
+
+export { registry };
+export { behaviors } from '@refrakt-md/theme-base/svelte/behaviors';
+export { default as DefaultLayout } from './layouts/DefaultLayout.svelte';
+`;
+}
+function generateThemeManifest(packageName) {
+    const manifest = {
+        name: packageName,
+        version: '0.1.0',
+        target: 'svelte',
+        designTokens: './tokens/base.css',
+        layouts: {
+            default: {
+                component: './svelte/layouts/DefaultLayout.svelte',
+                regions: ['content'],
+            },
+        },
+        routeRules: [
+            { pattern: '**', layout: 'default' },
+        ],
+        components: {},
+        unsupportedRuneBehavior: 'passthrough',
+    };
+    return JSON.stringify(manifest, null, '\t') + '\n';
+}
+function generateThemeIndexCss() {
+    return `/* Design tokens */
+@import './tokens/base.css';
+@import './tokens/dark.css';
+
+/* Global styles */
+@import './styles/global.css';
+
+/* Rune styles — add imports as you create CSS for each rune */
+/* @import './styles/runes/hint.css'; */
+/* @import './styles/runes/grid.css'; */
+`;
+}
+function generateThemeBaseTokens() {
+    return `:root {
+\t/* Typography */
+\t--rf-font-sans: system-ui, -apple-system, sans-serif;
+\t--rf-font-mono: ui-monospace, 'SFMono-Regular', monospace;
+
+\t/* Primary color scale */
+\t--rf-color-primary-50: #f0f9ff;
+\t--rf-color-primary-100: #e0f2fe;
+\t--rf-color-primary-500: #3b82f6;
+\t--rf-color-primary-600: #2563eb;
+\t--rf-color-primary-900: #1e3a5f;
+
+\t/* Core palette */
+\t--rf-color-text: #1a1a2e;
+\t--rf-color-muted: #64748b;
+\t--rf-color-border: #e2e8f0;
+\t--rf-color-bg: #ffffff;
+\t--rf-color-primary: var(--rf-color-primary-500);
+\t--rf-color-primary-hover: var(--rf-color-primary-600);
+
+\t/* Surfaces */
+\t--rf-color-surface: #f8fafc;
+\t--rf-color-surface-hover: #f1f5f9;
+\t--rf-color-surface-active: #e2e8f0;
+\t--rf-color-surface-raised: #ffffff;
+
+\t/* Semantic */
+\t--rf-color-info: #3b82f6;
+\t--rf-color-info-bg: #eff6ff;
+\t--rf-color-info-border: #bfdbfe;
+\t--rf-color-warning: #f59e0b;
+\t--rf-color-warning-bg: #fffbeb;
+\t--rf-color-warning-border: #fde68a;
+\t--rf-color-danger: #ef4444;
+\t--rf-color-danger-bg: #fef2f2;
+\t--rf-color-danger-border: #fecaca;
+\t--rf-color-success: #10b981;
+\t--rf-color-success-bg: #ecfdf5;
+\t--rf-color-success-border: #a7f3d0;
+
+\t/* Radii */
+\t--rf-radius-sm: 6px;
+\t--rf-radius-md: 10px;
+\t--rf-radius-lg: 16px;
+\t--rf-radius-full: 9999px;
+
+\t/* Shadows */
+\t--rf-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
+\t--rf-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.07);
+\t--rf-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.08);
+}
+`;
+}
+function generateThemeDarkTokens() {
+    return `[data-theme="dark"] {
+\t--rf-color-text: #e2e8f0;
+\t--rf-color-muted: #94a3b8;
+\t--rf-color-border: #334155;
+\t--rf-color-bg: #0f172a;
+\t--rf-color-surface: #1e293b;
+\t--rf-color-surface-hover: #334155;
+\t--rf-color-surface-active: #475569;
+\t--rf-color-surface-raised: #1e293b;
+\t--rf-color-info-bg: #1e3a5f;
+\t--rf-color-info-border: #1e40af;
+\t--rf-color-warning-bg: #451a03;
+\t--rf-color-warning-border: #92400e;
+\t--rf-color-danger-bg: #450a0a;
+\t--rf-color-danger-border: #991b1b;
+\t--rf-color-success-bg: #052e16;
+\t--rf-color-success-border: #166534;
+}
+
+@media (prefers-color-scheme: dark) {
+\t:root:not([data-theme="light"]) {
+\t\t--rf-color-text: #e2e8f0;
+\t\t--rf-color-muted: #94a3b8;
+\t\t--rf-color-border: #334155;
+\t\t--rf-color-bg: #0f172a;
+\t\t--rf-color-surface: #1e293b;
+\t\t--rf-color-surface-hover: #334155;
+\t\t--rf-color-surface-active: #475569;
+\t\t--rf-color-surface-raised: #1e293b;
+\t\t--rf-color-info-bg: #1e3a5f;
+\t\t--rf-color-info-border: #1e40af;
+\t\t--rf-color-warning-bg: #451a03;
+\t\t--rf-color-warning-border: #92400e;
+\t\t--rf-color-danger-bg: #450a0a;
+\t\t--rf-color-danger-border: #991b1b;
+\t\t--rf-color-success-bg: #052e16;
+\t\t--rf-color-success-border: #166534;
+\t}
+}
+`;
+}
+function generateThemeGlobalCss() {
+    return `/* Global resets and base styles */
+*,
+*::before,
+*::after {
+\tbox-sizing: border-box;
+}
+
+body {
+\tfont-family: var(--rf-font-sans);
+\tcolor: var(--rf-color-text);
+\tbackground-color: var(--rf-color-bg);
+\tline-height: 1.6;
+\t-webkit-font-smoothing: antialiased;
+}
+`;
+}
+function generateThemeTsconfig() {
+    const config = {
+        compilerOptions: {
+            target: 'ES2022',
+            module: 'ES2022',
+            moduleResolution: 'bundler',
+            declaration: true,
+            outDir: 'dist',
+            rootDir: 'src',
+            strict: true,
+            esModuleInterop: true,
+            skipLibCheck: true,
+        },
+        include: ['src'],
+    };
+    return JSON.stringify(config, null, '\t') + '\n';
+}
+function generateThemeDefaultLayout() {
+    return `<script lang="ts">
+\timport { Renderer } from '@refrakt-md/svelte';
+
+\tlet { regions, renderable }: {
+\t\tregions: Record<string, { name: string; mode: string; content: any[] }>;
+\t\trenderable: any;
+\t} = $props();
+</script>
+
+{#if regions.header}
+\t<header>
+\t\t<Renderer node={regions.header.content} />
+\t</header>
+{/if}
+
+<main>
+\t<Renderer node={renderable} />
+</main>
+`;
+}
+function generateThemeCssCoverageTest() {
+    return `import { describe, it, expect } from 'vitest';
+import { readFileSync, readdirSync, existsSync } from 'fs';
+import { join } from 'path';
+import postcss from 'postcss';
+import { themeConfig } from '../src/config.js';
+
+const CSS_DIR = join(__dirname, '..', 'styles', 'runes');
+
+/** Parse all CSS files and collect every .rf-* class selector */
+function parseAllCssSelectors(): Set<string> {
+\tconst selectors = new Set<string>();
+\tif (!existsSync(CSS_DIR)) return selectors;
+
+\tconst files = readdirSync(CSS_DIR).filter(f => f.endsWith('.css'));
+\tfor (const file of files) {
+\t\tconst css = readFileSync(join(CSS_DIR, file), 'utf-8');
+\t\tconst root = postcss.parse(css);
+\t\troot.walkRules(rule => {
+\t\t\tconst matches = rule.selector.matchAll(/\\.rf-[\\w-]+/g);
+\t\t\tfor (const m of matches) {
+\t\t\t\tselectors.add(m[0]);
+\t\t\t}
+\t\t});
+\t}
+\treturn selectors;
+}
+
+const allCssSelectors = parseAllCssSelectors();
+const { prefix, runes } = themeConfig;
+
+describe('Theme CSS coverage', () => {
+\tit('block selectors exist for styled runes', () => {
+\t\tconst allBlocks = [...new Set(Object.values(runes).map(c => c.block))];
+\t\tconst styledBlocks = allBlocks.filter(block =>
+\t\t\tallCssSelectors.has(\`.\${prefix}-\${block}\`)
+\t\t);
+
+\t\tconsole.log(\`CSS coverage: \${styledBlocks.length}/\${allBlocks.length} blocks\`);
+\t\t// Start at 0% — increase this threshold as you add CSS
+\t\texpect(styledBlocks.length).toBeGreaterThanOrEqual(0);
+\t});
+});
+`;
+}
+function generateThemeKitchenSink() {
+    return `---
+title: Kitchen Sink
+description: Preview of all major runes for theme development.
+---
+
+# Kitchen Sink
+
+This page demonstrates all major rune types. Use it to preview your theme styles.
+
+## Hints
+
+{% hint type="note" %}
+This is a **note** hint for general information.
+{% /hint %}
+
+{% hint type="warning" %}
+This is a **warning** hint for cautionary messages.
+{% /hint %}
+
+{% hint type="caution" %}
+This is a **caution** hint for dangerous actions.
+{% /hint %}
+
+{% hint type="check" %}
+This is a **check** hint for success messages.
+{% /hint %}
+
+## Grid
+
+{% grid cols=3 %}
+{% feature title="Fast" %}
+Lightning-fast build times with incremental compilation.
+{% /feature %}
+
+{% feature title="Flexible" %}
+Supports multiple frameworks and output targets.
+{% /feature %}
+
+{% feature title="Extensible" %}
+Create custom runes and themes to match your brand.
+{% /feature %}
+{% /grid %}
+
+## Accordion
+
+{% accordion %}
+### What is refrakt.md?
+A documentation framework that transforms Markdown into rich, interactive pages.
+
+### How do themes work?
+Themes provide an identity transform layer (BEM classes, structure) and optional Svelte components for interactive runes.
+
+### Can I create my own runes?
+Yes! Define a schema in the runes package and add engine config to your theme.
+{% /accordion %}
+
+## Steps
+
+{% steps %}
+### Install dependencies
+\`\`\`sh
+npm install
+\`\`\`
+
+### Configure your theme
+Edit \`src/config.ts\` to customize rune behavior and icons.
+
+### Add CSS styles
+Create CSS files in \`styles/runes/\` for each rune block.
+{% /steps %}
+
+## API Endpoint
+
+{% api method="GET" path="/api/users" %}
+Returns a list of all users.
+
+### Parameters
+
+| Name | Type | Description |
+|------|------|-------------|
+| limit | number | Max results to return |
+| offset | number | Pagination offset |
+{% /api %}
+
+## Tabs
+
+{% tabs %}
+{% tab title="npm" %}
+\`\`\`sh
+npm install @refrakt-md/svelte
+\`\`\`
+{% /tab %}
+
+{% tab title="pnpm" %}
+\`\`\`sh
+pnpm add @refrakt-md/svelte
+\`\`\`
+{% /tab %}
+
+{% tab title="yarn" %}
+\`\`\`sh
+yarn add @refrakt-md/svelte
+\`\`\`
+{% /tab %}
+{% /tabs %}
+
+## Code Block
+
+\`\`\`ts title="example.ts"
+import { themeConfig } from './config';
+
+export function greet(name: string): string {
+  return \`Hello, \${name}!\`;
+}
+\`\`\`
+`;
+}
+function generateThemeBaseCss() {
+    return `/* Base styles — tokens + globals (no rune CSS) */
+@import './tokens/base.css';
+@import './tokens/dark.css';
+@import './styles/global.css';
+`;
+}
+function generateThemeTokensBridge() {
+    return `@import '../index.css';
+`;
+}
 //# sourceMappingURL=scaffold.js.map

package/dist/scaffold.js.map

@@ -1 +1 @@
-{"version":3,"file":"scaffold.js","sourceRoot":"","sources":["../src/scaffold.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"scaffold.js","sourceRoot":"","sources":["../src/scaffold.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "create-refrakt",
   "description": "Scaffold a new refrakt.md project",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "type": "module",
   "license": "MIT",
   "repository": {

package/template/src/routes/+layout.server.ts

@@ -1,7 +1,10 @@
 import { loadContent } from '@refrakt-md/content';
+import { readFileSync } from 'node:fs';
 import * as path from 'node:path';
+import type { RefraktConfig } from '@refrakt-md/types';
 
-const contentDir = path.resolve('content');
+const config: RefraktConfig = JSON.parse(readFileSync(path.resolve('refrakt.config.json'), 'utf-8'));
+const contentDir = path.resolve(config.contentDir);
 
 export async function load() {
 	const site = await loadContent(contentDir);

package/template/src/routes/[...slug]/+page.server.ts

@@ -1,15 +1,31 @@
 import { loadContent } from '@refrakt-md/content';
 import { serialize, serializeTree } from '@refrakt-md/svelte';
+import { createHighlightTransform } from '@refrakt-md/highlight';
+import type { HighlightTransform } from '@refrakt-md/highlight';
 import { error } from '@sveltejs/kit';
+import { readFileSync } from 'node:fs';
 import * as path from 'node:path';
 import type { PageServerLoad } from './$types';
+import type { RefraktConfig } from '@refrakt-md/types';
 
-const contentDir = path.resolve('content');
+const config: RefraktConfig = JSON.parse(readFileSync(path.resolve('refrakt.config.json'), 'utf-8'));
+const contentDir = path.resolve(config.contentDir);
+
+let _hl: HighlightTransform | null = null;
+
+async function getHighlightTransform(): Promise<HighlightTransform> {
+	const cached = _hl;
+	if (cached) return cached;
+	const hl = await createHighlightTransform(config.highlight);
+	_hl = hl;
+	return hl;
+}
 
 export const prerender = true;
 
 export const load: PageServerLoad = async ({ params }) => {
 	const site = await loadContent(contentDir);
+	const hl = await getHighlightTransform();
 	const slug = params.slug || '';
 	const url = '/' + slug;
 
@@ -19,17 +35,20 @@ export const load: PageServerLoad = async ({ params }) => {
 		error(404, 'Page not found');
 	}
 
+	const renderable = hl(serializeTree(page.renderable));
+
 	return {
 		title: page.frontmatter.title ?? '',
 		description: page.frontmatter.description ?? '',
-		renderable: serializeTree(page.renderable),
+		renderable,
 		regions: Object.fromEntries(
 			[...page.layout.regions.entries()].map(([name, region]) => [
 				name,
-				{ name: region.name, mode: region.mode, content: region.content.map(serialize) }
+				{ name: region.name, mode: region.mode, content: region.content.map(c => hl(serialize(c))) }
 			])
 		),
 		url,
+		highlightCss: hl.css,
 	};
 };
 

package/template/src/routes/[...slug]/+page.svelte

@@ -5,6 +5,12 @@
 	let { data } = $props();
 </script>
 
+<svelte:head>
+	{#if data.highlightCss}
+		{@html `<style>${data.highlightCss}</style>`}
+	{/if}
+</svelte:head>
+
 <ThemeShell
 	{theme}
 	page={{