@nitronjs/framework 0.1.24 → 0.2.0

package/lib/Build/colors.js

@@ -0,0 +1,10 @@
+const COLORS = {
+    reset: "\x1b[0m",
+    dim: "\x1b[2m",
+    red: "\x1b[31m",
+    green: "\x1b[32m",
+    yellow: "\x1b[33m",
+    cyan: "\x1b[36m"
+};
+
+export default COLORS;

package/lib/Build/jsxRuntime.js

@@ -0,0 +1,116 @@
+const JSX_RUNTIME = `
+import * as React from 'react';
+import * as OriginalJsx from '__react_jsx_original__';
+
+const CTX = Symbol.for('__nitron_view_context__');
+const MARK = Symbol.for('__nitron_client_component__');
+const UNSAFE_KEYS = new Set(['__proto__', 'constructor', 'prototype']);
+
+function getContext() {
+    return globalThis[CTX]?.getStore?.();
+}
+
+globalThis.csrf = () => getContext()?.csrf || '';
+
+globalThis.request = () => {
+    const ctx = getContext();
+    return ctx?.request || { params: {}, query: {}, url: '', method: 'GET', headers: {} };
+};
+
+const DepthContext = React.createContext(false);
+const componentCache = new WeakMap();
+
+function sanitizeProps(obj, seen = new WeakSet()) {
+    if (obj == null) return obj;
+
+    const type = typeof obj;
+    if (type === 'function' || type === 'symbol') return undefined;
+    if (type === 'bigint') return obj.toString();
+    if (type !== 'object') return obj;
+
+    if (seen.has(obj)) return undefined;
+    seen.add(obj);
+
+    if (Array.isArray(obj)) {
+        return obj.map(item => {
+            const sanitized = sanitizeProps(item, seen);
+            return sanitized === undefined ? null : sanitized;
+        });
+    }
+
+    if (obj instanceof Date) return obj.toISOString();
+    if (obj._attributes && typeof obj._attributes === 'object') {
+        return sanitizeProps(obj._attributes, seen);
+    }
+    if (typeof obj.toJSON === 'function') {
+        return sanitizeProps(obj.toJSON(), seen);
+    }
+
+    const proto = Object.getPrototypeOf(obj);
+    if (proto !== Object.prototype && proto !== null) return undefined;
+
+    const result = {};
+    for (const key of Object.keys(obj)) {
+        if (UNSAFE_KEYS.has(key)) continue;
+        const value = sanitizeProps(obj[key], seen);
+        if (value !== undefined) result[key] = value;
+    }
+    return result;
+}
+
+function wrapWithDepth(children) {
+    return OriginalJsx.jsx(DepthContext.Provider, { value: true, children });
+}
+
+function createIsland(Component, name) {
+    function IslandBoundary(props) {
+        if (React.useContext(DepthContext)) {
+            return OriginalJsx.jsx(Component, props);
+        }
+
+        const id = React.useId();
+        const safeProps = sanitizeProps(props) || {};
+
+        const ctx = getContext();
+        if (ctx) {
+            ctx.props = ctx.props || {};
+            ctx.props[id] = safeProps;
+        }
+
+        return OriginalJsx.jsx('div', {
+            'data-cid': id,
+            'data-island': name,
+            children: wrapWithDepth(OriginalJsx.jsx(Component, props))
+        });
+    }
+
+    IslandBoundary.displayName = 'Island(' + name + ')';
+    return IslandBoundary;
+}
+
+function getWrappedComponent(Component) {
+    if (!componentCache.has(Component)) {
+        const name = Component.displayName || Component.name || 'Anonymous';
+        componentCache.set(Component, createIsland(Component, name));
+    }
+    return componentCache.get(Component);
+}
+
+export function jsx(type, props, key) {
+    if (typeof type === 'function' && type[MARK]) {
+        return OriginalJsx.jsx(getWrappedComponent(type), props, key);
+    }
+    return OriginalJsx.jsx(type, props, key);
+}
+
+export function jsxs(type, props, key) {
+    if (typeof type === 'function' && type[MARK]) {
+        return OriginalJsx.jsx(getWrappedComponent(type), props, key);
+    }
+    return OriginalJsx.jsxs(type, props, key);
+}
+
+export const Fragment = OriginalJsx.Fragment;
+`;
+
+export default JSX_RUNTIME;

package/lib/Build/plugins.js

