@esportsplus/template 0.35.0 → 0.37.0

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/analyzer.d.ts

@@ -0,0 +1,4 @@
+import { COMPILER_TYPES } from '../constants.js';
+import { ts } from '@esportsplus/typescript';
+declare const analyze: (expr: ts.Expression, checker?: ts.TypeChecker) => COMPILER_TYPES;
+export { analyze };

package/build/compiler/analyzer.js

@@ -0,0 +1,65 @@
+import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, COMPILER_TYPES } from '../constants.js';
+import { ts } from '@esportsplus/typescript';
+function isTypeFunction(type, checker) {
+    if (type.isUnion()) {
+        for (let i = 0, n = type.types.length; i < n; i++) {
+            if (!isTypeFunction(type.types[i], checker)) {
+                return false;
+            }
+        }
+        return type.types.length > 0;
+    }
+    return type.getCallSignatures().length > 0;
+}
+const analyze = (expr, checker) => {
+    while (ts.isParenthesizedExpression(expr)) {
+        expr = expr.expression;
+    }
+    if (ts.isArrowFunction(expr) || ts.isFunctionExpression(expr)) {
+        return COMPILER_TYPES.Effect;
+    }
+    if (ts.isCallExpression(expr) &&
+        ts.isPropertyAccessExpression(expr.expression) &&
+        ts.isIdentifier(expr.expression.expression) &&
+        expr.expression.expression.text === COMPILER_ENTRYPOINT &&
+        expr.expression.name.text === COMPILER_ENTRYPOINT_REACTIVITY) {
+        return COMPILER_TYPES.ArraySlot;
+    }
+    if (ts.isTaggedTemplateExpression(expr) && ts.isIdentifier(expr.tag) && expr.tag.text === COMPILER_ENTRYPOINT) {
+        return COMPILER_TYPES.DocumentFragment;
+    }
+    if (ts.isNumericLiteral(expr) ||
+        ts.isStringLiteral(expr) ||
+        ts.isNoSubstitutionTemplateLiteral(expr) ||
+        expr.kind === ts.SyntaxKind.TrueKeyword ||
+        expr.kind === ts.SyntaxKind.FalseKeyword ||
+        expr.kind === ts.SyntaxKind.NullKeyword ||
+        expr.kind === ts.SyntaxKind.UndefinedKeyword) {
+        return COMPILER_TYPES.Static;
+    }
+    if (ts.isTemplateExpression(expr)) {
+        return COMPILER_TYPES.Primitive;
+    }
+    if (ts.isConditionalExpression(expr)) {
+        let whenFalse = analyze(expr.whenFalse, checker), whenTrue = analyze(expr.whenTrue, checker);
+        if (whenTrue === whenFalse) {
+            return whenTrue;
+        }
+        if (whenTrue === COMPILER_TYPES.Effect || whenFalse === COMPILER_TYPES.Effect) {
+            return COMPILER_TYPES.Effect;
+        }
+        return COMPILER_TYPES.Unknown;
+    }
+    if (checker && (ts.isIdentifier(expr) || ts.isPropertyAccessExpression(expr) || ts.isCallExpression(expr))) {
+        try {
+            let type = checker.getTypeAtLocation(expr);
+            if (isTypeFunction(type, checker)) {
+                return COMPILER_TYPES.Effect;
+            }
+        }
+        catch {
+        }
+    }
+    return COMPILER_TYPES.Unknown;
+};
+export { analyze };

package/build/compiler/codegen.d.ts

