@sprlab/wccompiler 0.5.4 → 0.5.6

package/lib/codegen.js

@@ -473,7 +473,7 @@ function generateItemSetup(lines, forBlock, itemVar, indexVar, propNames, signal
       lines.push(`${indent}    const __sp = { ${propsEntries} };`);
       lines.push(`${indent}    let __h = __slotEl.innerHTML;`);
       lines.push(`${indent}    for (const [k, v] of Object.entries(__sp)) {`);
-      lines.push(`${indent}      __h = __h.replace(new RegExp('\\\\{\\\\{\\\\s*' + k + '\\\\s*\\\\}\\\\}', 'g'), v ?? '');`);
+      lines.push(`${indent}      __h = __h.replace(new RegExp('\\\\{\\\\{\\\\s*' + k + '(\\\\(\\\\))?\\\\s*\\\\}\\\\}', 'g'), v ?? '');`);
       lines.push(`${indent}    }`);
       lines.push(`${indent}    __slotEl.innerHTML = __h;`);
       lines.push(`${indent}  }`);
@@ -788,7 +788,7 @@ export function generateComponent(parseResult, options = {}) {
       lines.push(`        const __props = { ${propsObj} };`);
       lines.push(`        let __html = this.__slotTpl_${s.name};`);
       lines.push("        for (const [k, v] of Object.entries(__props)) {");
-      lines.push(`          __html = __html.replace(new RegExp('\\\\{\\\\{\\\\s*' + k + '\\\\s*\\\\}\\\\}', 'g'), v ?? '');`);
+      lines.push(`          __html = __html.replace(new RegExp('\\\\{\\\\{\\\\s*' + k + '(\\\\(\\\\))?\\\\s*\\\\}\\\\}', 'g'), v ?? '');`);
       lines.push('        }');
       lines.push(`        this.${s.varName}.innerHTML = __html;`);
       lines.push('      });');

package/lib/sfc-parser.js

@@ -57,16 +57,59 @@ function findBlocks(source, blockName) {
   let m;
 
   while ((m = openRe.exec(source)) !== null) {
+    const attrs = m[1] || '';
+
+    // For template blocks: skip <template #name> (slot content, not SFC block)
+    if (blockName === 'template' && /#/.test(attrs)) {
+      continue;
+    }
+
     const openEnd = m.index + m[0].length;
-    const closeIdx = source.indexOf(closeTag, openEnd);
-    if (closeIdx === -1) continue; // unclosed tag — skip
-
-    matches.push({
-      content: source.slice(openEnd, closeIdx),
-      attrs: m[1] || '',
-      start: m.index,
-      end: closeIdx + closeTag.length,
-    });
+
+    // Use depth counting to find the matching close tag (handles nested <template #name>)
+    if (blockName === 'template') {
+      let depth = 1;
+      let searchPos = openEnd;
+      let closeIdx = -1;
+      const openTagRe = /<template[\s>]/g;
+      const closeTagStr = '</template>';
+
+      while (depth > 0 && searchPos < source.length) {
+        const nextClose = source.indexOf(closeTagStr, searchPos);
+        if (nextClose === -1) break;
+
+        // Check for any opening <template> between searchPos and nextClose
+        openTagRe.lastIndex = searchPos;
+        let openMatch;
+        while ((openMatch = openTagRe.exec(source)) !== null && openMatch.index < nextClose) {
+          depth++;
+        }
+
+        depth--; // for the </template> we found
+        if (depth === 0) {
+          closeIdx = nextClose;
+          break;
+        }
+        searchPos = nextClose + closeTagStr.length;
+      }
+
+      if (closeIdx === -1) continue;
+      matches.push({
+        content: source.slice(openEnd, closeIdx),
+        attrs,
+        start: m.index,
+        end: closeIdx + closeTag.length,
+      });
+    } else {
+      const closeIdx = source.indexOf(closeTag, openEnd);
+      if (closeIdx === -1) continue;
+      matches.push({
+        content: source.slice(openEnd, closeIdx),
+        attrs,
+        start: m.index,
+        end: closeIdx + closeTag.length,
+      });
+    }
   }
 
   return matches;

package/lib/tree-walker.js

@@ -74,6 +74,14 @@ export function walkTree(rootEl, signalNames, computedNames, propNames = new Set
     if (node.nodeType === 1) {
       const el = /** @type {Element} */ (node);
 
+      // Skip <template #name> elements — they are slot content passed to child components
+      // Their interpolations are resolved by the provider, not the consumer
+      if (el.tagName === 'TEMPLATE') {
+        for (const attr of Array.from(el.attributes)) {
+          if (attr.name.startsWith('#')) return;
+        }
+      }
+
       // Detect <slot> elements — replace with <span data-slot="..."> placeholder
       if (el.tagName === 'SLOT') {
         const slotName = el.getAttribute('name') || '';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sprlab/wccompiler",
-  "version": "0.5.4",
+  "version": "0.5.6",
   "description": "Zero-runtime compiler that transforms .wcc single-file components into native web components with signals-based reactivity",
   "type": "module",
   "bin": {