@ape-egg/vibe 1.6.0 → 1.6.1

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## [1.6.1] - 2026-02-12
+
+### Fixed
+
+- **Compiler output directory handling** - Fixed duplicate file generation in output
+  - Compiler now properly handles source and output paths without preserving source directory structure
+  - Files from `./src` are now correctly written to root of output directory (e.g., `compiled/index.html`) instead of `compiled/src/index.html`
+  - Canonicalized source path for reliable comparison and path stripping
+  - Updated all processing functions to use canonical source path for relative path calculation
+
+- **Manifest detection improvements** - Better handling of directory URLs and extensionless paths
+  - Directory URLs now normalized: `/compiled/` → `/compiled/index.html`
+  - Extensionless URLs now normalized: `/compiled/mypage` → `/compiled/mypage.html`
+  - Fixes manifest detection when visiting pages without explicit `.html` extension
+  - Enables proper hyperspeed loading for directory index pages
+
+---
+
 ## [1.6.0] - 2026-02-12
 
 ### Added

package/README.md

@@ -1,13 +1,15 @@
 # Vibe
 
-A runtime-first reactive library.
+**Version 1.6.0 (Alpha)** — A runtime-first reactive framework with optional compilation.
 
-No virtual DOM. No build step. Just modern JavaScript.
+No virtual DOM. No build step required. Just modern JavaScript. When you need production optimizations, add the optional Rust-based compiler.
 
 ```bash
 npm install @ape-egg/vibe
 ```
 
+**Status:** Functional and ready to use, but expect bugs and breaking changes daily until stable. Use in production at your own risk.
+
 ---
 
 ## Vibe Runtime
@@ -246,7 +248,7 @@ No need for immutable update patterns or spread operators. Just mutate and Vibe
 
 ## Vibe Compiler
 
-Optional build step for production optimization. The compiler processes HTML files, inlines components, and handles assets while preserving directory structure.
+Optional build step for production optimization. The compiler provides component inlining, iteration optimization, watch mode, and hydration manifests while preserving directory structure.
 
 ### Installation
 
@@ -264,18 +266,27 @@ curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
 # Initialize config in package.json
 bunx vibe compile --init
 
-# Compile
+# Basic compilation
 bunx vibe compile
+# or shorthand
+bunx vibe c
+
+# Watch mode (incremental compilation)
+bunx vibe compile --watch
+
+# Production build
+bunx vibe compile --minify --source-maps
 
 # With options
 bunx vibe compile --verbose             # Step-by-step logging
 bunx vibe compile --minify              # Minify output
-bunx vibe compile --accessibility       # Transform custom tags to divs
+bunx vibe compile --elements-as-is      # Keep custom elements as-is
 bunx vibe compile --validate            # Validate HTML syntax
-bunx vibe compile --create-manifest     # Generate hydration manifest
 bunx vibe compile --source-maps         # Generate source maps
 bunx vibe compile --node-modules-as-is  # Copy node_modules as-is
-bunx vibe compile --watch               # Watch mode (future)
+bunx vibe compile --components-as-is    # Skip component inlining
+bunx vibe compile --runtime-as-is       # Skip manifest generation
+bunx vibe compile --iterations-as-is    # Skip iteration optimization
 ```
 
 Or via npm scripts:
@@ -283,13 +294,14 @@ Or via npm scripts:
 ```json
 {
   "scripts": {
-    "vibe:compile": "vibe compile",
-    "vibe:compile:init": "vibe compile --init"
+    "compile": "vibe compile",
+    "compile:watch": "vibe compile --watch",
+    "compile:prod": "vibe compile --minify --source-maps"
   }
 }
 ```
 
-Then run with `bun vibe:compile` or `npm run vibe:compile`.
+Then run with `npm run compile` or `bun compile`.
 
 ### Configuration
 
@@ -304,13 +316,26 @@ Add to your `package.json`:
     "pages": "pages",
     "assets": "assets",
     "minify": false,
-    "accessibility": false,
-    "excludeTags": [],
-    "nodeModulesAsIs": false
+    "elementsAsIs": false,
+    "reservedElements": [],
+    "sourceMaps": false,
+    "validate": false,
+    "nodeModulesAsIs": false,
+    "componentsAsIs": false,
+    "runtimeAsIs": false,
+    "iterationsAsIs": false
   }
 }
 ```
 