@@ -4,8 +4,7 @@ type CodegenResult = {
     changed: boolean;
     code: 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 { 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,10 +1,37 @@
 import { ts } from '@esportsplus/typescript';
 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_TYPES, DIRECT_ATTACH_EVENTS, LIFECYCLE_EVENTS, PACKAGE } from '../constants.js';
+import { analyze } from './analyzer.js';
 import parser from './parser.js';
 const ARROW_EMPTY_PARAMS = /\(\s*\)\s*=>\s*$/;
 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 generateAttributeBinding(ctx, element, name, expr, staticValue) {
+    if (name.startsWith('on') && name.length > 2) {
+        let event = name.slice(2).toLowerCase(), key = name.toLowerCase();
+        if (LIFECYCLE_EVENTS.has(key)) {
+            return `${addImport(ctx, key)}(${element}, ${expr});`;
+        }
+        if (DIRECT_ATTACH_EVENTS.has(key)) {
+            return `${addImport(ctx, 'on')}(${element}, '${event}', ${expr});`;
+        }
+        return `${addImport(ctx, 'delegate')}(${element}, '${event}', ${expr});`;
+    }
+    if (name === 'class') {
+        return `${addImport(ctx, 'setClass')}(${element}, '${staticValue}', ${expr});`;
+    }
+    if (name === 'style') {
+        return `${addImport(ctx, 'setStyle')}(${element}, '${staticValue}', ${expr});`;
+    }
+    return `${addImport(ctx, 'setProperty')}(${element}, '${name}', ${expr});`;
+}
 function collectNestedTemplateReplacements(ctx, node, exprStart, replacements) {
     if (isNestedHtmlTemplate(node)) {
         replacements.push({
@@ -35,27 +62,23 @@ function generateNestedTemplateCode(ctx, node) {
 }
 function generateNodeBinding(ctx, anchor, exprText, exprNode) {
     if (!exprNode) {
-        ctx.neededImports.add('slot');
-        return `slot(${anchor}, ${exprText});`;
+        return `${addImport(ctx, 'slot')}(${anchor}, ${exprText});`;
     }
     if (isNestedHtmlTemplate(exprNode)) {
         return `${anchor}.parentNode.insertBefore(${generateNestedTemplateCode(ctx, exprNode)}, ${anchor});`;
     }
-    let slotType = analyzeExpression(exprNode, ctx.checker);
+    let slotType = analyze(exprNode, ctx.checker);
     switch (slotType) {
         case COMPILER_TYPES.Effect:
-            ctx.neededImports.add('EffectSlot');
-            return `new EffectSlot(${anchor}, ${exprText});`;
+            return `new ${addImport(ctx, 'EffectSlot')}(${anchor}, ${exprText});`;
         case COMPILER_TYPES.ArraySlot:
-            ctx.neededImports.add('ArraySlot');
-            return `new 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:
-            ctx.neededImports.add('slot');
-            return `slot(${anchor}, ${exprText});`;
+            return `${addImport(ctx, 'slot')}(${anchor}, ${exprText});`;
     }
 }
 function generateTemplateCode(ctx, { html, slots }, exprTexts, exprNodes, isArrowBody) {
@@ -74,23 +97,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('.');
-        ctx.neededImports.add('Element');
-        declarations.push(`${name} = ${ancestorVar}.${suffix} as 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) {
@@ -98,19 +123,16 @@ 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, ctx.neededImports);
-                    for (let k = 0, o = bindings.length; k < o; k++) {
-                        code.push(bindings[k]);
-                    }
+                    code.push(`${addImport(ctx, 'setProperties')}(${element}, ${exprTexts[index] || 'undefined'});`);
                     index++;
                 }
                 else {
-                    code.push(generateAttributeBinding(elementVar, name, exprTexts[index++] || 'undefined', slot.attributes.statics[name] || '', ctx.neededImports));
+                    code.push(generateAttributeBinding(ctx, element, name, exprTexts[index++] || 'undefined', slot.attributes.statics[name] || ''));
                 }
             }
         }
         else {
-            code.push(generateNodeBinding(ctx, elementVar, exprTexts[index] || 'undefined', exprNodes[index]));
+            code.push(generateNodeBinding(ctx, element, exprTexts[index] || 'undefined', exprNodes[index]));
             index++;
         }
     }
@@ -119,32 +141,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;
 }
@@ -159,7 +162,7 @@ function rewriteExpression(ctx, expr) {
     collectNestedTemplateReplacements(ctx, expr, expr.getStart(), replacements);
     return c.replaceReverse(expr.getText(ctx.sourceFile), replacements);
 }
-const generateCode = (templates, originalCode, sourceFile, checker) => {
+const generateCode = (templates, originalCode, sourceFile, checker, existingAliases) => {
     if (templates.length === 0) {
         return { changed: false, code: originalCode };
     }
@@ -176,12 +179,11 @@ const generateCode = (templates, originalCode, sourceFile, checker) => {
     }
     let ctx = {
         checker,
-        hoistedFactories: new Map(),
-        htmlToTemplateId: new Map(),
-        neededImports: new Set(['template']),
+        imports: existingAliases ?? new Map(),
         printer,
-        sourceFile
-    }, replacements = [];
+        sourceFile,
+        templates: new Map(),
+    }, 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++) {
@@ -206,19 +208,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} = template(\`${html}\`);`);
+    if (changed && ctx.templates.size > 0) {
+        let aliasedImports = [], factories = [], updatedSourceFile = ts.createSourceFile(sourceFile.fileName, code, sourceFile.languageVersion, true);
+        for (let [name, alias] of ctx.imports) {
+            aliasedImports.push(`${name} as ${alias}`);
         }
-        code = imports.modify(factories.join('\n') + code, sourceFile, PACKAGE, {
-            add: ctx.neededImports,
+        for (let [html, id] of ctx.templates) {
+            factories.push(`const ${id} = ${templateAlias}(\`${html}\`);`);
+        }
+        code = imports.modify(code, updatedSourceFile, 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;
     }
@@ -227,7 +233,7 @@ const generateReactiveInlining = (calls, code, sourceFile) => {
         let call = calls[i];
         replacements.push({
             end: call.end,
-            newText: `new ArraySlot(
+            newText: `new ${arraySlotAlias}(
                 ${printer.printNode(ts.EmitHint.Expression, call.arrayArg, sourceFile)},
                 ${printer.printNode(ts.EmitHint.Expression, call.callbackArg, sourceFile)}
             )`,
@@ -236,9 +242,4 @@ const generateReactiveInlining = (calls, code, sourceFile) => {
     }
     return c.replaceReverse(code, replacements);
 };
-const needsArraySlotImport = (sourceFile) => {
-    return ast.hasMatch(sourceFile, n => ts.isNewExpression(n) &&
-        ts.isIdentifier(n.expression) &&
-        n.expression.text === 'ArraySlot') && !hasArraySlotImport(sourceFile);
-};
-export { generateCode, generateReactiveInlining, needsArraySlotImport };
+export { generateCode, generateReactiveInlining };

package/build/compiler/index.d.ts

@@ -1,8 +1,10 @@
+import type { PluginContext } from '@esportsplus/typescript/compiler';
 import { ts } from '@esportsplus/typescript';
 type TransformResult = {
     changed: boolean;
     code: string;
     sourceFile: ts.SourceFile;
 };
-declare const transform: (sourceFile: ts.SourceFile, program: ts.Program) => TransformResult;
-export { transform };
+declare const analyze: (sourceFile: ts.SourceFile, program: ts.Program, context: PluginContext) => void;
+declare const transform: (sourceFile: ts.SourceFile, program: ts.Program, context?: PluginContext) => TransformResult;
+export { analyze, transform };

package/build/compiler/index.js

@@ -1,45 +1,82 @@
 import { ts } from '@esportsplus/typescript';
-import { code as c, imports } from '@esportsplus/typescript/compiler';
+import { code as c, imports, uid } from '@esportsplus/typescript/compiler';
 import { COMPILER_ENTRYPOINT, COMPILER_ENTRYPOINT_REACTIVITY, PACKAGE } from '../constants.js';
-import { generateCode, generateReactiveInlining, needsArraySlotImport } from './codegen.js';
+import { generateCode, generateReactiveInlining } from './codegen.js';
 import { findHtmlTemplates, findReactiveCalls } from './ts-parser.js';
+const CONTEXT_KEY = 'template:analyzed';
 const PATTERNS = [`${COMPILER_ENTRYPOINT}\``, `${COMPILER_ENTRYPOINT}.${COMPILER_ENTRYPOINT_REACTIVITY}`];
 const REGEX_BACKSLASH = /\\/g;
 const REGEX_FORWARD_SLASH = /\//g;
-const transform = (sourceFile, program) => {
+function getAnalyzedFile(context, filename) {
+    return context?.get(CONTEXT_KEY)?.get(filename);
+}
+const analyze = (sourceFile, program, context) => {
     let code = sourceFile.getFullText();
     if (!c.contains(code, { patterns: PATTERNS })) {
-        return { changed: false, code, sourceFile };
+        return;
     }
-    let checker, fileName = sourceFile.fileName, programSourceFile = program.getSourceFile(fileName)
-        || program.getSourceFile(fileName.replace(REGEX_BACKSLASH, '/'))
-        || program.getSourceFile(fileName.replace(REGEX_FORWARD_SLASH, '\\'));
+    let checker = program.getTypeChecker(), filename = sourceFile.fileName, files = context.get(CONTEXT_KEY), programSourceFile = program.getSourceFile(filename)
+        || program.getSourceFile(filename.replace(REGEX_BACKSLASH, '/'))
+        || program.getSourceFile(filename.replace(REGEX_FORWARD_SLASH, '\\'));
     if (programSourceFile) {
-        checker = program.getTypeChecker();
         sourceFile = programSourceFile;
     }
-    let changed = false, codegenChanged = false, needsImport = false, reactiveCalls = findReactiveCalls(sourceFile, checker), result = code;
-    if (reactiveCalls.length > 0) {
+    if (!files) {
+        files = new Map();
+        context.set(CONTEXT_KEY, files);
+    }
+    files.set(filename, {
+        reactiveCalls: findReactiveCalls(sourceFile, checker),
+        templates: findHtmlTemplates(sourceFile, checker)
+    });
+};
+const transform = (sourceFile, program, context) => {
+    let code = sourceFile.getFullText(), filename = sourceFile.fileName;
+    let analyzed = getAnalyzedFile(context, filename);
+    if (!analyzed) {
+        if (!c.contains(code, { patterns: PATTERNS })) {
+            return { changed: false, code, sourceFile };
+        }
+        let checker = program.getTypeChecker(), programSourceFile = program.getSourceFile(filename)
+            || program.getSourceFile(filename.replace(REGEX_BACKSLASH, '/'))
+            || program.getSourceFile(filename.replace(REGEX_FORWARD_SLASH, '\\'));
+        if (programSourceFile) {
+            sourceFile = programSourceFile;
+        }
+        analyzed = {
+            reactiveCalls: findReactiveCalls(sourceFile, checker),
+            templates: findHtmlTemplates(sourceFile, checker)
+        };
+    }
+    let changed = false, codegenChanged = false, existingAliases = new Map(), result = code;
+    if (analyzed.reactiveCalls.length > 0) {
         changed = true;
-        result = generateReactiveInlining(reactiveCalls, result, sourceFile);
+        existingAliases.set('ArraySlot', uid('ArraySlot'));
+        result = generateReactiveInlining(analyzed.reactiveCalls, result, sourceFile, existingAliases.get('ArraySlot'));
         sourceFile = ts.createSourceFile(sourceFile.fileName, result, sourceFile.languageVersion, true);
-        needsImport = needsArraySlotImport(sourceFile);
+        analyzed = {
+            reactiveCalls: [],
+            templates: findHtmlTemplates(sourceFile, program.getTypeChecker())
+        };
     }
-    let templates = findHtmlTemplates(sourceFile, checker);
-    if (templates.length > 0) {
-        let codegenResult = generateCode(templates, result, sourceFile, checker);
+    if (analyzed.templates.length > 0) {
+        let codegenResult = generateCode(analyzed.templates, result, sourceFile, program.getTypeChecker(), existingAliases);
         if (codegenResult.changed) {
             changed = true;
             codegenChanged = true;
             result = codegenResult.code;
         }
     }
-    if (needsImport && !codegenChanged) {
-        result = imports.modify(result, sourceFile, PACKAGE, { add: ['ArraySlot'] });
+    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);
     }
     return { changed, code: result, sourceFile };
 };
-export { transform };
+export { analyze, transform };

package/build/compiler/plugins/tsc.js

@@ -1,3 +1,3 @@
 import { plugin } from '@esportsplus/typescript/compiler';
-import { transform } from '../index.js';
-export default plugin.tsc(transform);
+import { analyze, transform } from '../index.js';
+export default plugin.tsc({ analyze, transform });

package/build/compiler/plugins/vite.d.ts

@@ -1,13 +1,13 @@
 declare const _default: ({ root }?: {
     root?: string;
 }) => {
-    configResolved(config: import("vite").ResolvedConfig): void;
-    enforce: string;
+    configResolved: (config: unknown) => void;
+    enforce: "pre";
     name: string;
-    transform(code: string, id: string): {
+    transform: (code: string, id: string) => {
         code: string;
         map: null;
     } | null;
-    watchChange(id: string): void;
+    watchChange: (id: string) => void;
 };
 export default _default;

package/build/compiler/plugins/vite.js

@@ -1,7 +1,8 @@
 import { plugin } from '@esportsplus/typescript/compiler';
 import { PACKAGE } from '../../constants.js';
-import { transform } from '../index.js';
+import { analyze, transform } from '../index.js';
 export default plugin.vite({
+    analyze,
     name: PACKAGE,
     transform
 });

package/build/compiler/ts-parser.js

@@ -19,8 +19,8 @@ function isHtmlFromPackage(node, checker) {
         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')) {
+        let filename = declarations[i].getSourceFile().fileName;
+        if (filename.includes(PACKAGE) || filename.includes('@esportsplus/template')) {
             return true;
         }
     }

package/package.json

@@ -2,14 +2,14 @@
   "author": "ICJR",
   "dependencies": {
     "@esportsplus/queue": "^0.2.0",
-    "@esportsplus/reactivity": "^0.27.0",
+    "@esportsplus/reactivity": "^0.27.3",
+    "@esportsplus/typescript": "^0.24.2",
     "@esportsplus/utilities": "^0.27.2",
     "serve": "^14.2.5"
   },
   "devDependencies": {
-    "@esportsplus/typescript": "^0.22.0",
     "@types/node": "^25.0.3",
-    "vite": "^7.3.0",
+    "vite": "^7.3.1",
     "vite-tsconfig-paths": "^6.0.3"
   },
   "exports": {
@@ -35,7 +35,7 @@
   },
   "type": "module",
   "types": "./build/index.d.ts",
-  "version": "0.35.0",
+  "version": "0.37.0",
   "scripts": {
     "build": "tsc",
     "build:test": "vite build --config test/vite.config.ts",

package/src/attributes.ts

@@ -61,7 +61,7 @@ function list(
         changed = false,
         delimiter = delimiters[name],
         store = (ctx ??= context(element)).store ??= {},
-        dynamic = store[name] as Set<string> | undefined;
+        dynamic = store[name] as Set<string>;
 
     if (dynamic === undefined) {
         let value = (element.getAttribute(name) || '').trim();
@@ -105,7 +105,7 @@ function list(
             }
         }
 
-        let cold = store[id] as Record<PropertyKey, true> | undefined;
+        let cold = store[id] as Record<PropertyKey, true>;
 
         if (cold !== undefined) {
             for (let part in cold) {
@@ -274,7 +274,7 @@ function task() {
 }
 
 
-const setClass = (element: Element, classlist: false | string | undefined, value: unknown) => {
+const setClass = (element: Element, classlist: false | string, value: unknown) => {
     let ctx = context(element),
         store = ctx.store ??= {};
 
@@ -298,8 +298,11 @@ const setProperty = (element: Element, name: string, value: unknown) => {
     }
 };
 
-const setProperties = function (element: Element, value: Attributes | Attributes[]) {
-    if (isObject(value)) {
+const setProperties = function (element: Element, value?: Attributes | Attributes[] | false | null | undefined) {
+    if (!value) {
+        return;
+    }
+    else if (isObject(value)) {
         for (let name in value) {
             let v = value[name];
 
@@ -317,7 +320,7 @@ const setProperties = function (element: Element, value: Attributes | Attributes
     }
 };
 
-const setStyle = (element: Element, styles: false | string | undefined, value: unknown) => {
+const setStyle = (element: Element, styles: false | string, value: unknown) => {
     let ctx = context(element),
         store = ctx.store ??= {};