@ape-egg/vibe 1.3.2 → 1.6.0

package/compiler/src/compiler/value_stamper.rs

@@ -1,126 +1,568 @@
 use regex::{Regex, Captures};
 use serde_json::Value;
+use rquickjs::{Context, Runtime};
+use std::collections::HashSet;
+
+// Elements that should not have reactive bindings processed
+// Matches runtime/constants.js NON_REACTIVE_ELEMENTS
+const NON_REACTIVE_ELEMENTS: &[&str] = &["script", "head", "pre"];
+
+// Attributes where the string value is meaningful (should NOT be removed when falsy)
+// All other attributes are treated as boolean-like (removed when falsy)
+// Matches runtime/constants.js VALUE_ATTRS
+const VALUE_ATTRS: &[&str] = &[
+    // Global attributes
+    "class", "style", "id", "title", "lang", "dir", "tabindex", "accesskey",
+    "slot", "part", "is", "nonce", "popover", "anchor",
+    // Enumerated attributes
+    "contenteditable", "draggable", "spellcheck", "translate", "autocapitalize",
+    "inputmode", "enterkeyhint", "virtualkeyboardpolicy",
+    // URLs and sources
+    "href", "src", "action", "cite", "data", "poster", "srcset", "imagesrcset",
+    "formaction", "ping", "usemap", "manifest", "codebase",
+    // Form attributes
+    "name", "type", "value", "placeholder", "pattern", "min", "max", "step",
+    "minlength", "maxlength", "size", "accept", "autocomplete", "list", "form",
+    "formmethod", "formtarget", "formenctype", "wrap", "method", "enctype", "for", "dirname",
+    // Text/accessibility
+    "alt", "label", "summary", "abbr",
+    // Dimensions and layout
+    "width", "height", "cols", "rows", "span", "rowspan", "colspan",
+    "low", "high", "optimum",
+    // Link/resource hints
+    "target", "rel", "hreflang", "download", "as", "media", "charset",
+    "crossorigin", "integrity", "loading", "decoding", "fetchpriority",
+    "referrerpolicy", "blocking", "imagesizes", "sizes",
+    // Media
+    "preload", "kind", "srclang",
+    // Meta
+    "content", "http-equiv",
+    // iframe/embed
+    "sandbox", "allow", "srcdoc", "credentialless",
+    // Table
+    "headers", "scope",
+    // Datetime
+    "datetime",
+    // Object/embed legacy
+    "coords", "shape",
+];
 
 pub struct ValueStamper<'a> {
     state: &'a Value,
     binding_regex: Regex,
