@lwc/ssr-compiler 8.12.1 → 8.12.2

package/dist/compile-js/errors.d.ts

@@ -0,0 +1,4 @@
+import { type LWCErrorInfo } from '@lwc/errors';
+type ExtractArguments<T extends string, Numbers extends number = never, Args extends string[] = []> = T extends `${string}{${infer N extends number}}${infer R}` ? N extends Numbers ? ExtractArguments<R, Numbers, Args> : ExtractArguments<R, N | Numbers, [string, ...Args]> : Args;
+export declare function generateError<const T extends LWCErrorInfo>(error: T, ...args: ExtractArguments<T['message']>): Error;
+export {};

package/dist/compile-js/lwc-import.d.ts

@@ -1,4 +1,4 @@
-import type { ImportDeclaration } from 'estree';
+import type { ImportDeclaration, ExportNamedDeclaration, ExportAllDeclaration } from 'estree';
 import type { NodePath } from 'estree-toolkit';
 import type { ComponentMetaState } from './types';
 /**
@@ -8,3 +8,11 @@ import type { ComponentMetaState } from './types';
  *  2. it makes note of the local var name associated with the `LightningElement` import
  */
 export declare function replaceLwcImport(path: NodePath<ImportDeclaration>, state: ComponentMetaState): void;
+/**
+ * This handles lwc barrel exports by replacing "lwc" with "@lwc/ssr-runtime"
+ */
+export declare function replaceNamedLwcExport(path: NodePath<ExportNamedDeclaration>): void;
+/**
+ * This handles all lwc barrel exports by replacing "lwc" with "@lwc/ssr-runtime"
+ */
+export declare function replaceAllLwcExport(path: NodePath<ExportAllDeclaration>): void;

package/dist/compile-js/types.d.ts

