@esportsplus/template 0.34.1 → 0.35.1

package/build/attributes.d.ts

@@ -1,6 +1,6 @@
 import { Attributes, Element } from './types.js';
-declare const setClass: (element: Element, classlist: false | string | undefined, value: unknown) => void;
+declare const setClass: (element: Element, classlist: false | string, value: unknown) => void;
 declare const setProperty: (element: Element, name: string, value: unknown) => void;
-declare const setProperties: (element: Element, value: Attributes | Attributes[]) => void;
-declare const setStyle: (element: Element, styles: false | string | undefined, value: unknown) => void;
+declare const setProperties: (element: Element, value?: Attributes | Attributes[] | false | null | undefined) => void;
+declare const setStyle: (element: Element, styles: false | string, value: unknown) => void;
 export { setClass, setProperty, setProperties, setStyle };

package/build/attributes.js

@@ -199,7 +199,10 @@ const setProperty = (element, name, value) => {
     }
 };
 const setProperties = function (element, value) {
-    if (isObject(value)) {
+    if (!value) {
+        return;
+    }
+    else if (isObject(value)) {
         for (let name in value) {
             let v = value[name];
             if (v == null || v === false || v === '') {

package/build/compiler/codegen.d.ts

@@ -4,9 +4,7 @@ type CodegenResult = {
     changed: boolean;
     code: string;
 };
-declare const addImport: (code: string) => string;
-declare const generateCode: (templates: TemplateInfo[], originalCode: string, sourceFile: ts.SourceFile, checker?: ts.TypeChecker) => CodegenResult;
-declare const generateReactiveInlining: (calls: ReactiveCallInfo[], code: string, sourceFile: ts.SourceFile) => string;
-declare const needsArraySlotImport: (sourceFile: ts.SourceFile) => boolean;
-export { addImport, generateCode, generateReactiveInlining, needsArraySlotImport };
+declare const generateCode: (templates: TemplateInfo[], originalCode: string, sourceFile: ts.SourceFile, checker?: ts.TypeChecker, existingAliases?: Map<string, string>) => CodegenResult;
+declare const generateReactiveInlining: (calls: ReactiveCallInfo[], code: string, sourceFile: ts.SourceFile, arraySlotAlias: string) => string;
+export { generateCode, generateReactiveInlining };
 export type { CodegenResult };

package/build/compiler/codegen.js

@@ -1,11 +1,18 @@
 import { ts } from '@esportsplus/typescript';
-import { ast, code as c, uid } from '@esportsplus/typescript/compiler';
+import { ast, code as c, imports, uid } from '@esportsplus/typescript/compiler';
+import { COMPILER_ENTRYPOINT, COMPILER_TYPES, PACKAGE } from '../constants.js';
 import { analyzeExpression, generateAttributeBinding, generateSpreadBindings } from './type-analyzer.js';
-import { COMPILER_ENTRYPOINT, COMPILER_NAMESPACE, COMPILER_TYPES, PACKAGE, PACKAGE_COMPILER } from '../constants.js';
 import parser from './parser.js';
 const ARROW_EMPTY_PARAMS = /\(\s*\)\s*=>\s*$/;
-const REGEX_PACKAGE_IMPORT = new RegExp(`import\\s*\\{[^}]*\\}\\s*from\\s*['"]${PACKAGE.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}['"];?\\n?`, 'g');
 let printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
+function addImport(ctx, name) {
+    let alias = ctx.imports.get(name);
+    if (!alias) {
+        alias = uid(name);
+        ctx.imports.set(name, alias);
+    }
+    return alias;
+}
 function collectNestedTemplateReplacements(ctx, node, exprStart, replacements) {
     if (isNestedHtmlTemplate(node)) {
         replacements.push({
@@ -36,7 +43,7 @@ function generateNestedTemplateCode(ctx, node) {
 }
 function generateNodeBinding(ctx, anchor, exprText, exprNode) {
     if (!exprNode) {
-        return `${COMPILER_NAMESPACE}.slot(${anchor}, ${exprText});`;
+        return `${addImport(ctx, 'slot')}(${anchor}, ${exprText});`;
     }
     if (isNestedHtmlTemplate(exprNode)) {
         return `${anchor}.parentNode.insertBefore(${generateNestedTemplateCode(ctx, exprNode)}, ${anchor});`;
@@ -44,15 +51,15 @@ function generateNodeBinding(ctx, anchor, exprText, exprNode) {
     let slotType = analyzeExpression(exprNode, ctx.checker);
     switch (slotType) {
         case COMPILER_TYPES.Effect:
-            return `new ${COMPILER_NAMESPACE}.EffectSlot(${anchor}, ${exprText});`;
+            return `new ${addImport(ctx, 'EffectSlot')}(${anchor}, ${exprText});`;
         case COMPILER_TYPES.ArraySlot:
-            return `new ${COMPILER_NAMESPACE}.ArraySlot(${anchor}, ${exprText});`;
+            return `new ${addImport(ctx, 'ArraySlot')}(${anchor}, ${exprText});`;
         case COMPILER_TYPES.Static:
             return `${anchor}.textContent = ${exprText};`;
         case COMPILER_TYPES.DocumentFragment:
             return `${anchor}.parentNode.insertBefore(${exprText}, ${anchor});`;
         default:
-            return `${COMPILER_NAMESPACE}.slot(${anchor}, ${exprText});`;
+            return `${addImport(ctx, 'slot')}(${anchor}, ${exprText});`;
     }
 }
 function generateTemplateCode(ctx, { html, slots }, exprTexts, exprNodes, isArrowBody) {
@@ -71,22 +78,25 @@ function generateTemplateCode(ctx, { html, slots }, exprTexts, exprNodes, isArro
         if (nodes.has(key)) {
             continue;
         }
-        let ancestorVar = root, startIdx = 0;
+        let ancestor = root, start = 0;
         for (let j = path.length - 1; j >= 0; j--) {
             let prefix = path.slice(0, j).join('.');
             if (nodes.has(prefix)) {
-                ancestorVar = nodes.get(prefix);
-                startIdx = j;
+                ancestor = nodes.get(prefix);
+                start = j;
                 break;
             }
         }
-        let name = uid('element'), suffix = path.slice(startIdx).join('.');
-        declarations.push(`${name} = ${ancestorVar}.${suffix} as ${COMPILER_NAMESPACE}.Element`);
+        let alias = addImport(ctx, 'Element'), name = uid('element'), segments = path.slice(start), value = `${ancestor}.${segments.join('!.')}`;
+        if (ancestor === root && segments[0] === 'firstChild') {
+            value = value.replace(`${ancestor}.firstChild!`, `(${ancestor}.firstChild! as ${alias})`);
+        }
+        declarations.push(`${name} = ${value} as ${alias}`);
         nodes.set(key, name);
     }
     code.push(isArrowBody ? '{' : `(() => {`, `let ${declarations.join(',\n')};`);
     for (let i = 0, n = slots.length; i < n; i++) {
-        let elementVar = slots[i].path.length === 0
+        let element = slots[i].path.length === 0
             ? root
             : (nodes.get(slots[i].path.join('.')) || root), slot = slots[i];
         if (slot.type === COMPILER_TYPES.Attribute) {
@@ -94,19 +104,19 @@ function generateTemplateCode(ctx, { html, slots }, exprTexts, exprNodes, isArro
             for (let j = 0, m = names.length; j < m; j++) {
                 let name = names[j];
                 if (name === COMPILER_TYPES.Attributes) {
-                    let bindings = generateSpreadBindings(exprNodes[index], exprTexts[index] || 'undefined', elementVar, ctx.checker, COMPILER_NAMESPACE);
+                    let bindings = generateSpreadBindings(exprTexts[index] || 'undefined', element, n => addImport(ctx, n));
                     for (let k = 0, o = bindings.length; k < o; k++) {
                         code.push(bindings[k]);
                     }
                     index++;
                 }
                 else {
-                    code.push(generateAttributeBinding(elementVar, name, exprTexts[index++] || 'undefined', slot.attributes.statics[name] || '', COMPILER_NAMESPACE));
+                    code.push(generateAttributeBinding(element, name, exprTexts[index++] || 'undefined', slot.attributes.statics[name] || '', n => addImport(ctx, n)));
                 }
             }
         }
         else {
-            code.push(generateNodeBinding(ctx, elementVar, exprTexts[index] || 'undefined', exprNodes[index]));
+            code.push(generateNodeBinding(ctx, element, exprTexts[index] || 'undefined', exprNodes[index]));
             index++;
         }
     }
@@ -115,32 +125,13 @@ function generateTemplateCode(ctx, { html, slots }, exprTexts, exprNodes, isArro
     return code.join('\n');
 }
 function getOrCreateTemplateId(ctx, html) {
-    let id = ctx.htmlToTemplateId.get(html);
+    let id = ctx.templates.get(html);
     if (!id) {
-        id = uid('tmpl');
-        ctx.hoistedFactories.set(id, html);
-        ctx.htmlToTemplateId.set(html, id);
+        id = uid('template');
+        ctx.templates.set(html, id);
     }
     return id;
 }
-function hasArraySlotImport(sourceFile) {
-    for (let i = 0, n = sourceFile.statements.length; i < n; i++) {
-        let stmt = sourceFile.statements[i];
-        if (!ts.isImportDeclaration(stmt) || !stmt.importClause?.namedBindings) {
-            continue;
-        }
-        let bindings = stmt.importClause.namedBindings;
-        if (!ts.isNamedImports(bindings)) {
-            continue;
-        }
-        for (let j = 0, m = bindings.elements.length; j < m; j++) {
-            if (bindings.elements[j].name.text === 'ArraySlot') {
-                return true;
-            }
-        }
-    }
-    return false;
-}
 function isNestedHtmlTemplate(expr) {
     return ts.isTaggedTemplateExpression(expr) && ts.isIdentifier(expr.tag) && expr.tag.text === COMPILER_ENTRYPOINT;
 }
@@ -155,13 +146,7 @@ function rewriteExpression(ctx, expr) {
     collectNestedTemplateReplacements(ctx, expr, expr.getStart(), replacements);
     return c.replaceReverse(expr.getText(ctx.sourceFile), replacements);
 }
-const addImport = (code) => {
-    return `import * as ${COMPILER_NAMESPACE} from '${PACKAGE_COMPILER}';\n` + code;
-};
-const removePackageImport = (code) => {
-    return code.replace(REGEX_PACKAGE_IMPORT, '');
-};
-const generateCode = (templates, originalCode, sourceFile, checker) => {
+const generateCode = (templates, originalCode, sourceFile, checker, existingAliases) => {
     if (templates.length === 0) {
         return { changed: false, code: originalCode };
     }
@@ -178,11 +163,11 @@ const generateCode = (templates, originalCode, sourceFile, checker) => {
     }
     let ctx = {
         checker,
-        hoistedFactories: new Map(),
-        htmlToTemplateId: new Map(),
+        templates: new Map(),
+        imports: existingAliases ?? new Map(),
         printer,
         sourceFile
-    }, replacements = [];
+    }, replacements = [], templateAlias = addImport(ctx, 'template');
     for (let i = 0, n = rootTemplates.length; i < n; i++) {
         let exprTexts = [], template = rootTemplates[i];
         for (let j = 0, m = template.expressions.length; j < m; j++) {
@@ -207,16 +192,23 @@ const generateCode = (templates, originalCode, sourceFile, checker) => {
         });
     }
     let changed = replacements.length > 0, code = c.replaceReverse(originalCode, replacements);
-    if (changed && ctx.hoistedFactories.size > 0) {
-        let factories = [];
-        for (let [id, html] of ctx.hoistedFactories) {
-            factories.push(`const ${id} = ${COMPILER_NAMESPACE}.template(\`${html}\`);`);
+    if (changed && ctx.templates.size > 0) {
+        let aliasedImports = [], factories = [];
+        for (let [name, alias] of ctx.imports) {
+            aliasedImports.push(`${name} as ${alias}`);
+        }
+        for (let [html, id] of ctx.templates) {
+            factories.push(`const ${id} = ${templateAlias}(\`${html}\`);`);
         }
-        code = addImport(factories.join('\n') + removePackageImport(code));
+        code = imports.modify(code, sourceFile, PACKAGE, {
+            add: new Set(aliasedImports),
+            remove: [COMPILER_ENTRYPOINT]
+        });
+        code = factories.join('\n') + '\n\n' + code;
     }
     return { changed, code };
 };
-const generateReactiveInlining = (calls, code, sourceFile) => {
+const generateReactiveInlining = (calls, code, sourceFile, arraySlotAlias) => {
     if (calls.length === 0) {
         return code;
     }
@@ -225,7 +217,7 @@ const generateReactiveInlining = (calls, code, sourceFile) => {
         let call = calls[i];
         replacements.push({
             end: call.end,
-            newText: `new ${COMPILER_NAMESPACE}.ArraySlot(
+            newText: `new ${arraySlotAlias}(
                 ${printer.printNode(ts.EmitHint.Expression, call.arrayArg, sourceFile)},
                 ${printer.printNode(ts.EmitHint.Expression, call.callbackArg, sourceFile)}
             )`,
@@ -234,9 +226,4 @@ const generateReactiveInlining = (calls, code, sourceFile) => {
     }
     return c.replaceReverse(code, replacements);
 };
-const needsArraySlotImport = (sourceFile) => {
-    return ast.hasMatch(sourceFile, n => ts.isNewExpression(n) &&
-        ts.isPropertyAccessExpression(n.expression) &&
-        n.expression.name.text === 'ArraySlot') && !hasArraySlotImport(sourceFile);
-};
-export { addImport, generateCode, generateReactiveInlining, needsArraySlotImport };
+export { generateCode, generateReactiveInlining };

package/build/compiler/index.d.ts

@@ -6,9 +6,3 @@ type TransformResult = {
 };
 declare const transform: (sourceFile: ts.SourceFile, program: ts.Program) => TransformResult;
 export { transform };
-export * from '../attributes.js';
-export * from '../event/index.js';
-export { ArraySlot } from '../slot/array.js';
-export { EffectSlot } from '../slot/effect.js';
-export type * from '../types.js';
-export * from '../utilities.js';

package/build/compiler/index.js

@@ -1,8 +1,8 @@
-import { code as c } from '@esportsplus/typescript/compiler';
-import { addImport, generateCode, generateReactiveInlining, needsArraySlotImport } from './codegen.js';
-import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY } from '../constants.js';
-import { findHtmlTemplates, findReactiveCalls } from './ts-parser.js';
 import { ts } from '@esportsplus/typescript';
+import { code as c, imports, uid } from '@esportsplus/typescript/compiler';
+import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, PACKAGE } from '../constants.js';
+import { generateCode, generateReactiveInlining } from './codegen.js';
+import { findHtmlTemplates, findReactiveCalls } from './ts-parser.js';
 const PATTERNS = [`${COMPILER_ENTRYPOINT}\``, `${COMPILER_ENTRYPOINT}.${COMPILER_ENTRYPOINT_REACTIVITY}`];
 const REGEX_BACKSLASH = /\\/g;
 const REGEX_FORWARD_SLASH = /\//g;
@@ -18,25 +18,29 @@ const transform = (sourceFile, program) => {
         checker = program.getTypeChecker();
         sourceFile = programSourceFile;
     }
-    let changed = false, codegenChanged = false, needsImport = false, reactiveCalls = findReactiveCalls(sourceFile), result = code;
+    let changed = false, codegenChanged = false, existingAliases = new Map(), reactiveCalls = findReactiveCalls(sourceFile, checker), result = code;
     if (reactiveCalls.length > 0) {
+        let arraySlotAlias = uid('ArraySlot');
         changed = true;
-        checker = undefined;
-        result = generateReactiveInlining(reactiveCalls, result, sourceFile);
+        existingAliases.set('ArraySlot', arraySlotAlias);
+        result = generateReactiveInlining(reactiveCalls, result, sourceFile, arraySlotAlias);
         sourceFile = ts.createSourceFile(sourceFile.fileName, result, sourceFile.languageVersion, true);
-        needsImport = needsArraySlotImport(sourceFile);
     }
-    let templates = findHtmlTemplates(sourceFile);
+    let templates = findHtmlTemplates(sourceFile, checker);
     if (templates.length > 0) {
-        let codegenResult = generateCode(templates, result, sourceFile, checker);
+        let codegenResult = generateCode(templates, result, sourceFile, checker, existingAliases);
         if (codegenResult.changed) {
             changed = true;
             codegenChanged = true;
             result = codegenResult.code;
         }
     }
-    if (needsImport && !codegenChanged) {
-        result = addImport(result);
+    if (existingAliases.size > 0 && !codegenChanged) {
+        let aliasedImports = [];
+        for (let [name, alias] of existingAliases) {
+            aliasedImports.push(`${name} as ${alias}`);
+        }
+        result = imports.modify(result, sourceFile, PACKAGE, { add: aliasedImports });
     }
     if (changed) {
         sourceFile = ts.createSourceFile(sourceFile.fileName, result, sourceFile.languageVersion, true);
@@ -44,8 +48,3 @@ const transform = (sourceFile, program) => {
     return { changed, code: result, sourceFile };
 };
 export { transform };
-export * from '../attributes.js';
-export * from '../event/index.js';
-export { ArraySlot } from '../slot/array.js';
-export { EffectSlot } from '../slot/effect.js';
-export * from '../utilities.js';

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

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

package/build/compiler/ts-parser.js

@@ -1,12 +1,38 @@
-import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY } from '../constants.js';
 import { ts } from '@esportsplus/typescript';
-function visitReactiveCalls(node, calls) {
+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.expression.text === COMPILER_ENTRYPOINT &&
         node.expression.name.text === COMPILER_ENTRYPOINT_REACTIVITY &&
-        node.arguments.length === 2) {
+        node.arguments.length === 2 &&
+        isHtmlFromPackage(node.expression.expression, checker)) {
         calls.push({
             arrayArg: node.arguments[0],
             callbackArg: node.arguments[1],
@@ -15,13 +41,13 @@ function visitReactiveCalls(node, calls) {
             start: node.getStart()
         });
     }
-    ts.forEachChild(node, child => visitReactiveCalls(child, calls));
+    ts.forEachChild(node, child => visitReactiveCalls(child, calls, checker));
 }
-function visitTemplates(node, depth, templates) {
+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) && node.tag.text === COMPILER_ENTRYPOINT) {
+    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);
@@ -43,17 +69,17 @@ function visitTemplates(node, depth, templates) {
             start: node.getStart()
         });
     }
-    ts.forEachChild(node, child => visitTemplates(child, nextDepth, templates));
+    ts.forEachChild(node, child => visitTemplates(child, nextDepth, templates, checker));
 }
-const findHtmlTemplates = (sourceFile) => {
+const findHtmlTemplates = (sourceFile, checker) => {
     let templates = [];
-    visitTemplates(sourceFile, 0, templates);
+    visitTemplates(sourceFile, 0, templates, checker);
     templates.sort((a, b) => a.depth !== b.depth ? b.depth - a.depth : a.start - b.start);
     return templates;
 };
-const findReactiveCalls = (sourceFile) => {
+const findReactiveCalls = (sourceFile, checker) => {
     let calls = [];
-    visitReactiveCalls(sourceFile, calls);
+    visitReactiveCalls(sourceFile, calls, checker);
     return calls;
 };
 export { findHtmlTemplates, findReactiveCalls };

package/build/compiler/type-analyzer.d.ts

@@ -1,6 +1,6 @@
 import { COMPILER_TYPES } from '../constants.js';
 import { ts } from '@esportsplus/typescript';
 declare const analyzeExpression: (expr: ts.Expression, checker?: ts.TypeChecker) => COMPILER_TYPES;
-declare const generateAttributeBinding: (elementVar: string, name: string, expr: string, staticValue: string, ns: string) => string;
-declare const generateSpreadBindings: (expr: ts.Expression, exprCode: string, elementVar: string, checker: ts.TypeChecker | undefined, ns: string) => string[];
+declare const generateAttributeBinding: (elementVar: string, name: string, expr: string, staticValue: string, addImport: (name: string) => string) => string;
+declare const generateSpreadBindings: (exprCode: string, elementVar: string, addImport: (name: string) => string) => string[];
 export { analyzeExpression, generateAttributeBinding, generateSpreadBindings };

package/build/compiler/type-analyzer.js

@@ -1,45 +1,5 @@
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS } from '../constants.js';
 import { ts } from '@esportsplus/typescript';
-function analyzeSpread(expr, checker) {
-    while (ts.isParenthesizedExpression(expr)) {
-        expr = expr.expression;
-    }
-    if (ts.isObjectLiteralExpression(expr)) {
-        let keys = [];
-        for (let i = 0, n = expr.properties.length; i < n; i++) {
-            let prop = expr.properties[i];
-            if (ts.isPropertyAssignment(prop)) {
-                if (ts.isIdentifier(prop.name) || ts.isStringLiteral(prop.name)) {
-                    keys.push(prop.name.text);
-                }
-            }
-            else if (ts.isShorthandPropertyAssignment(prop)) {
-                keys.push(prop.name.text);
-            }
-            else if (ts.isSpreadAssignment(prop)) {
-                return { canUnpack: false, keys: [] };
-            }
-        }
-        return { canUnpack: true, keys };
-    }
-    if (checker && (ts.isIdentifier(expr) || ts.isPropertyAccessExpression(expr))) {
-        try {
-            let keys = [], props = checker.getTypeAtLocation(expr).getProperties();
-            for (let i = 0, n = props.length; i < n; i++) {
-                let name = props[i].getName();
-                if (name.startsWith('__') || name.startsWith('[')) {
-                    continue;
-                }
-                keys.push(name);
-            }
-            if (keys.length > 0) {
-                return { canUnpack: true, keys };
-            }
-        }
-        catch { }
-    }
-    return { canUnpack: false, keys: [] };
-}
 function inferCOMPILER_TYPES(expr, checker) {
     while (ts.isParenthesizedExpression(expr)) {
         expr = expr.expression;
@@ -57,9 +17,6 @@ function inferCOMPILER_TYPES(expr, checker) {
     if (ts.isTaggedTemplateExpression(expr) && ts.isIdentifier(expr.tag) && expr.tag.text === COMPILER_ENTRYPOINT) {
         return COMPILER_TYPES.DocumentFragment;
     }
-    if (ts.isArrayLiteralExpression(expr)) {
-        return COMPILER_TYPES.ArraySlot;
-    }
     if (ts.isNumericLiteral(expr) ||
         ts.isStringLiteral(expr) ||
         ts.isNoSubstitutionTemplateLiteral(expr) ||
@@ -88,98 +45,53 @@ function inferCOMPILER_TYPES(expr, checker) {
             if (isTypeFunction(type, checker)) {
                 return COMPILER_TYPES.Effect;
             }
-            if (isTypeArray(type, checker)) {
-                return COMPILER_TYPES.ArraySlot;
-            }
         }
         catch {
         }
     }
     return COMPILER_TYPES.Unknown;
 }
-function isTypeArray(type, checker) {
-    if (checker.isArrayType(type)) {
-        return true;
-    }
-    return type.getSymbol()?.getName() === 'ReactiveArray';
-}
 function isTypeFunction(type, checker) {
-    if (type.getCallSignatures().length > 0) {
-        return true;
-    }
     if (type.isUnion()) {
+        let allFunctions = true, hasFunction = false;
         for (let i = 0, n = type.types.length; i < n; i++) {
             if (isTypeFunction(type.types[i], checker)) {
-                return true;
+                hasFunction = true;
+            }
+            else {
+                allFunctions = false;
             }
         }
+        return hasFunction && allFunctions;
     }
-    return false;
+    return type.getCallSignatures().length > 0;
 }
 const analyzeExpression = (expr, checker) => {
     return inferCOMPILER_TYPES(expr, checker);
 };
-const generateAttributeBinding = (elementVar, name, expr, staticValue, ns) => {
+const generateAttributeBinding = (elementVar, name, expr, staticValue, addImport) => {
     if (name.startsWith('on') && name.length > 2) {
         let event = name.slice(2).toLowerCase(), key = name.toLowerCase();
         if (LIFECYCLE_EVENTS.has(key)) {
-            return `${ns}.${key}(${elementVar}, ${expr});`;
+            return `${addImport(key)}(${elementVar}, ${expr});`;
         }
         if (DIRECT_ATTACH_EVENTS.has(key)) {
-            return `${ns}.on(${elementVar}, '${event}', ${expr});`;
+            return `${addImport('on')}(${elementVar}, '${event}', ${expr});`;
         }
-        return `${ns}.delegate(${elementVar}, '${event}', ${expr});`;
+        return `${addImport('delegate')}(${elementVar}, '${event}', ${expr});`;
     }
     if (name === 'class') {
-        return `${ns}.setClass(${elementVar}, '${staticValue}', ${expr});`;
+        return `${addImport('setClass')}(${elementVar}, '${staticValue}', ${expr});`;
     }
     if (name === COMPILER_TYPES.Attributes) {
-        return `${ns}.setProperties(${elementVar}, ${expr});`;
+        return `${addImport('setProperties')}(${elementVar}, ${expr});`;
     }
     if (name === 'style') {
-        return `${ns}.setStyle(${elementVar}, '${staticValue}', ${expr});`;
+        return `${addImport('setStyle')}(${elementVar}, '${staticValue}', ${expr});`;
     }
-    return `${ns}.setProperty(${elementVar}, '${name}', ${expr});`;
+    return `${addImport('setProperty')}(${elementVar}, '${name}', ${expr});`;
 };
-const generateSpreadBindings = (expr, exprCode, elementVar, checker, ns) => {
-    while (ts.isParenthesizedExpression(expr)) {
-        expr = expr.expression;
-    }
-    let analysis = analyzeSpread(expr, checker);
-    if (!analysis.canUnpack) {
-        return [`${ns}.setProperties(${elementVar}, ${exprCode});`];
-    }
-    let lines = [];
-    if (ts.isObjectLiteralExpression(expr)) {
-        for (let i = 0, n = analysis.keys.length; i < n; i++) {
-            let key = analysis.keys[i], value = null;
-            for (let j = 0, m = expr.properties.length; j < m; j++) {
-                let prop = expr.properties[j];
-                if (ts.isPropertyAssignment(prop)) {
-                    let text = ts.isIdentifier(prop.name)
-                        ? prop.name.text
-                        : ts.isStringLiteral(prop.name) ? prop.name.text : null;
-                    if (text === key) {
-                        value = prop.initializer.getText();
-                        break;
-                    }
-                }
-                else if (ts.isShorthandPropertyAssignment(prop) && prop.name.text === key) {
-                    value = prop.name.text;
-                    break;
-                }
-            }
-            if (value !== null) {
-                lines.push(generateAttributeBinding(elementVar, key, value, '', ns));
-            }
-        }
-    }
-    else {
-        for (let i = 0, n = analysis.keys.length; i < n; i++) {
-            let key = analysis.keys[i];
-            lines.push(generateAttributeBinding(elementVar, key, `${exprCode}.${key}`, '', ns));
-        }
-    }
-    return lines;
+const generateSpreadBindings = (exprCode, elementVar, addImport) => {
+    return [`${addImport('setProperties')}(${elementVar}, ${exprCode});`];
 };
 export { analyzeExpression, generateAttributeBinding, generateSpreadBindings };

package/build/constants.d.ts

@@ -2,7 +2,6 @@ declare const ARRAY_SLOT: unique symbol;
 declare const CLEANUP: unique symbol;
 declare const COMPILER_ENTRYPOINT = "html";
 declare const COMPILER_ENTRYPOINT_REACTIVITY = "reactive";
-declare const COMPILER_NAMESPACE: string;
 declare const enum COMPILER_TYPES {
     ArraySlot = "array-slot",
     Attributes = "attributes",
@@ -17,10 +16,9 @@ declare const enum COMPILER_TYPES {
 declare const DIRECT_ATTACH_EVENTS: Set<string>;
 declare const LIFECYCLE_EVENTS: Set<string>;
 declare const PACKAGE = "@esportsplus/template";
-declare const PACKAGE_COMPILER = "@esportsplus/template/compiler";
 declare const SLOT_HTML = "<!--$-->";
 declare const STATE_HYDRATING = 0;
 declare const STATE_NONE = 1;
 declare const STATE_WAITING = 2;
 declare const STORE: unique symbol;
-export { ARRAY_SLOT, CLEANUP, COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_NAMESPACE, COMPILER_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS, PACKAGE, PACKAGE_COMPILER, SLOT_HTML, STATE_HYDRATING, STATE_NONE, STATE_WAITING, STORE, };
+export { ARRAY_SLOT, CLEANUP, COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS, PACKAGE, SLOT_HTML, STATE_HYDRATING, STATE_NONE, STATE_WAITING, STORE, };

package/build/constants.js

@@ -1,9 +1,7 @@
-import { uid } from '@esportsplus/typescript/compiler';
 const ARRAY_SLOT = Symbol('template.array.slot');
 const CLEANUP = Symbol('template.cleanup');
 const COMPILER_ENTRYPOINT = 'html';
 const COMPILER_ENTRYPOINT_REACTIVITY = 'reactive';
-const COMPILER_NAMESPACE = uid('template');
 var COMPILER_TYPES;
 (function (COMPILER_TYPES) {
     COMPILER_TYPES["ArraySlot"] = "array-slot";
@@ -30,10 +28,9 @@ const LIFECYCLE_EVENTS = new Set([
     'onconnect', 'ondisconnect', 'onrender', 'onresize', 'ontick'
 ]);
 const PACKAGE = '@esportsplus/template';
-const PACKAGE_COMPILER = '@esportsplus/template/compiler';
 const SLOT_HTML = '<!--$-->';
 const STATE_HYDRATING = 0;
 const STATE_NONE = 1;
 const STATE_WAITING = 2;
 const STORE = Symbol('template.store');
-export { ARRAY_SLOT, CLEANUP, COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_NAMESPACE, COMPILER_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS, PACKAGE, PACKAGE_COMPILER, SLOT_HTML, STATE_HYDRATING, STATE_NONE, STATE_WAITING, STORE, };
+export { ARRAY_SLOT, CLEANUP, COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS, PACKAGE, SLOT_HTML, STATE_HYDRATING, STATE_NONE, STATE_WAITING, STORE, };