nexa-compiler 0.7.1 → 0.7.3

package/dist/codegen/render.d.ts

@@ -10,11 +10,12 @@ export declare function generateComponentCode(sfc: {
     setup?: boolean;
     scoped: boolean;
     hmrId?: string;
-}): string;
+}, filename?: string): string;
 export declare function generateComponentCodeWithSourceMap(sfc: {
     template: string | null;
     script: string | null;
     style: string | null;
+    setup?: boolean;
     scoped: boolean;
     hmrId?: string;
 }, options?: GenerateOptions): {

package/dist/codegen/render.js

@@ -2,7 +2,8 @@ import { transformStyle } from '../transform/style.js';
 import { generateSourceMap } from './sourcemap.js';
 import { parseDefineProps, parseDefineEmits, stripMacroLines, extractBindings, extractImportBindings } from './macros.js';
 import { generateRenderCode } from './template.js';
-export function generateComponentCode(sfc) {
+import { validateTemplateBindings } from './validate.js';
+export function generateComponentCode(sfc, filename) {
     const lines = [];
     const scriptContent = sfc.script || '';
     const importRegex = /import\s+[\s\S]*?\s+from\s+['"][^'"]+['"]|import\s+['"][^'"]+['"]/g;
@@ -163,6 +164,8 @@ export function generateComponentCode(sfc) {
     lines.push('');
     lines.push(`const _sfc_main = ${componentDefinition}`);
     if (sfc.template) {
+        const renderBindings = [...new Set([...allBindings, ...propsKeys])];
+        validateTemplateBindings(sfc.template, renderBindings, filename);
         lines.push('// Injected render function');
         lines.push('_sfc_main.render = function(ctx) {');
         const usedBuiltIns = ['Fragment'];
@@ -170,7 +173,6 @@ export function generateComponentCode(sfc) {
             usedBuiltIns.push('Teleport');
         if (sfc.template.includes('<Transition'))
             usedBuiltIns.push('Transition');
-        const renderBindings = [...new Set([...allBindings, ...propsKeys])];
         const componentBindings = renderBindings.map(b => /^[A-Z]/.test(b) ? `${b}: _ntc_${b}` : b);
         const allRenderBindings = [...componentBindings, ...usedBuiltIns.map(b => `${b}: _ntc_${b}`)];
         if (allRenderBindings.length > 0) {
@@ -195,11 +197,10 @@ export function generateComponentCode(sfc) {
     return lines.join('\n');
 }
 export function generateComponentCodeWithSourceMap(sfc, options = {}) {
-    const code = generateComponentCode(sfc);
+    const code = generateComponentCode(sfc, options.filename);
     if (!options.sourceMap || !options.filename || !options.source) {
         return { code, map: null };
     }
-    const scriptLines = (options.source.split('\n<script')[0].match(/\n/g) || []).length + 2;
-    const map = generateSourceMap(options.filename, code, options.source, scriptLines);
+    const map = generateSourceMap(options.filename, code, options.source);
     return { code, map };
 }

package/dist/codegen/sourcemap.d.ts

@@ -1 +1 @@
-export declare function generateSourceMap(filename: string, code: string, source: string, scriptLineCount: number): string;
+export declare function generateSourceMap(filename: string, code: string, source: string): string | null;

package/dist/codegen/sourcemap.js

@@ -17,7 +17,7 @@ function encodeVLQ(value) {
     }
     return result;
 }
-function encodeMappings(generatedLines, scriptLines, _templateLineStart) {
+function encodeMappings(generatedLines, lineMap) {
     let result = '';
     let lastGenCol = 0;
     let lastSrcIdx = 0;
@@ -26,36 +26,74 @@ function encodeMappings(generatedLines, scriptLines, _templateLineStart) {
     for (let genLine = 0; genLine < generatedLines; genLine++) {
         if (genLine > 0)
             result += ';';
-        if (genLine < scriptLines) {
-            const srcLine = genLine;
-            const genCol = 0;
-            const srcCol = 0;
-            const srcIdx = 0;
-            const dGenCol = genCol - lastGenCol;
-            const dSrcIdx = srcIdx - lastSrcIdx;
-            const dSrcLine = srcLine - lastSrcLine;
-            const dSrcCol = srcCol - lastSrcCol;
-            result += encodeVLQ(dGenCol);
-            result += encodeVLQ(dSrcIdx);
-            result += encodeVLQ(dSrcLine);
-            result += encodeVLQ(dSrcCol);
-            lastGenCol = genCol;
-            lastSrcIdx = srcIdx;
-            lastSrcLine = srcLine;
-            lastSrcCol = srcCol;
-        }
+        const srcLine = lineMap[genLine];
+        const dGenCol = 0 - lastGenCol;
+        const dSrcIdx = 0 - lastSrcIdx;
+        const dSrcLine = srcLine - lastSrcLine;
+        const dSrcCol = 0 - lastSrcCol;
+        result += encodeVLQ(dGenCol);
+        result += encodeVLQ(dSrcIdx);
+        result += encodeVLQ(dSrcLine);
+        result += encodeVLQ(dSrcCol);
+        lastGenCol = 0;
+        lastSrcIdx = 0;
+        lastSrcLine = srcLine;
+        lastSrcCol = 0;
     }
     return result;
 }
-export function generateSourceMap(filename, code, source, scriptLineCount) {
-    const generatedLines = code.split('\n').length;
+export function generateSourceMap(filename, code, source) {
+    if (!code || !source)
+        return null;
+    const genLines = code.split('\n');
+    const srcLines = source.split('\n');
+    const generatedLines = genLines.length;
+    const templateOpen = srcLines.findIndex(l => l.trim().startsWith('<template'));
+    const templateClose = srcLines.findIndex(l => l.trim().startsWith('</template'));
+    const templateContentStart = templateOpen >= 0 ? templateOpen + 1 : 0;
+    const templateContentEnd = templateClose >= 0 ? templateClose - 1 : srcLines.length - 1;
+    const templateContentCount = Math.max(1, templateContentEnd - templateContentStart + 1);
+    const renderFuncLine = genLines.findIndex(l => /_sfc_main\.render\s*=/.test(l));
+    const lineMap = [];
+    if (renderFuncLine < 0) {
+        for (let i = 0; i < generatedLines; i++) {
+            lineMap.push(Math.min(i, srcLines.length - 1));
+        }
+    }
+    else {
+        let renderBodyStart = renderFuncLine + 1;
+        let renderDepth = 0;
+        let renderBodyEnd = genLines.length;
+        if (genLines[renderFuncLine].includes('{')) {
+            renderDepth = (genLines[renderFuncLine].match(/\{/g) || []).length;
+            renderDepth -= (genLines[renderFuncLine].match(/\}/g) || []).length;
+        }
+        for (let i = renderFuncLine + 1; i < genLines.length; i++) {
+            const opens = (genLines[i].match(/\{/g) || []).length;
+            const closes = (genLines[i].match(/\}/g) || []).length;
+            renderDepth += opens - closes;
+            if (renderDepth <= 0) {
+                renderBodyEnd = i;
+                break;
+            }
+        }
+        for (let genLine = 0; genLine < generatedLines; genLine++) {
+            if (genLine >= renderBodyStart && genLine < renderBodyEnd) {
+                const relativeLine = genLine - renderBodyStart;
+                lineMap.push(templateContentStart + (relativeLine % templateContentCount));
+            }
+            else {
+                lineMap.push(0);
+            }
+        }
+    }
     const map = {
         version: 3,
         file: filename.replace(/\.nexa$/, '.js'),
         sources: [filename],
         sourcesContent: [source],
         names: [],
-        mappings: encodeMappings(generatedLines, scriptLineCount, 0),
+        mappings: encodeMappings(generatedLines, lineMap),
     };
     return JSON.stringify(map);
 }

package/dist/codegen/template.js

@@ -40,7 +40,13 @@ function genIf(node) {
 }
 function genFor(node) {
     const childrenCode = node.children.length === 1 ? genNode(node.children[0]) : `h("div", null, [\n        ${node.children.map(genNode).join(',\n        ')}\n      ])`;
-    return `${node.list}.map((${node.item}, ${node.index}) => ${childrenCode})`;
+    return genForIterate(node.list, node.item, node.index, childrenCode);
+}
+function genForIterate(list, item, index, body) {
+    if (/^\d+$/.test(list)) {
+        return `Array.from({length: ${list}}, (_, ${item}) =>\n        ${body}\n      )`;
+    }
+    return `(${list}).map((${item}, ${index}) =>\n        ${body}\n      )`;
 }
 function genElement(node) {
     const { tag, props, children } = node;
@@ -48,7 +54,7 @@ function genElement(node) {
     const elementCode = buildElementCode(tag, props, childStr, node.scopeId);
     if (node.vFor) {
         const { item, index, list } = node.vFor;
-        return `${list}.map((${item}, ${index}) =>\n        ${elementCode}\n      )`;
+        return genForIterate(list, item, index, elementCode);
     }
     // Note: v-if is handled by transformChildren and genIf
     return elementCode;

package/dist/codegen/validate.d.ts

@@ -0,0 +1 @@
+export declare function validateTemplateBindings(template: string, knownBindings: string[], filename?: string): void;

package/dist/codegen/validate.js

@@ -0,0 +1,138 @@
+const JS_GLOBALS = new Set([
+    'Math', 'JSON', 'console', 'Object', 'Array', 'Number', 'String',
+    'Boolean', 'Date', 'RegExp', 'Map', 'Set', 'Promise', 'Symbol',
+    'parseInt', 'parseFloat', 'isNaN', 'isFinite', 'undefined', 'null',
+    'true', 'false', 'this', 'NaN', 'Infinity', 'globalThis',
+    'Error', 'TypeError', 'RangeError', 'SyntaxError', 'ReferenceError',
+    'Intl', 'URL', 'URLSearchParams', 'AbortController', 'AbortSignal',
+    'setTimeout', 'setInterval', 'clearTimeout', 'clearInterval',
+    'requestAnimationFrame', 'cancelAnimationFrame',
+    'window', 'document', 'localStorage', 'sessionStorage',
+    'fetch', 'navigator', 'history', 'location', 'location',
+    '$event', 'event',
+    'h', 'hText', 'Fragment', 'Teleport', 'Transition',
+    'in', 'of', 'typeof', 'instanceof', 'delete', 'void',
+]);
+const PROPERTY_NAMES = new Set([
+    'length', 'name', 'value', 'id', 'key', 'title', 'type', 'size',
+    'x', 'y', 'w', 'h', 'top', 'bottom', 'left', 'right',
+    'slice', 'charAt', 'charCodeAt', 'toUpperCase', 'toLowerCase', 'trim',
+    'toString', 'toFixed', 'toPrecision', 'toExponential',
+    'map', 'filter', 'reduce', 'reduceRight', 'forEach', 'find', 'findIndex',
+    'push', 'pop', 'shift', 'unshift', 'splice', 'concat', 'join', 'split',
+    'indexOf', 'lastIndexOf', 'includes', 'has', 'every', 'some', 'sort',
+    'keys', 'values', 'entries', 'from', 'of',
+    'prototype', 'constructor', 'call', 'apply', 'bind',
+    'column', 'columns', 'data', 'row', 'rows', 'index', 'idx',
+    'option', 'options', 'item', 'items', 'group', 'groups',
+    'field', 'fields', 'label', 'labels', 'icon', 'icons',
+    'footer', 'header', 'slot', 'scopedSlots',
+    'message', 'messages', 'toast', 'toasts', 'tab', 'tabs',
+    'step', 'page', 'pages', 'mode', 'theme',
+]);
+export function validateTemplateBindings(template, knownBindings, filename) {
+    if (!template)
+        return;
+    const known = new Set(knownBindings);
+    const used = new Set();
+    const forLoopVars = new Set();
+    const mustacheRe = /\{\{(.*?)\}\}/g;
+    let m;
+    while ((m = mustacheRe.exec(template)) !== null) {
+        extractUsedIds(m[1].trim(), used, forLoopVars);
+    }
+    const attrRe = /([\w.-]+)\s*=\s*(?:"([^"]*)"|'([^']*)')/g;
+    while ((m = attrRe.exec(template)) !== null) {
+        const attrName = m[1];
+        const value = m[2] ?? m[3];
+        if (!value)
+            continue;
+        if (attrName === 'v-for') {
+            const forParts = value.match(/^\s*(?:\(?\s*(\w+)\s*(?:,\s*(\w+))?\s*\)?\s+)?(?:in|of)\s+([\s\S]+)$/);
+            if (forParts) {
+                if (forParts[1])
+                    forLoopVars.add(forParts[1]);
+                if (forParts[2])
+                    forLoopVars.add(forParts[2]);
+                const listExpr = forParts[3].trim();
+                if (!/^\d+$/.test(listExpr)) {
+                    extractUsedIds(listExpr, used, forLoopVars);
+                }
+            }
+        }
+        else if (attrName.startsWith(':') || attrName.startsWith('@') || attrName.startsWith('v-')) {
+            extractUsedIds(value, used, forLoopVars);
+        }
+    }
+    const missing = [];
+    for (const id of used) {
+        if (JS_GLOBALS.has(id))
+            continue;
+        if (PROPERTY_NAMES.has(id))
+            continue;
+        if (forLoopVars.has(id))
+            continue;
+        if (known.has(id))
+            continue;
+        missing.push(id);
+    }
+    if (missing.length > 0) {
+        const source = filename ? ` in ${filename}` : '';
+        const listed = [...new Set(missing)].sort().join(', ');
+        console.warn(`[nexa-compiler]${source} template references undefined binding(s): ${listed}. ` +
+            `Make sure these are declared in <script setup> or passed as props.`);
+    }
+}
+function extractUsedIds(expr, used, loopVars) {
+    let inString = null;
+    let prevDot = false;
+    let braceDepth = 0;
+    for (let i = 0; i < expr.length; i++) {
+        const c = expr[i];
+        if ((c === "'" || c === '"' || c === '`') && expr[i - 1] !== '\\') {
+            if (!inString)
+                inString = c;
+            else if (inString === c)
+                inString = null;
+            continue;
+        }
+        if (inString)
+            continue;
+        if (c === '{') {
+            braceDepth++;
+            continue;
+        }
+        if (c === '}') {
+            braceDepth = Math.max(0, braceDepth - 1);
+            prevDot = false;
+            continue;
+        }
+        if (c === '.') {
+            prevDot = true;
+            continue;
+        }
+        if (/[a-zA-Z_$]/.test(c)) {
+            const start = i;
+            while (i < expr.length && /[\w$]/.test(expr[i])) {
+                i++;
+            }
+            const ident = expr.slice(start, i);
+            if (ident && !prevDot) {
+                const isObjectKey = braceDepth > 0 && skipSpace(expr, i) === ':';
+                if (!isObjectKey) {
+                    used.add(ident);
+                }
+            }
+            prevDot = false;
+            i--;
+            continue;
+        }
+        prevDot = false;
+    }
+}
+function skipSpace(s, i) {
+    while (i < s.length && (s[i] === ' ' || s[i] === '\t' || s[i] === '\n' || s[i] === '\r')) {
+        i++;
+    }
+    return s[i];
+}

package/dist/parse/errors.d.ts

@@ -0,0 +1,48 @@
+export interface SourceLocation {
+    line: number;
+    column: number;
+    offset: number;
+}
+export interface CompilerError {
+    code: string;
+    message: string;
+    location: SourceLocation;
+    endLocation?: SourceLocation;
+    suggestion?: string;
+    helpUrl?: string;
+}
+declare const ERROR_CODES: {
+    readonly E001: "UNCLOSED_TAG";
+    readonly E002: "UNEXPECTED_CLOSING_TAG";
+    readonly E003: "INVALID_TAG_NAME";
+    readonly E004: "MALFORMED_ATTRIBUTE";
+    readonly E005: "MISSING_ATTRIBUTE_VALUE";
+    readonly E006: "INVALID_EXPRESSION";
+    readonly E007: "UNCLOSED_MUSTACHE";
+    readonly E008: "V_FOR_REQUIRED";
+    readonly E009: "V_IF_REQUIRED";
+    readonly E010: "SELF_CLOSING_NON_VOID";
+    readonly E011: "DUPLICATE_ATTRIBUTE";
+    readonly E012: "INVALID_DIRECTIVE";
+    readonly E013: "UNCLOSED_COMMENT";
+    readonly E014: "NESTED_SFC_TAG";
+    readonly E015: "MISSING_CLOSING_BRACKET";
+};
+type ErrorCode = keyof typeof ERROR_CODES;
+export declare class NexaCompilerError extends Error {
+    readonly code: string;
+    readonly location: SourceLocation;
+    readonly endLocation?: SourceLocation;
+    readonly suggestion?: string;
+    readonly helpUrl?: string;
+    constructor(error: CompilerError);
+    toString(): string;
+    toMarkdown(): string;
+}
+export declare function createError(code: ErrorCode, message: string, location: SourceLocation, options?: {
+    endLocation?: SourceLocation;
+    suggestion?: string;
+    helpUrl?: string;
+}): NexaCompilerError;
+export declare function getErrorHelp(code: string): string | undefined;
+export { ERROR_CODES };

package/dist/parse/errors.js

@@ -0,0 +1,94 @@
+const ERROR_CODES = {
+    E001: 'UNCLOSED_TAG',
+    E002: 'UNEXPECTED_CLOSING_TAG',
+    E003: 'INVALID_TAG_NAME',
+    E004: 'MALFORMED_ATTRIBUTE',
+    E005: 'MISSING_ATTRIBUTE_VALUE',
+    E006: 'INVALID_EXPRESSION',
+    E007: 'UNCLOSED_MUSTACHE',
+    E008: 'V_FOR_REQUIRED',
+    E009: 'V_IF_REQUIRED',
+    E010: 'SELF_CLOSING_NON_VOID',
+    E011: 'DUPLICATE_ATTRIBUTE',
+    E012: 'INVALID_DIRECTIVE',
+    E013: 'UNCLOSED_COMMENT',
+    E014: 'NESTED_SFC_TAG',
+    E015: 'MISSING_CLOSING_BRACKET',
+};
+export class NexaCompilerError extends Error {
+    code;
+    location;
+    endLocation;
+    suggestion;
+    helpUrl;
+    constructor(error) {
+        super(error.message);
+        this.name = 'NexaCompilerError';
+        this.code = error.code;
+        this.location = error.location;
+        this.endLocation = error.endLocation;
+        this.suggestion = error.suggestion;
+        this.helpUrl = error.helpUrl;
+    }
+    toString() {
+        const location = formatLocation(this.location);
+        let result = `\n${this.code}: ${this.message}\n`;
+        result += `  at ${location}\n`;
+        if (this.suggestion) {
+            result += `\n  Suggestion: ${this.suggestion}\n`;
+        }
+        return result;
+    }
+    toMarkdown() {
+        const location = formatLocation(this.location);
+        let result = `### ${this.code}: ${this.message}\n\n`;
+        result += `**Location:** ${location}\n`;
+        if (this.suggestion) {
+            result += `\n**Suggestion:** ${this.suggestion}\n`;
+        }
+        if (this.helpUrl) {
+            result += `\n**Learn more:** ${this.helpUrl}\n`;
+        }
+        return result;
+    }
+}
+function formatLocation(loc) {
+    return `${loc.line}:${loc.column}`;
+}
+function getLineCol(text, offset) {
+    const lines = text.slice(0, offset).split('\n');
+    return {
+        line: lines.length,
+        column: (lines[lines.length - 1]?.length || 0) + 1,
+        offset,
+    };
+}
+export function createError(code, message, location, options) {
+    return new NexaCompilerError({
+        code: ERROR_CODES[code],
+        message,
+        location,
+        ...options,
+    });
+}
+export function getErrorHelp(code) {
+    const helpUrls = {
+        E001: 'https://nexajs.dev/docs/compiler/errors#e001',
+        E002: 'https://nexajs.dev/docs/compiler/errors#e002',
+        E003: 'https://nexajs.dev/docs/compiler/errors#e003',
+        E004: 'https://nexajs.dev/docs/compiler/errors#e004',
+        E005: 'https://nexajs.dev/docs/compiler/errors#e005',
+        E006: 'https://nexajs.dev/docs/compiler/errors#e006',
+        E007: 'https://nexajs.dev/docs/compiler/errors#e007',
+        E008: 'https://nexajs.dev/docs/compiler/errors#e008',
+        E009: 'https://nexajs.dev/docs/compiler/errors#e009',
+        E010: 'https://nexajs.dev/docs/compiler/errors#e010',
+        E011: 'https://nexajs.dev/docs/compiler/errors#e011',
+        E012: 'https://nexajs.dev/docs/compiler/errors#e012',
+        E013: 'https://nexajs.dev/docs/compiler/errors#e013',
+        E014: 'https://nexajs.dev/docs/compiler/errors#e014',
+        E015: 'https://nexajs.dev/docs/compiler/errors#e015',
+    };
+    return helpUrls[code];
+}
+export { ERROR_CODES };

package/dist/parse/template.js

@@ -1,40 +1,79 @@
+import { createError, getErrorHelp } from './errors.js';
 const tagRegex = /<(\/?)(\w[\w-]*)((?:\s+[^'">\s/]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^>\s/]+))?)*)\s*(\/?)>/g;
-const attrRegex = /([#@:]?[\w.-]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|(\{[^}]+\})))?/g;
+const attrRegex = /([#@:]?[\w.:-]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|(\{[^}]+\})))?/g;
 const mustacheRegex = /\{\{(.*?)\}\}/g;
+const voidElements = new Set([
+    'area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input',
+    'link', 'meta', 'param', 'source', 'track', 'wbr',
+]);
 export function parseTemplate(template) {
     template = template.replace(/<!--[\s\S]*?-->/g, '');
     const root = { type: 'root', children: [] };
-    const stack = [root.children];
+    const stack = [];
     let lastIndex = 0;
     let match;
     tagRegex.lastIndex = 0;
     while ((match = tagRegex.exec(template)) !== null) {
         const [, isClose, tag, attrsStr, selfClose] = match;
         const matchStart = match.index;
-        // Process text between tags
         if (matchStart > lastIndex) {
             const text = template.slice(lastIndex, matchStart);
             const nodes = parseText(text);
             for (const node of nodes) {
-                stack[stack.length - 1].push(node);
+                const parentStack = stack.length > 0 ? stack[stack.length - 1] : null;
+                if (parentStack && 'children' in parentStack.node) {
+                    parentStack.node.children.push(node);
+                }
+                else {
+                    root.children.push(node);
+                }
             }
         }
         if (isClose) {
-            // Closing tag
-            if (stack.length > 1) {
-                stack.pop();
+            if (stack.length === 0) {
+                const location = getLineCol(template, matchStart);
+                const topTag = stack.length > 0 ? stack[stack.length - 1].tag : null;
+                const suggestion = topTag
+                    ? `Did you mean to close </${topTag}> instead?`
+                    : `This closing tag has no matching opening tag.`;
+                throw createError('E002', `Unexpected closing tag </${tag}>`, location, {
+                    suggestion,
+                    helpUrl: getErrorHelp('E002'),
+                });
+            }
+            const parent = stack[stack.length - 1];
+            if (parent.tag !== tag) {
+                const location = getLineCol(template, matchStart);
+                throw createError('E002', `Unexpected closing tag </${tag}>. Expected </${parent.tag}>`, location, {
+                    suggestion: `Did you mean </${parent.tag}>?`,
+                    helpUrl: getErrorHelp('E002'),
+                });
+            }
+            stack.pop();
+            lastIndex = tagRegex.lastIndex;
+            continue;
+        }
+        const attrs = parseAttrs(attrsStr.trim(), template, matchStart);
+        const isVoid = isVoidElement(tag);
+        const isSelfClosing = selfClose === '/' || isVoid;
+        if (isSelfClosing) {
+            const parentStack = stack.length > 0 ? stack[stack.length - 1] : null;
+            const node = { type: 'element', tag, attrs, children: [], isSelfClosing: true };
+            if (parentStack && 'children' in parentStack.node) {
+                parentStack.node.children.push(node);
+            }
+            else {
+                root.children.push(node);
             }
             lastIndex = tagRegex.lastIndex;
             continue;
         }
-        const attrs = parseAttrs(attrsStr.trim());
-        const isSelfClosing = selfClose === '/' || isVoidElement(tag);
         const node = {
             type: 'element',
             tag,
             attrs,
             children: [],
-            isSelfClosing: isSelfClosing,
+            isSelfClosing: false,
         };
         const isSlot = tag === 'slot';
         if (isSlot) {
@@ -42,41 +81,66 @@ export function parseTemplate(template) {
                 type: 'slot',
                 name: attrs.find(a => a.name === 'name')?.value || 'default',
                 attrs,
-                children: []
+                children: [],
             };
-            stack[stack.length - 1].push(slotNode);
-            if (!isSelfClosing) {
-                stack.push(slotNode.children);
+            const parentStack = stack.length > 0 ? stack[stack.length - 1] : null;
+            if (parentStack && 'children' in parentStack.node) {
+                parentStack.node.children.push(slotNode);
+            }
+            else {
+                root.children.push(slotNode);
             }
+            stack.push({ tag, node: slotNode, start: matchStart });
         }
         else {
-            stack[stack.length - 1].push(node);
-            if (!isSelfClosing) {
-                stack.push(node.children);
+            const parentStack = stack.length > 0 ? stack[stack.length - 1] : null;
+            if (parentStack && 'children' in parentStack.node) {
+                parentStack.node.children.push(node);
             }
+            else {
+                root.children.push(node);
+            }
+            stack.push({ tag, node, start: matchStart });
         }
         lastIndex = tagRegex.lastIndex;
     }
-    // Process remaining text
+    if (stack.length > 0) {
+        const unclosed = stack[stack.length - 1];
+        const location = getLineCol(template, unclosed.start);
+        throw createError('E001', `Unclosed tag <${unclosed.tag}>`, location, {
+            suggestion: `Add closing </${unclosed.tag}> tag after the content.`,
+            helpUrl: getErrorHelp('E001'),
+        });
+    }
     if (lastIndex < template.length) {
         const text = template.slice(lastIndex);
         const nodes = parseText(text);
         for (const node of nodes) {
-            stack[stack.length - 1].push(node);
+            root.children.push(node);
         }
     }
     return root;
 }
-function parseAttrs(attrsStr) {
+function parseAttrs(attrsStr, template, tagStart) {
     if (!attrsStr)
         return [];
     const attrs = [];
     attrRegex.lastIndex = 0;
+    const seenAttrs = new Map();
     let match;
     while ((match = attrRegex.exec(attrsStr)) !== null) {
         let rawName = match[1];
         let quotedValue = match[2] ?? match[3] ?? match[4];
         const isDynamic = rawName.startsWith(':') || rawName.startsWith('@');
+        if (seenAttrs.has(rawName)) {
+            const attrIndex = tagStart + 4 + attrsStr.indexOf(rawName);
+            const location = getLineCol(template, attrIndex);
+            throw createError('E011', `Duplicate attribute "${rawName}"`, location, {
+                suggestion: `Remove one of the duplicate attributes.`,
+                helpUrl: getErrorHelp('E011'),
+            });
+        }
+        seenAttrs.set(rawName, match.index);
         let name;
         if (rawName.startsWith(':')) {
             name = rawName.slice(1);
@@ -102,6 +166,17 @@ function parseAttrs(attrsStr) {
     }
     return attrs;
 }
+function isVoidElement(tag) {
+    return voidElements.has(tag);
+}
+function getLineCol(text, offset) {
+    const lines = text.slice(0, offset).split('\n');
+    return {
+        line: lines.length,
+        column: (lines[lines.length - 1]?.length || 0) + 1,
+        offset,
+    };
+}
 function decodeEntities(text) {
     return text.replace(/&[a-zA-Z#]+;/g, match => {
         const entities = {
@@ -120,6 +195,10 @@ function parseText(text) {
         if (match.index > lastIdx) {
             nodes.push({ type: 'text', content: decodeEntities(text.slice(lastIdx, match.index)) });
         }
+        if (!match[1].trim()) {
+            lastIdx = mustacheRegex.lastIndex;
+            continue;
+        }
         nodes.push({ type: 'expression', content: match[1].trim() });
         lastIdx = mustacheRegex.lastIndex;
     }
@@ -128,10 +207,3 @@ function parseText(text) {
     }
     return nodes;
 }
-const voidElements = new Set([
-    'area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input',
-    'link', 'meta', 'param', 'source', 'track', 'wbr',
-]);
-function isVoidElement(tag) {
-    return voidElements.has(tag);
-}

package/dist/transform/template.js

@@ -7,6 +7,13 @@ function transformNode(node, scopeId) {
         case 'comment':
             return { type: 'comment' };
         case 'element': {
+            if (node.tag === 'slot') {
+                const dynamicAttrs = node.attrs.filter(a => a.dynamic && a.name !== 'name');
+                const slotProps = dynamicAttrs.length > 0
+                    ? dynamicAttrs.map(a => `${a.name}: ${a.value}`).join(', ')
+                    : undefined;
+                return { type: 'slot', name: node.attrs.find(a => a.name === 'name')?.value || 'default', slotProps, children: node.children?.map(c => transformNode(c)) };
+            }
             const vForAttr = node.attrs.find(a => a.name === 'v-for');
             const vIfAttr = node.attrs.find(a => a.name === 'v-if');
             const filteredAttrs = node.attrs.filter(a => a.name !== 'v-if' && a.name !== 'v-for');
@@ -118,10 +125,16 @@ function genProps(attrs, tag) {
             continue;
         if (attr.name === 'class')
             continue;
+        if (tag === 'slot' && attr.name === 'name')
+            continue;
         let propName = attr.name;
         if (propName.startsWith('v-')) {
             propName = propName.split('-').map((s, i) => i === 0 ? s : s.charAt(0).toUpperCase() + s.slice(1)).join('');
         }
+        const isComponentTag = /^[A-Z]/.test(tag) || tag.includes('-');
+        if (isComponentTag && propName.includes('-')) {
+            propName = propName.replace(/-([a-z])/g, (_, c) => c.toUpperCase());
+        }
         if (propName === 'vShow' && typeof attr.value === 'string') {
             parts.push(`${propName}: ${attr.value}`);
         }
@@ -164,7 +177,8 @@ function genProps(attrs, tag) {
                     handler = `($event) => { $event.stopPropagation(); (${handler})($event) }`;
                 }
             }
-            parts.push(`${realName}: ${handler}`);
+            const safeKey = /[^a-zA-Z0-9_$]/.test(realName) ? JSON.stringify(realName) : realName;
+            parts.push(`${safeKey}: ${handler}`);
         }
         else if (attr.dynamic) {
             const key = /[^a-zA-Z0-9_$]/.test(propName) ? JSON.stringify(propName) : propName;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nexa-compiler",
-  "version": "0.7.1",
+  "version": "0.7.3",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",