create-rasti 0.0.1

package/src/utils/exec.js

@@ -0,0 +1,83 @@
+import { execSync } from 'node:child_process';
+
+/**
+ * Detect the package manager being used.
+ * Checks npm_config_user_agent or falls back to checking available commands.
+ * @returns {string} Package manager name (npm, pnpm, bun)
+ */
+export function detectPackageManager() {
+    const userAgent = process.env.npm_config_user_agent || '';
+
+    if (userAgent.includes('pnpm')) {
+        return 'pnpm';
+    }
+
+    if (userAgent.includes('bun')) {
+        return 'bun';
+    }
+
+    if (userAgent.includes('yarn')) {
+        return 'yarn';
+    }
+
+    // Fallback: check if pnpm or bun is available
+    if (isCommandAvailable('pnpm')) {
+        return 'pnpm';
+    }
+
+    if (isCommandAvailable('bun')) {
+        return 'bun';
+    }
+
+    return 'npm';
+}
+
+/**
+ * Check if a command is available in the system.
+ * @param {string} command - Command name
+ * @returns {boolean} True if command is available
+ */
+function isCommandAvailable(command) {
+    try {
+        execSync(`${command} --version`, { stdio : 'ignore' });
+        return true;
+    } catch {
+        return false;
+    }
+}
+
+/**
+ * Get the install command for the detected package manager.
+ * @param {string} pm - Package manager name
+ * @returns {string} Install command
+ */
+export function getInstallCommand(pm) {
+    switch (pm) {
+    case 'pnpm':
+        return 'pnpm install';
+    case 'bun':
+        return 'bun install';
+    case 'yarn':
+        return 'yarn';
+    default:
+        return 'npm install';
+    }
+}
+
+/**
+ * Get the dev command for the detected package manager.
+ * @param {string} pm - Package manager name
+ * @returns {string} Dev command
+ */
+export function getDevCommand(pm) {
+    switch (pm) {
+    case 'pnpm':
+        return 'pnpm dev';
+    case 'bun':
+        return 'bun dev';
+    case 'yarn':
+        return 'yarn dev';
+    default:
+        return 'npm run dev';
+    }
+}

package/src/utils/logger.js

@@ -0,0 +1,79 @@
+import * as p from '@clack/prompts';
+import { getInstallCommand, getDevCommand } from './exec.js';
+
+/**
+ * Logging utilities using @clack/prompts for consistent output.
+ */
+export const log = {
+    /**
+     * Log an info message.
+     * @param {string} message - Message to log
+     */
+    info : (message) => {
+        p.log.info(message);
+    },
+
+    /**
+     * Log a success message.
+     * @param {string} message - Message to log
+     */
+    success : (message) => {
+        p.log.success(message);
+    },
+
+    /**
+     * Log a warning message.
+     * @param {string} message - Message to log
+     */
+    warn : (message) => {
+        p.log.warn(message);
+    },
+
+    /**
+     * Log an error message.
+     * @param {string} message - Message to log
+     */
+    error : (message) => {
+        p.log.error(message);
+    },
+
+    /**
+     * Log a step message.
+     * @param {string} message - Message to log
+     */
+    step : (message) => {
+        p.log.step(message);
+    }
+};
+
+/**
+ * Create a spinner for long-running operations.
+ * @returns {object} Spinner object with start and stop methods
+ */
+export function createSpinner() {
+    return p.spinner();
+}
+
+/**
+ * Show intro message.
+ */
+export function intro() {
+    p.intro('create-rasti');
+}
+
+/**
+ * Show outro message with next steps.
+ * @param {string} projectName - Name of the created project
+ * @param {string} [pm='npm'] - Package manager to use
+ */
+export function outro(projectName, pm = 'npm') {
+    const installCmd = getInstallCommand(pm);
+    const devCmd = getDevCommand(pm);
+
+    p.note(
+        `cd ${projectName}\n${installCmd}\n${devCmd}`,
+        'Next steps'
+    );
+
+    p.outro('Project ready. Have fun.');
+}