+**Key Options:**
+
+- `elementsAsIs: false` — Transform custom elements to divs (default)
+- `reservedElements: []` — Additional element names to reserve (appends to built-in HTML5 elements + "component")
+- `componentsAsIs: false` — Inline components (default) or keep separate for runtime
+- `iterationsAsIs: false` — Optimize iterations (default) or use runtime rendering
+- `runtimeAsIs: false` — Generate manifest (default) or skip for runtime-only
+
 **Defaults** (when no config):
 
 - `source`: `./`
@@ -351,6 +376,66 @@ Auto-detects based on lockfiles: `bun.lockb`, `pnpm-lock.yaml`, `yarn.lock`, `pa
 **Opt-out:**
 Set `nodeModulesAsIs: true` in config or use `--node-modules-as-is` flag to copy node_modules as-is.
 
+### Watch Mode
+
+Watch mode enables incremental compilation with intelligent dependency tracking:
+
+```bash
+bunx vibe compile --watch
+```
+
+Features:
+- **Incremental builds** — Only recompiles changed files (~100ms)
+- **Dependency tracking** — Changes to components trigger recompilation of pages using them
+- **Debounced** — 300ms debounce prevents excessive compilation during rapid changes
+- **Delta output** — First compile shows full output, subsequent compiles show only changes
+
+### Component System
+
+Components are automatically inlined during compilation with full support for props and slots:
+
+```html
+<!-- Source: components/card.html -->
+<div class="card">
+  <h2>@[title]</h2>
+  <p>@[description]</p>
+  <slot></slot>
+</div>
+
+<!-- Usage in page -->
+<component src="/components/card.html" title="My Card" description="Card description">
+  <p>Slot content</p>
+</component>
+
+<!-- Compiled output -->
+<component>
+  <div class="card">
+    <h2>My Card</h2>
+    <p>Card description</p>
+    <p>Slot content</p>
+  </div>
+</component>
+```
+
+**Custom element syntax:** Components can also use custom element syntax (e.g., `<card>` → auto-converts to `<component src="/components/card.html">`).
+
+**Opt-out:** Set `componentsAsIs: true` to keep components as separate files for runtime loading.
+
+### Iteration Optimization
+
+The compiler generates optimized batch functions for `<!-- each -->` loops, providing 2-3x faster rendering:
+
+```html
+<!-- Source -->
+<!-- each items as item, index -->
+<li>@[index]: @[item]</li>
+<!-- /each -->
+
+<!-- Compiled to optimized batch function -->
+```
+
+**Opt-out:** Set `iterationsAsIs: true` to use runtime rendering for all iterations.
+
 ### Output Structure
 
 Mirrors source structure:
@@ -368,9 +453,9 @@ src/                     compiled/
         └── vibe/               └── vibe/
 ```
 
-### Accessibility Mode
+### Element Transformation
 
-`--accessibility` transforms custom HTML elements to divs with classes:
+By default (`elementsAsIs: false`), custom HTML elements are transformed to divs with classes for better HTML validity:
 
 ```html
 <!-- input -->
@@ -380,7 +465,23 @@ src/                     compiled/
 <div class="counter-header">Count</div>
 ```
 
-Exclude specific tags (e.g., web components) via `excludeTags` config.
+Set `elementsAsIs: true` or use `--elements-as-is` flag to keep custom elements unchanged.
+
+**Note:** The `<component>` element is a framework element and is never transformed.
+
+### Reserved Element Names
+
+The compiler validates component filenames against reserved element names (all HTML5 elements + "component" + your custom list). This prevents confusing bugs where components share names with HTML elements.
+
+```json
+{
+  "vibe-compiler": {
+    "reservedElements": ["my-custom-element", "another-reserved-name"]
+  }
+}
+```
+
+**Case-sensitive validation:** `nav.html` conflicts with `<nav>` and will error, but `Nav.html` is allowed.
 
 ### Building Native Binaries
 

package/compiler/src/Cargo.lock

@@ -2061,7 +2061,7 @@ checksum = "0b928f33d975fc6ad9f86c8f283853ad26bdd5b10b7f1542aa2fa15e2289105a"
 
 [[package]]
 name = "vibe-compiler"
