@collie-lang/compiler 1.0.0 → 2.0.0

package/dist/index.js

@@ -303,175 +303,149 @@ function escapeText(value) {
 }
 
 // src/html-codegen.ts
-function generateHtmlModule(root, options) {
+function generateHtml(root, options = {}) {
+  const indent = options.indent ?? "  ";
   const aliasEnv = buildClassAliasEnvironment2(root.classAliases);
-  const htmlExpression = emitNodesString(root.children, aliasEnv);
-  const propsType = emitJsDocPropsType2(root.props);
-  const propsDestructure = emitPropsDestructure2(root.props);
-  const parts = [];
-  if (root.clientComponent) {
-    parts.push(`"use client";`);
-  }
-  parts.push(...createHtmlHelpers());
-  parts.push(propsType);
-  parts.push(`/** @param {Props} props */`);
-  parts.push(`/** @returns {string} */`);
-  const lines = [`export default function ${options.componentName}(props = {}) {`];
-  if (propsDestructure) {
-    lines.push(`  ${propsDestructure}`);
-  }
-  lines.push(`  const __collie_html = ${htmlExpression};`);
-  lines.push("  return __collie_html;", "}");
-  parts.push(lines.join("\n"));
-  return parts.join("\n\n");
-}
-function emitNodesString(children, aliasEnv) {
-  if (children.length === 0) {
-    return '""';
+  const rendered = emitNodes(root.children, aliasEnv, indent, 0);
+  return rendered.trimEnd();
+}
+function emitNodes(children, aliasEnv, indent, depth) {
+  let html = "";
+  for (const child of children) {
+    const chunk = emitNode(child, aliasEnv, indent, depth);
+    if (chunk) {
+      html += chunk;
+    }
   }
-  const segments = children.map((child) => emitNodeString(child, aliasEnv)).filter(Boolean);
-  return concatSegments(segments);
+  return html;
 }
-function emitNodeString(node, aliasEnv) {
+function emitNode(node, aliasEnv, indent, depth) {
   switch (node.type) {
-    case "Text":
-      return emitTextNode(node);
-    case "Expression":
-      return `__collie_escapeHtml(${node.value})`;
-    case "JSXPassthrough":
-      return `String(${node.expression})`;
     case "Element":
-      return wrapWithGuard2(emitElement2(node, aliasEnv), node.guard);
-    case "Component":
-      return wrapWithGuard2(emitComponent2(node, aliasEnv), node.guard);
-    case "Conditional":
-      return emitConditional(node, aliasEnv);
-    case "For":
-      return emitFor(node, aliasEnv);
+      return emitElement2(node, aliasEnv, indent, depth);
+    case "Text":
+      return emitTextBlock(node, indent, depth);
     default:
-      return '""';
+      return "";
   }
 }
-function emitElement2(node, aliasEnv) {
-  const classSegments = expandClasses2(node.classes, aliasEnv);
-  const attributeSegments = emitAttributeSegments(node.attributes, classSegments);
-  const start = concatSegments([literal(`<${node.name}`), ...attributeSegments, literal(node.children.length > 0 ? ">" : " />")]);
+function emitElement2(node, aliasEnv, indent, depth) {
+  const indentText = indent.repeat(depth);
+  const classNames = expandClasses2(node.classes, aliasEnv);
+  const attrs = renderAttributes(node.attributes, classNames);
+  const openTag = `<${node.name}${attrs}>`;
   if (node.children.length === 0) {
-    return start;
-  }
-  const children = emitNodesString(node.children, aliasEnv);
-  const end = literal(`</${node.name}>`);
-  return concatSegments([start, children, end]);
-}
-function emitComponent2(node, aliasEnv) {
-  const attributeSegments = emitAttributeSegments(node.attributes, []);
-  const hasChildren = node.children.length > 0 || (node.slots?.length ?? 0) > 0;
-  const closingToken = hasChildren ? ">" : " />";
-  const start = concatSegments([literal(`<${node.name}`), ...attributeSegments, literal(closingToken)]);
-  if (!hasChildren) {
-    return start;
-  }
-  const childSegments = [];
-  if (node.children.length) {
-    childSegments.push(emitNodesString(node.children, aliasEnv));
+    return `${indentText}${openTag}</${node.name}>
+`;
+  }
+  if (node.children.length === 1 && node.children[0].type === "Text") {
+    const inline = emitInlineText(node.children[0]);
+    if (inline !== null) {
+      return `${indentText}${openTag}${inline}</${node.name}>
+`;
+    }
   }
-  for (const slot of node.slots ?? []) {
-    childSegments.push(emitSlotTemplate(slot, aliasEnv));
+  const children = emitNodes(node.children, aliasEnv, indent, depth + 1);
+  if (!children) {
+    return `${indentText}${openTag}</${node.name}>
+`;
   }
-  const children = concatSegments(childSegments);
-  const end = literal(`</${node.name}>`);
-  return concatSegments([start, children, end]);
-}
-function emitSlotTemplate(slot, aliasEnv) {
-  const start = literal(`<template slot="${slot.name}">`);
-  const body = emitNodesString(slot.children, aliasEnv);
-  const end = literal("</template>");
-  return concatSegments([start, body, end]);
+  return `${indentText}${openTag}
+${children}${indentText}</${node.name}>
+`;
 }
-function emitConditional(node, aliasEnv) {
-  if (node.branches.length === 0) {
-    return '""';
+function renderAttributes(attributes, classNames) {
+  const segments = [];
+  if (classNames.length) {
+    segments.push(`class="${escapeAttributeValue(classNames.join(" "))}"`);
   }
-  const first = node.branches[0];
-  if (node.branches.length === 1 && first.test) {
-    return `(${first.test}) ? ${emitBranch(first, aliasEnv)} : ""`;
+  for (const attr of attributes) {
+    if (attr.value === null) {
+      segments.push(attr.name);
+      continue;
+    }
+    const literal = extractStaticAttributeValue(attr.value);
+    if (literal === null) {
+      continue;
+    }
+    const name = attr.name === "className" ? "class" : attr.name;
+    segments.push(`${name}="${escapeAttributeValue(literal)}"`);
   }
-  const hasElse = node.branches[node.branches.length - 1].test === void 0;
-  let fallback = hasElse ? emitBranch(node.branches[node.branches.length - 1], aliasEnv) : '""';
-  const limit = hasElse ? node.branches.length - 2 : node.branches.length - 1;
-  for (let i = limit; i >= 0; i--) {
-    const branch = node.branches[i];
-    const test = branch.test ?? "false";
-    fallback = `(${test}) ? ${emitBranch(branch, aliasEnv)} : ${fallback}`;
+  if (!segments.length) {
+    return "";
   }
-  return fallback;
-}
-function emitBranch(branch, aliasEnv) {
-  return emitNodesString(branch.body, aliasEnv);
+  return " " + segments.join(" ");
 }
-function emitFor(node, aliasEnv) {
-  const body = emitNodesString(node.body, aliasEnv);
-  return `(${node.arrayExpr}).map((${node.itemName}) => ${body}).join("")`;
+function emitTextBlock(node, indent, depth) {
+  const inline = emitInlineText(node);
+  if (inline === null || inline.trim().length === 0) {
+    return "";
+  }
+  return `${indent.repeat(depth)}${inline}
+`;
 }
-function emitTextNode(node) {
+function emitInlineText(node) {
   if (!node.parts.length) {
-    return '""';
+    return "";
   }
-  const segments = node.parts.map((part) => {
-    if (part.type === "text") {
-      return literal(escapeStaticText(part.value));
+  let text = "";
+  for (const part of node.parts) {
+    if (part.type !== "text") {
+      return null;
     }
-    return `__collie_escapeHtml(${part.value})`;
-  });
-  return concatSegments(segments);
+    text += escapeStaticText(part.value);
+  }
+  return text;
 }
-function emitAttributeSegments(attributes, classNames) {
-  const segments = [];
-  if (classNames.length) {
-    segments.push(literal(` class="${classNames.join(" ")}"`));
+function extractStaticAttributeValue(raw) {
+  const trimmed = raw.trim();
+  if (trimmed.length < 2) {
+    return null;
   }
-  for (const attr of attributes) {
-    if (attr.value === null) {
-      segments.push(literal(` ${attr.name}`));
+  const quote = trimmed[0];
+  if (quote !== '"' && quote !== "'" || trimmed[trimmed.length - 1] !== quote) {
+    return null;
+  }
+  const body = trimmed.slice(1, -1);
+  let result = "";
+  let escaping = false;
+  for (const char of body) {
+    if (escaping) {
+      result += unescapeChar(char, quote);
+      escaping = false;
       continue;
     }
-    const expr = attributeExpression(attr.value);
-    segments.push(
-      [
-        "(() => {",
-        `  const __collie_attr = ${expr};`,
-        `  return __collie_attr == null ? "" : ${literal(` ${attr.name}="`)} + __collie_escapeAttr(__collie_attr) + ${literal(`"`)};`,
-        "})()"
-      ].join(" ")
-    );
-  }
-  return segments;
-}
-function attributeExpression(raw) {
-  const trimmed = raw.trim();
-  if (trimmed.startsWith("{") && trimmed.endsWith("}")) {
-    return trimmed.slice(1, -1).trim();
+    if (char === "\\") {
+      escaping = true;
+    } else {
+      result += char;
+    }
   }
-  return trimmed;
-}
-function wrapWithGuard2(rendered, guard) {
-  if (!guard) {
-    return rendered;
+  if (escaping) {
+    result += "\\";
   }
-  return `(${guard}) ? ${rendered} : ""`;
-}
-function literal(text) {
-  return JSON.stringify(text);
+  return result;
 }
-function concatSegments(segments) {
-  const filtered = segments.filter((segment) => segment && segment !== '""');
-  if (!filtered.length) {
-    return '""';
-  }
-  if (filtered.length === 1) {
-    return filtered[0];
+function unescapeChar(char, quote) {
+  switch (char) {
+    case "n":
+      return "\n";
+    case "r":
+      return "\r";
+    case "t":
+      return "	";
+    case "\\":
+      return "\\";
+    case '"':
+      return '"';
+    case "'":
+      return "'";
+    default:
+      if (char === quote) {
+        return quote;
+      }
+      return char;
   }
-  return filtered.join(" + ");
 }
 function buildClassAliasEnvironment2(decl) {
   const env = /* @__PURE__ */ new Map();
@@ -499,26 +473,6 @@ function expandClasses2(classes, aliasEnv) {
   }
   return result;
 }
-function emitJsDocPropsType2(props) {
-  if (!props) {
-    return "/** @typedef {any} Props */";
-  }
-  if (!props.fields.length) {
-    return "/** @typedef {{}} Props */";
-  }
-  const fields = props.fields.map((field) => {
-    const optional = field.optional ? "?" : "";
-    return `${field.name}${optional}: ${field.typeText}`;
-  }).join("; ");
-  return `/** @typedef {{ ${fields} }} Props */`;
-}
-function emitPropsDestructure2(props) {
-  if (!props || props.fields.length === 0) {
-    return null;
-  }
-  const names = props.fields.map((field) => field.name);
-  return `const { ${names.join(", ")} } = props;`;
-}
 function escapeStaticText(value) {
   return value.replace(/[&<>{}]/g, (char) => {
     switch (char) {
@@ -537,47 +491,21 @@ function escapeStaticText(value) {
     }
   });
 }
-function createHtmlHelpers() {
-  return [
-    "function __collie_escapeHtml(value) {",
-    "  if (value === null || value === undefined) {",
-    '    return "";',
-    "  }",
-    "  return String(value).replace(/[&<>]/g, __collie_escapeHtmlChar);",
-    "}",
-    "function __collie_escapeHtmlChar(char) {",
-    "  switch (char) {",
-    '    case "&":',
-    '      return "&amp;";',
-    '    case "<":',
-    '      return "&lt;";',
-    '    case ">":',
-    '      return "&gt;";',
-    "    default:",
-    "      return char;",
-    "  }",
-    "}",
-    "function __collie_escapeAttr(value) {",
-    "  if (value === null || value === undefined) {",
-    '    return "";',
-    "  }",
-    '  return String(value).replace(/["&<>]/g, __collie_escapeAttrChar);',
-    "}",
-    "function __collie_escapeAttrChar(char) {",
-    "  switch (char) {",
-    '    case "&":',
-    '      return "&amp;";',
-    '    case "<":',
-    '      return "&lt;";',
-    '    case ">":',
-    '      return "&gt;";',
-    `    case '"':`,
-    '      return "&quot;";',
-    "    default:",
-    "      return char;",
-    "  }",
-    "}"
-  ];
+function escapeAttributeValue(value) {
+  return value.replace(/["&<>]/g, (char) => {
+    switch (char) {
+      case "&":
+        return "&amp;";
+      case "<":
+        return "&lt;";
+      case ">":
+        return "&gt;";
+      case '"':
+        return "&quot;";
+      default:
+        return char;
+    }
+  });
 }
 
 // src/diagnostics.ts
@@ -1938,10 +1866,9 @@ function compileToTsx(sourceOrAst, options = {}) {
 function compileToHtml(sourceOrAst, options = {}) {
   const document = normalizeDocument(sourceOrAst, options.filename);
   const diagnostics = options.filename ? attachFilename(document.diagnostics, options.filename) : document.diagnostics;
-  const componentName = options.componentNameHint ?? "CollieTemplate";
-  let code = createStubHtml(componentName);
+  let code = createStubHtml();
   if (!hasErrors(diagnostics)) {
-    code = generateHtmlModule(document.root, { componentName });
+    code = generateHtml(document.root);
   }
   return { code, diagnostics, map: void 0 };
 }
@@ -1983,8 +1910,8 @@ function createStubComponent(name, flavor) {
   }
   return [`export default function ${name}(props) {`, "  return null;", "}"].join("\n");
 }
-function createStubHtml(name) {
-  return [`export default function ${name}(props = {}) {`, '  return "";', "}"].join("\n");
+function createStubHtml() {
+  return "";
 }
 function attachFilename(diagnostics, filename) {
   if (!filename) {