@@ -0,0 +1,264 @@
+import fs from "fs";
+import path from "path";
+import { parse } from "@babel/parser";
+import traverse from "@babel/traverse";
+import Paths from "../Core/Paths.js";
+import COLORS from "./colors.js";
+
+const _traverse = traverse.default;
+
+export function createPathAliasPlugin() {
+    const root = Paths.project;
+    return {
+        name: "path-alias",
+        setup: (build) => {
+            // @ resolves to project root
+            build.onResolve({ filter: /^@\// }, async (args) => {
+                const relativePath = args.path.replace(/^@\//, "");
+                const absolutePath = path.join(root, relativePath);
+
+                const extensions = [".js", ".ts", ".jsx", ".tsx", ""];
+                for (const ext of extensions) {
+                    const fullPath = absolutePath + ext;
+                    if (fs.existsSync(fullPath)) {
+                        return { path: fullPath, external: false };
+                    }
+                }
+
+                if (fs.existsSync(absolutePath) && fs.statSync(absolutePath).isDirectory()) {
+                    for (const ext of [".js", ".ts", ".jsx", ".tsx"]) {
+                        const indexPath = path.join(absolutePath, "index" + ext);
+                        if (fs.existsSync(indexPath)) {
+                            return { path: indexPath, external: false };
+                        }
+                    }
+                }
+
+                return { path: absolutePath + ".js", external: false };
+            });
+        }
+    };
+}
+
+export function createOriginalJsxPlugin() {
+    return {
+        name: "original-jsx",
+        setup: (build) => {
+            build.onResolve({ filter: /^__react_jsx_original__$/ }, () => ({
+                path: "react/jsx-runtime",
+                external: true
+            }));
+        }
+    };
+}
+
+export function createVendorGlobalsPlugin() {
+    const escapeRegex = (str) => str.replace(/[.*+?^${}()|[\]\\\/]/g, "\\$&");
+
+    const packages = {
+        "react": "__NITRON_REACT__",
+        "react-dom": "__NITRON_REACT_DOM__",
+        "react-dom/client": "__NITRON_REACT_DOM_CLIENT__",
+        "react/jsx-runtime": "__NITRON_JSX_RUNTIME__"
+    };
+
+    const patterns = Object.entries(packages).map(([pkg, global]) => ({
+        filter: new RegExp(`^${escapeRegex(pkg)}$`),
+        pkg,
+        global
+    }));
+
+    return {
+        name: "vendor-globals",
+        setup: (build) => {
+            for (const { filter, pkg, global } of patterns) {
+                build.onResolve({ filter }, () => ({
+                    path: pkg,
+                    namespace: "vendor-global"
+                }));
+
+                build.onLoad({ filter, namespace: "vendor-global" }, () => ({
+                    contents: `module.exports = window.${global};`,
+                    loader: "js"
+                }));
+            }
+        }
+    };
+}
+
+export function createServerModuleBlockerPlugin() {
+    const SERVER_MODULES = /lib\/(DB|Mail|Log|Hash|Environment|Server|Model|Validator|Storage)\.js$/;
+
+    return {
+        name: "server-module-blocker",
+        setup: (build) => {
+            build.onResolve({ filter: SERVER_MODULES }, (args) => {
+                const moduleName = args.path.match(/\/(\w+)\.js$/)?.[1] || "Module";
+                return {
+                    path: args.path,
+                    namespace: "server-blocked",
+                    pluginData: { moduleName, importer: args.importer }
+                };
+            });
+
+            build.onLoad({ filter: /.*/, namespace: "server-blocked" }, (args) => {
+                const { moduleName, importer } = args.pluginData;
+                const importerRelative = importer ? path.relative(Paths.project, importer) : "unknown";
+
+                return {
+                    errors: [{
+                        text: `Server module "${moduleName}" cannot be imported in client components`,
+                        notes: [{
+                            text: `Imported from: ${importerRelative}\n\nClient components run in the browser and cannot access server-only modules.\nMove this logic to a server component or use an API endpoint.`
+                        }]
+                    }]
+                };
+            });
+        }
+    };
+}
+
+export function createServerFunctionsPlugin() {
+    return {
+        name: "server-functions",
+        setup: (build) => {
+            build.onLoad({ filter: /\.(tsx?|jsx?)$/ }, async (args) => {
+                if (args.path.includes("node_modules")) {
+                    return null;
+                }
+
+                let source = await fs.promises.readFile(args.path, "utf8");
+
+                if (!source.includes("csrf(") && !source.includes("route(")) {
+                    return null;
+                }
+
+                source = source.replace(
+                    /\bcsrf\s*\(\s*\)/g,
+                    "window.__NITRON_RUNTIME__.csrf"
+                );
+
+                source = source.replace(
+                    /\broute\s*\(\s*['"]([^'"]+)['"]\s*\)/g,
+                    (_, routeName) => `window.__NITRON_RUNTIME__.routes["${routeName}"]`
+                );
+
+                const ext = args.path.split(".").pop();
+                const loader = ext === "tsx" ? "tsx" : ext === "ts" ? "ts" : ext === "jsx" ? "jsx" : "js";
+
+                return { contents: source, loader };
+            });
+        }
+    };
+}
+
+export function createCssStubPlugin() {
+    return {
+        name: "css-stub",
+        setup: (build) => {
+            build.onResolve({ filter: /\.css$/ }, (args) => ({
+                path: args.path,
+                namespace: "css-stub"
+            }));
+
+            build.onLoad({ filter: /.*/, namespace: "css-stub" }, () => ({
+                contents: "",
+                loader: "js"
+            }));
+        }
+    };
+}
+
+export function createMarkerPlugin(options, isDev) {
+    return {
+        name: "client-marker",
+        setup: (build) => {
+            if (options.platform === "browser") {
+                return;
+            }
+
+            build.onLoad({ filter: /\.tsx$/ }, async (args) => {
+                const source = await fs.promises.readFile(args.path, "utf8");
+
+                if (!/^\s*["']use client["']/.test(source.slice(0, 50))) {
+                    return null;
+                }
+
+                let ast;
+                try {
+                    ast = parse(source, {
+                        sourceType: "module",
+                        plugins: ["typescript", "jsx"]
+                    });
+                } catch {
+                    if (isDev) {
+                        console.warn(`${COLORS.yellow}⚠ Parse: ${args.path}${COLORS.reset}`);
+                    }
+                    return null;
+                }
+
+                const exports = findExports(ast);
+                if (!exports.length) {
+                    return null;
+                }
+
+                const symbolCode = `Symbol.for('__nitron_client_component__')`;
+                let additionalCode = "\n";
+
+                for (const exp of exports) {
+                    additionalCode += `try { Object.defineProperty(${exp.name}, ${symbolCode}, { value: true }); ${exp.name}.displayName = "${exp.name}"; } catch {}\n`;
+                }
+
+                return { contents: source + additionalCode, loader: "tsx" };
+            });
+        }
+    };
+}
+
+function findExports(ast) {
+    const exports = [];
+
+    _traverse(ast, {
+        ExportDefaultDeclaration: (p) => {
+            const decl = p.node.declaration;
+            let name = "__default__";
+
+            if (decl.type === "Identifier") {
+                name = decl.name;
+            } else if (decl.type === "FunctionDeclaration" && decl.id?.name) {
+                name = decl.id.name;
+            } else if (decl.type === "CallExpression" && 
+                ["memo", "forwardRef", "lazy"].includes(decl.callee?.name)) {
+                name = decl.arguments[0]?.name || "__default__";
+            }
+
+            exports.push({ name });
+        },
+
+        ExportNamedDeclaration: (p) => {
+            for (const spec of p.node.specifiers || []) {
+                if (spec.type === "ExportSpecifier") {
+                    exports.push({
+                        name: spec.exported.name === "default" ? spec.local.name : spec.exported.name
+                    });
+                }
+            }
+
+            const decl = p.node.declaration;
+            if (decl?.type === "FunctionDeclaration" && decl.id?.name) {
+                exports.push({ name: decl.id.name });
+            }
+            if (decl?.type === "VariableDeclaration") {
+                for (const d of decl.declarations) {
+                    if (d.id.type === "Identifier" && d.init?.type === "ArrowFunctionExpression") {
+                        exports.push({ name: d.id.name });
+                    }
+                }
+            }
+        }
+    });
+
+    return exports;
+}
+
+export { findExports };

package/lib/Console/Commands/BuildCommand.js

@@ -1,25 +1,26 @@
 #!/usr/bin/env node
 import Builder from "../../Build/Manager.js";
 
-export default async function Build(only = null) {
+export default async function Build(only = null, isDev = false) {
     const builder = new Builder();
 
     try {
-        const success = await builder.run(only);
+        const success = await builder.run(only, isDev);
         return success;
-    } catch (error) {
+    }
+    catch (error) {
         console.error("Build failed:", error.message);
         throw error;
     }
 }
 
-// Auto-run when called directly
+// Auto-run when called directly (production build)
 const isMain = process.argv[1]?.endsWith("BuildCommand.js");
 if (isMain) {
     // process.argv[2] would be --only=views or --only=css
     const onlyArg = process.argv.find(arg => arg.startsWith("--only="));
     const only = onlyArg?.split("=")[1] || null;
-    Build(only)
+    Build(only, false) // Production build
         .then(success => process.exit(success ? 0 : 1))
         .catch(() => process.exit(1));
 }