package/src/utils/pkg.js

@@ -0,0 +1,87 @@
+import { readFile, writeFile } from './copy.js';
+import path from 'node:path';
+
+/**
+ * Read package.json from a directory.
+ * @param {string} dir - Directory path
+ * @returns {Promise<object>} Package.json content
+ */
+export async function readPackageJson(dir) {
+    const pkgPath = path.join(dir, 'package.json');
+    const content = await readFile(pkgPath);
+    return JSON.parse(content);
+}
+
+/**
+ * Write package.json to a directory.
+ * @param {string} dir - Directory path
+ * @param {object} pkg - Package.json content
+ */
+export async function writePackageJson(dir, pkg) {
+    const pkgPath = path.join(dir, 'package.json');
+    // Use 4 spaces indentation to match Rasti style
+    const content = JSON.stringify(pkg, null, 4);
+    await writeFile(pkgPath, content + '\n');
+}
+
+/**
+ * Add dependencies to package.json.
+ * @param {string} dir - Directory path
+ * @param {object} deps - Dependencies to add { dependencies?: object, devDependencies?: object }
+ */
+export async function addDependencies(dir, deps) {
+    const pkg = await readPackageJson(dir);
+
+    if (deps.dependencies) {
+        pkg.dependencies = pkg.dependencies || {};
+        Object.assign(pkg.dependencies, deps.dependencies);
+        // Sort dependencies
+        pkg.dependencies = sortObject(pkg.dependencies);
+    }
+
+    if (deps.devDependencies) {
+        pkg.devDependencies = pkg.devDependencies || {};
+        Object.assign(pkg.devDependencies, deps.devDependencies);
+        // Sort devDependencies
+        pkg.devDependencies = sortObject(pkg.devDependencies);
+    }
+
+    await writePackageJson(dir, pkg);
+}
+
+/**
+ * Update package.json name field.
+ * @param {string} dir - Directory path
+ * @param {string} name - New package name
+ */
+export async function updatePackageName(dir, name) {
+    const pkg = await readPackageJson(dir);
+    pkg.name = name;
+    await writePackageJson(dir, pkg);
+}
+
+/**
+ * Merge scripts into package.json (add or override).
+ * @param {string} dir - Directory path
+ * @param {object} scripts - Scripts to merge { scriptName: "command", ... }
+ */
+export async function mergeScripts(dir, scripts) {
+    const pkg = await readPackageJson(dir);
+    pkg.scripts = pkg.scripts || {};
+    Object.assign(pkg.scripts, scripts);
+    await writePackageJson(dir, pkg);
+}
+
+/**
+ * Sort object keys alphabetically.
+ * @param {object} obj - Object to sort
+ * @returns {object} Sorted object
+ */
+function sortObject(obj) {
+    return Object.keys(obj)
+        .sort()
+        .reduce((result, key) => {
+            result[key] = obj[key];
+            return result;
+        }, {});
+}

package/src/utils/template.js