-version = "0.1.0"
+version = "1.6.1"
 dependencies = [
  "clap",
  "colored",

package/compiler/src/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "vibe-compiler"
-version = "0.1.0"
+version = "1.6.1"
 edition = "2021"
 description = "Vibe framework compiler - compiles Vibe source files into optimized output"
 authors = ["Kim Korte"]

package/compiler/src/compiler/compile.rs

@@ -502,18 +502,20 @@ impl Compiler {
             }
         }
 
-        // Canonicalize output path once for reliable comparison
+        // Canonicalize both output and source paths for reliable comparison
         let canonical_output = self.config.output.canonicalize()
             .unwrap_or_else(|_| self.config.output.clone());
+        let canonical_source = self.config.source.canonicalize()
+            .unwrap_or_else(|_| self.config.source.clone());
 
         // Track compile and copy times separately
         let compile_start = Instant::now();
 
         // Process all HTML files in source (excluding components directory)
-        self.process_directory_html_only(&self.config.source.clone(), &parser, "", &canonical_output, &mut stats)?;
+        self.process_directory_html_only(&canonical_source, &parser, "", &canonical_output, &canonical_source, &mut stats)?;
 
         // Process source directory for assets (CSS, JS, images, etc.)
-        self.process_directory_assets_only(&self.config.source.clone(), "", &canonical_output, &mut stats)?;
+        self.process_directory_assets_only(&canonical_source, "", &canonical_output, &canonical_source, &mut stats)?;
 
         let process_time = compile_start.elapsed();
 
