@esportsplus/template 0.38.1 → 0.39.0

package/build/compiler/codegen.d.ts

@@ -6,6 +6,7 @@ type CodegenResult = {
     replacements: ReplacementIntent[];
     templates: Map<string, string>;
 };
+declare let printer: ts.Printer;
 declare const generateCode: (templates: TemplateInfo[], sourceFile: ts.SourceFile, checker?: ts.TypeChecker) => CodegenResult;
-export { generateCode };
+export { generateCode, printer };
 export type { CodegenResult };

package/build/compiler/codegen.js

@@ -1,29 +1,10 @@
 import { ts } from '@esportsplus/typescript';
 import { ast, uid } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_NAMESPACE, COMPILER_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS } from '../constants.js';
-import { analyze } from './analyzer.js';
+import { extractTemplateParts } from './ts-parser.js';
+import { analyze } from './ts-analyzer.js';
 import parser from './parser.js';
-const ARROW_EMPTY_PARAMS = /\(\s*\)\s*=>\s*$/;
 let printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
-function collectNestedReplacements(ctx, node, exprStart, replacements) {
-    if (isNestedHtmlTemplate(node)) {
-        replacements.push({
-            end: node.end - exprStart,
-            newText: generateNestedTemplateCode(ctx, node),
-            start: node.getStart(ctx.sourceFile) - exprStart
-        });
-    }
-    else if (isReactiveCall(node)) {
-        replacements.push({
-            end: node.end - exprStart,
-            newText: rewriteReactiveCall(ctx, node),
-            start: node.getStart(ctx.sourceFile) - exprStart
-        });
-    }
-    else {
-        ts.forEachChild(node, child => collectNestedReplacements(ctx, child, exprStart, replacements));
-    }
-}
 function generateAttributeBinding(element, name, expr, staticValue) {
     if (name.startsWith('on') && name.length > 2) {
         let event = name.slice(2).toLowerCase(), key = name.toLowerCase();
@@ -44,20 +25,11 @@ function generateAttributeBinding(element, name, expr, staticValue) {
     return `${COMPILER_NAMESPACE}.setProperty(${element}, '${name}', ${expr});`;
 }
 function generateNestedTemplateCode(ctx, node) {
-    let expressions = [], exprTexts = [], literals = [], template = node.template;
-    if (ts.isNoSubstitutionTemplateLiteral(template)) {
-        literals.push(template.text);
-    }
-    else if (ts.isTemplateExpression(template)) {
-        literals.push(template.head.text);
-        for (let i = 0, n = template.templateSpans.length; i < n; i++) {
-            let expr = template.templateSpans[i].expression;
-            expressions.push(expr);
-            literals.push(template.templateSpans[i].literal.text);
-            exprTexts.push(rewriteExpression(ctx, expr));
-        }
+    let { expressions, literals } = extractTemplateParts(node.template), exprTexts = [];
+    for (let i = 0, n = expressions.length; i < n; i++) {
+        exprTexts.push(rewriteExpression(ctx, expressions[i]));
     }
-    return generateTemplateCode(ctx, parser.parse(literals), exprTexts, expressions, false);
+    return generateTemplateCode(ctx, parser.parse(literals), exprTexts, expressions, node);
 }
 function generateNodeBinding(ctx, anchor, exprText, exprNode) {
     if (!exprNode) {
@@ -66,8 +38,7 @@ function generateNodeBinding(ctx, anchor, exprText, exprNode) {
     if (isNestedHtmlTemplate(exprNode)) {
         return `${anchor}.parentNode!.insertBefore(${generateNestedTemplateCode(ctx, exprNode)}, ${anchor});`;
     }
-    let slotType = analyze(exprNode, ctx.checker);
-    switch (slotType) {
+    switch (analyze(exprNode, ctx.checker)) {
         case COMPILER_TYPES.ArraySlot:
             return `${anchor}.parentNode!.insertBefore(new ${COMPILER_NAMESPACE}.ArraySlot(${exprText}).fragment, ${anchor});`;
         case COMPILER_TYPES.DocumentFragment:
@@ -80,11 +51,11 @@ function generateNodeBinding(ctx, anchor, exprText, exprNode) {
             return `${COMPILER_NAMESPACE}.slot(${anchor}, ${exprText});`;
     }
 }
-function generateTemplateCode(ctx, { html, slots }, exprTexts, exprNodes, isArrowBody) {
+function generateTemplateCode(ctx, { html, slots }, exprTexts, exprNodes, templateNode) {
     if (!slots || slots.length === 0) {
         return `${getOrCreateTemplateId(ctx, html)}()`;
     }
-    let code = [], declarations = [], index = 0, nodes = new Map(), root = uid('root');
+    let code = [], declarations = [], index = 0, isArrowBody = isArrowExpressionBody(templateNode), nodes = new Map(), root = uid('root');
     declarations.push(`${root} = ${getOrCreateTemplateId(ctx, html)}()`);
     nodes.set('', root);
     for (let i = 0, n = slots.length; i < n; i++) {
@@ -150,6 +121,9 @@ function getOrCreateTemplateId(ctx, html) {
 function isNestedHtmlTemplate(expr) {
     return ts.isTaggedTemplateExpression(expr) && ts.isIdentifier(expr.tag) && expr.tag.text === COMPILER_ENTRYPOINT;
 }
+function isArrowExpressionBody(node) {
+    return ts.isArrowFunction(node.parent) && node.parent.body === node;
+}
 function isReactiveCall(expr) {
     return (ts.isCallExpression(expr) &&
         ts.isPropertyAccessExpression(expr.expression) &&
@@ -157,69 +131,104 @@ function isReactiveCall(expr) {
         expr.expression.expression.text === COMPILER_ENTRYPOINT &&
         expr.expression.name.text === COMPILER_ENTRYPOINT_REACTIVITY);
 }
-function replaceReverse(text, replacements) {
-    let sorted = replacements.slice().sort((a, b) => b.start - a.start);
-    for (let i = 0, n = sorted.length; i < n; i++) {
-        let r = sorted[i];
-        text = text.slice(0, r.start) + r.newText + text.slice(r.end);
-    }
-    return text;
-}
 function rewriteExpression(ctx, expr) {
     if (isNestedHtmlTemplate(expr)) {
         return generateNestedTemplateCode(ctx, expr);
     }
     if (isReactiveCall(expr)) {
-        return rewriteReactiveCall(ctx, expr);
+        return `
+            ${printer.printNode(ts.EmitHint.Expression, expr.arguments[0], ctx.sourceFile)},
+            ${rewriteExpression(ctx, expr.arguments[1])}
+        `;
     }
     if (!ast.hasMatch(expr, n => isNestedHtmlTemplate(n) || isReactiveCall(n))) {
-        return ctx.printer.printNode(ts.EmitHint.Expression, expr, ctx.sourceFile);
+        return printer.printNode(ts.EmitHint.Expression, expr, ctx.sourceFile);
     }
-    let replacements = [];
-    collectNestedReplacements(ctx, expr, expr.getStart(ctx.sourceFile), replacements);
-    return replaceReverse(expr.getText(ctx.sourceFile), replacements);
-}
-function rewriteReactiveCall(ctx, node) {
-    let arrayArg = node.arguments[0], arrayText = ctx.printer.printNode(ts.EmitHint.Expression, arrayArg, ctx.sourceFile), callbackArg = node.arguments[1], callbackText = rewriteExpression(ctx, callbackArg);
-    return `${arrayText}, ${callbackText}`;
+    return walkExpression(ctx, expr);
 }
-function discoverTemplatesInExpression(ctx, node) {
+function walkExpression(ctx, node) {
     if (isNestedHtmlTemplate(node)) {
-        let template = node, expressions = [], literals = [], tpl = template.template;
-        if (ts.isNoSubstitutionTemplateLiteral(tpl)) {
-            literals.push(tpl.text);
-        }
-        else if (ts.isTemplateExpression(tpl)) {
-            literals.push(tpl.head.text);
-            for (let i = 0, n = tpl.templateSpans.length; i < n; i++) {
-                expressions.push(tpl.templateSpans[i].expression);
-                literals.push(tpl.templateSpans[i].literal.text);
-            }
+        return generateNestedTemplateCode(ctx, node);
+    }
+    if (isReactiveCall(node)) {
+        let call = node;
+        return `new ${COMPILER_NAMESPACE}.ArraySlot(${printer.printNode(ts.EmitHint.Expression, call.arguments[0], ctx.sourceFile)}, ${rewriteExpression(ctx, call.arguments[1])})`;
+    }
+    if (!ast.hasMatch(node, n => isNestedHtmlTemplate(n) || isReactiveCall(n))) {
+        return printer.printNode(ts.EmitHint.Expression, node, ctx.sourceFile);
+    }
+    if (ts.isConditionalExpression(node)) {
+        return `${walkExpression(ctx, node.condition)} ? ${walkExpression(ctx, node.whenTrue)} : ${walkExpression(ctx, node.whenFalse)}`;
+    }
+    if (ts.isBinaryExpression(node)) {
+        return `${walkExpression(ctx, node.left)} ${node.operatorToken.getText(ctx.sourceFile)} ${walkExpression(ctx, node.right)}`;
+    }
+    if (ts.isCallExpression(node)) {
+        let args = [];
+        for (let i = 0, n = node.arguments.length; i < n; i++) {
+            args.push(walkExpression(ctx, node.arguments[i]));
         }
-        let parsed = parser.parse(literals);
-        getOrCreateTemplateId(ctx, parsed.html);
-        for (let i = 0, n = expressions.length; i < n; i++) {
-            discoverTemplatesInExpression(ctx, expressions[i]);
+        return `${walkExpression(ctx, node.expression)}(${args.join(', ')})`;
+    }
+    if (ts.isPropertyAccessExpression(node)) {
+        return `${walkExpression(ctx, node.expression)}.${node.name.text}`;
+    }
+    if (ts.isElementAccessExpression(node)) {
+        return `${walkExpression(ctx, node.expression)}[${walkExpression(ctx, node.argumentExpression)}]`;
+    }
+    if (ts.isParenthesizedExpression(node)) {
+        return `(${walkExpression(ctx, node.expression)})`;
+    }
+    if (ts.isArrowFunction(node)) {
+        return `(${node.parameters.map(p => p.getText(ctx.sourceFile)).join(', ')}) => ${ts.isBlock(node.body) ? node.body.getText(ctx.sourceFile) : walkExpression(ctx, node.body)}`;
+    }
+    if (ts.isArrayLiteralExpression(node)) {
+        let elements = [];
+        for (let i = 0, n = node.elements.length; i < n; i++) {
+            elements.push(walkExpression(ctx, node.elements[i]));
         }
+        return `[${elements.join(', ')}]`;
     }
-    else if (isReactiveCall(node)) {
-        let call = node;
-        if (call.arguments.length >= 2) {
-            discoverTemplatesInExpression(ctx, call.arguments[1]);
+    if (ts.isObjectLiteralExpression(node)) {
+        let properties = [];
+        for (let i = 0, n = node.properties.length; i < n; i++) {
+            let prop = node.properties[i];
+            if (ts.isPropertyAssignment(prop)) {
+                properties.push(`${prop.name.getText(ctx.sourceFile)}: ${walkExpression(ctx, prop.initializer)}`);
+            }
+            else if (ts.isShorthandPropertyAssignment(prop)) {
+                properties.push(prop.name.text);
+            }
+            else if (ts.isSpreadAssignment(prop)) {
+                properties.push(`...${walkExpression(ctx, prop.expression)}`);
+            }
+            else {
+                properties.push(prop.getText(ctx.sourceFile));
+            }
         }
+        return `{ ${properties.join(', ')} }`;
     }
-    else {
-        ts.forEachChild(node, child => discoverTemplatesInExpression(ctx, child));
+    if (ts.isPrefixUnaryExpression(node)) {
+        return `${ts.tokenToString(node.operator)}${walkExpression(ctx, node.operand)}`;
     }
-}
-function discoverAllTemplates(ctx, templates) {
-    for (let i = 0, n = templates.length; i < n; i++) {
-        let parsed = parser.parse(templates[i].literals);
-        getOrCreateTemplateId(ctx, parsed.html);
-        for (let j = 0, m = templates[i].expressions.length; j < m; j++) {
-            discoverTemplatesInExpression(ctx, templates[i].expressions[j]);
+    if (ts.isPostfixUnaryExpression(node)) {
+        return `${walkExpression(ctx, node.operand)}${ts.tokenToString(node.operator)}`;
+    }
+    if (ts.isTemplateExpression(node)) {
+        let parts = [node.head.text];
+        for (let i = 0, n = node.templateSpans.length; i < n; i++) {
+            let span = node.templateSpans[i];
+            parts.push('${' + walkExpression(ctx, span.expression) + '}' + span.literal.text);
         }
+        return '`' + parts.join('') + '`';
+    }
+    if (ts.isAsExpression(node) || ts.isTypeAssertionExpression(node)) {
+        return walkExpression(ctx, node.expression);
+    }
+    if (ts.isNonNullExpression(node)) {
+        return `${walkExpression(ctx, node.expression)}!`;
     }
+    return printer.printNode(ts.EmitHint.Expression, node, ctx.sourceFile);
 }
 const generateCode = (templates, sourceFile, checker) => {
     let result = {
@@ -243,7 +252,6 @@ const generateCode = (templates, sourceFile, checker) => {
     }
     let ctx = {
         checker,
-        printer,
         sourceFile,
         templates: result.templates
     };
@@ -251,30 +259,27 @@ const generateCode = (templates, sourceFile, checker) => {
         let template = rootTemplates[i];
         result.replacements.push({
             generate: (sf) => {
-                let codeBefore = sf.getFullText().slice(0, template.node.getStart(sf)), exprTexts = [], isArrowBody = codeBefore.trimEnd().endsWith('=>'), localCtx = {
+                let exprTexts = [], localCtx = {
                     checker,
-                    printer,
                     sourceFile: sf,
                     templates: ctx.templates
                 }, parsed = parser.parse(template.literals);
                 for (let j = 0, m = template.expressions.length; j < m; j++) {
                     exprTexts.push(rewriteExpression(localCtx, template.expressions[j]));
                 }
-                if (isArrowBody && (!parsed.slots || parsed.slots.length === 0)) {
-                    let arrowMatch = codeBefore.match(ARROW_EMPTY_PARAMS);
-                    if (arrowMatch) {
-                        return getOrCreateTemplateId(localCtx, parsed.html);
-                    }
+                if (isArrowExpressionBody(template.node) &&
+                    template.node.parent.parameters.length === 0 &&
+                    (!parsed.slots || parsed.slots.length === 0)) {
+                    return getOrCreateTemplateId(localCtx, parsed.html);
                 }
-                return generateTemplateCode(localCtx, parsed, exprTexts, template.expressions, isArrowBody);
+                return generateTemplateCode(localCtx, parsed, exprTexts, template.expressions, template.node);
             },
             node: template.node
         });
     }
-    discoverAllTemplates(ctx, templates);
     for (let [html, id] of ctx.templates) {
         result.prepend.push(`const ${id} = ${COMPILER_NAMESPACE}.template(\`${html}\`);`);
     }
     return result;
 };
-export { generateCode };
+export { generateCode, printer };

package/build/compiler/index.js

@@ -1,29 +1,17 @@
 import { ts } from '@esportsplus/typescript';
+import { ast } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_NAMESPACE, PACKAGE } from '../constants.js';
-import { generateCode } from './codegen.js';
+import { generateCode, printer } from './codegen.js';
 import { findHtmlTemplates, findReactiveCalls } from './ts-parser.js';
-const PATTERNS = [
-    `${COMPILER_ENTRYPOINT}\``,
-    `${COMPILER_ENTRYPOINT}.${COMPILER_ENTRYPOINT_REACTIVITY}`
-];
-function isInRange(ranges, start, end) {
-    for (let i = 0, n = ranges.length; i < n; i++) {
-        let range = ranges[i];
-        if (start >= range.start && end <= range.end) {
-            return true;
-        }
-    }
-    return false;
-}
-let printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
 const plugin = {
-    patterns: PATTERNS,
+    patterns: [
+        `${COMPILER_ENTRYPOINT}\``,
+        `${COMPILER_ENTRYPOINT}.${COMPILER_ENTRYPOINT_REACTIVITY}`
+    ],
     transform: (ctx) => {
-        let importsIntent = [], prepend = [], replacements = [], removeImports = [];
-        let templates = findHtmlTemplates(ctx.sourceFile, ctx.checker);
-        let templateRanges = [];
+        let importsIntent = [], prepend = [], ranges = [], replacements = [], removeImports = [], templates = findHtmlTemplates(ctx.sourceFile, ctx.checker);
         for (let i = 0, n = templates.length; i < n; i++) {
-            templateRanges.push({
+            ranges.push({
                 end: templates[i].end,
                 start: templates[i].start
             });
@@ -31,11 +19,14 @@ const plugin = {
         let reactiveCalls = findReactiveCalls(ctx.sourceFile, ctx.checker);
         for (let i = 0, n = reactiveCalls.length; i < n; i++) {
             let call = reactiveCalls[i];
-            if (isInRange(templateRanges, call.start, call.end)) {
+            if (ast.inRange(ranges, call.start, call.end)) {
                 continue;
             }
             replacements.push({
-                generate: (sourceFile) => `new ${COMPILER_NAMESPACE}.ArraySlot(${printer.printNode(ts.EmitHint.Expression, call.arrayArg, sourceFile)}, ${printer.printNode(ts.EmitHint.Expression, call.callbackArg, sourceFile)})`,
+                generate: (sourceFile) => `new ${COMPILER_NAMESPACE}.ArraySlot(
+                    ${printer.printNode(ts.EmitHint.Expression, call.arrayArg, sourceFile)},
+                    ${printer.printNode(ts.EmitHint.Expression, call.callbackArg, sourceFile)}
+                )`,
                 node: call.node
             });
         }

package/build/compiler/{analyzer.js → ts-analyzer.js}

@@ -57,8 +57,7 @@ const analyze = (expr, checker) => {
                 return COMPILER_TYPES.Effect;
             }
         }
-        catch {
-        }
+        catch { }
     }
     return COMPILER_TYPES.Unknown;
 };

package/build/compiler/ts-parser.d.ts

@@ -14,7 +14,11 @@ type TemplateInfo = {
     node: ts.TaggedTemplateExpression;
     start: number;
 };
+declare const extractTemplateParts: (template: ts.TemplateLiteral) => {
+    expressions: ts.Expression[];
+    literals: string[];
+};
 declare const findHtmlTemplates: (sourceFile: ts.SourceFile, checker?: ts.TypeChecker) => TemplateInfo[];
 declare const findReactiveCalls: (sourceFile: ts.SourceFile, checker?: ts.TypeChecker) => ReactiveCallInfo[];
-export { findHtmlTemplates, findReactiveCalls };
+export { extractTemplateParts, findHtmlTemplates, findReactiveCalls };
 export type { ReactiveCallInfo, TemplateInfo };

package/build/compiler/ts-parser.js

@@ -1,38 +1,14 @@
 import { ts } from '@esportsplus/typescript';
+import { imports } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, PACKAGE } from '../constants.js';
-function isHtmlFromPackage(node, checker) {
-    if (node.text !== COMPILER_ENTRYPOINT) {
-        return false;
-    }
-    if (!checker) {
-        return true;
-    }
-    let symbol = checker.getSymbolAtLocation(node);
-    if (!symbol) {
-        return true;
-    }
-    if (symbol.flags & ts.SymbolFlags.Alias) {
-        symbol = checker.getAliasedSymbol(symbol);
-    }
-    let declarations = symbol.getDeclarations();
-    if (!declarations || declarations.length === 0) {
-        return true;
-    }
-    for (let i = 0, n = declarations.length; i < n; i++) {
-        let filename = declarations[i].getSourceFile().fileName;
-        if (filename.includes(PACKAGE) || filename.includes('@esportsplus/template')) {
-            return true;
-        }
-    }
-    return false;
-}
 function visitReactiveCalls(node, calls, checker) {
     if (ts.isCallExpression(node) &&
         ts.isPropertyAccessExpression(node.expression) &&
         ts.isIdentifier(node.expression.expression) &&
         node.expression.name.text === COMPILER_ENTRYPOINT_REACTIVITY &&
         node.arguments.length === 2 &&
-        isHtmlFromPackage(node.expression.expression, checker)) {
+        node.expression.expression.text === COMPILER_ENTRYPOINT &&
+        (!checker || imports.inPackage(checker, node.expression.expression, PACKAGE, COMPILER_ENTRYPOINT))) {
         calls.push({
             arrayArg: node.arguments[0],
             callbackArg: node.arguments[1],
@@ -47,19 +23,11 @@ function visitTemplates(node, depth, templates, checker) {
     let nextDepth = (ts.isArrowFunction(node) || ts.isFunctionDeclaration(node) || ts.isFunctionExpression(node) || ts.isMethodDeclaration(node))
         ? depth + 1
         : depth;
-    if (ts.isTaggedTemplateExpression(node) && ts.isIdentifier(node.tag) && isHtmlFromPackage(node.tag, checker)) {
-        let expressions = [], literals = [], template = node.template;
-        if (ts.isNoSubstitutionTemplateLiteral(template)) {
-            literals.push(template.text);
-        }
-        else if (ts.isTemplateExpression(template)) {
-            literals.push(template.head.text);
-            for (let i = 0, n = template.templateSpans.length; i < n; i++) {
-                let span = template.templateSpans[i];
-                expressions.push(span.expression);
-                literals.push(span.literal.text);
-            }
-        }
+    if (ts.isTaggedTemplateExpression(node) &&
+        ts.isIdentifier(node.tag) &&
+        node.tag.text === COMPILER_ENTRYPOINT &&
+        (!checker || imports.inPackage(checker, node.tag, PACKAGE, COMPILER_ENTRYPOINT))) {
+        let { expressions, literals } = extractTemplateParts(node.template);
         templates.push({
             depth,
             end: node.end,
@@ -71,15 +39,29 @@ function visitTemplates(node, depth, templates, checker) {
     }
     ts.forEachChild(node, child => visitTemplates(child, nextDepth, templates, checker));
 }
+const extractTemplateParts = (template) => {
+    let expressions = [], literals = [];
+    if (ts.isNoSubstitutionTemplateLiteral(template)) {
+        literals.push(template.text);
+    }
+    else if (ts.isTemplateExpression(template)) {
+        literals.push(template.head.text);
+        for (let i = 0, n = template.templateSpans.length; i < n; i++) {
+            let span = template.templateSpans[i];
+            expressions.push(span.expression);
+            literals.push(span.literal.text);
+        }
+    }
+    return { expressions, literals };
+};
 const findHtmlTemplates = (sourceFile, checker) => {
     let templates = [];
     visitTemplates(sourceFile, 0, templates, checker);
-    templates.sort((a, b) => a.depth !== b.depth ? b.depth - a.depth : a.start - b.start);
-    return templates;
+    return templates.sort((a, b) => a.depth !== b.depth ? b.depth - a.depth : a.start - b.start);
 };
 const findReactiveCalls = (sourceFile, checker) => {
     let calls = [];
     visitReactiveCalls(sourceFile, calls, checker);
     return calls;
 };
-export { findHtmlTemplates, findReactiveCalls };
+export { extractTemplateParts, findHtmlTemplates, findReactiveCalls };

package/package.json

@@ -2,8 +2,8 @@
   "author": "ICJR",
   "dependencies": {
     "@esportsplus/queue": "^0.2.0",
-    "@esportsplus/reactivity": "^0.28.1",
-    "@esportsplus/typescript": "^0.25.0",
+    "@esportsplus/reactivity": "^0.29.1",
+    "@esportsplus/typescript": "^0.26.0",
     "@esportsplus/utilities": "^0.27.2",
     "serve": "^14.2.5"
   },
@@ -35,7 +35,7 @@
   },
   "type": "module",
   "types": "./build/index.d.ts",
-  "version": "0.38.1",
+  "version": "0.39.0",
   "scripts": {
     "build": "tsc",
     "build:test": "vite build --config test/vite.config.ts",

package/src/compiler/codegen.ts

@@ -2,8 +2,9 @@ import type { ReplacementIntent } from '@esportsplus/typescript/compiler';
 import { ts } from '@esportsplus/typescript';
 import { ast, uid } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_NAMESPACE, COMPILER_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS } from '~/constants';
+import { extractTemplateParts } from './ts-parser';
 import type { TemplateInfo } from './ts-parser';
-import { analyze } from './analyzer';
+import { analyze } from './ts-analyzer';
 import parser from './parser';
 
 
@@ -18,7 +19,6 @@ type Attribute = {
 
 type CodegenContext = {
     checker?: ts.TypeChecker;
-    printer: ts.Printer;
     sourceFile: ts.SourceFile;
     templates: Map<string, string>;
 };
@@ -39,44 +39,10 @@ type ParseResult = {
     slots: (Attribute | Node)[] | null;
 };
 
-type Replacement = {
-    end: number;
-    newText: string;
-    start: number;
-};
-
-
-const ARROW_EMPTY_PARAMS = /\(\s*\)\s*=>\s*$/;
-
 
 let printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
 
 
-function collectNestedReplacements(
-    ctx: CodegenContext,
-    node: ts.Node,
-    exprStart: number,
-    replacements: Replacement[]
-): void {
-    if (isNestedHtmlTemplate(node as ts.Expression)) {
-        replacements.push({
-            end: node.end - exprStart,
-            newText: generateNestedTemplateCode(ctx, node as ts.TaggedTemplateExpression),
-            start: node.getStart(ctx.sourceFile) - exprStart
-        });
-    }
-    else if (isReactiveCall(node as ts.Expression)) {
-        replacements.push({
-            end: node.end - exprStart,
-            newText: rewriteReactiveCall(ctx, node as ts.CallExpression),
-            start: node.getStart(ctx.sourceFile) - exprStart
-        });
-    }
-    else {
-        ts.forEachChild(node, child => collectNestedReplacements(ctx, child, exprStart, replacements));
-    }
-}
-
 function generateAttributeBinding(element: string, name: string, expr: string, staticValue: string): string {
     if (name.startsWith('on') && name.length > 2) {
         let event = name.slice(2).toLowerCase(),
@@ -105,24 +71,11 @@ function generateAttributeBinding(element: string, name: string, expr: string, s
 }
 
 function generateNestedTemplateCode(ctx: CodegenContext, node: ts.TaggedTemplateExpression): string {
-    let expressions: ts.Expression[] = [],
-        exprTexts: string[] = [],
-        literals: string[] = [],
-        template = node.template;
+    let { expressions, literals } = extractTemplateParts(node.template),
+        exprTexts: string[] = [];
 
-    if (ts.isNoSubstitutionTemplateLiteral(template)) {
-        literals.push(template.text);
-    }
-    else if (ts.isTemplateExpression(template)) {
-        literals.push(template.head.text);
-
-        for (let i = 0, n = template.templateSpans.length; i < n; i++) {
-            let expr = template.templateSpans[i].expression;
-
-            expressions.push(expr);
-            literals.push(template.templateSpans[i].literal.text);
-            exprTexts.push(rewriteExpression(ctx, expr));
-        }
+    for (let i = 0, n = expressions.length; i < n; i++) {
+        exprTexts.push(rewriteExpression(ctx, expressions[i]));
     }
 
     return generateTemplateCode(
@@ -130,7 +83,7 @@ function generateNestedTemplateCode(ctx: CodegenContext, node: ts.TaggedTemplate
         parser.parse(literals) as ParseResult,
         exprTexts,
         expressions,
-        false
+        node
     );
 }
 
@@ -143,9 +96,7 @@ function generateNodeBinding(ctx: CodegenContext, anchor: string, exprText: stri
         return `${anchor}.parentNode!.insertBefore(${generateNestedTemplateCode(ctx, exprNode)}, ${anchor});`;
     }
 
-    let slotType = analyze(exprNode, ctx.checker);
-
-    switch (slotType) {
+    switch (analyze(exprNode, ctx.checker)) {
         case COMPILER_TYPES.ArraySlot:
             return `${anchor}.parentNode!.insertBefore(new ${COMPILER_NAMESPACE}.ArraySlot(${exprText}).fragment, ${anchor});`;
 
@@ -168,7 +119,7 @@ function generateTemplateCode(
     { html, slots }: ParseResult,
     exprTexts: string[],
     exprNodes: ts.Expression[],
-    isArrowBody: boolean
+    templateNode: ts.Node
 ): string {
     if (!slots || slots.length === 0) {
         return `${getOrCreateTemplateId(ctx, html)}()`;
@@ -177,6 +128,7 @@ function generateTemplateCode(
     let code: string[] = [],
         declarations: string[] = [],
         index = 0,
+        isArrowBody = isArrowExpressionBody(templateNode),
         nodes = new Map<string, string>(),
         root = uid('root');
 
@@ -285,6 +237,10 @@ function isNestedHtmlTemplate(expr: ts.Expression): expr is ts.TaggedTemplateExp
     return ts.isTaggedTemplateExpression(expr) && ts.isIdentifier(expr.tag) && expr.tag.text === COMPILER_ENTRYPOINT;
 }
 
+function isArrowExpressionBody(node: ts.Node): boolean {
+    return ts.isArrowFunction(node.parent) && (node.parent as ts.ArrowFunction).body === node;
+}
+
 function isReactiveCall(expr: ts.Expression): expr is ts.CallExpression {
     return (
         ts.isCallExpression(expr) &&
@@ -295,106 +251,152 @@ function isReactiveCall(expr: ts.Expression): expr is ts.CallExpression {
     );
 }
 
-function replaceReverse(text: string, replacements: Replacement[]): string {
-    let sorted = replacements.slice().sort((a, b) => b.start - a.start);
-
-    for (let i = 0, n = sorted.length; i < n; i++) {
-        let r = sorted[i];
-
-        text = text.slice(0, r.start) + r.newText + text.slice(r.end);
-    }
-
-    return text;
-}
-
 function rewriteExpression(ctx: CodegenContext, expr: ts.Expression): string {
     if (isNestedHtmlTemplate(expr)) {
         return generateNestedTemplateCode(ctx, expr);
     }
 
+    // Returns just args "array, callback" - for direct slot usage where generateNodeBinding wraps it
     if (isReactiveCall(expr)) {
-        return rewriteReactiveCall(ctx, expr);
+        return `
+            ${printer.printNode(ts.EmitHint.Expression, expr.arguments[0], ctx.sourceFile)},
+            ${rewriteExpression(ctx, expr.arguments[1] as ts.Expression)}
+        `;
     }
 
     if (!ast.hasMatch(expr, n => isNestedHtmlTemplate(n as ts.Expression) || isReactiveCall(n as ts.Expression))) {
-        return ctx.printer.printNode(ts.EmitHint.Expression, expr, ctx.sourceFile);
+        return printer.printNode(ts.EmitHint.Expression, expr, ctx.sourceFile);
     }
 
-    let replacements: Replacement[] = [];
+    return walkExpression(ctx, expr);
+}
 
-    collectNestedReplacements(ctx, expr, expr.getStart(ctx.sourceFile), replacements);
+function walkExpression(ctx: CodegenContext, node: ts.Node): string {
+    // Intercept special nodes
+    if (isNestedHtmlTemplate(node as ts.Expression)) {
+        return generateNestedTemplateCode(ctx, node as ts.TaggedTemplateExpression);
+    }
 
-    return replaceReverse(expr.getText(ctx.sourceFile), replacements);
-}
+    if (isReactiveCall(node as ts.Expression)) {
+        let call = node as ts.CallExpression;
 
-function rewriteReactiveCall(ctx: CodegenContext, node: ts.CallExpression): string {
-    let arrayArg = node.arguments[0],
-        arrayText = ctx.printer.printNode(ts.EmitHint.Expression, arrayArg, ctx.sourceFile),
-        callbackArg = node.arguments[1],
-        callbackText = rewriteExpression(ctx, callbackArg as ts.Expression);
+        return `new ${COMPILER_NAMESPACE}.ArraySlot(${printer.printNode(ts.EmitHint.Expression, call.arguments[0], ctx.sourceFile)}, ${rewriteExpression(ctx, call.arguments[1] as ts.Expression)})`;
+    }
 
-    return `${arrayText}, ${callbackText}`;
-}
+    // No nested constructs - use printer
+    if (!ast.hasMatch(node, n => isNestedHtmlTemplate(n as ts.Expression) || isReactiveCall(n as ts.Expression))) {
+        return printer.printNode(ts.EmitHint.Expression, node as ts.Expression, ctx.sourceFile);
+    }
 
-// Eager discovery - walk all expressions to find templates before prepend generation
-function discoverTemplatesInExpression(ctx: CodegenContext, node: ts.Node): void {
-    if (isNestedHtmlTemplate(node as ts.Expression)) {
-        let template = node as ts.TaggedTemplateExpression,
-            expressions: ts.Expression[] = [],
-            literals: string[] = [],
-            tpl = template.template;
+    // Recursive handling by node type
+    if (ts.isConditionalExpression(node)) {
+        return `${walkExpression(ctx, node.condition)} ? ${walkExpression(ctx, node.whenTrue)} : ${walkExpression(ctx, node.whenFalse)}`;
+    }
 
-        if (ts.isNoSubstitutionTemplateLiteral(tpl)) {
-            literals.push(tpl.text);
-        }
-        else if (ts.isTemplateExpression(tpl)) {
-            literals.push(tpl.head.text);
+    if (ts.isBinaryExpression(node)) {
+        return `${walkExpression(ctx, node.left)} ${node.operatorToken.getText(ctx.sourceFile)} ${walkExpression(ctx, node.right)}`;
+    }
 
-            for (let i = 0, n = tpl.templateSpans.length; i < n; i++) {
-                expressions.push(tpl.templateSpans[i].expression);
-                literals.push(tpl.templateSpans[i].literal.text);
-            }
+    if (ts.isCallExpression(node)) {
+        let args: string[] = [];
+
+        for (let i = 0, n = node.arguments.length; i < n; i++) {
+            args.push(walkExpression(ctx, node.arguments[i]));
         }
 
-        let parsed = parser.parse(literals) as ParseResult;
+        return `${walkExpression(ctx, node.expression)}(${args.join(', ')})`;
+    }
+
+    if (ts.isPropertyAccessExpression(node)) {
+        return `${walkExpression(ctx, node.expression)}.${node.name.text}`;
+    }
+
+    if (ts.isElementAccessExpression(node)) {
+        return `${walkExpression(ctx, node.expression)}[${walkExpression(ctx, node.argumentExpression)}]`;
+    }
+
+    if (ts.isParenthesizedExpression(node)) {
+        return `(${walkExpression(ctx, node.expression)})`;
+    }
+
+    if (ts.isArrowFunction(node)) {
+        return `(${node.parameters.map(p => p.getText(ctx.sourceFile)).join(', ')}) => ${
+            ts.isBlock(node.body) ? node.body.getText(ctx.sourceFile) : walkExpression(ctx, node.body)
+        }`;
+    }
 
-        getOrCreateTemplateId(ctx, parsed.html);
+    if (ts.isArrayLiteralExpression(node)) {
+        let elements: string[] = [];
 
-        for (let i = 0, n = expressions.length; i < n; i++) {
-            discoverTemplatesInExpression(ctx, expressions[i]);
+        for (let i = 0, n = node.elements.length; i < n; i++) {
+            elements.push( walkExpression(ctx, node.elements[i]) );
         }
+
+        return `[${elements.join(', ')}]`;
     }
-    else if (isReactiveCall(node as ts.Expression)) {
-        let call = node as ts.CallExpression;
 
-        if (call.arguments.length >= 2) {
-            discoverTemplatesInExpression(ctx, call.arguments[1]);
+    if (ts.isObjectLiteralExpression(node)) {
+        let properties: string[] = [];
+
+        for (let i = 0, n = node.properties.length; i < n; i++) {
+            let prop = node.properties[i];
+
+            if (ts.isPropertyAssignment(prop)) {
+                properties.push(`${prop.name.getText(ctx.sourceFile)}: ${walkExpression(ctx, prop.initializer)}`);
+            }
+            else if (ts.isShorthandPropertyAssignment(prop)) {
+                properties.push(prop.name.text);
+            }
+            else if (ts.isSpreadAssignment(prop)) {
+                properties.push(`...${walkExpression(ctx, prop.expression)}`);
+            }
+            else {
+                properties.push(prop.getText(ctx.sourceFile));
+            }
         }
+
+        return `{ ${properties.join(', ')} }`;
     }
-    else {
-        ts.forEachChild(node, child => discoverTemplatesInExpression(ctx, child));
+
+    if (ts.isPrefixUnaryExpression(node)) {
+        return `${ts.tokenToString(node.operator)}${walkExpression(ctx, node.operand)}`;
     }
-}
 
-function discoverAllTemplates(ctx: CodegenContext, templates: TemplateInfo[]): void {
-    for (let i = 0, n = templates.length; i < n; i++) {
-        let parsed = parser.parse(templates[i].literals) as ParseResult;
+    if (ts.isPostfixUnaryExpression(node)) {
+        return `${walkExpression(ctx, node.operand)}${ts.tokenToString(node.operator)}`;
+    }
 
-        getOrCreateTemplateId(ctx, parsed.html);
+    if (ts.isTemplateExpression(node)) {
+        let parts = [node.head.text];
 
-        for (let j = 0, m = templates[i].expressions.length; j < m; j++) {
-            discoverTemplatesInExpression(ctx, templates[i].expressions[j]);
+        for (let i = 0, n = node.templateSpans.length; i < n; i++) {
+            let span = node.templateSpans[i];
+
+            parts.push('${' + walkExpression(ctx, span.expression) + '}' + span.literal.text);
         }
+
+        return '`' + parts.join('') + '`';
     }
+
+    if (ts.isAsExpression(node) || ts.isTypeAssertionExpression(node)) {
+        return walkExpression(ctx, node.expression);
+    }
+
+    if (ts.isNonNullExpression(node)) {
+        return `${walkExpression(ctx, node.expression)}!`;
+    }
+
+    // Fallback - use printer
+    return printer.printNode(ts.EmitHint.Expression, node as ts.Expression, ctx.sourceFile);
 }
 
 
 const generateCode = (templates: TemplateInfo[], sourceFile: ts.SourceFile, checker?: ts.TypeChecker): CodegenResult => {
     let result: CodegenResult = {
-        prepend: [],
-        replacements: [],
-        templates: new Map()
-    };
+            prepend: [],
+            replacements: [],
+            templates: new Map()
+        };
 
     if (templates.length === 0) {
         return result;
@@ -417,23 +419,19 @@ const generateCode = (templates: TemplateInfo[], sourceFile: ts.SourceFile, chec
     }
 
     let ctx: CodegenContext = {
-        checker,
-        printer,
-        sourceFile,
-        templates: result.templates
-    };
+            checker,
+            sourceFile,
+            templates: result.templates
+        };
 
     for (let i = 0, n = rootTemplates.length; i < n; i++) {
         let template = rootTemplates[i];
 
         result.replacements.push({
             generate: (sf) => {
-                let codeBefore = sf.getFullText().slice(0, template.node.getStart(sf)),
-                    exprTexts: string[] = [],
-                    isArrowBody = codeBefore.trimEnd().endsWith('=>'),
+                let exprTexts: string[] = [],
                     localCtx: CodegenContext = {
                         checker,
-                        printer,
                         sourceFile: sf,
                         templates: ctx.templates
                     },
@@ -443,12 +441,13 @@ const generateCode = (templates: TemplateInfo[], sourceFile: ts.SourceFile, chec
                     exprTexts.push(rewriteExpression(localCtx, template.expressions[j]));
                 }
 
-                if (isArrowBody && (!parsed.slots || parsed.slots.length === 0)) {
-                    let arrowMatch = codeBefore.match(ARROW_EMPTY_PARAMS);
-
-                    if (arrowMatch) {
-                        return getOrCreateTemplateId(localCtx, parsed.html);
-                    }
+                // Zero-param arrow with no slots → just return template ID
+                if (
+                    isArrowExpressionBody(template.node) &&
+                    (template.node.parent as ts.ArrowFunction).parameters.length === 0 &&
+                    (!parsed.slots || parsed.slots.length === 0)
+                ) {
+                    return getOrCreateTemplateId(localCtx, parsed.html);
                 }
 
                 return generateTemplateCode(
@@ -456,16 +455,13 @@ const generateCode = (templates: TemplateInfo[], sourceFile: ts.SourceFile, chec
                     parsed,
                     exprTexts,
                     template.expressions,
-                    isArrowBody
+                    template.node
                 );
             },
             node: template.node
         });
     }
 
-    // Eager discovery: find all templates before prepend generation
-    discoverAllTemplates(ctx, templates);
-
     for (let [html, id] of ctx.templates) {
         result.prepend.push(`const ${id} = ${COMPILER_NAMESPACE}.template(\`${html}\`);`);
     }
@@ -474,5 +470,5 @@ const generateCode = (templates: TemplateInfo[], sourceFile: ts.SourceFile, chec
 };
 
 
-export { generateCode };
+export { generateCode, printer };
 export type { CodegenResult };

package/src/compiler/index.ts

@@ -1,49 +1,29 @@
-import type { ImportIntent, Plugin, ReplacementIntent, TransformContext } from '@esportsplus/typescript/compiler';
 import { ts } from '@esportsplus/typescript';
+import { ast } from '@esportsplus/typescript/compiler';
+import type { ImportIntent, Plugin, ReplacementIntent, TransformContext } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_NAMESPACE, PACKAGE } from '~/constants';
-import { generateCode } from './codegen';
+import { generateCode, printer } from './codegen';
 import { findHtmlTemplates, findReactiveCalls } from './ts-parser';
 
 
-const PATTERNS = [
-    `${COMPILER_ENTRYPOINT}\``,
-    `${COMPILER_ENTRYPOINT}.${COMPILER_ENTRYPOINT_REACTIVITY}`
-];
-
-
-function isInRange(ranges: { end: number; start: number }[], start: number, end: number): boolean {
-    for (let i = 0, n = ranges.length; i < n; i++) {
-        let range = ranges[i];
-
-        if (start >= range.start && end <= range.end) {
-            return true;
-        }
-    }
-
-    return false;
-}
-
-
-let printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
-
-
 const plugin: Plugin = {
-    patterns: PATTERNS,
+    patterns: [
+        `${COMPILER_ENTRYPOINT}\``,
+        `${COMPILER_ENTRYPOINT}.${COMPILER_ENTRYPOINT_REACTIVITY}`
+    ],
 
     transform: (ctx: TransformContext) => {
         let importsIntent: ImportIntent[] = [],
             prepend: string[] = [],
+            // Build ranges for all template nodes - reactive calls inside these are handled by template codegen
+            ranges: { end: number; start: number }[] = [],
             replacements: ReplacementIntent[] = [],
-            removeImports: string[] = [];
-
-        // Find templates first to build exclusion ranges
-        let templates = findHtmlTemplates(ctx.sourceFile, ctx.checker);
-
-        // Build ranges for all template nodes - reactive calls inside these are handled by template codegen
-        let templateRanges: { end: number; start: number }[] = [];
+            removeImports: string[] = [],
+            // Find templates first to build exclusion ranges
+            templates = findHtmlTemplates(ctx.sourceFile, ctx.checker);
 
         for (let i = 0, n = templates.length; i < n; i++) {
-            templateRanges.push({
+            ranges.push({
                 end: templates[i].end,
                 start: templates[i].start
             });
@@ -56,12 +36,15 @@ const plugin: Plugin = {
             let call = reactiveCalls[i];
 
             // Skip reactive calls that are inside template expressions - handled by template codegen
-            if (isInRange(templateRanges, call.start, call.end)) {
+            if (ast.inRange(ranges, call.start, call.end)) {
                 continue;
             }
 
             replacements.push({
-                generate: (sourceFile) => `new ${COMPILER_NAMESPACE}.ArraySlot(${printer.printNode(ts.EmitHint.Expression, call.arrayArg, sourceFile)}, ${printer.printNode(ts.EmitHint.Expression, call.callbackArg, sourceFile)})`,
+                generate: (sourceFile) => `new ${COMPILER_NAMESPACE}.ArraySlot(
+                    ${printer.printNode(ts.EmitHint.Expression, call.arrayArg, sourceFile)},
+                    ${printer.printNode(ts.EmitHint.Expression, call.callbackArg, sourceFile)}
+                )`,
                 node: call.node
             });
         }

package/src/compiler/{analyzer.ts → ts-analyzer.ts}

@@ -82,8 +82,7 @@ const analyze = (expr: ts.Expression, checker?: ts.TypeChecker): COMPILER_TYPES
                 return COMPILER_TYPES.Effect;
             }
         }
-        catch {
-        }
+        catch {}
     }
 
     return COMPILER_TYPES.Unknown;

package/src/compiler/ts-parser.ts

@@ -1,4 +1,5 @@
 import { ts } from '@esportsplus/typescript';
+import { imports } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, PACKAGE } from '~/constants';
 
 
@@ -20,47 +21,6 @@ type TemplateInfo = {
 };
 
 
-function isHtmlFromPackage(node: ts.Identifier, checker: ts.TypeChecker | undefined): boolean {
-    // Fast path: check identifier name first
-    if (node.text !== COMPILER_ENTRYPOINT) {
-        return false;
-    }
-
-    // Without checker, fall back to string-based check
-    if (!checker) {
-        return true;
-    }
-
-    let symbol = checker.getSymbolAtLocation(node);
-
-    if (!symbol) {
-        return true;
-    }
-
-    // Follow aliases (re-exports) to find original symbol
-    if (symbol.flags & ts.SymbolFlags.Alias) {
-        symbol = checker.getAliasedSymbol(symbol);
-    }
-
-    let declarations = symbol.getDeclarations();
-
-    if (!declarations || declarations.length === 0) {
-        return true;
-    }
-
-    // Check if any declaration is from our package
-    for (let i = 0, n = declarations.length; i < n; i++) {
-        let filename = declarations[i].getSourceFile().fileName;
-
-        // Check for package in node_modules path or direct package reference
-        if (filename.includes(PACKAGE) || filename.includes('@esportsplus/template')) {
-            return true;
-        }
-    }
-
-    return false;
-}
-
 function visitReactiveCalls(node: ts.Node, calls: ReactiveCallInfo[], checker: ts.TypeChecker | undefined): void {
     if (
         ts.isCallExpression(node) &&
@@ -68,7 +28,8 @@ function visitReactiveCalls(node: ts.Node, calls: ReactiveCallInfo[], checker: t
         ts.isIdentifier(node.expression.expression) &&
         node.expression.name.text === COMPILER_ENTRYPOINT_REACTIVITY &&
         node.arguments.length === 2 &&
-        isHtmlFromPackage(node.expression.expression, checker)
+        node.expression.expression.text === COMPILER_ENTRYPOINT &&
+        (!checker || imports.inPackage(checker, node.expression.expression, PACKAGE, COMPILER_ENTRYPOINT))
     ) {
         calls.push({
             arrayArg: node.arguments[0],
@@ -87,24 +48,13 @@ function visitTemplates(node: ts.Node, depth: number, templates: TemplateInfo[],
             ? depth + 1
             : depth;
 
-    if (ts.isTaggedTemplateExpression(node) && ts.isIdentifier(node.tag) && isHtmlFromPackage(node.tag, checker)) {
-        let expressions: ts.Expression[] = [],
-            literals: string[] = [],
-            template = node.template;
-
-        if (ts.isNoSubstitutionTemplateLiteral(template)) {
-            literals.push(template.text);
-        }
-        else if (ts.isTemplateExpression(template)) {
-            literals.push(template.head.text);
-
-            for (let i = 0, n = template.templateSpans.length; i < n; i++) {
-                let span = template.templateSpans[i];
-
-                expressions.push(span.expression);
-                literals.push(span.literal.text);
-            }
-        }
+    if (
+        ts.isTaggedTemplateExpression(node) &&
+        ts.isIdentifier(node.tag) &&
+        node.tag.text === COMPILER_ENTRYPOINT &&
+        (!checker || imports.inPackage(checker, node.tag, PACKAGE, COMPILER_ENTRYPOINT))
+    ) {
+        let { expressions, literals } = extractTemplateParts(node.template);
 
         templates.push({
             depth,
@@ -120,15 +70,34 @@ function visitTemplates(node: ts.Node, depth: number, templates: TemplateInfo[],
 }
 
 
+const extractTemplateParts = (template: ts.TemplateLiteral): { expressions: ts.Expression[]; literals: string[] } => {
+    let expressions: ts.Expression[] = [],
+        literals: string[] = [];
+
+    if (ts.isNoSubstitutionTemplateLiteral(template)) {
+        literals.push(template.text);
+    }
+    else if (ts.isTemplateExpression(template)) {
+        literals.push(template.head.text);
+
+        for (let i = 0, n = template.templateSpans.length; i < n; i++) {
+            let span = template.templateSpans[i];
+
+            expressions.push(span.expression);
+            literals.push(span.literal.text);
+        }
+    }
+
+    return { expressions, literals };
+};
+
 const findHtmlTemplates = (sourceFile: ts.SourceFile, checker?: ts.TypeChecker): TemplateInfo[] => {
     let templates: TemplateInfo[] = [];
 
     visitTemplates(sourceFile, 0, templates, checker);
 
     // Sort by depth descending (deepest first), then by position for stable ordering
-    templates.sort((a, b) => a.depth !== b.depth ? b.depth - a.depth : a.start - b.start);
-
-    return templates;
+    return templates.sort((a, b) => a.depth !== b.depth ? b.depth - a.depth : a.start - b.start);
 };
 
 const findReactiveCalls = (sourceFile: ts.SourceFile, checker?: ts.TypeChecker): ReactiveCallInfo[] => {
@@ -140,5 +109,5 @@ const findReactiveCalls = (sourceFile: ts.SourceFile, checker?: ts.TypeChecker):
 };
 
 
-export { findHtmlTemplates, findReactiveCalls };
+export { extractTemplateParts, findHtmlTemplates, findReactiveCalls };
 export type { ReactiveCallInfo, TemplateInfo };