@torpor/view 0.0.13 → 0.0.14

package/dist/compile.js

@@ -177,6 +177,7 @@ function buildComponentFragmentText(node, status, fragments, currentFragment) {
   }
 }
 function buildElementFragmentText(node, status, fragments, currentFragment) {
+  let needsClass = node.scopeStyles;
   currentFragment.text += `<${node.tagName}`;
   let attributesText = node.attributes.filter((a) => !a.name.startsWith("on") && !a.name.includes(":")).map((a) => {
     if (a.value && isReactive(a.value) && !a.name.includes(":")) {
@@ -184,6 +185,7 @@ function buildElementFragmentText(node, status, fragments, currentFragment) {
         return `${a.name}=""`;
       }
     } else if (a.name === "class" && node.scopeStyles) {
+      needsClass = false;
       let value = a.value ? `"${trimQuotes(a.value)} torp-${status.styleHash}"` : `"torp-${status.styleHash}"`;
       return `${a.name}=${value}`;
     } else {
@@ -193,6 +195,9 @@ function buildElementFragmentText(node, status, fragments, currentFragment) {
   if (attributesText) {
     currentFragment.text += " " + attributesText;
   }
+  if (needsClass) {
+    currentFragment.text += ` class="torp-${status.styleHash}"`;
+  }
   currentFragment.text += ">";
   for (let child of node.children) {
     buildNodeFragmentText(child, status, fragments, currentFragment);
@@ -2386,6 +2391,7 @@ function buildServerElementNode(node, status, b) {
   }
 }
 function buildElementAttributes2(node, status) {
+  let needsClass = node.scopeStyles;
   let attributes = [];
   for (let { name, value } of node.attributes) {
     if (name === "self" && node.tagName === ":element") {
@@ -2434,6 +2440,7 @@ function buildElementAttributes2(node, status) {
         status.imports.add("t_class");
         if (node.scopeStyles) {
           value += `, "torp-${status.styleHash}"`;
+          needsClass = false;
         }
         attributes.push(`class="\${t_class(${value})}"`);
       } else if (name === ":style") {
@@ -2451,12 +2458,16 @@ function buildElementAttributes2(node, status) {
     } else if (name === "class" && node.scopeStyles) {
       value = value ? `"${trimQuotes(value)} torp-${status.styleHash}"` : `"torp-${status.styleHash}"`;
       attributes.push(`${name}="${trimQuotes(value).replaceAll('"', "&quot;")}"`);
+      needsClass = false;
     } else if (value != null) {
       attributes.push(`${name}="${trimQuotes(value).replaceAll('"', "&quot;")}"`);
     } else {
       attributes.push(`${name}`);
     }
   }
+  if (needsClass) {
+    attributes.push(`class="torp-${status.styleHash}"`);
+  }
   return attributes.join(" ");
 }
 
@@ -2693,6 +2704,9 @@ function buildServerTemplate(template, imports, b, options) {
       marker = i + "/* @params */".length;
     } else if (script.substring(i, i + "/* @start */".length) === "/* @start */") {
       b.append(script.substring(marker, i));
+      if (current.props?.length) {
+        b.append(`$props ??= {};`);
+      }
       if (current.contextProps?.length) {
         b.append(`$context = Object.assign({}, $context);`);
       }