@jxrstudios/jxr 1.0.4 → 1.0.5

package/dist/index.js

@@ -548,28 +548,28 @@ var VirtualFS = class {
       }
     }
   }
-  write(path, content) {
-    const existing = this.files.get(path);
-    const language = this.detectLanguage(path);
+  write(path3, content) {
+    const existing = this.files.get(path3);
+    const language = this.detectLanguage(path3);
     const file = {
-      path,
+      path: path3,
       content,
       language,
       lastModified: Date.now(),
       size: new TextEncoder().encode(content).byteLength,
       dirty: true
     };
-    this.files.set(path, file);
+    this.files.set(path3, file);
     this.emit(file, existing ? "update" : "create");
     return file;
   }
-  read(path) {
-    return this.files.get(path) ?? null;
+  read(path3) {
+    return this.files.get(path3) ?? null;
   }
-  delete(path) {
-    const file = this.files.get(path);
+  delete(path3) {
+    const file = this.files.get(path3);
     if (!file) return false;
-    this.files.delete(path);
+    this.files.delete(path3);
     this.emit(file, "delete");
     return true;
   }
@@ -577,8 +577,8 @@ var VirtualFS = class {
     const all = Array.from(this.files.values());
     return prefix ? all.filter((f) => f.path.startsWith(prefix)) : all;
   }
-  exists(path) {
-    return this.files.has(path);
+  exists(path3) {
+    return this.files.has(path3);
   }
   onChange(handler) {
     this.changeHandlers.add(handler);
@@ -622,13 +622,13 @@ var VirtualFS = class {
   }
   toJSON() {
     const result = {};
-    for (const [path, file] of Array.from(this.files.entries())) {
-      result[path] = file.content;
+    for (const [path3, file] of Array.from(this.files.entries())) {
+      result[path3] = file.content;
     }
     return result;
   }
-  detectLanguage(path) {
-    const ext = path.split(".").pop()?.toLowerCase();
+  detectLanguage(path3) {
+    const ext = path3.split(".").pop()?.toLowerCase();
     const map = {
       tsx: "tsx",
       ts: "ts",
@@ -761,26 +761,26 @@ var ModuleCache = class {
   constructor(maxSize = 200) {
     this.maxSize = maxSize;
   }
-  set(path, module) {
+  set(path3, module) {
     if (this.cache.size >= this.maxSize) {
       const oldest = Array.from(this.cache.keys())[0];
       const old = this.cache.get(oldest);
       if (old?.objectUrl) URL.revokeObjectURL(old.objectUrl);
       this.cache.delete(oldest);
     }
-    this.cache.set(path, module);
+    this.cache.set(path3, module);
   }
-  get(path) {
-    const module = this.cache.get(path);
+  get(path3) {
+    const module = this.cache.get(path3);
     if (!module) return null;
-    this.cache.delete(path);
-    this.cache.set(path, module);
+    this.cache.delete(path3);
+    this.cache.set(path3, module);
     return module;
   }
-  invalidate(path) {
-    const module = this.cache.get(path);
+  invalidate(path3) {
+    const module = this.cache.get(path3);
     if (module?.objectUrl) URL.revokeObjectURL(module.objectUrl);
-    this.cache.delete(path);
+    this.cache.delete(path3);
   }
   clear() {
     for (const module of Array.from(this.cache.values())) {
@@ -942,17 +942,17 @@ var JXRRuntime = class {
     this.startMetricsBroadcast();
   }
   /** Resolve and transform a module from the VirtualFS */
-  async resolveModule(path) {
-    const cached = this.cache.get(path);
+  async resolveModule(path3) {
+    const cached = this.cache.get(path3);
     if (cached) return cached.transformed;
-    const file = this.vfs.read(path);
-    if (!file) throw new Error(`Module not found: ${path}`);
+    const file = this.vfs.read(path3);
+    if (!file) throw new Error(`Module not found: ${path3}`);
     const startTime = performance.now();
-    const transformed = this.transformer.transform(file.content, path);
+    const transformed = this.transformer.transform(file.content, path3);
     const transformMs = performance.now() - startTime;
     const objectUrl = this.transformer.createObjectUrl(transformed);
-    this.cache.set(path, {
-      path,
+    this.cache.set(path3, {
+      path: path3,
       source: file.content,
       transformed,
       objectUrl,
@@ -1033,65 +1033,1018 @@ var JXRRuntime = class {
 };
 var jxrRuntime = new JXRRuntime();
 
+// src/enhanced-transpiler.ts
+import * as Babel from "@babel/standalone";
+var EnhancedTranspiler = class {
+  transformCache = /* @__PURE__ */ new Map();
+  dependencyGraph = /* @__PURE__ */ new Map();
+  options;
+  constructor(options = {}) {
+    this.options = options;
+  }
+  transpileTypeScript(code, filename, options = {}) {
+    const mergedOptions = { ...this.options, ...options, filename };
+    const cacheKey = `${filename}:${code}:${JSON.stringify(mergedOptions)}`;
+    if (mergedOptions.cache !== false && this.transformCache.has(cacheKey)) {
+      return { ...this.transformCache.get(cacheKey), cached: true };
+    }
+    try {
+      const result = Babel.transform(code, {
+        filename,
+        presets: [
+          ["react", { runtime: "automatic" }],
+          "typescript",
+          ...mergedOptions.presets || []
+        ],
+        plugins: [
+          // Handle import/export transformations - pass filename for context
+          this.createImportTransformer(filename),
+          ...mergedOptions.plugins || []
+        ],
+        sourceMaps: true,
+        sourceFileName: filename
+      });
+      const transformed = {
+        code: result.code || code,
+        map: result.map,
+        cached: false
+      };
+      if (mergedOptions.cache !== false) {
+        this.transformCache.set(cacheKey, transformed);
+      }
+      return transformed;
+    } catch (error) {
+      console.error("[EnhancedTranspiler] Transpilation error:", error);
+      return {
+        code,
+        error,
+        cached: false
+      };
+    }
+  }
+  transpileJSX(code, filename, options = {}) {
+    const mergedOptions = { ...this.options, ...options, filename };
+    const cacheKey = `jsx:${filename}:${code}:${JSON.stringify(mergedOptions)}`;
+    if (mergedOptions.cache !== false && this.transformCache.has(cacheKey)) {
+      return { ...this.transformCache.get(cacheKey), cached: true };
+    }
+    try {
+      const result = Babel.transform(code, {
+        filename,
+        presets: [
+          ["react", { runtime: "automatic" }],
+          ...mergedOptions.presets || []
+        ],
+        plugins: mergedOptions.plugins || [],
+        sourceMaps: true,
+        sourceFileName: filename
+      });
+      console.log("[v0] Transpiled JSX for", filename);
+      console.log("[v0] Output (first 500 chars):", result.code?.substring(0, 500));
+      const transformed = {
+        code: result.code || code,
+        map: result.map,
+        cached: false
+      };
+      if (mergedOptions.cache !== false) {
+        this.transformCache.set(cacheKey, transformed);
+      }
+      return transformed;
+    } catch (error) {
+      console.error("[EnhancedTranspiler] JSX transformation error:", error);
+      return {
+        code,
+        error,
+        cached: false
+      };
+    }
+  }
+  createImportTransformer(filename) {
+    const self = this;
+    return function importTransformer() {
+      return {
+        visitor: {
+          ImportDeclaration(path3) {
+            const source = path3.node.source.value;
+            if (!source.startsWith("./") && !source.startsWith("../") && !source.startsWith("@/")) {
+              return;
+            }
+            const resolvedPath = self.resolveImportPath(filename, source);
+            if (resolvedPath) {
+              console.log(`[Transpiler] Rewriting: ${filename} imports "${source}" \u2192 "${resolvedPath}"`);
+              path3.node.source.value = resolvedPath;
+            }
+          },
+          ExportNamedDeclaration(path3) {
+            if (path3.node.source) {
+              const source = path3.node.source.value;
+              if (!source.startsWith("./") && !source.startsWith("../") && !source.startsWith("@/")) {
+                return;
+              }
+              const resolvedPath = self.resolveImportPath(filename, source);
+              if (resolvedPath) {
+                console.log(`[Transpiler] Rewriting export: ${filename} exports from "${source}" \u2192 "${resolvedPath}"`);
+                path3.node.source.value = resolvedPath;
+              }
+            }
+          },
+          ExportAllDeclaration(path3) {
+            if (path3.node.source) {
+              const source = path3.node.source.value;
+              if (!source.startsWith("./") && !source.startsWith("../") && !source.startsWith("@/")) {
+                return;
+              }
+              const resolvedPath = self.resolveImportPath(filename, source);
+              if (resolvedPath) {
+                console.log(`[Transpiler] Rewriting export all: ${filename} exports from "${source}" \u2192 "${resolvedPath}"`);
+                path3.node.source.value = resolvedPath;
+              }
+            }
+          }
+        }
+      };
+    };
+  }
+  resolveImportPath(fromFile, importPath) {
+    const normalizedFromFile = fromFile.startsWith("/") ? fromFile.substring(1) : fromFile;
+    if (importPath.startsWith("@/")) {
+      return ("/src/" + importPath.substring(2)).replace(/\.(tsx|ts|jsx|js)$/, "");
+    }
+    if (importPath.startsWith("./") || importPath.startsWith("../")) {
+      const fromDir = normalizedFromFile.split("/").slice(0, -1);
+      const importParts = importPath.split("/");
+      let currentPath = [...fromDir];
+      for (const part of importParts) {
+        if (part === "..") {
+          currentPath.pop();
+        } else if (part !== ".") {
+          currentPath.push(part);
+        }
+      }
+      return "/" + currentPath.join("/").replace(/\.(tsx|ts|jsx|js)$/, "");
+    }
+    return null;
+  }
+  // Track dependencies for cache invalidation
+  trackDependencies(filename, dependencies) {
+    this.dependencyGraph.set(filename, new Set(dependencies));
+  }
+  // Invalidate cache entries that depend on changed files
+  invalidateCache(changedFiles) {
+    const toInvalidate = /* @__PURE__ */ new Set();
+    for (const [file, deps] of this.dependencyGraph) {
+      for (const changedFile of changedFiles) {
+        if (deps.has(changedFile)) {
+          toInvalidate.add(file);
+        }
+      }
+    }
+    for (const file of toInvalidate) {
+      for (const [key] of this.transformCache) {
+        if (key.startsWith(`${file}:`)) {
+          this.transformCache.delete(key);
+        }
+      }
+    }
+  }
+  // Clear all cache
+  clearCache() {
+    this.transformCache.clear();
+    this.dependencyGraph.clear();
+  }
+  invalidateFile(filename) {
+    for (const key of this.transformCache.keys()) {
+      if (key.startsWith(filename)) {
+        this.transformCache.delete(key);
+        console.log("[Transpiler] Invalidated cache for", filename);
+      }
+    }
+    const dependents = this.dependencyGraph.get(filename);
+    if (dependents) {
+      for (const dependent of dependents) {
+        this.invalidateFile(dependent);
+      }
+    }
+  }
+  // Get cache statistics
+  getCacheStats() {
+    return {
+      size: this.transformCache.size,
+      hitRate: 0
+      // Could be implemented with usage tracking
+    };
+  }
+  // Extract dependencies from code for tracking
+  extractDependencies(code) {
+    const dependencies = [];
+    try {
+      const importRegex = /import\s+(?:[\w\s{},*]*\s+from\s+)?['"]([^'"]+)['"]/g;
+      let match;
+      while ((match = importRegex.exec(code)) !== null) {
+        dependencies.push(match[1]);
+      }
+      const exportRegex = /export\s+(?:[\w\s{},*]*\s+from\s+)?['"]([^'"]+)['"]/g;
+      while ((match = exportRegex.exec(code)) !== null) {
+        dependencies.push(match[1]);
+      }
+      const dynamicImportRegex = /import\s*\(\s*['"]([^'"]+)['"]\s*\)/g;
+      while ((match = dynamicImportRegex.exec(code)) !== null) {
+        dependencies.push(match[1]);
+      }
+      const requireRegex = /require\s*\(\s*['"]([^'"]+)['"]\s*\)/g;
+      while ((match = requireRegex.exec(code)) !== null) {
+        dependencies.push(match[1]);
+      }
+    } catch (error) {
+      console.warn("[EnhancedTranspiler] Failed to extract dependencies:", error);
+    }
+    return [...new Set(dependencies)];
+  }
+  // Validate transpiled code
+  validateTranspiledCode(code) {
+    const errors = [];
+    try {
+      new Function(code);
+    } catch (error) {
+      errors.push(`Syntax error: ${error.message}`);
+    }
+    if (code.includes("undefined") && code.includes("import")) {
+      errors.push("Possible import resolution issue detected");
+    }
+    if (code.includes("require(") && !code.includes("module.exports")) {
+      errors.push("CommonJS require() detected in ES module");
+    }
+    return {
+      valid: errors.length === 0,
+      errors
+    };
+  }
+};
+
+// src/entry-point-detection.ts
+function generateId() {
+  return Date.now().toString(36) + Math.random().toString(36).substr(2);
+}
+var COMMON_ENTRY_POINTS = [
+  "src/App.tsx",
+  "src/App.ts",
+  "App.tsx",
+  "App.ts",
+  "app/page.tsx",
+  // Next.js
+  "app/page.ts",
+  "src/main.tsx",
+  "src/main.ts",
+  "main.tsx",
+  "main.ts",
+  "index.tsx",
+  "index.ts",
+  "src/index.tsx",
+  "src/index.ts"
+];
+var COMPONENT_INDICATORS = [
+  "App",
+  "Main",
+  "Page",
+  "Index",
+  "Home"
+];
+function findOrCreateEntryPoint(files) {
+  console.log("\u{1F50D} Entry point detection: Starting with", files.length, "files");
+  console.log("\u{1F4C1} Available files:", files.map((f) => f.path));
+  const existingEntry = findExistingEntryPoint(files);
+  if (existingEntry) {
+    console.log("\u{1F3AF} Found existing entry point:", existingEntry);
+    return {
+      entryPoint: existingEntry,
+      files,
+      createdEntry: false
+    };
+  }
+  const componentEntry = findComponentEntryPoint(files);
+  if (componentEntry) {
+    console.log("\u{1F527} Found component that could be entry point:", componentEntry);
+    const componentFile = files.find((f) => f.path === componentEntry);
+    if (componentFile) {
+      console.log("\u{1F4DD} Creating app wrapper for component:", componentEntry);
+      const appWrapperFile = createAppWrapperForComponent(componentFile);
+      const updatedFiles2 = [...files, appWrapperFile];
+      return {
+        entryPoint: appWrapperFile.path,
+        files: updatedFiles2,
+        createdEntry: true
+      };
+    }
+  }
+  console.log("\u{1F4DD} Creating default entry point");
+  const entryPointFile = createDefaultEntryPoint(files);
+  const updatedFiles = [...files, entryPointFile];
+  return {
+    entryPoint: entryPointFile.path,
+    files: updatedFiles,
+    createdEntry: true
+  };
+}
+function isBootstrapFile(file) {
+  const c = file.content;
+  return /\bcreateRoot\s*\(/.test(c) || /ReactDOM\.render\s*\(/.test(c) || /\bhydrateRoot\s*\(/.test(c);
+}
+function extractComponentFromBootstrap(bootstrapFile, allFiles) {
+  const importRe = /import\s+(\w+)\s+from\s+['"]([^'"]+)['"]/g;
+  let match;
+  while ((match = importRe.exec(bootstrapFile.content)) !== null) {
+    const importPath = match[2];
+    if (!importPath.startsWith(".") && !importPath.startsWith("@/")) continue;
+    const bootstrapDir = bootstrapFile.path.replace(/\/[^/]+$/, "");
+    let resolvedBase;
+    if (importPath.startsWith("@/")) {
+      resolvedBase = "src/" + importPath.slice(2);
+    } else {
+      const parts = bootstrapDir.split("/").filter(Boolean);
+      for (const seg of importPath.split("/")) {
+        if (seg === "..") parts.pop();
+        else if (seg !== ".") parts.push(seg);
+      }
+      resolvedBase = parts.join("/");
+    }
+    const extensions = [".tsx", ".ts", ".jsx", ".js", ""];
+    for (const ext of extensions) {
+      const candidate = resolvedBase + ext;
+      const found = allFiles.find(
+        (f) => f.path === candidate || f.path === "/" + candidate || f.path.replace(/^\//, "") === candidate
+      );
+      if (found) {
+        console.log(`\u{1F517} Bootstrap ${bootstrapFile.path} imports component from ${found.path}`);
+        return found.path;
+      }
+    }
+  }
+  return null;
+}
+function findExistingEntryPoint(files) {
+  for (const entryPath of COMMON_ENTRY_POINTS) {
+    const found = files.find(
+      (f) => f.path === entryPath || f.path.endsWith(entryPath) || f.path.replace(/^\//, "") === entryPath.replace(/^\//, "")
+    );
+    if (found) {
+      if (isBootstrapFile(found)) {
+        console.log(`\u26A1 Skipping bootstrap file as entry point: ${found.path}`);
+        const componentPath = extractComponentFromBootstrap(found, files);
+        if (componentPath) {
+          return componentPath;
+        }
+        continue;
+      }
+      return found.path;
+    }
+  }
+  return null;
+}
+function findComponentEntryPoint(files) {
+  for (const file of files) {
+    const fileName = file.path.split("/").pop()?.replace(/\.(tsx?|jsx?)$/, "");
+    if (fileName && COMPONENT_INDICATORS.includes(fileName)) {
+      return file.path;
+    }
+  }
+  const jsxFiles = files.filter(
+    (f) => f.path.endsWith(".tsx") || f.path.endsWith(".jsx")
+  );
+  if (jsxFiles.length > 0) {
+    for (const file of jsxFiles) {
+      if (file.content.includes("export default") || file.content.includes("function") || file.content.includes("const")) {
+        return file.path;
+      }
+    }
+    return jsxFiles[0].path;
+  }
+  const tsFiles = files.filter((f) => f.path.endsWith(".ts"));
+  if (tsFiles.length > 0) {
+    return tsFiles[0].path;
+  }
+  return null;
+}
+function toValidIdentifier(name) {
+  return name.replace(/[-_]/g, " ").replace(/\s+/g, " ").split(" ").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join("").replace(/[^a-zA-Z0-9_$]/g, "").replace(/^[0-9]/, "_$&") || "Component";
+}
+function createAppWrapperForComponent(componentFile) {
+  const rawComponentName = componentFile.path.split("/").pop()?.replace(/\.(tsx?|jsx?)$/, "") || "Component";
+  const componentName = toValidIdentifier(rawComponentName);
+  const componentPath = componentFile.path.replace(/\.(tsx?|jsx?)$/, "");
+  const content = `import React from 'react'
+import ${componentName} from '${componentPath}'
+
+// App wrapper created by preview system for component: ${componentName}
+export default function App() {
+  return (
+    <div style={{ 
+      padding: '20px', 
+      fontFamily: 'system-ui, sans-serif',
+      minHeight: '100vh',
+      background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)'
+    }}>
+      <div style={{
+        maxWidth: '800px',
+        margin: '0 auto',
+        background: 'white',
+        borderRadius: '12px',
+        padding: '30px',
+        boxShadow: '0 10px 30px rgba(0,0,0,0.1)'
+      }}>
+        <h1 style={{
+          color: '#333',
+          marginBottom: '10px',
+          fontSize: '28px',
+          fontWeight: '700'
+        }}>
+          DamascusAI Preview
+        </h1>
+        <p style={{
+          color: '#666',
+          marginBottom: '30px',
+          fontSize: '16px'
+        }}>
+          Sovereign generation system active - Component: ${componentName}
+        </p>
+        
+        <div style={{
+          border: '2px dashed #e2e8f0',
+          borderRadius: '8px',
+          padding: '20px',
+          background: '#f8fafc'
+        }}>
+          <h2 style={{
+            color: '#4a5568',
+            marginBottom: '15px',
+            fontSize: '18px'
+          }}>
+            Component: <code>${componentName}</code>
+          </h2>
+          <${componentName} />
+        </div>
+        
+        <div style={{
+          marginTop: '20px',
+          padding: '15px',
+          background: '#edf2f7',
+          borderRadius: '6px',
+          fontSize: '14px',
+          color: '#4a5568'
+        }}>
+          <strong>Generated by:</strong> DamascusAI Sovereign Stack
+        </div>
+      </div>
+    </div>
+  )
+}
+`;
+  const now = Date.now();
+  return {
+    id: generateId(),
+    path: "/App.tsx",
+    content,
+    language: "typescript",
+    createdAt: now,
+    updatedAt: now
+  };
+}
+function createDefaultEntryPoint(files) {
+  console.log("\u{1F4DD} Creating default App.tsx entry point");
+  const components = findAvailableComponents(files);
+  const sanitizedComponents = components.map((comp) => ({
+    ...comp,
+    name: toValidIdentifier(comp.name)
+  }));
+  const imports = sanitizedComponents.map(
+    (comp) => `import ${comp.name} from '${comp.path.replace(/\.(tsx?|jsx?)$/, "")}'`
+  ).join("\n");
+  const componentUsage = sanitizedComponents.map(
+    (comp) => `      <${comp.name} />`
+  ).join("\n");
+  const content = `${imports}
+import React from 'react'
+
+// Default entry point created by preview system
+export default function App() {
+  return (
+    <div style={{ 
+      padding: '20px', 
+      fontFamily: 'system-ui, sans-serif',
+      minHeight: '100vh',
+      background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)'
+    }}>
+      <div style={{
+        maxWidth: '800px',
+        margin: '0 auto',
+        background: 'white',
+        borderRadius: '12px',
+        padding: '30px',
+        boxShadow: '0 10px 30px rgba(0,0,0,0.1)'
+      }}>
+        <h1 style={{
+          color: '#333',
+          marginBottom: '10px',
+          fontSize: '28px',
+          fontWeight: '700'
+        }}>
+          \u{1F680} Damascus AI Preview
+        </h1>
+        <p style={{
+          color: '#666',
+          marginBottom: '30px',
+          fontSize: '16px'
+        }}>
+          Sovereign generation system active
+        </p>
+        
+        <div style={{
+          border: '2px dashed #e2e8f0',
+          borderRadius: '8px',
+          padding: '20px',
+          background: '#f8fafc'
+        }}>
+          <h2 style={{
+            color: '#4a5568',
+            marginBottom: '15px',
+            fontSize: '18px'
+          }}>
+            Generated Components:
+          </h2>
+          <div style={{ marginTop: '20px' }}>
+${componentUsage}
+          </div>
+        </div>
+        
+        <div style={{
+          marginTop: '20px',
+          padding: '15px',
+          background: '#edf2f7',
+          borderRadius: '6px',
+          fontSize: '14px',
+          color: '#4a5568'
+        }}>
+          <strong>Generated by:</strong> DamascusAI Sovereign Stack
+        </div>
+      </div>
+    </div>
+  )
+}
+`;
+  const now = Date.now();
+  return {
+    id: generateId(),
+    path: "/App.tsx",
+    content,
+    language: "typescript",
+    createdAt: now,
+    updatedAt: now
+  };
+}
+function findAvailableComponents(files) {
+  const components = [];
+  for (const file of files) {
+    if (file.path.endsWith(".tsx") || file.path.endsWith(".jsx")) {
+      const fileName = file.path.split("/").pop()?.replace(/\.(tsx?|jsx?)$/, "");
+      if (fileName && fileName !== "App" && fileName !== "index") {
+        if (file.content.includes("export") || file.content.includes("return")) {
+          components.push({
+            name: fileName,
+            path: file.path
+          });
+        }
+      }
+    }
+  }
+  if (components.length === 0) {
+    components.push({
+      name: "GeneratedContent",
+      path: "/placeholder"
+    });
+  }
+  return components.slice(0, 3);
+}
+
+// src/jxr-server-manager.ts
+import { readFile, readdir, watch } from "fs/promises";
+import path from "path";
+import http from "http";
+var JXRServerManager = class {
+  runtime;
+  transpiler;
+  server = null;
+  config;
+  projectFiles = [];
+  entryPoint = "src/App.tsx";
+  watchers = /* @__PURE__ */ new Map();
+  debounceTimer = null;
+  pendingChanges = /* @__PURE__ */ new Map();
+  clients = /* @__PURE__ */ new Set();
+  constructor(config = {}) {
+    this.config = {
+      port: config.port || 3e3,
+      host: config.host || "localhost",
+      srcDir: config.srcDir || "src",
+      enableHMR: config.enableHMR !== false,
+      debounceMs: config.debounceMs || 300
+    };
+    this.runtime = new JXRRuntime();
+    this.transpiler = new EnhancedTranspiler();
+  }
+  async initialize() {
+    await this.runtime.init();
+    await this.loadProjectFiles();
+    this.setupEntryPoint();
+    if (this.config.enableHMR) {
+      this.startFileWatching();
+    }
+  }
+  async loadProjectFiles() {
+    const srcPath = path.resolve(process.cwd(), this.config.srcDir);
+    this.projectFiles = [];
+    async function readDirRecursive(dir, base, files, runtime) {
+      for (const entry of await readdir(dir, { withFileTypes: true })) {
+        const fullPath = path.join(dir, entry.name);
+        const relativePath = path.join(base, entry.name);
+        if (entry.isDirectory()) {
+          await readDirRecursive(fullPath, relativePath, files, runtime);
+        } else if (/\.(tsx?|jsx?|css)$/.test(entry.name)) {
+          const content = await readFile(fullPath, "utf-8");
+          const vfsPath = "/" + relativePath.replace(/\\/g, "/");
+          runtime.vfs.write(vfsPath, content);
+          files.push({
+            id: Math.random().toString(36).slice(2),
+            path: relativePath.replace(/\\/g, "/"),
+            content,
+            language: entry.name.endsWith(".tsx") || entry.name.endsWith(".ts") ? "typescript" : "javascript",
+            createdAt: Date.now(),
+            updatedAt: Date.now()
+          });
+        }
+      }
+    }
+    try {
+      await readDirRecursive(srcPath, this.config.srcDir, this.projectFiles, this.runtime);
+      console.log(`\u{1F4C1} Loaded ${this.projectFiles.length} files into VirtualFS`);
+    } catch (err) {
+      console.error("Error loading files:", err);
+    }
+  }
+  setupEntryPoint() {
+    const result = findOrCreateEntryPoint(this.projectFiles);
+    this.entryPoint = result.entryPoint;
+    if (result.createdEntry) {
+      const entryFile = result.files.find((f) => f.path === this.entryPoint);
+      if (entryFile) {
+        this.runtime.vfs.write("/" + entryFile.path, entryFile.content);
+      }
+    }
+    console.log(`\u{1F3AF} Entry point: ${this.entryPoint}`);
+  }
+  startFileWatching() {
+    const srcPath = path.resolve(process.cwd(), this.config.srcDir);
+    const watchDir = async (dir) => {
+      try {
+        const watcher = watch(dir, { recursive: true });
+        this.watchers.set(dir, watcher);
+        for await (const event of watcher) {
+          if (event.filename && /\.(tsx?|jsx?|css)$/.test(event.filename)) {
+            this.handleFileChange(event.filename);
+          }
+        }
+      } catch (err) {
+        console.error(`Watch error for ${dir}:`, err);
+      }
+    };
+    watchDir(srcPath);
+    console.log(`\u{1F440} Watching ${this.config.srcDir} for changes...`);
+  }
+  handleFileChange(filename) {
+    const fullPath = path.resolve(process.cwd(), this.config.srcDir, filename);
+    const relativePath = path.join(this.config.srcDir, filename).replace(/\\/g, "/");
+    readFile(fullPath, "utf-8").then((content) => {
+      const file = {
+        id: Math.random().toString(36).slice(2),
+        path: relativePath,
+        content,
+        language: filename.endsWith(".tsx") || filename.endsWith(".ts") ? "typescript" : "javascript",
+        createdAt: Date.now(),
+        updatedAt: Date.now()
+      };
+      this.pendingChanges.set(relativePath, file);
+      this.scheduleReload();
+    }).catch((err) => console.error(`Error reading ${filename}:`, err));
+  }
+  scheduleReload() {
+    if (this.debounceTimer) {
+      clearTimeout(this.debounceTimer);
+    }
+    this.debounceTimer = setTimeout(() => {
+      this.processPendingChanges();
+    }, this.config.debounceMs);
+  }
+  async processPendingChanges() {
+    if (this.pendingChanges.size === 0) return;
+    console.log(`\u{1F504} Processing ${this.pendingChanges.size} file changes...`);
+    for (const [path3, file] of this.pendingChanges) {
+      this.runtime.vfs.write("/" + path3, file.content);
+      const existingIndex = this.projectFiles.findIndex((f) => f.path === path3);
+      if (existingIndex >= 0) {
+        this.projectFiles[existingIndex] = file;
+      }
+    }
+    this.pendingChanges.clear();
+    this.broadcastReload();
+  }
+  broadcastReload() {
+    const message = JSON.stringify({ type: "reload", timestamp: Date.now() });
+    this.clients.forEach((client) => {
+      client.write(`data: ${message}
+
+`);
+    });
+  }
+  async start() {
+    this.server = http.createServer(async (req, res) => {
+      const url = new URL(req.url || "/", `http://${this.config.host}:${this.config.port}`);
+      if (url.pathname === "/__hmr" && this.config.enableHMR) {
+        res.writeHead(200, {
+          "Content-Type": "text/event-stream",
+          "Cache-Control": "no-cache",
+          "Connection": "keep-alive",
+          "Access-Control-Allow-Origin": "*"
+        });
+        this.clients.add(res);
+        req.on("close", () => {
+          this.clients.delete(res);
+        });
+        res.write(`data: ${JSON.stringify({ type: "connected" })}
+
+`);
+        return;
+      }
+      if (url.pathname === "/__health") {
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ status: "ok", runtime: "JXR", version: this.runtime.version }));
+        return;
+      }
+      if (url.pathname === "/") {
+        res.writeHead(200, { "Content-Type": "text/html" });
+        res.end(this.generateHTML());
+        return;
+      }
+      if (url.pathname.match(/\.(tsx?|jsx?|ts|js)$/) || url.pathname.startsWith("/src/")) {
+        try {
+          let vfsPath = url.pathname;
+          let file = this.runtime.vfs.read(vfsPath);
+          if (!file && !vfsPath.match(/\.(tsx?|jsx?|ts|js|css)$/)) {
+            const extensions = [".tsx", ".ts", ".jsx", ".js", ".css"];
+            for (const ext of extensions) {
+              file = this.runtime.vfs.read(vfsPath + ext);
+              if (file) {
+                vfsPath = vfsPath + ext;
+                break;
+              }
+            }
+          }
+          if (!file) {
+            res.writeHead(404, { "Content-Type": "text/plain" });
+            res.end(`// Module not found: ${url.pathname}`);
+            return;
+          }
+          if (vfsPath.endsWith(".css")) {
+            const escapedCSS = file.content.replace(/\\/g, "\\\\").replace(/`/g, "\\`").replace(/\$/g, "\\$");
+            const js = `
+const style = document.createElement('style');
+style.textContent = \`${escapedCSS}\`;
+document.head.appendChild(style);
+export default \`${escapedCSS}\`;
+`;
+            res.writeHead(200, {
+              "Content-Type": "application/javascript",
+              "Cache-Control": "no-cache"
+            });
+            res.end(js);
+            return;
+          }
+          const result = this.transpiler.transpileTypeScript(file.content, vfsPath);
+          if (result.error) {
+            console.error(`Transform error for ${url.pathname}:`, result.error);
+            res.writeHead(500, { "Content-Type": "text/plain" });
+            res.end(`// Transform error: ${result.error.message}`);
+            return;
+          }
+          res.writeHead(200, {
+            "Content-Type": "application/javascript",
+            "Cache-Control": "no-cache"
+          });
+          res.end(result.code);
+        } catch (err) {
+          console.error(`Error serving ${url.pathname}:`, err);
+          res.writeHead(500, { "Content-Type": "text/plain" });
+          res.end(`// Error: ${err?.message || String(err)}`);
+        }
+        return;
+      }
+      res.writeHead(404);
+      res.end("Not found");
+    });
+    return new Promise((resolve, reject) => {
+      this.server.listen(this.config.port, this.config.host, () => {
+        console.log(`\u{1F680} JXR server running on http://${this.config.host}:${this.config.port}/`);
+        if (this.config.enableHMR) {
+          console.log(`\u{1F525} HMR enabled (debounce: ${this.config.debounceMs}ms)`);
+        }
+        resolve();
+      });
+      this.server.on("error", reject);
+    });
+  }
+  async stop() {
+    this.watchers.clear();
+    if (this.debounceTimer) {
+      clearTimeout(this.debounceTimer);
+      this.debounceTimer = null;
+    }
+    this.clients.forEach((client) => {
+      try {
+        client.end();
+      } catch {
+      }
+    });
+    this.clients.clear();
+    if (this.server) {
+      await new Promise((resolve) => {
+        this.server.close(() => resolve());
+      });
+      this.server = null;
+    }
+    this.runtime.dispose();
+    console.log("\u{1F44B} JXR server stopped");
+  }
+  generateHTML() {
+    const hmrScript = this.config.enableHMR ? `
+    <script>
+      // HMR Client
+      const evtSource = new EventSource('/__hmr');
+      evtSource.onmessage = (e) => {
+        const data = JSON.parse(e.data);
+        if (data.type === 'reload') {
+          console.log('[JXR] Reloading...');
+          location.reload();
+        }
+      };
+      evtSource.onerror = () => console.log('[JXR] HMR connection lost');
+    <\/script>` : "";
+    const importMap = {
+      "imports": {
+        "react": "https://esm.sh/react@19.2.4",
+        "react/jsx-runtime": "https://esm.sh/react@19.2.4/jsx-runtime",
+        "react/jsx-dev-runtime": "https://esm.sh/react@19.2.4/jsx-dev-runtime",
+        "react-dom/client": "https://esm.sh/react-dom@19.2.4/client"
+      }
+    };
+    const hasMainFile = this.projectFiles.some(
+      (f) => f.path === "src/main.tsx" || f.path === "src/main.ts" || f.path === "src/index.tsx" || f.path === "src/index.ts"
+    );
+    if (hasMainFile) {
+      return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>JXR App</title>
+  <script type="importmap">
+    ${JSON.stringify(importMap)}
+  <\/script>
+</head>
+<body>
+  <div id="root"></div>
+  <script type="module" src="/src/main.tsx"><\/script>
+  ${hmrScript}
+</body>
+</html>`;
+    }
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>JXR App</title>
+  <script type="importmap">
+    ${JSON.stringify(importMap)}
+  <\/script>
+</head>
+<body>
+  <div id="root"></div>
+  <script type="module">
+    import { createRoot } from 'react-dom/client';
+    import App from '/${this.entryPoint}';
+    
+    const root = createRoot(document.getElementById('root'));
+    root.render(App());
+  <\/script>
+  ${hmrScript}
+</body>
+</html>`;
+  }
+};
+
 // src/deployer.ts
+import { readFile as readFile2, stat } from "fs/promises";
+import path2 from "path";
+import { spawn } from "child_process";
 var JXRDeployer = class {
   apiKey;
-  apiUrl;
   projectId;
   constructor(apiKey, projectId) {
     this.apiKey = apiKey;
-    this.apiUrl = "https://api.jxrstudios.online/v1";
     this.projectId = projectId || this.generateProjectId();
   }
   /**
    * Deploy the current project to JXR infrastructure
-   * @param projectPath Path to the built project (dist/ folder)
-   * @param config Deployment configuration
    */
   async deploy(projectPath, config = {}) {
     const env = config.environment || "production";
     const branch = config.branch || "main";
+    const pid = config.projectId || this.projectId;
     console.log(`\u{1F680} Deploying to JXR ${env}...`);
+    const logs = [];
     try {
-      const uploadResult = await this.uploadBuild(projectPath, {
-        projectId: config.projectId || this.projectId,
-        environment: env,
-        branch
-      });
-      if (!uploadResult.success) {
-        throw new Error(`Upload failed: ${uploadResult.error}`);
-      }
-      const deployment = await this.triggerDeployment({
-        projectId: config.projectId || this.projectId,
-        environment: env,
-        uploadId: uploadResult.uploadId
-      });
-      const result = await this.pollDeployment(deployment.deploymentId);
+      await stat(projectPath);
+      logs.push(`\u{1F4C1} Deploying from: ${projectPath}`);
+      const tarballPath = await this.createTarball(projectPath);
+      logs.push(`\u{1F4E6} Created tarball: ${tarballPath}`);
+      const uploadResult = await this.uploadTarball(tarballPath, pid, env, branch);
+      logs.push(`\u2601\uFE0F  Uploaded to JXR`);
+      const url = `https://${pid}.jxr.dev`;
+      logs.push(`\u{1F310} Live at: ${url}`);
       return {
-        success: result.status === "deployed",
-        url: result.url || `https://${this.projectId}.jxr.dev`,
-        deploymentId: deployment.deploymentId,
+        success: true,
+        url,
+        deploymentId: uploadResult.deploymentId,
         timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-        logs: result.logs || []
+        logs
       };
     } catch (error) {
+      const errorMsg = error instanceof Error ? error.message : "Unknown error";
+      logs.push(`\u274C Error: ${errorMsg}`);
       return {
         success: false,
         url: "",
         deploymentId: "",
         timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-        logs: [`Error: ${error instanceof Error ? error.message : "Unknown error"}`]
+        logs
       };
     }
   }
+  /**
+   * Create a tarball of the build directory
+   */
+  async createTarball(projectPath) {
+    const tarballPath = path2.join(process.cwd(), ".jxr-deploy.tar.gz");
+    return new Promise((resolve, reject) => {
+      const tar = spawn("tar", ["-czf", tarballPath, "-C", projectPath, "."]);
+      tar.on("close", (code) => {
+        if (code === 0) {
+          resolve(tarballPath);
+        } else {
+          reject(new Error(`tar exited with code ${code}`));
+        }
+      });
+      tar.on("error", reject);
+    });
+  }
+  /**
+   * Upload tarball to JXR API
+   */
+  async uploadTarball(tarballPath, projectId, environment, branch) {
+    const formData = new FormData();
+    const fileContent = await readFile2(tarballPath);
+    const blob = new Blob([fileContent]);
+    formData.append("build", blob, "build.tar.gz");
+    formData.append("projectId", projectId);
+    formData.append("environment", environment);
+    formData.append("branch", branch);
+    const response = await fetch("https://jxrstudios.workers.dev/v1/deployments", {
+      method: "POST",
+      headers: {
+        "Authorization": `Bearer ${this.apiKey}`
+      },
+      body: formData
+    });
+    if (!response.ok) {
+      throw new Error(`Upload failed: ${response.statusText}`);
+    }
+    const result = await response.json();
+    return { deploymentId: result.deploymentId };
+  }
   /**
    * Get deployment status
    */
   async getStatus(deploymentId) {
-    const response = await fetch(`${this.apiUrl}/deployments/${deploymentId}`, {
+    const response = await fetch(`https://jxrstudios.workers.dev/v1/deployments/${deploymentId}`, {
       headers: {
-        "Authorization": `Bearer ${this.apiKey}`,
-        "Content-Type": "application/json"
+        "Authorization": `Bearer ${this.apiKey}`
       }
     });
     if (!response.ok) {
@@ -1104,7 +2057,7 @@ var JXRDeployer = class {
    */
   async listDeployments(projectId) {
     const pid = projectId || this.projectId;
-    const response = await fetch(`${this.apiUrl}/projects/${pid}/deployments`, {
+    const response = await fetch(`https://jxrstudios.workers.dev/v1/projects/${pid}/deployments`, {
       headers: {
         "Authorization": `Bearer ${this.apiKey}`
       }
@@ -1118,11 +2071,10 @@ var JXRDeployer = class {
    * Rollback to a previous deployment
    */
   async rollback(deploymentId) {
-    const response = await fetch(`${this.apiUrl}/deployments/${deploymentId}/rollback`, {
+    const response = await fetch(`https://jxrstudios.workers.dev/v1/deployments/${deploymentId}/rollback`, {
       method: "POST",
       headers: {
-        "Authorization": `Bearer ${this.apiKey}`,
-        "Content-Type": "application/json"
+        "Authorization": `Bearer ${this.apiKey}`
       }
     });
     if (!response.ok) {
@@ -1137,70 +2089,6 @@ var JXRDeployer = class {
       logs: ["Rollback successful"]
     };
   }
-  /**
-   * Delete a deployment
-   */
-  async deleteDeployment(deploymentId) {
-    const response = await fetch(`${this.apiUrl}/deployments/${deploymentId}`, {
-      method: "DELETE",
-      headers: {
-        "Authorization": `Bearer ${this.apiKey}`
-      }
-    });
-    if (!response.ok) {
-      throw new Error(`Delete failed: ${response.statusText}`);
-    }
-  }
-  // ─── Private Methods ────────────────────────────────────────────────────────
-  async uploadBuild(projectPath, options) {
-    const formData = new FormData();
-    formData.append("projectId", options.projectId);
-    formData.append("environment", options.environment);
-    formData.append("branch", options.branch);
-    const response = await fetch(`${this.apiUrl}/uploads`, {
-      method: "POST",
-      headers: {
-        "Authorization": `Bearer ${this.apiKey}`
-      },
-      body: formData
-    });
-    if (!response.ok) {
-      return { success: false, uploadId: "", error: response.statusText };
-    }
-    const data = await response.json();
-    return { success: true, uploadId: data.uploadId };
-  }
-  async triggerDeployment(options) {
-    const response = await fetch(`${this.apiUrl}/deployments`, {
-      method: "POST",
-      headers: {
-        "Authorization": `Bearer ${this.apiKey}`,
-        "Content-Type": "application/json"
-      },
-      body: JSON.stringify({
-        projectId: options.projectId,
-        environment: options.environment,
-        uploadId: options.uploadId
-      })
-    });
-    if (!response.ok) {
-      throw new Error(`Failed to trigger deployment: ${response.statusText}`);
-    }
-    return response.json();
-  }
-  async pollDeployment(deploymentId, maxAttempts = 60) {
-    for (let i = 0; i < maxAttempts; i++) {
-      const status = await this.getStatus(deploymentId);
-      if (status.status === "deployed") {
-        return { status: "deployed", url: status.url, logs: [] };
-      }
-      if (status.status === "failed") {
-        return { status: "failed", logs: [status.error || "Deployment failed"] };
-      }
-      await new Promise((resolve) => setTimeout(resolve, 2e3));
-    }
-    throw new Error("Deployment timed out");
-  }
   generateProjectId() {
     const timestamp = Date.now().toString(36);
     const random = Math.random().toString(36).substring(2, 8);
@@ -1213,15 +2101,18 @@ var jxrDeployer = new JXRDeployer(
 );
 export {
   DEFAULT_PROJECT_FILES,
+  EnhancedTranspiler,
   ImportMapBuilder,
   JSXTransformer,
   JXRCrypto,
   JXRDeployer,
   JXRRuntime,
+  JXRServerManager,
   MoQTransport,
   ModuleCache,
   VirtualFS,
   WorkerPool,
+  findOrCreateEntryPoint,
   jxrCrypto,
   jxrDeployer,
   jxrRuntime