-    iteration_regex: Regex,
+    _runtime: Runtime, // Must be kept alive for context to work
+    context: Context,
+    components_as_is: bool,
 }
 
 impl<'a> ValueStamper<'a> {
-    pub fn new(state: &'a Value) -> Self {
-        Self {
+    pub fn new(state: &'a Value, components_as_is: bool) -> Result<Self, String> {
+        let runtime = Runtime::new().map_err(|e| format!("Failed to create QuickJS runtime: {:?}", e))?;
+        let context = Context::full(&runtime).map_err(|e| format!("Failed to create QuickJS context: {:?}", e))?;
+
+        // Set up state ONCE when creating the stamper (not per expression)
+        context.with(|ctx| -> Result<(), String> {
+            let state_str = serde_json::to_string(state)
+                .map_err(|e| format!("Failed to serialize state: {}", e))?;
+            ctx.eval::<(), _>(format!("const $ = {}; Object.assign(globalThis, $)", state_str))
+                .map_err(|e| format!("Failed to set up state in QuickJS: {:?}", e))?;
+            Ok(())
+        })?;
+
+        Ok(Self {
             state,
             binding_regex: Regex::new(r"@\[((?:[^\[\]]|\[[^\]]*\])+)\]").unwrap(),
-            iteration_regex: Regex::new(r"(?s)<!--\s*each\s+(\w+(?:\.\w+)*)\s+as\s+(\w+)(?:\s*,\s*(\w+))?\s*-->(.*?)<!--\s*/each\s*-->").unwrap(),
-        }
+            _runtime: runtime,
+            context,
+            components_as_is,
+        })
     }
 
     pub fn stamp_html(&self, html: String) -> Result<String, String> {
         // First, render iterations (expands templates into multiple instances)
         let html = self.render_iterations(html)?;
 
-        // Then stamp all bindings (including those in rendered iterations)
-        Ok(self.binding_regex.replace_all(&html, |caps: &Captures| {
-            let path = &caps[1];
-            self.resolve_state_path(path)
-                .unwrap_or_else(|| caps[0].to_string())  // Keep marker if can't resolve
-        }).to_string())
+        // Then, render conditionals (resolve if/else branches)
+        let html = self.render_conditionals(html)?;
+
+        // Find all NON_REACTIVE_ELEMENT regions to skip
+        let mut skip_regions: Vec<(usize, usize)> = Vec::new();
+
+        for element_type in NON_REACTIVE_ELEMENTS {
+            let regex = Regex::new(&format!(r"(?s)<{}[^>]*>.*?</{}>", element_type, element_type)).unwrap();
+            for mat in regex.find_iter(&html) {
+                skip_regions.push((mat.start(), mat.end()));
+            }
+        }
+
+        // When components_as_is is true, skip component elements (runtime will handle them)
+        // Match both <component> and <div class="component"> elements
+        if self.components_as_is {
+            // Match <component ...>...</component>
+            let component_regex = Regex::new(r"(?s)<component[^>]*>.*?</component>").unwrap();
+            for mat in component_regex.find_iter(&html) {
+                skip_regions.push((mat.start(), mat.end()));
+            }
+
+            // Match <div class="component" ...>...</div>
+            let div_component_regex = Regex::new(r#"(?s)<div\s+class="component"[^>]*>.*?</div>"#).unwrap();
+            for mat in div_component_regex.find_iter(&html) {
+                skip_regions.push((mat.start(), mat.end()));
+            }
+        }
+
+        // Sort and merge overlapping regions
+        skip_regions.sort_by_key(|r| r.0);
+
+        // Stamp bindings only in regions that are NOT in skip_regions
+        let mut result = String::new();
+        let mut last_pos = 0;
+
+        for binding_match in self.binding_regex.find_iter(&html) {
+            let match_start = binding_match.start();
+            let match_end = binding_match.end();
+
+            // Check if this binding is inside a skip region
+            let should_skip = skip_regions.iter().any(|(start, end)| {
+                match_start >= *start && match_end <= *end
+            });
+
+            // Add text before this match
+            result.push_str(&html[last_pos..match_start]);
+
+            if should_skip {
+                // Keep the binding marker as-is
+                result.push_str(binding_match.as_str());
+            } else {
+                // Stamp the binding
+                let caps = self.binding_regex.captures(binding_match.as_str()).unwrap();
+                let expr = &caps[1];
+                let stamped = self.eval_expression(expr)
+                    .unwrap_or_else(|| binding_match.as_str().to_string());
+                result.push_str(&stamped);
+            }
+
+            last_pos = match_end;
+        }
+
+        // Add remaining text
+        result.push_str(&html[last_pos..]);
+
+        // Finally, clean up boolean-like attributes with falsy values
+        // When components_as_is is true, skip cleanup inside component elements
+        Ok(self.cleanup_boolean_attributes(result, &skip_regions))
+    }
+
+    /// Evaluate a JavaScript expression with the current state
+    fn eval_expression(&self, expr: &str) -> Option<String> {
+        self.eval_with_state(expr, self.state)
+    }
+
+    /// Evaluate a JavaScript expression with custom state (for nested iterations)
+    fn eval_with_state(&self, expr: &str, _state: &Value) -> Option<String> {
+        // State is already set up in the context during new(), just evaluate the expression
+        self.context.with(|ctx| -> Option<String> {
+            // Evaluate expression and convert to string
+            let result: rquickjs::Value = ctx.eval(expr).ok()?;
+
+            // Convert result to string
+            if result.is_string() {
+                result.as_string().and_then(|s| s.to_string().ok())
+            } else if result.is_number() {
+                result.as_number().map(|n| n.to_string())
+            } else if result.is_bool() {
+                result.as_bool().map(|b| b.to_string())
+            } else if result.is_null() {
+                Some(String::new())
+            } else if result.is_undefined() {
+                None
+            } else {
+                // For objects/arrays, convert to JSON
+                ctx.json_stringify(result).ok()
+                    .and_then(|v| v.and_then(|s| s.to_string().ok()))
+            }
+        })
     }
 
     fn render_iterations(&self, html: String) -> Result<String, String> {
-        let result = self.iteration_regex.replace_all(&html, |caps: &Captures| {
-            let array_path = &caps[1];
-            let item_alias = &caps[2];
-            let index_alias = caps.get(3).map(|m| m.as_str()).unwrap_or("index");
-            let template = &caps[4];
-
-            // Get array from state
-            let array = match self.resolve_array_path(array_path) {
-                Some(arr) => arr,
-                None => {
-                    // Array not found, keep iteration block as-is
-                    return caps[0].to_string();
+        // Use depth counting to properly handle nested iterations
+        self.render_iterations_recursive(html)
+    }
+
+    fn render_iterations_recursive(&self, html: String) -> Result<String, String> {
+        let each_start = Regex::new(r"<!--\s*each\s+(\w+(?:\.\w+)*)\s+as\s+(\w+)(?:\s*,\s*(\w+))?\s*-->").unwrap();
+
+        let mut result = html.clone();
+        let mut search_pos = 0;
+
+        while let Some(start_match) = each_start.find_at(&result, search_pos) {
+            // Extract positions before doing anything else
+            let start_pos = start_match.start();
+            let template_start = start_match.end();
+
+            let captures = each_start.captures(&result[start_pos..]).unwrap();
+            let array_path = captures.get(1).unwrap().as_str().to_string();
+            let item_alias = captures.get(2).unwrap().as_str().to_string();
+            let index_alias = captures.get(3).map(|m| m.as_str().to_string()).unwrap_or_else(|| "index".to_string());
+            let has_index = captures.get(3).is_some();
+
+            // Find matching <!-- /each --> using depth counting
+            if let Some((end_pos, end_after)) = self.find_matching_end(&result, template_start) {
+                let template = result[template_start..end_pos].to_string();
+
+                // Get array from state using QuickJS
+                let array = match self.eval_array_path(&array_path) {
+                    Some(arr) => arr,
+                    None => {
+                        // Array not found, skip this iteration
+                        search_pos = end_after;
+                        continue;
+                    }
+                };
+
+                // Render each item
+                let mut rendered_items = Vec::new();
+                for (idx, item) in array.iter().enumerate() {
+                    // Create temporary merged state for nested iterations
+                    // This allows nested iterations to reference the parent item (e.g., category.items)
+                    let mut merged_state = self.state.clone();
+                    if let Some(obj) = merged_state.as_object_mut() {
+                        obj.insert(item_alias.clone(), item.clone());
+                        obj.insert(index_alias.clone(), Value::Number(idx.into()));
+                    }
+
+                    // Create temp stamper with merged state for this iteration
+                    let temp_stamper = ValueStamper::new(&merged_state, false)
+                        .map_err(|e| format!("Failed to create stamper for iteration: {}", e))?;
+
+                    // Render nested iterations first
+                    let mut item_html = temp_stamper.render_iterations_recursive(template.clone())?;
+
+                    // Then stamp all bindings in this item's context
+                    item_html = temp_stamper.binding_regex.replace_all(&item_html, |caps: &Captures| {
+                        let expr = &caps[1];
+                        temp_stamper.eval_expression(expr)
+                            .unwrap_or_else(|| caps[0].to_string())
+                    }).to_string();
+
+                    rendered_items.push(item_html);
                 }
-            };
 
-            // Render each item
-            let mut rendered_items = Vec::new();
-            for (idx, item) in array.iter().enumerate() {
-                let mut item_html = template.to_string();
+                // Reconstruct with comments
+                let index_part = if has_index {
+                    format!(", {}", index_alias)
+                } else {
+                    String::new()
+                };
 
-                // Replace @[item] and @[index] in template
-                item_html = item_html.replace(
-                    &format!("@[{}]", item_alias),
-                    &self.value_to_string(item)
-                );
-                item_html = item_html.replace(
-                    &format!("@[{}]", index_alias),
-                    &idx.to_string()
+                let replacement = format!(
+                    "<!-- each {} as {}{} -->{}<!-- /each -->",
+                    array_path,
+                    item_alias,
+                    index_part,
+                    rendered_items.join("")
                 );
 
-                rendered_items.push(item_html);
-            }
+                // Replace the entire iteration block
+                result.replace_range(start_pos..end_after, &replacement);
 
-            // Reconstruct with comments (preserve index alias if it was in original)
-            let index_part = if caps.get(3).is_some() {
-                format!(", {}", index_alias)
+                // Continue searching after the replacement
+                search_pos = start_pos + replacement.len();
             } else {
-                String::new()
-            };
+                break;
+            }
+        }
 
-            format!(
-                "<!-- each {} as {}{} -->{}<!-- /each -->",
-                array_path,
-                item_alias,
-                index_part,
-                rendered_items.join("")
-            )
-        });
+        Ok(result)
+    }
+
+    /// Evaluate an array path and return the array
+    fn eval_array_path(&self, path: &str) -> Option<Vec<Value>> {
+        let runtime = Runtime::new().ok()?;
+        let context = Context::full(&runtime).ok()?;
+
+        context.with(|ctx| -> Option<Vec<Value>> {
+            // Set state properties in global scope
+            let state_str = serde_json::to_string(self.state).ok()?;
+            ctx.eval::<(), _>(format!("const $ = {}; Object.assign(globalThis, $)", state_str)).ok()?;
 
-        Ok(result.to_string())
+            // Evaluate path to get array
+            let result: rquickjs::Value = ctx.eval(path).ok()?;
+
+            // Convert to JSON and parse back to Vec<Value>
+            let json_str = ctx.json_stringify(result).ok()??;
+            let json_str = json_str.to_string().ok()?;
+            serde_json::from_str(&json_str).ok()
+        })
     }
 
-    fn resolve_array_path(&self, path: &str) -> Option<&Vec<Value>> {
-        let parts: Vec<&str> = path.split('.').collect();
-        let mut current = self.state;
+    /// Find matching <!-- /each --> using depth counting
+    fn find_matching_end(&self, html: &str, start_pos: usize) -> Option<(usize, usize)> {
+        let each_start = Regex::new(r"<!--\s*each\s+").unwrap();
+        let end_comment = Regex::new(r"<!--\s*/each\s*-->").unwrap();
+
+        let mut depth = 1;
+        let mut search_pos = start_pos;
 
-        for part in parts {
-            current = current.get(part)?;
+        while depth > 0 {
+            let next_start = each_start.find_at(html, search_pos);
+            let next_end = end_comment.find_at(html, search_pos);
+
+            match (next_start, next_end) {
+                (Some(start), Some(end)) if start.start() < end.start() => {
+                    depth += 1;
+                    search_pos = start.end();
+                }
+                (_, Some(end)) => {
+                    depth -= 1;
+                    if depth == 0 {
+                        return Some((end.start(), end.end()));
+                    }
+                    search_pos = end.end();
+                }
+                _ => return None,
+            }
         }
 
-        current.as_array()
+        None
     }
 
-    fn resolve_state_path(&self, path: &str) -> Option<String> {
-        // Navigate state by dot path: "user.name" -> state["user"]["name"]
-        let parts: Vec<&str> = path.split('.').collect();
-        let mut current = self.state;
+    fn render_conditionals(&self, html: String) -> Result<String, String> {
+        let if_start = Regex::new(r"<!--\s*if\s+(.+?)\s*-->").unwrap();
+        let else_comment = Regex::new(r"<!--\s*else\s*-->").unwrap();
+
+        let mut result = html.clone();
+        let mut search_pos = 0;
+
+        while let Some(start_match) = if_start.find_at(&result, search_pos) {
+            let start_pos = start_match.start();
+            let template_start = start_match.end();
+
+            // Extract condition expression
+            let captures = if_start.captures(&result[start_pos..]).unwrap();
+            let condition = captures.get(1).unwrap().as_str();
+
+            // Try to evaluate condition - if it fails (e.g., references iteration variables),
+            // skip this conditional and let runtime handle it
+            let condition_result = match self.try_eval_condition(condition) {
+                Some(result) => result,
+                None => {
+                    // Can't evaluate (likely references iteration variables)
+                    // Skip and let runtime handle it
+                    search_pos = template_start;
+                    continue;
+                }
+            };
+
+            // Find matching <!-- /if -->
+            if let Some((end_pos, end_after)) = self.find_matching_conditional_end(&result, template_start) {
+                // Find <!-- else --> at the same depth level (not nested inside inner conditionals)
+                let else_pos = self.find_else_at_same_level(&result, template_start, end_pos);
 
-        for part in parts {
-            // Handle array access: items[0]
-            if let Some(bracket_pos) = part.find('[') {
-                let array_name = &part[..bracket_pos];
-                let index_str = &part[bracket_pos+1..part.len()-1];
-                let index: usize = index_str.parse().ok()?;
+                // Keep ALL markers (if/else/endif) regardless of which branch is taken
+                // This allows restoration to understand the structure
+                let if_comment = &result[start_pos..template_start];
 
-                current = current.get(array_name)?.get(index)?;
+                let replacement = if let Some(else_start) = else_pos {
+                    let else_match = else_comment.find_at(&result, else_start).unwrap();
+                    let else_marker = &result[else_match.start()..else_match.end()];
+
+                    if condition_result {
+                        // True branch: stamp if content, keep else empty
+                        let if_content = result[template_start..else_start].trim().to_string();
+                        format!("{}{}{}<!-- /if -->", if_comment, if_content, else_marker)
+                    } else {
+                        // False branch: keep if empty, stamp else content
+                        let else_end = else_match.end();
+                        let else_content = result[else_end..end_pos].trim().to_string();
+                        format!("{}{}{}<!-- /if -->", if_comment, else_marker, else_content)
+                    }
+                } else {
+                    // No else branch - only stamp if content was true, otherwise empty
+                    let content = if condition_result {
+                        result[template_start..end_pos].trim().to_string()
+                    } else {
+                        String::new()
+                    };
+                    format!("{}{}<!-- /if -->", if_comment, content)
+                };
+
+                // Replace entire conditional block
+                result.replace_range(start_pos..end_after, &replacement);
+
+                // Continue searching after replacement
+                search_pos = start_pos + replacement.len();
             } else {
-                current = current.get(part)?;
+                break;
             }
         }
 
-        Some(self.value_to_string(current))
+        Ok(result)
     }
 
-    fn value_to_string(&self, val: &Value) -> String {
-        match val {
-            Value::String(s) => s.clone(),
-            Value::Number(n) => n.to_string(),
-            Value::Bool(b) => b.to_string(),
-            Value::Null => String::new(),
-            Value::Array(_) | Value::Object(_) => val.to_string(),
+    fn find_matching_conditional_end(&self, html: &str, start_pos: usize) -> Option<(usize, usize)> {
+        let if_start = Regex::new(r"<!--\s*if\s+.+?\s*-->").unwrap();
+        let if_end = Regex::new(r"<!--\s*/if\s*-->").unwrap();
+
+        let mut depth = 1;
+        let mut search_pos = start_pos;
+
+        while depth > 0 {
+            let next_start = if_start.find_at(html, search_pos);
+            let next_end = if_end.find_at(html, search_pos);
+
+            match (next_start, next_end) {
+                (Some(start), Some(end)) if start.start() < end.start() => {
+                    depth += 1;
+                    search_pos = start.end();
+                }
+                (_, Some(end)) => {
+                    depth -= 1;
+                    if depth == 0 {
+                        return Some((end.start(), end.end()));
+                    }
+                    search_pos = end.end();
+                }
+                _ => return None,
+            }
         }
+
+        None
+    }
+
+    fn find_else_at_same_level(&self, html: &str, start_pos: usize, end_pos: usize) -> Option<usize> {
+        let if_start = Regex::new(r"<!--\s*if\s+.+?\s*-->").unwrap();
+        let if_end = Regex::new(r"<!--\s*/if\s*-->").unwrap();
+        let else_comment = Regex::new(r"<!--\s*else\s*-->").unwrap();
+
+        let mut depth = 0;
+        let mut search_pos = start_pos;
+
+        while search_pos < end_pos {
+            // Find the next comment (could be if, else, or /if)
+            let next_if = if_start.find_at(html, search_pos);
+            let next_else = else_comment.find_at(html, search_pos);
+            let next_end = if_end.find_at(html, search_pos);
+
+            // Determine which comment comes first
+            let mut next_pos = end_pos;
+            let mut next_type = None; // 0=if, 1=else, 2=end
+
+            if let Some(m) = next_if {
+                if m.start() < next_pos {
+                    next_pos = m.start();
+                    next_type = Some(0);
+                }
+            }
+            if let Some(m) = next_else {
+                if m.start() < next_pos {
+                    next_pos = m.start();
+                    next_type = Some(1);
+                }
+            }
+            if let Some(m) = next_end {
+                if m.start() < next_pos {
+                    next_pos = m.start();
+                    next_type = Some(2);
+                }
+            }
+
+            match next_type {
+                Some(0) => {
+                    // Found nested if - increase depth
+                    depth += 1;
+                    search_pos = next_if.unwrap().end();
+                }
+                Some(1) => {
+                    // Found else
+                    if depth == 0 {
+                        // This is the else at our level!
+                        return Some(next_pos);
+                    }
+                    search_pos = next_else.unwrap().end();
+                }
+                Some(2) => {
+                    // Found end - decrease depth
+                    depth -= 1;
+                    search_pos = next_end.unwrap().end();
+                }
+                None => {
+                    // No more comments found
+                    break;
+                }
+                _ => break,
+            }
+        }
+
+        None
+    }
+
+    fn try_eval_condition(&self, condition: &str) -> Option<bool> {
+        self.context.with(|ctx| -> Option<bool> {
+            // Try to evaluate condition
+            // If it fails (e.g., references undefined iteration variables), return None
+            let result: rquickjs::Value = ctx.eval(condition).ok()?;
+            result.as_bool()
+        })
+    }
+
+    /// Remove boolean-like attributes with falsy values, normalize truthy ones
+    /// Boolean-like attributes (not in VALUE_ATTRS) should be:
+    /// - Removed entirely when falsy
+    /// - Present with empty value when truthy (HTML5 boolean attribute syntax)
+    fn cleanup_boolean_attributes(&self, html: String, skip_regions: &[(usize, usize)]) -> String {
+        // Create a set for faster lookup
+        let value_attrs: HashSet<&str> = VALUE_ATTRS.iter().copied().collect();
+
+        // Match attributes with their values: attr="value"
+        let attr_regex = Regex::new(r#"\s+([\w-]+)="([^"]*)""#).unwrap();
+
+        attr_regex.replace_all(&html, |caps: &Captures| {
+            let match_start = caps.get(0).unwrap().start();
+            let match_end = caps.get(0).unwrap().end();
+
+            // Check if this attribute is inside a skip region
+            let in_skip_region = skip_regions.iter().any(|(start, end)| {
+                match_start >= *start && match_end <= *end
+            });
+
+            // If in skip region, keep attribute as-is
+            if in_skip_region {
+                return caps[0].to_string();
+            }
+
+            let attr_name = caps[1].to_lowercase();
+            let attr_value = &caps[2];
+
+            // Check if this is a value attribute (should keep its value)
+            // Includes: VALUE_ATTRS list + data-* + aria-* + on* (event handlers)
+            let is_value_attr = value_attrs.contains(attr_name.as_str())
+                || attr_name.starts_with("data-")
+                || attr_name.starts_with("aria-")
+                || attr_name.starts_with("on");
+
+            if is_value_attr {
+                // Keep value attributes as-is
+                return caps[0].to_string();
+            }
+
+            // Check if value is explicitly falsy
+            let is_falsy = matches!(
+                attr_value,
+                "false" | "0" | "null" | "undefined"
+            );
+
+            if is_falsy {
+                // Remove the entire attribute (return empty string)
+                String::new()
+            } else if attr_value.is_empty() {
+                // Convert boolean attributes with empty values to short form: `demo=""` -> `demo`
+                format!(" {}", &caps[1])
+            } else {
+                // Keep the attribute as-is
+                caps[0].to_string()
+            }
+        }).to_string()
     }
 }
 
@@ -132,7 +574,7 @@ mod tests {
     #[test]
     fn stamp_simple_binding() {
         let state = json!({ "name": "World" });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from("<div>Hello @[name]</div>");
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, "<div>Hello World</div>");
@@ -141,7 +583,7 @@ mod tests {
     #[test]
     fn stamp_multiple_bindings() {
         let state = json!({ "firstName": "John", "lastName": "Doe" });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from("<div>@[firstName] @[lastName]</div>");
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, "<div>John Doe</div>");
@@ -150,16 +592,25 @@ mod tests {
     #[test]
     fn stamp_nested_binding() {
         let state = json!({ "user": { "name": "John" } });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from("<div>Hello @[user.name]</div>");
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, "<div>Hello John</div>");
     }
 
+    #[test]
+    fn stamp_array_length() {
+        let state = json!({ "items": ["first", "second", "third"] });
+        let stamper = ValueStamper::new(&state, false).unwrap();
+        let html = String::from("<div>@[items.length]</div>");
+        let result = stamper.stamp_html(html).unwrap();
+        assert_eq!(result, "<div>3</div>");
+    }
+
     #[test]
     fn stamp_array_binding() {
         let state = json!({ "items": ["first", "second", "third"] });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from("<div>@[items[0]]</div>");
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, "<div>first</div>");
@@ -168,7 +619,7 @@ mod tests {
     #[test]
     fn stamp_number_binding() {
         let state = json!({ "count": 42 });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from("<div>Count: @[count]</div>");
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, "<div>Count: 42</div>");
@@ -177,7 +628,7 @@ mod tests {
     #[test]
     fn stamp_boolean_binding() {
         let state = json!({ "isActive": true });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from("<div>Active: @[isActive]</div>");
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, "<div>Active: true</div>");
@@ -186,7 +637,7 @@ mod tests {
     #[test]
     fn stamp_missing_binding() {
         let state = json!({ "name": "World" });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from("<div>Hello @[missing]</div>");
         let result = stamper.stamp_html(html).unwrap();
         // Should keep the binding marker if value doesn't exist
@@ -196,7 +647,7 @@ mod tests {
     #[test]
     fn stamp_attribute_binding() {
         let state = json!({ "firstName": "John" });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from(r#"<input value="@[firstName]">"#);
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, r#"<input value="John">"#);
@@ -205,7 +656,7 @@ mod tests {
     #[test]
     fn render_simple_iteration() {
         let state = json!({ "items": [1, 2, 3] });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from(r#"<!-- each items as item --><div>@[item]</div><!-- /each -->"#);
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, r#"<!-- each items as item --><div>1</div><div>2</div><div>3</div><!-- /each -->"#);
@@ -214,9 +665,49 @@ mod tests {
     #[test]
     fn render_iteration_with_index() {
         let state = json!({ "items": ["a", "b", "c"] });
-        let stamper = ValueStamper::new(&state);
+        let stamper = ValueStamper::new(&state, false).unwrap();
         let html = String::from(r#"<!-- each items as item, idx --><span>[@[idx]] @[item]</span><!-- /each -->"#);
         let result = stamper.stamp_html(html).unwrap();
         assert_eq!(result, r#"<!-- each items as item, idx --><span>[0] a</span><span>[1] b</span><span>[2] c</span><!-- /each -->"#);
     }
+
+    #[test]
+    fn cleanup_boolean_attributes_false() {
+        let state = json!({ "buttonDisabled": false });
+        let stamper = ValueStamper::new(&state, false).unwrap();
+        let html = String::from(r#"<button disabled="@[buttonDisabled]">Click</button>"#);
+        let result = stamper.stamp_html(html).unwrap();
+        // disabled="false" should be removed entirely (falsy boolean-like attribute)
+        assert_eq!(result, r#"<button>Click</button>"#);
+    }
+
+    #[test]
+    fn cleanup_boolean_attributes_true() {
+        let state = json!({ "buttonDisabled": true });
+        let stamper = ValueStamper::new(&state, false).unwrap();
+        let html = String::from(r#"<button disabled="@[buttonDisabled]">Click</button>"#);
+        let result = stamper.stamp_html(html).unwrap();
+        // disabled="true" should become disabled="" (HTML5 boolean attribute syntax)
+        assert_eq!(result, r#"<button disabled="">Click</button>"#);
+    }
+
+    #[test]
+    fn cleanup_keeps_value_attributes() {
+        let state = json!({ "inputValue": "false" });
+        let stamper = ValueStamper::new(&state, false).unwrap();
+        let html = String::from(r#"<input value="@[inputValue]">"#);
+        let result = stamper.stamp_html(html).unwrap();
+        // value="false" should be kept as-is (value attribute, not boolean-like)
+        assert_eq!(result, r#"<input value="false">"#);
+    }
+
+    #[test]
+    fn cleanup_multiple_boolean_attributes() {
+        let state = json!({ "disabled": false, "readonly": true, "required": false });
+        let stamper = ValueStamper::new(&state, false).unwrap();
+        let html = String::from(r#"<input disabled="@[disabled]" readonly="@[readonly]" required="@[required]">"#);
+        let result = stamper.stamp_html(html).unwrap();
+        // disabled and required should be removed, readonly should be present with empty value
+        assert_eq!(result, r#"<input readonly="">"#);
+    }
 }