@@ -906,6 +908,7 @@ impl Compiler {
         parser: &HtmlParser,
         relative_path: &str,
         canonical_output: &Path,
+        canonical_source: &Path,
         stats: &mut CompileStats,
     ) -> Result<(), CompileError> {
         let entries = fs::read_dir(dir).map_err(|e| CompileError::ReadError {
@@ -941,7 +944,7 @@ impl Compiler {
                     format!("{}/{}", relative_path, file_name)
                 };
 
-                self.process_directory_html_only(&path, parser, &new_relative, canonical_output, stats)?;
+                self.process_directory_html_only(&path, parser, &new_relative, canonical_output, canonical_source, stats)?;
             } else if path.extension().and_then(|e| e.to_str()) == Some("html") {
                 let (internal, external, component_srcs) = self.compile_html_file(&path, parser, relative_path)?;
                 stats.files_compiled += 1;
@@ -962,7 +965,7 @@ impl Compiler {
                 };
 
                 if let Some(ref mut logger) = self.logger {
-                    logger.log(&path, FileOperation::Compiled, &self.config.source);
+                    logger.log(&path, FileOperation::Compiled, canonical_source);
 
                     // Log each component occurrence (for counting)
                     if let Some(all_srcs) = all_srcs {
@@ -990,6 +993,7 @@ impl Compiler {
         dir: &Path,
         relative_path: &str,
         canonical_output: &Path,
+        canonical_source: &Path,
         stats: &mut CompileStats,
     ) -> Result<(), CompileError> {
         let entries = fs::read_dir(dir).map_err(|e| CompileError::ReadError {
@@ -1027,7 +1031,7 @@ impl Compiler {
                         } else {
                             format!("{}/{}", relative_path, file_name)
                         };
-                        self.copy_directory(&path, &new_relative, stats)?;
+                        self.copy_directory(&path, &new_relative, canonical_source, stats)?;
                     }
                     // Skip further processing (don't recurse into components)
                     continue;
@@ -1040,7 +1044,7 @@ impl Compiler {
                     format!("{}/{}", relative_path, file_name)
                 };
 
-                self.process_directory_assets_only(&path, &new_relative, canonical_output, stats)?;
+                self.process_directory_assets_only(&path, &new_relative, canonical_output, canonical_source, stats)?;
             } else if let Some(ext) = path.extension().and_then(|e| e.to_str()) {
                 // Skip files matching skip patterns
                 if should_skip_path(&path, file_name) {
@@ -1052,7 +1056,7 @@ impl Compiler {
                     self.copy_file(&path, relative_path)?;
                     stats.files_copied += 1;
                     if let Some(ref mut logger) = self.logger {
-                        logger.log(&path, FileOperation::Copied, &self.config.source);
+                        logger.log(&path, FileOperation::Copied, canonical_source);
                     }
                 }
             }
@@ -1523,6 +1527,7 @@ impl Compiler {
         &mut self,
         dir: &Path,
         relative_path: &str,
+        canonical_source: &Path,
         stats: &mut CompileStats,
     ) -> Result<(), CompileError> {
         let entries = fs::read_dir(dir).map_err(|e| CompileError::ReadError {
@@ -1541,12 +1546,12 @@ impl Compiler {
 
             if path.is_dir() {
                 let new_relative = format!("{}/{}", relative_path, file_name);
-                self.copy_directory(&path, &new_relative, stats)?;
+                self.copy_directory(&path, &new_relative, canonical_source, stats)?;
             } else {
                 self.copy_file(&path, relative_path)?;
                 stats.files_copied += 1;
                 if let Some(ref mut logger) = self.logger {
-                    logger.log(&path, FileOperation::Copied, &self.config.source);
+                    logger.log(&path, FileOperation::Copied, canonical_source);
                 }
             }
         }

package/compiler/src/main.rs

@@ -26,7 +26,7 @@ struct ConfigOverrides {
 #[derive(ClapParser, Debug)]
 #[command(name = "vibe-compile")]
 #[command(author = "Kim Korte")]
-#[command(version = "0.1.0")]
+#[command(version = "1.6.1")]
 #[command(about = "Compiles Vibe source files into optimized output")]
 struct Args {
     /// Working directory (defaults to current directory)
@@ -163,7 +163,7 @@ fn main() {
     }
 
     if args.verbose {
-        println!("{}", "Vibe Compiler".cyan().bold());
+        println!("{}", format!("Vibe Compiler v{}", env!("CARGO_PKG_VERSION")).cyan().bold());
         println!();
         println!("  {}: {}", "Working dir".cyan(), config.working_dir.display());
         println!("  {}: {}", "Source".cyan(), config.source.display());
@@ -207,6 +207,9 @@ fn main() {
         println!("  {}: {}", format!("{:<18}", "source-maps").cyan(), format_bool_with_flag(config.source_maps, overrides.source_maps, original_source_maps));
         println!("  {}: {}", format!("{:<18}", "validate").cyan(), format_bool_with_flag(config.validate, overrides.validate, original_validate));
         println!();
+    } else {
+        // Show version in non-verbose mode
+        println!("{}", format!("Vibe Compiler v{}", env!("CARGO_PKG_VERSION")).cyan());
     }
 
     // Handle watch mode
@@ -243,7 +246,7 @@ fn main() {
             }
 
             // Show success headline
-            println!("\n{}", "Compilation successful! ✅".green().bold());
+            println!("\n{}", format!("Compilation successful! (v{}) ✅", env!("CARGO_PKG_VERSION")).green().bold());
             println!();
 
             // Show individual phase timings (validation first, then components, HTML, manifests, copied)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ape-egg/vibe",
-  "version": "1.6.0",
+  "version": "1.6.1",
   "type": "module",
   "description": "Runtime-first reactivity with optional compiler",
   "main": "index.js",

package/runtime/pre-compiled-manifest.js

@@ -135,7 +135,21 @@ const detectHyperspeed = async () => {
   hyperspeedDetectionAttempted = true;
 
   try {
-    const pagePath = window.location.pathname;
+    let pagePath = window.location.pathname;
+
+    // Normalize path: handle directory URLs and missing extensions
+    if (pagePath.endsWith('/')) {
+      // /compiled/ -> /compiled/index.html
+      pagePath = pagePath + 'index.html';
+    } else if (!pagePath.includes('.')) {
+      // /compiled/mypage -> /compiled/mypage.html
+      const lastSlash = pagePath.lastIndexOf('/');
+      const lastSegment = pagePath.substring(lastSlash + 1);
+      if (lastSegment && !lastSegment.includes('.')) {
+        pagePath = pagePath + '.html';
+      }
+    }
+
     const pathSegments = pagePath.split('/').filter(s => s);
 
     if (pathSegments.length === 0) return null;