@@ -0,0 +1,205 @@
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const TEMPLATES_DIR = path.resolve(__dirname, '../../templates');
+const EXTRAS_DIR = path.resolve(__dirname, '../../extras');
+
+/**
+ * Copy a file from the `extras/` directory verbatim (no placeholder processing).
+ * Used for standalone mini-packages copied into generated projects (e.g. cn, micro-router).
+ * @param {string} extraPath - Relative path inside extras/ (e.g. 'cn/src/index.js')
+ * @param {string} destPath - Absolute destination path
+ */
+export async function copyExtraFile(extraPath, destPath) {
+    const src = path.join(EXTRAS_DIR, extraPath);
+    const content = await fs.readFile(src, 'utf-8');
+    await fs.mkdir(path.dirname(destPath), { recursive : true });
+    await fs.writeFile(destPath, content, 'utf-8');
+}
+
+/**
+ * Process conditional blocks: {{#if KEY}}...{{#elif KEY}}...{{#else}}...{{#endif}}.
+ * Supports nesting. Evaluates KEY as truthy/falsy against context.
+ * @param {string} content - Template content
+ * @param {object} context - Values to evaluate conditions
+ * @returns {string} Processed content
+ */
+function processConditionals(content, context) {
+    const RE = /(?:^[ \t]*)?(?:\{\{#if\s+(\w+)\}\}|\{\{#elif\s+(\w+)\}\}|\{\{#else\}\}|\{\{#endif\}\})(?:[ \t]*$\n?)?/gm;
+    const stack = [];
+    let result = '';
+    let lastIndex = 0;
+    let match;
+
+    while ((match = RE.exec(content)) !== null) {
+        const [token, ifKey, elifKey] = match;
+        const textBefore = content.slice(lastIndex, match.index);
+        const shouldEmit = stack.length === 0 || stack[stack.length - 1].emit;
+
+        if (shouldEmit) result += textBefore;
+        lastIndex = RE.lastIndex;
+
+        if (ifKey) {
+            const parentEmit = stack.length === 0 || stack[stack.length - 1].emit;
+            const condTrue = parentEmit && !!context[ifKey];
+            stack.push({ resolved : condTrue, emit : condTrue });
+        } else if (elifKey) {
+            const frame = stack[stack.length - 1];
+            const parentEmit = stack.length <= 1 || stack[stack.length - 2].emit;
+            if (parentEmit && !frame.resolved && !!context[elifKey]) {
+                frame.emit = true;
+                frame.resolved = true;
+            } else {
+                frame.emit = false;
+            }
+        } else if (token.includes('#else')) {
+            const frame = stack[stack.length - 1];
+            const parentEmit = stack.length <= 1 || stack[stack.length - 2].emit;
+            frame.emit = parentEmit && !frame.resolved;
+            if (frame.emit) frame.resolved = true;
+        } else {
+            stack.pop();
+        }
+    }
+
+    const tailEmit = stack.length === 0 || stack[stack.length - 1].emit;
+    if (tailEmit) result += content.slice(lastIndex);
+
+    // Collapse runs of 3+ newlines (left by conditional blocks) into 2
+    return result.replace(/\n{3,}/g, '\n\n');
+}
+
+/**
+ * Copy a template file processing placeholders.
+ * @param {string} templatePath - Relative path in templates/
+ * @param {string} destPath - Absolute destination path
+ * @param {object} context - Values to replace placeholders
+ */
+export async function copyTemplateFile(templatePath, destPath, context = {}) {
+    const src = path.join(TEMPLATES_DIR, templatePath);
+    let content = await fs.readFile(src, 'utf-8');
+
+    // Process conditional blocks first
+    content = processConditionals(content, context);
+
+    // Replace placeholders {{KEY}} with context values
+    for (const [key, value] of Object.entries(context)) {
+        content = content.replaceAll(`{{${key}}}`, value);
+    }
+
+    // Ensure directory exists
+    await fs.mkdir(path.dirname(destPath), { recursive : true });
+    await fs.writeFile(destPath, content, 'utf-8');
+}
+
+/**
+ * Copy a template directory to the target, processing placeholders in all files.
+ * @param {string} templateName - Name of the template directory (spa, ssr)
+ * @param {string} targetDir - Target directory path
+ * @param {object} context - Values to replace placeholders
+ */
+export async function copyTemplateDir(templateName, targetDir, context = {}) {
+    const templateDir = path.join(TEMPLATES_DIR, templateName);
+    await copyDirRecursive(templateDir, targetDir, context);
+}
+
+/**
+ * Recursively copy a directory, processing placeholders in text files.
+ * @param {string} src - Source directory
+ * @param {string} dest - Destination directory
+ * @param {object} context - Values to replace placeholders
+ */
+async function copyDirRecursive(src, dest, context) {
+    await fs.mkdir(dest, { recursive : true });
+
+    const entries = await fs.readdir(src, { withFileTypes : true });
+
+    for (const entry of entries) {
+        const srcPath = path.join(src, entry.name);
+        const destPath = path.join(dest, entry.name);
+
+        if (entry.isDirectory()) {
+            await copyDirRecursive(srcPath, destPath, context);
+        } else {
+            if (isTextFile(entry.name)) {
+                let content = await fs.readFile(srcPath, 'utf-8');
+                content = processConditionals(content, context);
+
+                for (const [key, value] of Object.entries(context)) {
+                    content = content.replaceAll(`{{${key}}}`, value);
+                }
+
+                await fs.writeFile(destPath, content, 'utf-8');
+            } else {
+                await fs.copyFile(srcPath, destPath);
+            }
+        }
+    }
+}
+
+/**
+ * Check if a file is a text file based on extension.
+ * @param {string} filename - File name
+ * @returns {boolean} True if text file
+ */
+function isTextFile(filename) {
+    const textExtensions = [
+        '.js', '.ts', '.jsx', '.tsx',
+        '.json', '.html', '.css', '.scss',
+        '.md', '.txt', '.svg', '.xml',
+        '.gitkeep', '.gitignore', '.env'
+    ];
+
+    const ext = path.extname(filename).toLowerCase();
+    return textExtensions.includes(ext) || filename.startsWith('.');
+}
+
+/**
+ * Copy a template file, auto-resolving styling variant by convention.
+ * Given `dir/File.js` and plan with tailwind, looks for `dir/File-tailwind.js` first.
+ * Falls back to `dir/File-cssfun.js` if cssfun, then `dir/File.js`.
+ * @param {string} templatePath - Base template path (e.g. '_extras/router/App.js')
+ * @param {string} destPath - Absolute destination path
+ * @param {object} context - Values to replace placeholders
+ * @param {object} plan - Project plan (checks plan.features.tailwind / cssfun)
+ */
+export async function copyStyledTemplate(templatePath, destPath, context, plan) {
+    const ext = path.extname(templatePath);
+    const base = templatePath.slice(0, -ext.length);
+
+    let resolvedPath = templatePath;
+    if (plan.features.tailwind) {
+        const candidate = `${base}-tailwind${ext}`;
+        const full = path.join(TEMPLATES_DIR, candidate);
+        try { await fs.access(full); resolvedPath = candidate; } catch { /* fallback to base */ }
+    } else if (plan.features.cssfun) {
+        const candidate = `${base}-cssfun${ext}`;
+        const full = path.join(TEMPLATES_DIR, candidate);
+        try { await fs.access(full); resolvedPath = candidate; } catch { /* fallback to base */ }
+    }
+
+    await copyTemplateFile(resolvedPath, destPath, context);
+}
+
+/**
+ * Copy a directory from source path to destination (no placeholder processing).
+ * Used for copying generated output (e.g. extras/rasti-heroicons/src/icons) into the project.
+ * @param {string} sourceDir - Absolute path to source directory
+ * @param {string} destDir - Absolute path to destination directory
+ * @returns {Promise<void>}
+ */
+export async function copyDirFromTo(sourceDir, destDir) {
+    await fs.mkdir(destDir, { recursive : true });
+    const entries = await fs.readdir(sourceDir, { withFileTypes : true });
+    for (const entry of entries) {
+        const srcPath = path.join(sourceDir, entry.name);
+        const destPath = path.join(destDir, entry.name);
+        if (entry.isDirectory()) {
+            await copyDirFromTo(srcPath, destPath);
+        } else {
+            await fs.copyFile(srcPath, destPath);
+        }
+    }
+}

package/src/validate.js

@@ -0,0 +1,48 @@
+import { PRESET_IDS } from '../extras/rasti-icons/src/presets.js';
+
+/**
+ * Validate a project plan.
+ * @param {object} plan - Project plan object
+ * @returns {object} Validation result { valid: boolean, error?: string }
+ */
+export function validatePlan(plan) {
+    // Check required fields
+    if (!plan.name) {
+        return { valid : false, error : 'Project name is required' };
+    }
+
+    // Validate project name format
+    if (!/^[a-z0-9-_]+$/i.test(plan.name)) {
+        return {
+            valid : false,
+            error : 'Project name can only contain letters, numbers, dashes and underscores'
+        };
+    }
+
+    // Check base template
+    if (!['spa', 'ssr', 'static'].includes(plan.base)) {
+        return { valid : false, error : 'Invalid base template. Must be "spa", "ssr" or "static"' };
+    }
+
+    // Check icon sets
+    if (plan.features.icons) {
+        for (const id of plan.features.icons) {
+            if (!PRESET_IDS.includes(id)) {
+                return {
+                    valid : false,
+                    error : `Invalid icon set "${id}". Valid: ${PRESET_IDS.join(', ')}`
+                };
+            }
+        }
+    }
+
+    // Check mutually exclusive features
+    if (plan.features.tailwind && plan.features.cssfun) {
+        return {
+            valid : false,
+            error : 'Cannot use both Tailwind and CSSFUN. They are mutually exclusive.'
+        };
+    }
+
+    return { valid : true };
+}

package/src/versions.js

@@ -0,0 +1,17 @@
+/**
+ * Single source of truth for every version pinned in generated projects.
+ * When bumping any of these, also follow docs/VERSIONS.md (e.g. path-to-regexp
+ * is mirrored in extras/micro-router/package.json, kept in sync manually).
+ */
+export const VERSIONS = {
+    rasti : '^4.0.1',
+    vite : '^7.0.0',
+    express : '^5.0.1',
+    compression : '^1.8.1',
+    sirv : '^3.0.0',
+    crossEnv : '^7.0.3',
+    tailwindcss : '^4.0.0',
+    tailwindVite : '^4.0.0',
+    cssfun : '^0.0.14',
+    pathToRegexp : '^8.0.0'
+};

package/templates/AGENTS.md

@@ -0,0 +1,48 @@
+# {{NAME}}
+
+{{#if STATIC}}
+Pre-rendered static site with [Rasti](https://rasti.js.org) {{RASTI_VERSION}} + [Vite](https://vite.dev) + [Express](https://expressjs.com){{#if TAILWIND}}, styled with [Tailwind CSS](https://tailwindcss.com){{#endif}}{{#if CSSFUN}}, styled with [CSSFUN](https://cssfun.js.org){{#endif}}.
+{{#elif SSR}}
+Server-side rendered app with [Rasti](https://rasti.js.org) {{RASTI_VERSION}} + [Vite](https://vite.dev) + [Express](https://expressjs.com){{#if TAILWIND}}, styled with [Tailwind CSS](https://tailwindcss.com){{#endif}}{{#if CSSFUN}}, styled with [CSSFUN](https://cssfun.js.org){{#endif}}.
+{{#else}}
+Single page app powered by [Rasti](https://rasti.js.org) {{RASTI_VERSION}} + [Vite](https://vite.dev){{#if TAILWIND}}, styled with [Tailwind CSS](https://tailwindcss.com){{#endif}}{{#if CSSFUN}}, styled with [CSSFUN](https://cssfun.js.org){{#endif}}.
+{{#endif}}
+
+## Commands
+
+```bash
+npm run dev      # development server (HMR)
+npm run build    # production build
+npm run preview  # preview production build
+{{#if SSR}}
+npm start        # start Express server (requires npm run build first)
+{{#endif}}
+{{#if STATIC}}
+npm run build:static   # pre-render configured routes to dist/static/
+npm run serve:static   # serve pre-rendered files locally
+{{#endif}}
+```
+
+## Architecture
+
+Components live in `src/components/` and are [Rasti components](./AGENTS-RASTI.md) defined with `Component.create`.
+`App` is the root component — it owns `this.state` and passes values and callbacks down as props. State is a [Rasti Model](./AGENTS-RASTI.md); mutations trigger re-renders automatically.
+{{#if CSSFUN}}
+Theming uses `src/theme.js` (light/dark via `data-color-scheme` on `<html>`; CSS variables prefixed `--fun-*`).
+{{#endif}}
+{{#if ROUTER}}
+Routing is handled by `src/router-setup.js` — routes update `state.location`; client-side links use the `data-router` attribute.
+{{#endif}}
+{{#if STATIC}}
+Routes to pre-render are listed in `static.config.js`.
+{{#endif}}
+
+## Conventions
+
+- ESM throughout, 4-space indentation, single quotes, semicolons
+- Spaces around colons in objects: `{ key : value }`
+- Component files are PascalCase; utilities are camelCase
+
+## Rasti API reference
+
+See [AGENTS-RASTI.md](./AGENTS-RASTI.md) — Rasti's AGENTS.md: component creation, template interpolations, lifecycle hooks, Model.

package/templates/_base/App-cssfun.js

@@ -0,0 +1,88 @@
+import { Component, Model } from 'rasti';
+import { css } from 'cssfun';
+import Header from './components/Header.js';
+import Home from './components/Home.js';
+{{#if ROUTER}}
+import About from './components/About.js';
+import { createAppRouter } from './router-setup.js';
+{{#endif}}
+
+const { classes } = css({
+    '@global' : {
+        body : {
+            background : 'var(--fun-bg)',
+            color : 'var(--fun-text)',
+            margin : 0,
+            padding : 0
+        },
+        'a' : {
+            color : 'var(--fun-link)',
+            textDecoration : 'none',
+            transition : 'color 0.2s ease',
+            '&:hover' : { color : 'var(--fun-linkHover)', textDecoration : 'underline' }
+        }
+    },
+    root : {
+        fontFamily : 'system-ui, sans-serif',
+        minHeight : '100dvh',
+        display : 'flex',
+        flexDirection : 'column',
+        alignItems : 'center',
+        gap : 'clamp(24px, 5vw, 40px)',
+        maxWidth : '1000px',
+        margin : '0 auto',
+        padding : 'clamp(20px, 5vw, 48px)',
+        boxSizing : 'border-box'
+    }
+});
+
+/**
+ * @typedef {Object} AppState
+ * @property {number} count
+{{#if ROUTER}}
+ * @property {import('./router-setup.js').Location | null} location
+{{#endif}}
+ */
+
+/** Root application component with CSS-in-JS global styles.
+ * @type {typeof import('rasti').Component<{}, AppState>}
+ */
+const App = Component.create`
+    <div class="${classes.root}">
+        <${Header} />
+{{#if ROUTER}}
+        ${({ state, partial }) => state.location?.test('/') ?
+            partial`<${Home} count="${({ state }) => state.count}" handleIncrement="${({ state }) => () => { state.count++; }}" />` :
+            partial`<${About} />`}
+{{#else}}
+        <${Home} count="${({ state }) => state.count}" handleIncrement="${({ state }) => () => { state.count++; }}" />
+{{#endif}}
+    </div>
+{{#if ROUTER}}
+`.extend({
+    /**
+     * @param {Object} [options]
+     * @param {string} [options.url] - Initial URL for server-side routing.
+     */
+    onCreate(options = {}) {
+        this.state = new Model({ location : null, count : 0 });
+        this.router = createAppRouter(this.state);
+        const url = options.url ?? (typeof window !== 'undefined' ? window.location.pathname + window.location.search : '/');
+        this.router.navigate(url, { addToHistory : false });
+    },
+    onHydrate() {
+        this.destroyQueue.push(
+            this.router.delegateNavigation(this.el),
+            this.router.bindHistory()
+        );
+    }
+});
+{{#else}}
+`.extend({
+    onCreate(options = {}) {
+        this.state = new Model({ count : 0 });
+    }
+});
+{{#endif}}
+
+export default App;