@@ -12,7 +12,6 @@ export interface ComponentMetaState {
     isLWC: boolean;
     hasConstructor: boolean;
     hasConnectedCallback: boolean;
-    hasRenderMethod: boolean;
     hadRenderedCallback: boolean;
     hadDisconnectedCallback: boolean;
     hadErrorCallback: boolean;

package/dist/compile-template/ir-to-es.d.ts

@@ -1,7 +1,7 @@
 import type { ChildNode as IrChildNode, Node as IrNode } from '@lwc/template-compiler';
 import type { Statement as EsStatement } from 'estree';
 import type { TemplateOpts, TransformerContext } from './types';
-export declare function irChildrenToEs(children: IrChildNode[], cxt: TransformerContext): EsStatement[];
+export declare function irChildrenToEs(children: IrChildNode[], cxt: TransformerContext, cb?: (child: IrChildNode) => (() => void) | void): EsStatement[];
 export declare function irToEs<T extends IrNode>(node: T, cxt: TransformerContext): EsStatement[];
 export declare function templateIrToEsTree(node: IrNode, contextOpts: TemplateOpts): {
     addImport: (imports: string | string[] | Record<string, string | undefined>, source?: string | undefined) => void;

package/dist/compile-template/transformers/legacyIf.d.ts

@@ -0,0 +1,3 @@
+import type { If as IrIf } from '@lwc/template-compiler';
+import type { Transformer } from '../types';
+export declare const LegacyIf: Transformer<IrIf>;

package/dist/compile-template/transformers/lwcIf.d.ts

@@ -0,0 +1,3 @@
+import type { ElseifBlock as IrElseifBlock, IfBlock as IrIfBlock } from '@lwc/template-compiler';
+import type { Transformer } from '../types';
+export declare const IfBlock: Transformer<IrIfBlock | IrElseifBlock>;

package/dist/estree/validators.d.ts

@@ -1,23 +1,5 @@
-import type { CallExpression, Identifier, MemberExpression } from 'estree';
 import type { Checker } from 'estree-toolkit/dist/generated/is-type';
 import type { Node } from 'estree-toolkit/dist/helpers';
-/** Node representing an identifier named "render". */
-type RenderIdentifier = Identifier & {
-    name: 'render';
-};
-/** Node representing a member expression `<something>.render`. */
-type RenderMemberExpression = MemberExpression & {
-    property: RenderIdentifier;
-};
-/** Node representing a method call `<something>.render()`. */
-type RenderCall = CallExpression & {
-    callee: RenderMemberExpression;
-};
-/** Returns `true` if the node is an identifier or `<something>.render()`. */
-export declare const isIdentOrRenderCall: {
-    (node: Node | null | undefined): node is Identifier | RenderCall;
-    __debugName: string;
-};
 /** A validator that returns `true` if the node is `null`. */
 type NullableChecker<T extends Node> = (node: Node | null | undefined) => node is T | null;
 /** Extends a validator to return `true` if the node is `null`. */

package/dist/index.cjs.js

@@ -9,11 +9,11 @@ var shared = require('@lwc/shared');
 var astring = require('astring');
 var estreeToolkit = require('estree-toolkit');
 var meriyah = require('meriyah');
+var errors = require('@lwc/errors');
 var immer = require('immer');
 var node_path = require('node:path');
 var acorn = require('acorn');
 var templateCompiler = require('@lwc/template-compiler');
-var errors = require('@lwc/errors');
 var builders = require('estree-toolkit/dist/builders');
 var types = require('@babel/types');
 var util = require('util');
@@ -288,7 +288,7 @@ _ImportManager_map = new WeakMap();
  *  2. it makes note of the local var name associated with the `LightningElement` import
  */
 function replaceLwcImport(path, state) {
-    if (!path.node || path.node.source.value !== 'lwc') {
+    if (!path.node || !isLwcSource(path)) {
         return;
     }
     for (const specifier of path.node.specifiers) {
@@ -299,7 +299,31 @@ function replaceLwcImport(path, state) {
             break;
         }
     }
-    path.replaceWith(estreeToolkit.builders.importDeclaration(path.node.specifiers, estreeToolkit.builders.literal('@lwc/ssr-runtime')));
+    path.replaceWith(estreeToolkit.builders.importDeclaration(structuredClone(path.node.specifiers), estreeToolkit.builders.literal('@lwc/ssr-runtime')));
+}
+/**
+ * This handles lwc barrel exports by replacing "lwc" with "@lwc/ssr-runtime"
+ */
+function replaceNamedLwcExport(path) {
+    if (!path.node || !isLwcSource(path)) {
+        return;
+    }
+    path.replaceWith(estreeToolkit.builders.exportNamedDeclaration(structuredClone(path.node.declaration), structuredClone(path.node.specifiers), estreeToolkit.builders.literal('@lwc/ssr-runtime')));
+}
+/**
+ * This handles all lwc barrel exports by replacing "lwc" with "@lwc/ssr-runtime"
+ */
+function replaceAllLwcExport(path) {
+    if (!path.node || !isLwcSource(path)) {
+        return;
+    }
+    path.replaceWith(estreeToolkit.builders.exportAllDeclaration(estreeToolkit.builders.literal('@lwc/ssr-runtime'), structuredClone(path.node.exported)));
+}
+/**
+ * Utility to determine if a node source is 'lwc'
+ */
+function isLwcSource(path) {
+    return path.node?.source?.value === 'lwc';
 }
 
 /*
@@ -518,36 +542,13 @@ function esTemplateWithYield(javascriptSegments, ...validators) {
 }
 
 /*
- * Copyright (c) 2024, salesforce.com, inc.
+ * Copyright (c) 2024, Salesforce, Inc.
  * All rights reserved.
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-/** Returns `true` if the node is an identifier or `<something>.render()`. */
-const isIdentOrRenderCall = (node) => {
-    return (estreeToolkit.is.identifier(node) ||
-        (estreeToolkit.is.callExpression(node) &&
-            estreeToolkit.is.memberExpression(node.callee) &&
-            estreeToolkit.is.identifier(node.callee.property) &&
-            node.callee.property.name === 'render'));
-};
-isIdentOrRenderCall.__debugName = 'identifier or .render() call';
-/** Extends a validator to return `true` if the node is `null`. */
-function isNullableOf(validator) {
-    const nullableValidator = (node) => {
-        return node === null || validator(node);
-    };
-    if (process.env.NODE_ENV !== 'production') {
-        nullableValidator.__debugName = `nullable(${validator.__debugName || validator.name || 'unknown validator'})`;
-    }
-    return nullableValidator;
-}
-isNullableOf.__debugName = 'isNullableOf';
-if (process.env.NODE_ENV !== 'production') {
-    // Modifying another package's exports is a code smell!
-    for (const [key, val] of shared.entries(estreeToolkit.is)) {
-        val.__debugName = key;
-    }
+function generateError(error, ...args) {
+    return new Error(errors.generateErrorMessage(error, args));
 }
 
 /*
@@ -567,8 +568,7 @@ function bMemberExpressionChain(props) {
 function getWireParams(node) {
     const { decorators } = node;
     if (decorators.length > 1) {
-        // TODO [#5032]: Harmonize errors thrown in `@lwc/ssr-compiler`
-        throw new Error('todo - multiple decorators at once');
+        throw generateError(errors.DecoratorErrors.ONE_WIRE_DECORATOR_ALLOWED);
     }
     // validate the parameters
     const wireDecorator = decorators[0].expression;
@@ -611,8 +611,7 @@ function validateWireId(id, path) {
     }
     // This is not the exact same validation done in @lwc/babel-plugin-component but it accomplishes the same thing
     if (path.scope?.getBinding(wireAdapterVar)?.kind !== 'module') {
-        // TODO [#5032]: Harmonize errors thrown in `@lwc/ssr-compiler`
-        throw new Error('todo - WIRE_ADAPTER_SHOULD_BE_IMPORTED');
+        throw generateError(errors.DecoratorErrors.COMPUTED_PROPERTY_MUST_BE_CONSTANT_OR_LITERAL);
     }
 }
 function validateWireConfig(config, path) {
@@ -648,8 +647,10 @@ function validateWireConfig(config, path) {
                 continue;
             }
         }
-        // TODO [#5032]: Harmonize errors thrown in `@lwc/ssr-compiler`
-        throw new Error('todo - COMPUTED_PROPERTY_MUST_BE_CONSTANT_OR_LITERAL');
+        else if (estreeToolkit.is.templateLiteral(key)) {
+            throw generateError(errors.DecoratorErrors.COMPUTED_PROPERTY_CANNOT_BE_TEMPLATE_LITERAL);
+        }
+        throw generateError(errors.DecoratorErrors.COMPUTED_PROPERTY_MUST_BE_CONSTANT_OR_LITERAL);
     }
 }
 function catalogWireAdapters(path, state) {
@@ -754,7 +755,10 @@ const bGenerateMarkup = (esTemplate `
             instance.connectedCallback();
             __mutationTracker.disable(instance);
         }
-        const tmplFn = ${isIdentOrRenderCall} ?? ${ /*component class*/3}[__SYMBOL__DEFAULT_TEMPLATE] ?? __fallbackTmpl;
+        // If a render() function is defined on the class or any of its superclasses, then that takes priority.
+        // Next, if the class or any of its superclasses has an implicitly-associated template, then that takes
+        // second priority (e.g. a foo.html file alongside a foo.js file). Finally, there is a fallback empty template.
+        const tmplFn = instance.render?.() ?? ${ /*component class*/3}[__SYMBOL__DEFAULT_TEMPLATE] ?? __fallbackTmpl;
         yield \`<\${tagName}\`;
 
         const hostHasScopedStylesheets =
@@ -794,20 +798,17 @@ const bExposeTemplate = (esTemplate `
  *  - deferring to the template function for yielding child content
  */
 function addGenerateMarkupFunction(program, state, tagName, filename) {
-    const { hasRenderMethod, privateFields, publicFields, tmplExplicitImports } = state;
+    const { privateFields, publicFields, tmplExplicitImports } = state;
     // The default tag name represents the component name that's passed to the transformer.
     // This is needed to generate markup for dynamic components which are invoked through
     // the generateMarkup function on the constructor.
     // At the time of generation, the invoker does not have reference to its tag name to pass as an argument.
     const defaultTagName = estreeToolkit.builders.literal(tagName);
     const classIdentifier = estreeToolkit.builders.identifier(state.lwcClassName);
-    const tmplVar = estreeToolkit.builders.identifier('tmpl');
-    const renderCall = hasRenderMethod
-        ? estreeToolkit.builders.callExpression(estreeToolkit.builders.memberExpression(estreeToolkit.builders.identifier('instance'), estreeToolkit.builders.identifier('render')), [])
-        : tmplVar;
     let exposeTemplateBlock = null;
     if (!tmplExplicitImports) {
         const defaultTmplPath = `./${node_path.parse(filename).name}.html`;
+        const tmplVar = estreeToolkit.builders.identifier('tmpl');
         program.body.unshift(bImportDeclaration({ default: tmplVar.name }, defaultTmplPath));
         program.body.unshift(bImportDeclaration({ SYMBOL__DEFAULT_TEMPLATE: '__SYMBOL__DEFAULT_TEMPLATE' }));
         exposeTemplateBlock = bExposeTemplate(tmplVar, classIdentifier);
@@ -828,7 +829,7 @@ function addGenerateMarkupFunction(program, state, tagName, filename) {
         SYMBOL__SET_INTERNALS: '__SYMBOL__SET_INTERNALS',
         establishContextfulRelationship: '__establishContextfulRelationship',
     }));
-    program.body.push(...bGenerateMarkup(defaultTagName, estreeToolkit.builders.arrayExpression(publicFields.map(estreeToolkit.builders.literal)), estreeToolkit.builders.arrayExpression(privateFields.map(estreeToolkit.builders.literal)), classIdentifier, connectWireAdapterCode, renderCall));
+    program.body.push(...bGenerateMarkup(defaultTagName, estreeToolkit.builders.arrayExpression(publicFields.map(estreeToolkit.builders.literal)), estreeToolkit.builders.arrayExpression(privateFields.map(estreeToolkit.builders.literal)), classIdentifier, connectWireAdapterCode));
     if (exposeTemplateBlock) {
         program.body.push(exposeTemplateBlock);
     }
@@ -861,6 +862,12 @@ function removeDecoratorImport(path) {
  */
 const visitors = {
     $: { scope: true },
+    ExportNamedDeclaration(path) {
+        replaceNamedLwcExport(path);
+    },
+    ExportAllDeclaration(path) {
+        replaceAllLwcExport(path);
+    },
     ImportDeclaration(path, state) {
         if (!path.node || !path.node.source.value || typeof path.node.source.value !== 'string') {
             return;
@@ -919,6 +926,7 @@ const visitors = {
             return;
         }
         const { decorators } = node;
+        validateUniqueDecorator(decorators);
         const decoratedExpression = decorators?.[0]?.expression;
         if (estreeToolkit.is.identifier(decoratedExpression) && decoratedExpression.name === 'api') {
             state.publicFields.push(node.key.name);
@@ -950,6 +958,7 @@ const visitors = {
             return;
         }
         const { decorators } = node;
+        validateUniqueDecorator(decorators);
         // The real type is a subset of `Expression`, which doesn't work with the `is` validators
         const decoratedExpression = decorators?.[0]?.expression;
         if (estreeToolkit.is.callExpression(decoratedExpression) &&
@@ -977,9 +986,6 @@ const visitors = {
             case 'connectedCallback':
                 state.hasConnectedCallback = true;
                 break;
-            case 'render':
-                state.hasRenderMethod = true;
-                break;
             case 'renderedCallback':
                 state.hadRenderedCallback = true;
                 path.remove();
@@ -1014,6 +1020,21 @@ const visitors = {
         },
     },
 };
+function validateUniqueDecorator(decorators) {
+    if (decorators.length < 2) {
+        return;
+    }
+    const expressions = decorators.map(({ expression }) => expression);
+    const hasWire = expressions.some((expr) => estreeToolkit.is.callExpression(expr) && estreeToolkit.is.identifier(expr.callee, { name: 'wire' }));
+    const hasApi = expressions.some((expr) => estreeToolkit.is.identifier(expr, { name: 'api' }));
+    if (hasWire && hasApi) {
+        throw generateError(errors.DecoratorErrors.CONFLICT_WITH_ANOTHER_DECORATOR, 'api');
+    }
+    const hasTrack = expressions.some((expr) => estreeToolkit.is.identifier(expr, { name: 'track' }));
+    if ((hasWire || hasApi) && hasTrack) {
+        throw generateError(errors.DecoratorErrors.CONFLICT_WITH_ANOTHER_DECORATOR, 'track');
+    }
+}
 function compileJS(src, filename, tagName, options, compilationMode) {
     let ast = meriyah.parseModule(src, {
         module: true,
@@ -1023,7 +1044,6 @@ function compileJS(src, filename, tagName, options, compilationMode) {
         isLWC: false,
         hasConstructor: false,
         hasConnectedCallback: false,
-        hasRenderMethod: false,
         hadRenderedCallback: false,
         hadDisconnectedCallback: false,
         hadErrorCallback: false,
@@ -1321,6 +1341,30 @@ const Comment = function Comment(node, cxt) {
     }
 };
 
+/*
+ * Copyright (c) 2024, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+/** Extends a validator to return `true` if the node is `null`. */
+function isNullableOf(validator) {
+    const nullableValidator = (node) => {
+        return node === null || validator(node);
+    };
+    if (process.env.NODE_ENV !== 'production') {
+        nullableValidator.__debugName = `nullable(${validator.__debugName || validator.name || 'unknown validator'})`;
+    }
+    return nullableValidator;
+}
+isNullableOf.__debugName = 'isNullableOf';
+if (process.env.NODE_ENV !== 'production') {
+    // Modifying another package's exports is a code smell!
+    for (const [key, val] of shared.entries(estreeToolkit.is)) {
+        val.__debugName = key;
+    }
+}
+
 /*
  * Copyright (c) 2024, salesforce.com, inc.
  * All rights reserved.
@@ -1366,6 +1410,18 @@ const bAddLightContent = (esTemplate `
         ${ /* slot content */false}
     });
 `);
+function getShadowSlottedContent(slottableChildren, cxt) {
+    return optimizeAdjacentYieldStmts(irChildrenToEs(slottableChildren, cxt, (child) => {
+        const { isSlotted } = cxt;
+        if (child.type === 'ExternalComponent' || child.type === 'Element') {
+            cxt.isSlotted = false;
+        }
+        // cleanup function
+        return () => {
+            cxt.isSlotted = isSlotted;
+        };
+    }));
+}
 // Light DOM slots are a bit complex because of needing to handle slots _not_ at the top level
 // At the non-top level, it matters what the ancestors are. These are relevant to slots:
 // - If (`if:true`, `if:false`)
@@ -1414,7 +1470,10 @@ function getLightSlottedContent(rootNodes, cxt) {
                 leaf.attributes = leaf.attributes.filter((attr) => attr.name !== 'slot');
             }
         });
+        const { isSlotted: originalIsSlotted } = cxt;
+        cxt.isSlotted = ancestorIndices.length > 1 || clone.type === 'Slot';
         const slotContent = irToEs(clone, cxt);
+        cxt.isSlotted = originalIsSlotted;
         results.push(estreeToolkit.builders.expressionStatement(bAddLightContent(slotName, null, slotContent)));
     };
     const traverse = (nodes, ancestorIndices) => {
@@ -1452,7 +1511,7 @@ function getSlottedContent(node, cxt) {
     // Anything inside the slotted content is a normal slotted content except for `<template lwc:slot-data>` which is a scoped slot.
     const slottableChildren = node.children.filter((child) => child.type !== 'ScopedSlotFragment');
     const scopedSlottableChildren = node.children.filter((child) => child.type === 'ScopedSlotFragment');
-    const shadowSlotContent = optimizeAdjacentYieldStmts(irChildrenToEs(slottableChildren, cxt));
+    const shadowSlotContent = getShadowSlottedContent(slottableChildren, cxt);
     const lightSlotContent = getLightSlottedContent(slottableChildren, cxt);
     const scopedSlotContent = scopedSlottableChildren.map((child) => {
         const boundVariableName = child.slotData.value.name;
@@ -1604,6 +1663,12 @@ const bYieldDynamicValue = (esTemplateWithYield `
             attrValue = shouldNormalize ? 0 : attrValue;
         }
 
+        // Backwards compatibility with historical patchStyleAttribute() behavior:
+        // https://github.com/salesforce/lwc/blob/59e2c6c/packages/%40lwc/engine-core/src/framework/modules/computed-style-attr.ts#L40
+        if (attrName === 'style' && (typeof attrValue !== 'string' || attrValue === '')) {
+            attrValue = undefined;
+        }
+
         if (attrValue !== undefined && attrValue !== null) {
             yield ' ' + attrName;
 
@@ -1834,36 +1899,14 @@ const ForOf = function ForEach(node, cxt) {
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
-function bYieldComment(text = '') {
-    return estreeToolkit.builders.expressionStatement(estreeToolkit.builders.yieldExpression(estreeToolkit.builders.literal(`<!--${text}-->`)));
-}
-function bBlockStatement(childNodes, cxt, insertComments) {
-    let statements = irChildrenToEs(childNodes, cxt);
-    if (insertComments)
-        statements = [bYieldComment(), ...statements, bYieldComment()];
-    return estreeToolkit.builders.blockStatement(optimizeAdjacentYieldStmts(statements));
-}
-const If = function If(node, cxt) {
+const LegacyIf = function If(node, cxt) {
     const { modifier: trueOrFalseAsStr, condition, children } = node;
     const trueOrFalse = trueOrFalseAsStr === 'true';
+    // FIXME: Does engine-server actually do triple-equals here?
     const comparison = estreeToolkit.builders.binaryExpression('===', estreeToolkit.builders.literal(trueOrFalse), expressionIrToEs(condition, cxt));
-    return [estreeToolkit.builders.ifStatement(comparison, bBlockStatement(children, cxt, false))];
-};
-function bIfStatement(ifElseIfNode, cxt) {
-    const { children, condition, else: elseNode } = ifElseIfNode;
-    let elseBlock = null;
-    if (elseNode) {
-        if (elseNode.type === 'ElseBlock') {
-            elseBlock = bBlockStatement(elseNode.children, cxt, true);
-        }
-        else {
-            elseBlock = bIfStatement(elseNode, cxt);
-        }
-    }
-    return estreeToolkit.builders.ifStatement(expressionIrToEs(condition, cxt), bBlockStatement(children, cxt, !cxt.isSlotted), elseBlock);
-}
-const IfBlock = function IfBlock(node, cxt) {
-    return [bIfStatement(node, cxt)];
+    const childStatements = irChildrenToEs(children, cxt);
+    const block = estreeToolkit.builders.blockStatement(optimizeAdjacentYieldStmts(childStatements));
+    return [estreeToolkit.builders.ifStatement(comparison, block)];
 };
 
 /*
@@ -1984,6 +2027,46 @@ function createNewContext(templateOptions) {
     };
 }
 
+/*
+ * Copyright (c) 2024, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: MIT
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
+ */
+// lwc:if/lwc:elseif/lwc:else use bookend comments due to VFragment vdom node using them
+// The bookends should surround the entire if/elseif/else series
+// Note: these should only be rendered if _something_ is rendered by a series of if/elseif/else's
+function bYieldBookendComment() {
+    return estreeToolkit.builders.expressionStatement(estreeToolkit.builders.yieldExpression(estreeToolkit.builders.literal(`<!---->`)));
+}
+function bBlockStatement(childNodes, cxt) {
+    const childStatements = irChildrenToEs(childNodes, cxt);
+    // Due to `flattenFragmentsInChildren`, we have to remove bookends for all _top-level_ slotted
+    // content. This applies to both light DOM and shadow DOM slots, although light DOM slots have
+    // the additional wrinkle that they themselves are VFragments with their own bookends.
+    // https://github.com/salesforce/lwc/blob/a33b390/packages/%40lwc/engine-core/src/framework/rendering.ts#L718-L753
+    const statements = cxt.isSlotted
+        ? childStatements
+        : [bYieldBookendComment(), ...childStatements, bYieldBookendComment()];
+    return estreeToolkit.builders.blockStatement(optimizeAdjacentYieldStmts(statements));
+}
+function bIfStatement(ifElseIfNode, cxt) {
+    const { children, condition, else: elseNode } = ifElseIfNode;
+    let elseBlock = null;
+    if (elseNode) {
+        if (elseNode.type === 'ElseBlock') {
+            elseBlock = bBlockStatement(elseNode.children, cxt);
+        }
+        else {
+            elseBlock = bIfStatement(elseNode, cxt);
+        }
+    }
+    return estreeToolkit.builders.ifStatement(expressionIrToEs(condition, cxt), bBlockStatement(children, cxt), elseBlock);
+}
+const IfBlock = function IfBlock(node, cxt) {
+    return [bIfStatement(node, cxt)];
+};
+
 /*
  * Copyright (c) 2024, salesforce.com, inc.
  * All rights reserved.
@@ -2006,7 +2089,7 @@ const transformers = {
     ExternalComponent: Element,
     ForEach,
     ForOf,
-    If,
+    If: LegacyIf,
     IfBlock,
     Root,
     Text,
@@ -2018,12 +2101,15 @@ const transformers = {
     Slot,
     Lwc: LwcComponent,
 };
-function irChildrenToEs(children, cxt) {
-    const result = children.flatMap((child, idx) => {
-        cxt.prevSibling = children[idx - 1];
-        cxt.nextSibling = children[idx + 1];
-        return irToEs(child, cxt);
-    });
+function irChildrenToEs(children, cxt, cb) {
+    const result = [];
+    for (let i = 0; i < children.length; i++) {
+        cxt.prevSibling = children[i - 1];
+        cxt.nextSibling = children[i + 1];
+        const cleanUp = cb?.(children[i]);
+        result.push(...irToEs(children[i], cxt));
+        cleanUp?.();
+    }
     cxt.prevSibling = undefined;
     cxt.nextSibling = undefined;
     return result;
@@ -2173,5 +2259,5 @@ function compileTemplateForSSR(src, filename, options, mode = shared.DEFAULT_SSR
 
 exports.compileComponentForSSR = compileComponentForSSR;
 exports.compileTemplateForSSR = compileTemplateForSSR;
-/** version: 8.12.1 */
+/** version: 8.12.2 */
 //# sourceMappingURL=index.cjs.js.map