@angular/core 20.2.0-next.0 → 20.2.0-next.2

package/schematics/bundles/{checker-DLInMAS3.cjs → checker-Cfq29XaS.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 /**
- * @license Angular v20.2.0-next.0
+ * @license Angular v20.2.0-next.2
  * (c) 2010-2025 Google LLC. https://angular.io/
  * License: MIT
  */
@@ -2693,7 +2693,18 @@ class Identifiers {
     static pipeBind4 = { name: 'ɵɵpipeBind4', moduleName: CORE };
     static pipeBindV = { name: 'ɵɵpipeBindV', moduleName: CORE };
     static domProperty = { name: 'ɵɵdomProperty', moduleName: CORE };
+    static ariaProperty = { name: 'ɵɵariaProperty', moduleName: CORE };
     static property = { name: 'ɵɵproperty', moduleName: CORE };
+    static animationEnterListener = {
+        name: 'ɵɵanimateEnterListener',
+        moduleName: CORE,
+    };
+    static animationLeaveListener = {
+        name: 'ɵɵanimateLeaveListener',
+        moduleName: CORE,
+    };
+    static animationEnter = { name: 'ɵɵanimateEnter', moduleName: CORE };
+    static animationLeave = { name: 'ɵɵanimateLeave', moduleName: CORE };
     static i18n = { name: 'ɵɵi18n', moduleName: CORE };
     static i18nAttributes = { name: 'ɵɵi18nAttributes', moduleName: CORE };
     static i18nExp = { name: 'ɵɵi18nExp', moduleName: CORE };
@@ -2837,6 +2848,10 @@ class Identifiers {
         name: 'ɵɵExternalStylesFeature',
         moduleName: CORE,
     };
+    static AnimationsFeature = {
+        name: 'ɵɵAnimationsFeature',
+        moduleName: CORE,
+    };
     static listener = { name: 'ɵɵlistener', moduleName: CORE };
     static getInheritedFactory = {
         name: 'ɵɵgetInheritedFactory',
@@ -2868,6 +2883,7 @@ class Identifiers {
     static InputSignalBrandWriteType = { name: 'ɵINPUT_SIGNAL_BRAND_WRITE_TYPE', moduleName: CORE };
     static UnwrapDirectiveSignalInputs = { name: 'ɵUnwrapDirectiveSignalInputs', moduleName: CORE };
     static unwrapWritableSignal = { name: 'ɵunwrapWritableSignal', moduleName: CORE };
+    static assertType = { name: 'ɵassertType', moduleName: CORE };
 }
 
 const DASH_CASE_REGEXP = /-+([a-z0-9])/g;
@@ -4411,6 +4427,7 @@ class ParsedProperty {
     valueSpan;
     isLiteral;
     isLegacyAnimation;
+    isAnimation;
     constructor(name, expression, type, sourceSpan, keySpan, valueSpan) {
         this.name = name;
         this.expression = expression;
@@ -4420,6 +4437,7 @@ class ParsedProperty {
         this.valueSpan = valueSpan;
         this.isLiteral = this.type === ParsedPropertyType.LITERAL_ATTR;
         this.isLegacyAnimation = this.type === ParsedPropertyType.LEGACY_ANIMATION;
+        this.isAnimation = this.type === ParsedPropertyType.ANIMATION;
     }
 }
 var ParsedPropertyType;
@@ -4428,6 +4446,7 @@ var ParsedPropertyType;
     ParsedPropertyType[ParsedPropertyType["LITERAL_ATTR"] = 1] = "LITERAL_ATTR";
     ParsedPropertyType[ParsedPropertyType["LEGACY_ANIMATION"] = 2] = "LEGACY_ANIMATION";
     ParsedPropertyType[ParsedPropertyType["TWO_WAY"] = 3] = "TWO_WAY";
+    ParsedPropertyType[ParsedPropertyType["ANIMATION"] = 4] = "ANIMATION";
 })(ParsedPropertyType || (ParsedPropertyType = {}));
 exports.ParsedEventType = void 0;
 (function (ParsedEventType) {
@@ -4437,6 +4456,8 @@ exports.ParsedEventType = void 0;
     ParsedEventType[ParsedEventType["LegacyAnimation"] = 1] = "LegacyAnimation";
     // Event side of a two-way binding (e.g. `[(property)]="expression"`).
     ParsedEventType[ParsedEventType["TwoWay"] = 2] = "TwoWay";
+    // Animation specific event
+    ParsedEventType[ParsedEventType["Animation"] = 3] = "Animation";
 })(exports.ParsedEventType || (exports.ParsedEventType = {}));
 class ParsedEvent {
     name;
@@ -4487,6 +4508,8 @@ exports.BindingType = void 0;
     BindingType[BindingType["LegacyAnimation"] = 4] = "LegacyAnimation";
     // Property side of a two-way binding (e.g. `[(property)]="expression"`).
     BindingType[BindingType["TwoWay"] = 5] = "TwoWay";
+    // A binding to an animation CSS class or function (e.g. `[animate.leave]="expression"`).
+    BindingType[BindingType["Animation"] = 6] = "Animation";
 })(exports.BindingType || (exports.BindingType = {}));
 class BoundElementProperty {
     name;
@@ -4689,8 +4712,9 @@ let Element$1 = class Element {
     sourceSpan;
     startSourceSpan;
     endSourceSpan;
+    isVoid;
     i18n;
-    constructor(name, attributes, inputs, outputs, directives, children, references, isSelfClosing, sourceSpan, startSourceSpan, endSourceSpan, i18n) {
+    constructor(name, attributes, inputs, outputs, directives, children, references, isSelfClosing, sourceSpan, startSourceSpan, endSourceSpan, isVoid, i18n) {
         this.name = name;
         this.attributes = attributes;
         this.inputs = inputs;
@@ -4702,6 +4726,7 @@ let Element$1 = class Element {
         this.sourceSpan = sourceSpan;
         this.startSourceSpan = startSourceSpan;
         this.endSourceSpan = endSourceSpan;
+        this.isVoid = isVoid;
         this.i18n = i18n;
     }
     visit(visitor) {
@@ -8615,6 +8640,22 @@ var OpKind;
      * Creation op that attaches the location at which an element was defined in a template to it.
      */
     OpKind[OpKind["SourceLocation"] = 52] = "SourceLocation";
+    /**
+     * An operation to bind animation css classes to an element.
+     */
+    OpKind[OpKind["Animation"] = 53] = "Animation";
+    /**
+     * An operation to bind animation css classes to an element.
+     */
+    OpKind[OpKind["AnimationString"] = 54] = "AnimationString";
+    /**
+     * An operation to bind animation css classes to an element.
+     */
+    OpKind[OpKind["AnimationBinding"] = 55] = "AnimationBinding";
+    /**
+     * An operation to bind animation events to an element.
+     */
+    OpKind[OpKind["AnimationListener"] = 56] = "AnimationListener";
 })(OpKind || (OpKind = {}));
 /**
  * Distinguishes different kinds of IR expressions.
@@ -8805,6 +8846,10 @@ var BindingKind;
      * Property side of a two-way binding.
      */
     BindingKind[BindingKind["TwoWayProperty"] = 7] = "TwoWayProperty";
+    /**
+     * Property side of an animation binding.
+     */
+    BindingKind[BindingKind["Animation"] = 8] = "Animation";
 })(BindingKind || (BindingKind = {}));
 /**
  * Enumeration of possible times i18n params can be resolved.
@@ -9045,13 +9090,13 @@ function createBindingOp(target, kind, name, expression, unit, securityContext,
 /**
  * Create a `PropertyOp`.
  */
-function createPropertyOp(target, name, expression, isLegacyAnimationTrigger, securityContext, isStructuralTemplateAttribute, templateKind, i18nContext, i18nMessage, sourceSpan) {
+function createPropertyOp(target, name, expression, bindingKind, securityContext, isStructuralTemplateAttribute, templateKind, i18nContext, i18nMessage, sourceSpan) {
     return {
         kind: OpKind.Property,
         target,
         name,
         expression,
-        isLegacyAnimationTrigger,
+        bindingKind,
         securityContext,
         sanitizer: null,
         isStructuralTemplateAttribute,
@@ -9202,6 +9247,24 @@ function createRepeaterOp(repeaterCreate, targetSlot, collection, sourceSpan) {
         ...TRAIT_DEPENDS_ON_SLOT_CONTEXT,
     };
 }
+/**
+ * Create an `AnimationBindingOp`.
+ */
+function createAnimationBindingOp(name, target, animationKind, expression, securityContext, sourceSpan, animationBindingKind) {
+    return {
+        kind: OpKind.AnimationBinding,
+        name,
+        target,
+        animationKind,
+        expression,
+        i18nMessage: null,
+        securityContext,
+        sanitizer: null,
+        sourceSpan,
+        animationBindingKind,
+        ...NEW_OP,
+    };
+}
 function createDeferWhenOp(target, expr, modifier, sourceSpan) {
     return {
         kind: OpKind.DeferWhen,
@@ -10032,6 +10095,8 @@ function transformExpressionsInOp(op, transform, flags) {
         case OpKind.StyleMap:
         case OpKind.ClassProp:
         case OpKind.ClassMap:
+        case OpKind.AnimationString:
+        case OpKind.AnimationBinding:
         case OpKind.Binding:
             if (op.expression instanceof Interpolation) {
                 transformExpressionsInInterpolation(op.expression, transform, flags);
@@ -10084,6 +10149,8 @@ function transformExpressionsInOp(op, transform, flags) {
                 op.contextValue = transformExpressionsInExpression(op.contextValue, transform, flags);
             }
             break;
+        case OpKind.Animation:
+        case OpKind.AnimationListener:
         case OpKind.Listener:
         case OpKind.TwoWayListener:
             for (const innerOp of op.handlerOps) {
@@ -10735,6 +10802,43 @@ function createTextOp(xref, initialValue, icuPlaceholder, sourceSpan) {
         ...NEW_OP,
     };
 }
+/**
+ * Create an `AnimationOp`.
+ */
+function createAnimationStringOp(name, target, animationKind, expression, securityContext, sourceSpan) {
+    return {
+        kind: OpKind.AnimationString,
+        name,
+        target,
+        animationKind,
+        expression,
+        i18nMessage: null,
+        securityContext,
+        sanitizer: null,
+        sourceSpan,
+        ...NEW_OP,
+    };
+}
+/**
+ * Create an `AnimationOp`.
+ */
+function createAnimationOp(name, target, animationKind, callbackOps, securityContext, sourceSpan) {
+    const handlerOps = new OpList();
+    handlerOps.push(callbackOps);
+    return {
+        kind: OpKind.Animation,
+        name,
+        target,
+        animationKind,
+        handlerOps,
+        handlerFnName: null,
+        i18nMessage: null,
+        securityContext,
+        sanitizer: null,
+        sourceSpan,
+        ...NEW_OP,
+    };
+}
 /**
  * Create a `ListenerOp`. Host bindings reuse all the listener logic.
  */
@@ -10758,6 +10862,28 @@ function createListenerOp(target, targetSlot, name, tag, handlerOps, legacyAnima
         ...NEW_OP,
     };
 }
+/**
+ * Create a `ListenerOp`. Host bindings reuse all the listener logic.
+ */
+function createAnimationListenerOp(target, targetSlot, name, tag, handlerOps, animationKind, eventTarget, hostListener, sourceSpan) {
+    const handlerList = new OpList();
+    handlerList.push(handlerOps);
+    return {
+        kind: OpKind.AnimationListener,
+        target,
+        targetSlot,
+        tag,
+        hostListener,
+        name,
+        animationKind,
+        handlerOps: handlerList,
+        handlerFnName: null,
+        consumesDollarEvent: false,
+        eventTarget,
+        sourceSpan,
+        ...NEW_OP,
+    };
+}
 /**
  * Create a `TwoWayListenerOp`.
  */
@@ -11007,12 +11133,12 @@ function createSourceLocationOp(templatePath, locations) {
     };
 }
 
-function createDomPropertyOp(name, expression, isLegacyAnimationTrigger, i18nContext, securityContext, sourceSpan) {
+function createDomPropertyOp(name, expression, bindingKind, i18nContext, securityContext, sourceSpan) {
     return {
         kind: OpKind.DomProperty,
         name,
         expression,
-        isLegacyAnimationTrigger,
+        bindingKind,
         i18nContext,
         securityContext,
         sanitizer: null,
@@ -11179,7 +11305,10 @@ class CompilationUnit {
     *ops() {
         for (const op of this.create) {
             yield op;
-            if (op.kind === OpKind.Listener || op.kind === OpKind.TwoWayListener) {
+            if (op.kind === OpKind.Listener ||
+                op.kind === OpKind.Animation ||
+                op.kind === OpKind.AnimationListener ||
+                op.kind === OpKind.TwoWayListener) {
                 for (const listenerOp of op.handlerOps) {
                     yield listenerOp;
                 }
@@ -11459,7 +11588,8 @@ function extractAttributes(job) {
                     extractAttributeOp(unit, op, elements);
                     break;
                 case OpKind.Property:
-                    if (!op.isLegacyAnimationTrigger) {
+                    if (op.bindingKind !== BindingKind.LegacyAnimation &&
+                        op.bindingKind !== BindingKind.Animation) {
                         let bindingKind;
                         if (op.i18nMessage !== null && op.templateKind === null) {
                             // If the binding has an i18n context, it is an i18n attribute, and should have that
@@ -11477,14 +11607,14 @@ function extractAttributes(job) {
                         createExtractedAttributeOp(op.target, bindingKind, null, op.name, 
                         /* expression */ null, 
                         /* i18nContext */ null, 
-                        /* i18nMessage */ null, op.securityContext), lookupElement$2(elements, op.target));
+                        /* i18nMessage */ null, op.securityContext), lookupElement$3(elements, op.target));
                     }
                     break;
                 case OpKind.TwoWayProperty:
                     OpList.insertBefore(createExtractedAttributeOp(op.target, BindingKind.TwoWayProperty, null, op.name, 
                     /* expression */ null, 
                     /* i18nContext */ null, 
-                    /* i18nMessage */ null, op.securityContext), lookupElement$2(elements, op.target));
+                    /* i18nMessage */ null, op.securityContext), lookupElement$3(elements, op.target));
                     break;
                 case OpKind.StyleProp:
                 case OpKind.ClassProp:
@@ -11497,7 +11627,7 @@ function extractAttributes(job) {
                         OpList.insertBefore(createExtractedAttributeOp(op.target, BindingKind.Property, null, op.name, 
                         /* expression */ null, 
                         /* i18nContext */ null, 
-                        /* i18nMessage */ null, SecurityContext.STYLE), lookupElement$2(elements, op.target));
+                        /* i18nMessage */ null, SecurityContext.STYLE), lookupElement$3(elements, op.target));
                     }
                     break;
                 case OpKind.Listener:
@@ -11517,7 +11647,7 @@ function extractAttributes(job) {
                             unit.create.push(extractedAttributeOp);
                         }
                         else {
-                            OpList.insertBefore(extractedAttributeOp, lookupElement$2(elements, op.target));
+                            OpList.insertBefore(extractedAttributeOp, lookupElement$3(elements, op.target));
                         }
                     }
                     break;
@@ -11528,7 +11658,7 @@ function extractAttributes(job) {
                         /* expression */ null, 
                         /* i18nContext */ null, 
                         /* i18nMessage */ null, SecurityContext.NONE);
-                        OpList.insertBefore(extractedAttributeOp, lookupElement$2(elements, op.target));
+                        OpList.insertBefore(extractedAttributeOp, lookupElement$3(elements, op.target));
                     }
                     break;
             }
@@ -11538,7 +11668,7 @@ function extractAttributes(job) {
 /**
  * Looks up an element in the given map by xref ID.
  */
-function lookupElement$2(elements, xref) {
+function lookupElement$3(elements, xref) {
     const el = elements.get(xref);
     if (el === undefined) {
         throw new Error('All attributes should have an element-like target.');
@@ -11566,7 +11696,7 @@ function extractAttributeOp(unit, op, elements) {
             unit.create.push(extractedAttributeOp);
         }
         else {
-            const ownerOp = lookupElement$2(elements, op.target);
+            const ownerOp = lookupElement$3(elements, op.target);
             OpList.insertBefore(extractedAttributeOp, ownerOp);
         }
         OpList.remove(op);
@@ -11576,7 +11706,7 @@ function extractAttributeOp(unit, op, elements) {
 /**
  * Looks up an element in the given map by xref ID.
  */
-function lookupElement$1(elements, xref) {
+function lookupElement$2(elements, xref) {
     const el = elements.get(xref);
     if (el === undefined) {
         throw new Error('All attributes should have an element-like target.');
@@ -11602,21 +11732,27 @@ function specializeBindings(job) {
                 case BindingKind.Attribute:
                     if (op.name === 'ngNonBindable') {
                         OpList.remove(op);
-                        const target = lookupElement$1(elements, op.target);
+                        const target = lookupElement$2(elements, op.target);
                         target.nonBindable = true;
                     }
+                    else if (op.name.startsWith('animate.')) {
+                        OpList.replace(op, createAnimationBindingOp(op.name, op.target, op.name === 'animate.enter' ? "enter" /* ir.AnimationKind.ENTER */ : "leave" /* ir.AnimationKind.LEAVE */, op.expression, op.securityContext, op.sourceSpan, 0 /* ir.AnimationBindingKind.STRING */));
+                    }
                     else {
                         const [namespace, name] = splitNsName(op.name);
                         OpList.replace(op, createAttributeOp(op.target, namespace, name, op.expression, op.securityContext, op.isTextAttribute, op.isStructuralTemplateAttribute, op.templateKind, op.i18nMessage, op.sourceSpan));
                     }
                     break;
+                case BindingKind.Animation:
+                    OpList.replace(op, createAnimationBindingOp(op.name, op.target, op.name === 'animate.enter' ? "enter" /* ir.AnimationKind.ENTER */ : "leave" /* ir.AnimationKind.LEAVE */, op.expression, op.securityContext, op.sourceSpan, 1 /* ir.AnimationBindingKind.VALUE */));
+                    break;
                 case BindingKind.Property:
                 case BindingKind.LegacyAnimation:
                     if (job.kind === CompilationJobKind.Host) {
-                        OpList.replace(op, createDomPropertyOp(op.name, op.expression, op.bindingKind === BindingKind.LegacyAnimation, op.i18nContext, op.securityContext, op.sourceSpan));
+                        OpList.replace(op, createDomPropertyOp(op.name, op.expression, op.bindingKind, op.i18nContext, op.securityContext, op.sourceSpan));
                     }
                     else {
-                        OpList.replace(op, createPropertyOp(op.target, op.name, op.expression, op.bindingKind === BindingKind.LegacyAnimation, op.securityContext, op.isStructuralTemplateAttribute, op.templateKind, op.i18nContext, op.i18nMessage, op.sourceSpan));
+                        OpList.replace(op, createPropertyOp(op.target, op.name, op.expression, op.bindingKind, op.securityContext, op.isStructuralTemplateAttribute, op.templateKind, op.i18nContext, op.i18nMessage, op.sourceSpan));
                     }
                     break;
                 case BindingKind.TwoWayProperty:
@@ -11638,6 +11774,7 @@ function specializeBindings(job) {
 }
 
 const CHAIN_COMPATIBILITY = new Map([
+    [Identifiers.ariaProperty, Identifiers.ariaProperty],
     [Identifiers.attribute, Identifiers.attribute],
     [Identifiers.classProp, Identifiers.classProp],
     [Identifiers.element, Identifiers.element],
@@ -11668,6 +11805,10 @@ const CHAIN_COMPATIBILITY = new Map([
     [Identifiers.domElementContainerEnd, Identifiers.domElementContainerEnd],
     [Identifiers.domListener, Identifiers.domListener],
     [Identifiers.domTemplate, Identifiers.domTemplate],
+    [Identifiers.animationEnter, Identifiers.animationEnter],
+    [Identifiers.animationLeave, Identifiers.animationLeave],
+    [Identifiers.animationEnterListener, Identifiers.animationEnterListener],
+    [Identifiers.animationLeaveListener, Identifiers.animationLeaveListener],
 ]);
 /**
  * Chaining results in repeated call expressions, causing a deep AST of receiver expressions. To prevent running out of
@@ -12088,6 +12229,52 @@ function serializeAttributes({ attributes, bindings, classes, i18n, projectAs, s
     return literalArr(attrArray);
 }
 
+/**
+ * Looks up an element in the given map by xref ID.
+ */
+function lookupElement$1(elements, xref) {
+    const el = elements.get(xref);
+    if (el === undefined) {
+        throw new Error('All attributes should have an element-like target.');
+    }
+    return el;
+}
+function convertAnimations(job) {
+    const elements = new Map();
+    for (const unit of job.units) {
+        for (const op of unit.create) {
+            if (!isElementOrContainerOp(op)) {
+                continue;
+            }
+            elements.set(op.xref, op);
+        }
+    }
+    for (const unit of job.units) {
+        for (const op of unit.ops()) {
+            if (op.kind === OpKind.AnimationBinding) {
+                const createAnimationOp = getAnimationOp(op);
+                if (job.kind === CompilationJobKind.Host) {
+                    unit.create.push(createAnimationOp);
+                }
+                else {
+                    OpList.insertAfter(createAnimationOp, lookupElement$1(elements, op.target));
+                }
+                OpList.remove(op);
+            }
+        }
+    }
+}
+function getAnimationOp(op) {
+    if (op.animationBindingKind === 0 /* ir.AnimationBindingKind.STRING */) {
+        // this is a simple string case
+        return createAnimationStringOp(op.name, op.target, op.name === 'animate.enter' ? "enter" /* ir.AnimationKind.ENTER */ : "leave" /* ir.AnimationKind.LEAVE */, op.expression, op.securityContext, op.sourceSpan);
+    }
+    else {
+        const expression = op.expression;
+        return createAnimationOp(op.name, op.target, op.name === 'animate.enter' ? "enter" /* ir.AnimationKind.ENTER */ : "leave" /* ir.AnimationKind.LEAVE */, [createStatementOp(new ReturnStatement(expression, expression.sourceSpan))], op.securityContext, op.sourceSpan);
+    }
+}
+
 /**
  * Some binding instructions in the update block may actually correspond to i18n bindings. In that
  * case, they should be replaced with i18nExp instructions for the dynamic portions.
@@ -12985,6 +13172,8 @@ function recursivelyProcessView(view, parentScope) {
                     op.trackByOps.prepend(generateVariablesInScopeForView(view, scope, false));
                 }
                 break;
+            case OpKind.Animation:
+            case OpKind.AnimationListener:
             case OpKind.Listener:
             case OpKind.TwoWayListener:
                 // Prepend variables to listener handler functions.
@@ -13067,7 +13256,7 @@ function getScopeForView(view, parent) {
  * This is a recursive process, as views inherit variables available from their parent view, which
  * itself may have inherited variables, etc.
  */
-function generateVariablesInScopeForView(view, scope, isListener) {
+function generateVariablesInScopeForView(view, scope, isCallback) {
     const newOps = [];
     if (scope.view !== view.xref) {
         // Before generating variables for a parent view, we need to switch to the context of the parent
@@ -13091,7 +13280,7 @@ function generateVariablesInScopeForView(view, scope, isListener) {
     for (const ref of scope.references) {
         newOps.push(createVariableOp(view.job.allocateXrefId(), ref.variable, new ReferenceExpr(ref.targetId, ref.targetSlot, ref.offset), VariableFlags.None));
     }
-    if (scope.view !== view.xref || isListener) {
+    if (scope.view !== view.xref || isCallback) {
         for (const decl of scope.letDeclarations) {
             newOps.push(createVariableOp(view.job.allocateXrefId(), decl.variable, new ContextLetReferenceExpr(decl.targetId, decl.targetSlot), VariableFlags.None));
         }
@@ -13321,7 +13510,8 @@ class Element extends NodeWithI18n {
     isSelfClosing;
     startSourceSpan;
     endSourceSpan;
-    constructor(name, attrs, directives, children, isSelfClosing, sourceSpan, startSourceSpan, endSourceSpan = null, i18n) {
+    isVoid;
+    constructor(name, attrs, directives, children, isSelfClosing, sourceSpan, startSourceSpan, endSourceSpan = null, isVoid, i18n) {
         super(sourceSpan, i18n);
         this.name = name;
         this.attrs = attrs;
@@ -13330,6 +13520,7 @@ class Element extends NodeWithI18n {
         this.isSelfClosing = isSelfClosing;
         this.startSourceSpan = startSourceSpan;
         this.endSourceSpan = endSourceSpan;
+        this.isVoid = isVoid;
     }
     visit(visitor, context) {
         return visitor.visitElement(this, context);
@@ -15667,6 +15858,19 @@ var CharacterReferenceType;
     CharacterReferenceType["HEX"] = "hexadecimal";
     CharacterReferenceType["DEC"] = "decimal";
 })(CharacterReferenceType || (CharacterReferenceType = {}));
+const SUPPORTED_BLOCKS = [
+    '@if',
+    '@else', // Covers `@else if` as well
+    '@for',
+    '@switch',
+    '@case',
+    '@default',
+    '@empty',
+    '@defer',
+    '@placeholder',
+    '@loading',
+    '@error',
+];
 // See https://www.w3.org/TR/html51/syntax.html#writing-html-documents
 class _Tokenizer {
     _getTagDefinition;
@@ -15757,10 +15961,10 @@ class _Tokenizer {
                     // don't want to advance in case it's not `@let`.
                     this._cursor.peek() === $AT &&
                     !this._inInterpolation &&
-                    this._attemptStr('@let')) {
+                    this._isLetStart()) {
                     this._consumeLetDeclaration(start);
                 }
-                else if (this._tokenizeBlocks && this._attemptCharCode($AT)) {
+                else if (this._tokenizeBlocks && this._isBlockStart()) {
                     this._consumeBlockStart(start);
                 }
                 else if (this._tokenizeBlocks &&
@@ -15800,6 +16004,7 @@ class _Tokenizer {
         return this._cursor.getChars(nameCursor).trim();
     }
     _consumeBlockStart(start) {
+        this._requireCharCode($AT);
         this._beginToken(24 /* TokenType.BLOCK_OPEN_START */, start);
         const startToken = this._endToken([this._getBlockName()]);
         if (this._cursor.peek() === $LPAREN) {
@@ -15872,6 +16077,7 @@ class _Tokenizer {
         }
     }
     _consumeLetDeclaration(start) {
+        this._requireStr('@let');
         this._beginToken(29 /* TokenType.LET_START */, start);
         // Require at least one white space after the `@let`.
         if (isWhitespace(this._cursor.peek())) {
@@ -16085,6 +16291,27 @@ class _Tokenizer {
         this._cursor.advance();
         return char;
     }
+    _peekStr(chars) {
+        const len = chars.length;
+        if (this._cursor.charsLeft() < len) {
+            return false;
+        }
+        const cursor = this._cursor.clone();
+        for (let i = 0; i < len; i++) {
+            if (cursor.peek() !== chars.charCodeAt(i)) {
+                return false;
+            }
+            cursor.advance();
+        }
+        return true;
+    }
+    _isBlockStart() {
+        return (this._cursor.peek() === $AT &&
+            SUPPORTED_BLOCKS.some((blockName) => this._peekStr(blockName)));
+    }
+    _isLetStart() {
+        return this._cursor.peek() === $AT && this._peekStr('@let');
+    }
     _consumeEntity(textTokenType) {
         this._beginToken(9 /* TokenType.ENCODED_ENTITY */);
         const start = this._cursor.clone();
@@ -16352,6 +16579,23 @@ class _Tokenizer {
                 return isNameEnd(code);
             };
         }
+        else if (attrNameStart === $LBRACKET) {
+            let openBrackets = 0;
+            // Be more permissive for which characters are allowed inside square-bracketed attributes,
+            // because they usually end up being bound as attribute values. Some third-party packages
+            // like Tailwind take advantage of this.
+            nameEndPredicate = (code) => {
+                if (code === $LBRACKET) {
+                    openBrackets++;
+                }
+                else if (code === $RBRACKET) {
+                    openBrackets--;
+                }
+                // Only check for name-ending characters if the brackets are balanced or mismatched.
+                // Also interrupt the matching on new lines.
+                return openBrackets <= 0 ? isNameEnd(code) : isNewLine(code);
+            };
+        }
         else {
             nameEndPredicate = isNameEnd;
         }
@@ -16631,7 +16875,7 @@ class _Tokenizer {
         if (this._tokenizeBlocks &&
             !this._inInterpolation &&
             !this._isInExpansion() &&
-            (this._cursor.peek() === $AT || this._cursor.peek() === $RBRACE)) {
+            (this._isBlockStart() || this._isLetStart() || this._cursor.peek() === $RBRACE)) {
             return true;
         }
         return false;
@@ -17268,13 +17512,13 @@ class _TreeBuilder {
         const directives = [];
         this._consumeAttributesAndDirectives(attrs, directives);
         const fullName = this._getElementFullName(startTagToken, this._getClosestElementLikeParent());
+        const tagDef = this._getTagDefinition(fullName);
         let selfClosing = false;
         // Note: There could have been a tokenizer error
         // so that we don't get a token for the end tag...
         if (this._peek.type === 2 /* TokenType.TAG_OPEN_END_VOID */) {
             this._advance();
             selfClosing = true;
-            const tagDef = this._getTagDefinition(fullName);
             if (!(tagDef?.canSelfClose || getNsPrefix(fullName) !== null || tagDef?.isVoid)) {
                 this.errors.push(TreeError.create(fullName, startTagToken.sourceSpan, `Only void, custom and foreign elements can be self closed "${startTagToken.parts[1]}"`));
             }
@@ -17287,7 +17531,7 @@ class _TreeBuilder {
         const span = new ParseSourceSpan(startTagToken.sourceSpan.start, end, startTagToken.sourceSpan.fullStart);
         // Create a separate `startSpan` because `span` will be modified when there is an `end` span.
         const startSpan = new ParseSourceSpan(startTagToken.sourceSpan.start, end, startTagToken.sourceSpan.fullStart);
-        const el = new Element(fullName, attrs, directives, [], selfClosing, span, startSpan, undefined);
+        const el = new Element(fullName, attrs, directives, [], selfClosing, span, startSpan, undefined, tagDef?.isVoid ?? false);
         const parent = this._getContainer();
         const isClosedByChild = parent !== null && !!this._getTagDefinition(parent)?.isClosedByChild(el.name);
         this._pushContainer(el, isClosedByChild);
@@ -17730,11 +17974,11 @@ class WhitespaceVisitor {
         if (SKIP_WS_TRIM_TAGS.has(element.name) || hasPreserveWhitespacesAttr(element.attrs)) {
             // don't descent into elements where we need to preserve whitespaces
             // but still visit all attributes to eliminate one used as a market to preserve WS
-            const newElement = new Element(element.name, visitAllWithSiblings(this, element.attrs), visitAllWithSiblings(this, element.directives), element.children, element.isSelfClosing, element.sourceSpan, element.startSourceSpan, element.endSourceSpan, element.i18n);
+            const newElement = new Element(element.name, visitAllWithSiblings(this, element.attrs), visitAllWithSiblings(this, element.directives), element.children, element.isSelfClosing, element.sourceSpan, element.startSourceSpan, element.endSourceSpan, element.isVoid, element.i18n);
             this.originalNodeMap?.set(newElement, element);
             return newElement;
         }
-        const newElement = new Element(element.name, element.attrs, element.directives, visitAllWithSiblings(this, element.children), element.isSelfClosing, element.sourceSpan, element.startSourceSpan, element.endSourceSpan, element.i18n);
+        const newElement = new Element(element.name, element.attrs, element.directives, visitAllWithSiblings(this, element.children), element.isSelfClosing, element.sourceSpan, element.startSourceSpan, element.endSourceSpan, element.isVoid, element.i18n);
         this.originalNodeMap?.set(newElement, element);
         return newElement;
     }
@@ -19381,12 +19625,13 @@ class _ParseAST {
         else {
             if (this.isAssignmentOperator(this.next)) {
                 const operation = this.next.strValue;
-                this.advance();
                 if (!(this.parseFlags & 1 /* ParseFlags.Action */)) {
+                    this.advance();
                     this.error('Bindings cannot contain assignments');
                     return new EmptyExpr$1(this.span(start), this.sourceSpan(start));
                 }
                 const receiver = new PropertyRead(this.span(start), this.sourceSpan(start), nameSpan, readReceiver, id);
+                this.advance();
                 const value = this.parseConditional();
                 return new Binary(this.span(start), this.sourceSpan(start), operation, receiver, value);
             }
@@ -19505,12 +19750,13 @@ class _ParseAST {
             this.expectCharacter($RBRACKET);
             if (this.isAssignmentOperator(this.next)) {
                 const operation = this.next.strValue;
-                this.advance();
                 if (isSafe) {
+                    this.advance();
                     this.error("The '?.' operator cannot be used in the assignment");
                 }
                 else {
                     const binaryReceiver = new KeyedRead(this.span(start), this.sourceSpan(start), receiver, key);
+                    this.advance();
                     const value = this.parseConditional();
                     return new Binary(this.span(start), this.sourceSpan(start), operation, binaryReceiver, value);
                 }
@@ -20273,6 +20519,44 @@ const _ATTR_TO_PROP = new Map(Object.entries({
     'innerHtml': 'innerHTML',
     'readonly': 'readOnly',
     'tabindex': 'tabIndex',
+    // https://www.w3.org/TR/wai-aria-1.2/#accessibilityroleandproperties-correspondence
+    'aria-atomic': 'ariaAtomic',
+    'aria-autocomplete': 'ariaAutoComplete',
+    'aria-busy': 'ariaBusy',
+    'aria-checked': 'ariaChecked',
+    'aria-colcount': 'ariaColCount',
+    'aria-colindex': 'ariaColIndex',
+    'aria-colspan': 'ariaColSpan',
+    'aria-current': 'ariaCurrent',
+    'aria-disabled': 'ariaDisabled',
+    'aria-expanded': 'ariaExpanded',
+    'aria-haspopup': 'ariaHasPopup',
+    'aria-hidden': 'ariaHidden',
+    'aria-invalid': 'ariaInvalid',
+    'aria-keyshortcuts': 'ariaKeyShortcuts',
+    'aria-label': 'ariaLabel',
+    'aria-level': 'ariaLevel',
+    'aria-live': 'ariaLive',
+    'aria-modal': 'ariaModal',
+    'aria-multiline': 'ariaMultiLine',
+    'aria-multiselectable': 'ariaMultiSelectable',
+    'aria-orientation': 'ariaOrientation',
+    'aria-placeholder': 'ariaPlaceholder',
+    'aria-posinset': 'ariaPosInSet',
+    'aria-pressed': 'ariaPressed',
+    'aria-readonly': 'ariaReadOnly',
+    'aria-required': 'ariaRequired',
+    'aria-roledescription': 'ariaRoleDescription',
+    'aria-rowcount': 'ariaRowCount',
+    'aria-rowindex': 'ariaRowIndex',
+    'aria-rowspan': 'ariaRowSpan',
+    'aria-selected': 'ariaSelected',
+    'aria-setsize': 'ariaSetSize',
+    'aria-sort': 'ariaSort',
+    'aria-valuemax': 'ariaValueMax',
+    'aria-valuemin': 'ariaValueMin',
+    'aria-valuenow': 'ariaValueNow',
+    'aria-valuetext': 'ariaValueText',
 }));
 // Invert _ATTR_TO_PROP.
 const _PROP_TO_ATTR = Array.from(_ATTR_TO_PROP).reduce((inverted, [propertyName, attributeName]) => {
@@ -22219,10 +22503,33 @@ function addNamesToView(unit, baseName, state, compatibility) {
         switch (op.kind) {
             case OpKind.Property:
             case OpKind.DomProperty:
-                if (op.isLegacyAnimationTrigger) {
+                if (op.bindingKind === BindingKind.LegacyAnimation) {
                     op.name = '@' + op.name;
                 }
                 break;
+            case OpKind.Animation:
+                if (op.handlerFnName === null) {
+                    const animationKind = op.name.replace('.', '');
+                    op.handlerFnName = `${unit.fnName}_${animationKind}_cb`;
+                    op.handlerFnName = sanitizeIdentifier(op.handlerFnName);
+                }
+                break;
+            case OpKind.AnimationListener:
+                if (op.handlerFnName !== null) {
+                    break;
+                }
+                if (!op.hostListener && op.targetSlot.slot === null) {
+                    throw new Error(`Expected a slot to be assigned`);
+                }
+                const animationKind = op.name.replace('.', '');
+                if (op.hostListener) {
+                    op.handlerFnName = `${baseName}_${animationKind}_HostBindingHandler`;
+                }
+                else {
+                    op.handlerFnName = `${unit.fnName}_${op.tag.replace('-', '_')}_${animationKind}_${op.targetSlot.slot}_listener`;
+                }
+                op.handlerFnName = sanitizeIdentifier(op.handlerFnName);
+                break;
             case OpKind.Listener:
                 if (op.handlerFnName !== null) {
                     break;
@@ -22380,7 +22687,10 @@ function stripImportant(name) {
 function mergeNextContextExpressions(job) {
     for (const unit of job.units) {
         for (const op of unit.create) {
-            if (op.kind === OpKind.Listener || op.kind === OpKind.TwoWayListener) {
+            if (op.kind === OpKind.Listener ||
+                op.kind === OpKind.Animation ||
+                op.kind === OpKind.AnimationListener ||
+                op.kind === OpKind.TwoWayListener) {
                 mergeNextContextsInOps(op.handlerOps);
             }
         }
@@ -22501,7 +22811,9 @@ function kindWithInterpolationTest(kind, interpolation) {
 }
 function basicListenerKindTest(op) {
     return ((op.kind === OpKind.Listener && !(op.hostListener && op.isLegacyAnimationListener)) ||
-        op.kind === OpKind.TwoWayListener);
+        op.kind === OpKind.TwoWayListener ||
+        op.kind === OpKind.Animation ||
+        op.kind === OpKind.AnimationListener);
 }
 function nonInterpolationPropertyKindTest(op) {
     return ((op.kind === OpKind.Property || op.kind === OpKind.TwoWayProperty) &&
@@ -22548,6 +22860,7 @@ const UPDATE_HOST_ORDERING = [
 const handledOpKinds = new Set([
     OpKind.Listener,
     OpKind.TwoWayListener,
+    OpKind.AnimationListener,
     OpKind.StyleMap,
     OpKind.ClassMap,
     OpKind.StyleProp,
@@ -22556,6 +22869,7 @@ const handledOpKinds = new Set([
     OpKind.TwoWayProperty,
     OpKind.DomProperty,
     OpKind.Attribute,
+    OpKind.Animation,
 ]);
 /**
  * Many type of operations have ordering constraints that must be respected. For example, a
@@ -23246,6 +23560,9 @@ function i18nAttributes(slot, i18nAttributesConfig) {
     const args = [literal(slot), literal(i18nAttributesConfig)];
     return call(Identifiers.i18nAttributes, args, null);
 }
+function ariaProperty(name, expression, sourceSpan) {
+    return propertyBase(Identifiers.ariaProperty, name, expression, null, sourceSpan);
+}
 function property(name, expression, sanitizer, sourceSpan) {
     return propertyBase(Identifiers.property, name, expression, sanitizer, sourceSpan);
 }
@@ -23359,6 +23676,36 @@ function i18nApply(slot, sourceSpan) {
 function domProperty(name, expression, sanitizer, sourceSpan) {
     return propertyBase(Identifiers.domProperty, name, expression, sanitizer, sourceSpan);
 }
+function animation(animationKind, handlerFn, sanitizer, sourceSpan) {
+    const args = [handlerFn];
+    if (sanitizer !== null) {
+        args.push(sanitizer);
+    }
+    const identifier = animationKind === "enter" /* ir.AnimationKind.ENTER */
+        ? Identifiers.animationEnter
+        : Identifiers.animationLeave;
+    return call(identifier, args, sourceSpan);
+}
+function animationString(animationKind, expression, sanitizer, sourceSpan) {
+    const value = expression instanceof Interpolation
+        ? interpolationToExpression(expression, sourceSpan)
+        : expression;
+    const args = [value];
+    if (sanitizer !== null) {
+        args.push(sanitizer);
+    }
+    const identifier = animationKind === "enter" /* ir.AnimationKind.ENTER */
+        ? Identifiers.animationEnter
+        : Identifiers.animationLeave;
+    return call(identifier, args, sourceSpan);
+}
+function animationListener(animationKind, handlerFn, eventTargetResolver, sourceSpan) {
+    const args = [handlerFn];
+    const identifier = animationKind === "enter" /* ir.AnimationKind.ENTER */
+        ? Identifiers.animationEnterListener
+        : Identifiers.animationLeaveListener;
+    return call(identifier, args, sourceSpan);
+}
 function syntheticHostProperty(name, expression, sourceSpan) {
     return call(Identifiers.syntheticHostProperty, [literal(name), expression], sourceSpan);
 }
@@ -23492,6 +23839,7 @@ function callVariadicInstruction(config, baseArgs, interpolationArgs, extraArgs,
     return createStatementOp(callVariadicInstructionExpr(config, baseArgs, interpolationArgs, extraArgs, sourceSpan).toStmt());
 }
 
+const ARIA_PREFIX = 'aria';
 /**
  * Map of target resolvers for event listeners.
  */
@@ -23605,6 +23953,18 @@ function reifyCreateOperations(unit, ops) {
             case OpKind.DeclareLet:
                 OpList.replace(op, declareLet(op.handle.slot, op.sourceSpan));
                 break;
+            case OpKind.AnimationString:
+                OpList.replace(op, animationString(op.animationKind, op.expression, op.sanitizer, op.sourceSpan));
+                break;
+            case OpKind.Animation:
+                const animationCallbackFn = reifyListenerHandler(unit, op.handlerFnName, op.handlerOps, 
+                /* consumesDollarEvent */ false);
+                OpList.replace(op, animation(op.animationKind, animationCallbackFn, op.sanitizer, op.sourceSpan));
+                break;
+            case OpKind.AnimationListener:
+                const animationListenerFn = reifyListenerHandler(unit, op.handlerFnName, op.handlerOps, op.consumesDollarEvent);
+                OpList.replace(op, animationListener(op.animationKind, animationListenerFn, null, op.sourceSpan));
+                break;
             case OpKind.Listener:
                 const listenerFn = reifyListenerHandler(unit, op.handlerFnName, op.handlerOps, op.consumesDollarEvent);
                 const eventTargetResolver = op.eventTarget
@@ -23783,9 +24143,11 @@ function reifyUpdateOperations(unit, ops) {
                 OpList.replace(op, advance(op.delta, op.sourceSpan));
                 break;
             case OpKind.Property:
-                OpList.replace(op, unit.job.mode === TemplateCompilationMode.DomOnly && !op.isLegacyAnimationTrigger
-                    ? domProperty(DOM_PROPERTY_REMAPPING.get(op.name) ?? op.name, op.expression, op.sanitizer, op.sourceSpan)
-                    : property(op.name, op.expression, op.sanitizer, op.sourceSpan));
+                OpList.replace(op, unit.job.mode === TemplateCompilationMode.DomOnly &&
+                    op.bindingKind !== BindingKind.LegacyAnimation &&
+                    op.bindingKind !== BindingKind.Animation
+                    ? reifyDomProperty(op)
+                    : reifyProperty(op));
                 break;
             case OpKind.TwoWayProperty:
                 OpList.replace(op, twoWayProperty(op.name, op.expression, op.sanitizer, op.sourceSpan));
@@ -23819,11 +24181,12 @@ function reifyUpdateOperations(unit, ops) {
                     throw new Error('not yet handled');
                 }
                 else {
-                    if (op.isLegacyAnimationTrigger) {
+                    if (op.bindingKind === BindingKind.LegacyAnimation ||
+                        op.bindingKind === BindingKind.Animation) {
                         OpList.replace(op, syntheticHostProperty(op.name, op.expression, op.sourceSpan));
                     }
                     else {
-                        OpList.replace(op, domProperty(DOM_PROPERTY_REMAPPING.get(op.name) ?? op.name, op.expression, op.sanitizer, op.sourceSpan));
+                        OpList.replace(op, reifyDomProperty(op));
                     }
                 }
                 break;
@@ -23855,6 +24218,61 @@ function reifyUpdateOperations(unit, ops) {
         }
     }
 }
+/**
+ * Converts an ARIA property name to its corresponding attribute name, if necessary.
+ *
+ * For example, converts `ariaLabel` to `aria-label`.
+ *
+ * https://www.w3.org/TR/wai-aria-1.2/#accessibilityroleandproperties-correspondence
+ *
+ * This must be kept in sync with the the function of the same name in
+ * packages/core/src/render3/instructions/aria_property.ts.
+ *
+ * @param name A property name that starts with `aria`.
+ * @returns The corresponding attribute name.
+ */
+function ariaAttrName(name) {
+    return name.charAt(ARIA_PREFIX.length) !== '-'
+        ? ARIA_PREFIX + '-' + name.slice(ARIA_PREFIX.length).toLowerCase()
+        : name; // Property already has attribute name.
+}
+/**
+ * Returns whether `name` is an ARIA property (or attribute) name.
+ *
+ * This is a heuristic based on whether name begins with and is longer than `aria`. For example,
+ * this returns true for both `ariaLabel` and `aria-label`.
+ */
+function isAriaProperty(name) {
+    return name.startsWith(ARIA_PREFIX) && name.length > ARIA_PREFIX.length;
+}
+/**
+ * Reifies a DOM property binding operation.
+ *
+ * This is an optimized version of {@link reifyProperty} that avoids unnecessarily trying to bind
+ * to directive inputs at runtime for views that don't import any directives.
+ *
+ * @param op A property binding operation.
+ * @returns A statement to update the property at runtime.
+ */
+function reifyDomProperty(op) {
+    return isAriaProperty(op.name)
+        ? attribute(ariaAttrName(op.name), op.expression, null, null, op.sourceSpan)
+        : domProperty(DOM_PROPERTY_REMAPPING.get(op.name) ?? op.name, op.expression, op.sanitizer, op.sourceSpan);
+}
+/**
+ * Reifies a property binding operation.
+ *
+ * The returned statement attempts to bind to directive inputs before falling back to a DOM
+ * property.
+ *
+ * @param op A property binding operation.
+ * @returns A statement to update the property at runtime.
+ */
+function reifyProperty(op) {
+    return isAriaProperty(op.name)
+        ? ariaProperty(op.name, op.expression, op.sourceSpan)
+        : property(op.name, op.expression, op.sanitizer, op.sourceSpan);
+}
 function reifyIrExpression(expr) {
     if (!isIrExpression(expr)) {
         return expr;
@@ -24096,6 +24514,8 @@ function processLexicalScope$1(view, ops) {
                         break;
                 }
                 break;
+            case OpKind.Animation:
+            case OpKind.AnimationListener:
             case OpKind.Listener:
             case OpKind.TwoWayListener:
                 processLexicalScope$1(view, op.handlerOps);
@@ -24161,11 +24581,13 @@ function resolveDollarEvent(job) {
 }
 function transformDollarEvent(ops) {
     for (const op of ops) {
-        if (op.kind === OpKind.Listener || op.kind === OpKind.TwoWayListener) {
+        if (op.kind === OpKind.Listener ||
+            op.kind === OpKind.TwoWayListener ||
+            op.kind === OpKind.AnimationListener) {
             transformExpressionsInOp(op, (expr) => {
                 if (expr instanceof LexicalReadExpr && expr.name === '$event') {
                     // Two-way listeners always consume `$event` so they omit this field.
-                    if (op.kind === OpKind.Listener) {
+                    if (op.kind === OpKind.Listener || op.kind === OpKind.AnimationListener) {
                         op.consumesDollarEvent = true;
                     }
                     return new ReadVarExpr(expr.name);
@@ -24556,6 +24978,8 @@ function processLexicalScope(unit, ops, savedView) {
                         break;
                 }
                 break;
+            case OpKind.Animation:
+            case OpKind.AnimationListener:
             case OpKind.Listener:
             case OpKind.TwoWayListener:
                 // Listener functions have separate variable declarations, so process them as a separate
@@ -24573,7 +24997,10 @@ function processLexicalScope(unit, ops, savedView) {
     // scope. Also, look for `ir.RestoreViewExpr`s and match them with the snapshotted view context
     // variable.
     for (const op of ops) {
-        if (op.kind == OpKind.Listener || op.kind === OpKind.TwoWayListener) {
+        if (op.kind == OpKind.Listener ||
+            op.kind === OpKind.TwoWayListener ||
+            op.kind === OpKind.Animation ||
+            op.kind === OpKind.AnimationListener) {
             // Listeners were already processed above with their own scopes.
             continue;
         }
@@ -24742,7 +25169,10 @@ function saveAndRestoreView(job) {
             }, new GetCurrentViewExpr(), VariableFlags.None),
         ]);
         for (const op of unit.create) {
-            if (op.kind !== OpKind.Listener && op.kind !== OpKind.TwoWayListener) {
+            if (op.kind !== OpKind.Listener &&
+                op.kind !== OpKind.TwoWayListener &&
+                op.kind !== OpKind.Animation &&
+                op.kind !== OpKind.AnimationListener) {
                 continue;
             }
             // Embedded views always need the save/restore view operation.
@@ -25062,7 +25492,10 @@ function generateTemporaries(ops) {
         // Add declarations for the temp vars.
         generatedStatements.push(...Array.from(new Set(defs.values())).map((name) => createStatementOp(new DeclareVarStmt(name))));
         opCount++;
-        if (op.kind === OpKind.Listener || op.kind === OpKind.TwoWayListener) {
+        if (op.kind === OpKind.Listener ||
+            op.kind === OpKind.Animation ||
+            op.kind === OpKind.AnimationListener ||
+            op.kind === OpKind.TwoWayListener) {
             op.handlerOps.prepend(generateTemporaries(op.handlerOps));
         }
         else if (op.kind === OpKind.RepeaterCreate && op.trackByOps !== null) {
@@ -25406,7 +25839,10 @@ function optimizeVariables(job) {
         inlineAlwaysInlineVariables(unit.create);
         inlineAlwaysInlineVariables(unit.update);
         for (const op of unit.create) {
-            if (op.kind === OpKind.Listener || op.kind === OpKind.TwoWayListener) {
+            if (op.kind === OpKind.Listener ||
+                op.kind === OpKind.Animation ||
+                op.kind === OpKind.AnimationListener ||
+                op.kind === OpKind.TwoWayListener) {
                 inlineAlwaysInlineVariables(op.handlerOps);
             }
             else if (op.kind === OpKind.RepeaterCreate && op.trackByOps !== null) {
@@ -25416,7 +25852,10 @@ function optimizeVariables(job) {
         optimizeVariablesInOpList(unit.create, job.compatibility);
         optimizeVariablesInOpList(unit.update, job.compatibility);
         for (const op of unit.create) {
-            if (op.kind === OpKind.Listener || op.kind === OpKind.TwoWayListener) {
+            if (op.kind === OpKind.Listener ||
+                op.kind === OpKind.Animation ||
+                op.kind === OpKind.AnimationListener ||
+                op.kind === OpKind.TwoWayListener) {
                 optimizeVariablesInOpList(op.handlerOps, job.compatibility);
             }
             else if (op.kind === OpKind.RepeaterCreate && op.trackByOps !== null) {
@@ -25853,6 +26292,7 @@ const phases = [
     { kind: CompilationJobKind.Both, fn: deduplicateTextBindings },
     { kind: CompilationJobKind.Both, fn: specializeStyleBindings },
     { kind: CompilationJobKind.Both, fn: specializeBindings },
+    { kind: CompilationJobKind.Both, fn: convertAnimations },
     { kind: CompilationJobKind.Both, fn: extractAttributes },
     { kind: CompilationJobKind.Tmpl, fn: createI18nContexts },
     { kind: CompilationJobKind.Both, fn: parseExtractedStyles },
@@ -26012,6 +26452,8 @@ const compatibilityMode = CompatibilityMode.TemplateDefinitionBuilder;
 const domSchema = new DomElementSchemaRegistry();
 // Tag name of the `ng-template` element.
 const NG_TEMPLATE_TAG_NAME = 'ng-template';
+// prefix for any animation binding
+const ANIMATE_PREFIX$1 = 'animate.';
 function isI18nRootNode(meta) {
     return meta instanceof Message;
 }
@@ -26044,6 +26486,9 @@ function ingestHostBinding(input, bindingParser, constantPool) {
         if (property.isLegacyAnimation) {
             bindingKind = BindingKind.LegacyAnimation;
         }
+        if (property.isAnimation) {
+            bindingKind = BindingKind.Animation;
+        }
         const securityContexts = bindingParser
             .calcPossibleSecurityContexts(input.componentSelector, property.name, bindingKind === BindingKind.Attribute)
             .filter((context) => context !== SecurityContext.NONE);
@@ -26710,6 +27155,7 @@ const BINDING_KINDS = new Map([
     [exports.BindingType.Class, BindingKind.ClassName],
     [exports.BindingType.Style, BindingKind.StyleProperty],
     [exports.BindingType.LegacyAnimation, BindingKind.LegacyAnimation],
+    [exports.BindingType.Animation, BindingKind.Animation],
 ]);
 /**
  * Checks whether the given template is a plain ng-template (as opposed to another kind of template
@@ -26774,6 +27220,9 @@ function ingestElementBindings(unit, op, element) {
         if (output.type === exports.ParsedEventType.TwoWay) {
             unit.create.push(createTwoWayListenerOp(op.xref, op.handle, output.name, op.tag, makeTwoWayListenerHandlerOps(unit, output.handler, output.handlerSpan), output.sourceSpan));
         }
+        else if (output.type === exports.ParsedEventType.Animation) {
+            unit.create.push(createAnimationListenerOp(op.xref, op.handle, output.name, op.tag, makeListenerHandlerOps(unit, output.handler, output.handlerSpan), output.name.endsWith('enter') ? "enter" /* ir.AnimationKind.ENTER */ : "leave" /* ir.AnimationKind.LEAVE */, output.target, false, output.sourceSpan));
+        }
         else {
             unit.create.push(createListenerOp(op.xref, op.handle, output.name, op.tag, makeListenerHandlerOps(unit, output.handler, output.handlerSpan), output.phase, output.target, false, output.sourceSpan));
         }
@@ -26882,7 +27331,9 @@ function createTemplateBinding(view, xref, type, name, value, unit, securityCont
             }
         }
         if (!isTextBinding &&
-            (type === exports.BindingType.Attribute || type === exports.BindingType.LegacyAnimation)) {
+            (type === exports.BindingType.Attribute ||
+                type === exports.BindingType.LegacyAnimation ||
+                type === exports.BindingType.Animation)) {
             // Again, this binding doesn't really target the ng-template; it actually targets the element
             // inside the structural template. In the case of non-text attribute or animation bindings,
             // the binding doesn't even show up on the ng-template const array, so we just skip it
@@ -27040,14 +27491,18 @@ function ingestControlFlowInsertionPoint(unit, xref, node) {
     if (root !== null) {
         // Collect the static attributes for content projection purposes.
         for (const attr of root.attributes) {
-            const securityContext = domSchema.securityContext(NG_TEMPLATE_TAG_NAME, attr.name, true);
-            unit.update.push(createBindingOp(xref, BindingKind.Attribute, attr.name, literal(attr.value), null, securityContext, true, false, null, asMessage(attr.i18n), attr.sourceSpan));
+            if (!attr.name.startsWith(ANIMATE_PREFIX$1)) {
+                const securityContext = domSchema.securityContext(NG_TEMPLATE_TAG_NAME, attr.name, true);
+                unit.update.push(createBindingOp(xref, BindingKind.Attribute, attr.name, literal(attr.value), null, securityContext, true, false, null, asMessage(attr.i18n), attr.sourceSpan));
+            }
         }
         // Also collect the inputs since they participate in content projection as well.
         // Note that TDB used to collect the outputs as well, but it wasn't passing them into
         // the template instruction. Here we just don't collect them.
         for (const attr of root.inputs) {
-            if (attr.type !== exports.BindingType.LegacyAnimation && attr.type !== exports.BindingType.Attribute) {
+            if (attr.type !== exports.BindingType.LegacyAnimation &&
+                attr.type !== exports.BindingType.Animation &&
+                attr.type !== exports.BindingType.Attribute) {
                 const securityContext = domSchema.securityContext(NG_TEMPLATE_TAG_NAME, attr.name, true);
                 unit.create.push(createExtractedAttributeOp(xref, BindingKind.Property, null, attr.name, null, null, null, securityContext));
             }
@@ -27259,6 +27714,7 @@ class HtmlParser extends Parser$1 {
 
 const PROPERTY_PARTS_SEPARATOR = '.';
 const ATTRIBUTE_PREFIX = 'attr';
+const ANIMATE_PREFIX = 'animate';
 const CLASS_PREFIX = 'class';
 const STYLE_PREFIX = 'style';
 const TEMPLATE_ATTR_PREFIX$1 = '*';
@@ -27458,6 +27914,9 @@ class BindingParser {
         if (isLegacyAnimationProp) {
             this._parseLegacyAnimation(name, expression, sourceSpan, absoluteOffset, keySpan, valueSpan, targetMatchableAttrs, targetProps);
         }
+        else if (name.startsWith(ANIMATE_PREFIX)) {
+            this._parseAnimation(name, this.parseBinding(expression, isHost, valueSpan || sourceSpan, absoluteOffset), sourceSpan, keySpan, valueSpan, targetMatchableAttrs, targetProps);
+        }
         else {
             this._parsePropertyAst(name, this.parseBinding(expression, isHost, valueSpan || sourceSpan, absoluteOffset), isPartOfAssignmentBinding, sourceSpan, keySpan, valueSpan, targetMatchableAttrs, targetProps);
         }
@@ -27474,6 +27933,10 @@ class BindingParser {
         targetMatchableAttrs.push([name, ast.source]);
         targetProps.push(new ParsedProperty(name, ast, isPartOfAssignmentBinding ? ParsedPropertyType.TWO_WAY : ParsedPropertyType.DEFAULT, sourceSpan, keySpan, valueSpan));
     }
+    _parseAnimation(name, ast, sourceSpan, keySpan, valueSpan, targetMatchableAttrs, targetProps) {
+        targetMatchableAttrs.push([name, ast.source]);
+        targetProps.push(new ParsedProperty(name, ast, ParsedPropertyType.ANIMATION, sourceSpan, keySpan, valueSpan));
+    }
     _parseLegacyAnimation(name, expression, sourceSpan, absoluteOffset, keySpan, valueSpan, targetMatchableAttrs, targetProps) {
         if (name.length === 0) {
             this._reportError('Animation trigger is missing', sourceSpan);
@@ -27536,6 +27999,11 @@ class BindingParser {
                 bindingType = exports.BindingType.Style;
                 securityContexts = [SecurityContext.STYLE];
             }
+            else if (parts[0] == ANIMATE_PREFIX) {
+                boundPropertyName = boundProp.name;
+                bindingType = exports.BindingType.Animation;
+                securityContexts = [SecurityContext.NONE];
+            }
         }
         // If not a special case, use the full property name
         if (boundPropertyName === null) {
@@ -27550,7 +28018,6 @@ class BindingParser {
         }
         return new BoundElementProperty(boundPropertyName, bindingType, securityContexts[0], boundProp.expression, unit, boundProp.sourceSpan, boundProp.keySpan, boundProp.valueSpan);
     }
-    // TODO: keySpan should be required but was made optional to avoid changing VE parser.
     parseEvent(name, expression, isAssignmentEvent, sourceSpan, handlerSpan, targetMatchableAttrs, targetEvents, keySpan) {
         if (name.length === 0) {
             this._reportError(`Event name is missing in binding`, sourceSpan);
@@ -27606,7 +28073,14 @@ class BindingParser {
         if (isAssignmentEvent && isValid && !this._isAllowedAssignmentEvent(ast)) {
             this._reportError('Unsupported expression in a two-way binding', sourceSpan);
         }
-        targetEvents.push(new ParsedEvent(eventName, target, isAssignmentEvent ? exports.ParsedEventType.TwoWay : exports.ParsedEventType.Regular, ast, sourceSpan, handlerSpan, keySpan));
+        let eventType = exports.ParsedEventType.Regular;
+        if (isAssignmentEvent) {
+            eventType = exports.ParsedEventType.TwoWay;
+        }
+        if (name.startsWith(ANIMATE_PREFIX)) {
+            eventType = exports.ParsedEventType.Animation;
+        }
+        targetEvents.push(new ParsedEvent(eventName, target, eventType, ast, sourceSpan, handlerSpan, keySpan));
         // Don't detect directives for event names for now,
         // so don't add the event name to the matchableAttrs
     }
@@ -28865,7 +29339,7 @@ class HtmlAstToIvyAst {
         }
         else {
             const attrs = this.categorizePropertyAttributes(element.name, parsedProperties, i18nAttrsMeta);
-            parsedElement = new Element$1(element.name, attributes, attrs.bound, boundEvents, directives, children, references, element.isSelfClosing, element.sourceSpan, element.startSourceSpan, element.endSourceSpan, element.i18n);
+            parsedElement = new Element$1(element.name, attributes, attrs.bound, boundEvents, directives, children, references, element.isSelfClosing, element.sourceSpan, element.startSourceSpan, element.endSourceSpan, element.isVoid, element.i18n);
         }
         if (elementHasInlineTemplate) {
             // If this node is an inline-template (e.g. has *ngFor) then we need to create a template
@@ -29177,7 +29651,7 @@ class HtmlAstToIvyAst {
                 const identifier = bindParts[IDENT_KW_IDX];
                 const keySpan = createKeySpan(srcSpan, bindParts[KW_BINDON_IDX], identifier);
                 this.bindingParser.parsePropertyBinding(identifier, value, false, true, srcSpan, absoluteOffset, attribute.valueSpan, matchableAttributes, parsedProperties, keySpan);
-                this.parseAssignmentEvent(identifier, value, srcSpan, attribute.valueSpan, matchableAttributes, boundEvents, keySpan);
+                this.parseAssignmentEvent(identifier, value, srcSpan, attribute.valueSpan, matchableAttributes, boundEvents, keySpan, absoluteOffset);
             }
             else if (bindParts[KW_AT_IDX]) {
                 const keySpan = createKeySpan(srcSpan, '', name);
@@ -29208,7 +29682,7 @@ class HtmlAstToIvyAst {
             const keySpan = createKeySpan(srcSpan, delims.start, identifier);
             if (delims.start === BINDING_DELIMS.BANANA_BOX.start) {
                 this.bindingParser.parsePropertyBinding(identifier, value, false, true, srcSpan, absoluteOffset, attribute.valueSpan, matchableAttributes, parsedProperties, keySpan);
-                this.parseAssignmentEvent(identifier, value, srcSpan, attribute.valueSpan, matchableAttributes, boundEvents, keySpan);
+                this.parseAssignmentEvent(identifier, value, srcSpan, attribute.valueSpan, matchableAttributes, boundEvents, keySpan, absoluteOffset);
             }
             else if (delims.start === BINDING_DELIMS.PROPERTY.start) {
                 this.bindingParser.parsePropertyBinding(identifier, value, false, false, srcSpan, absoluteOffset, attribute.valueSpan, matchableAttributes, parsedProperties, keySpan);
@@ -29328,7 +29802,7 @@ class HtmlAstToIvyAst {
         }
         references.push(new Reference$1(identifier, value, sourceSpan, keySpan, valueSpan));
     }
-    parseAssignmentEvent(name, expression, sourceSpan, valueSpan, targetMatchableAttrs, boundEvents, keySpan) {
+    parseAssignmentEvent(name, expression, sourceSpan, valueSpan, targetMatchableAttrs, boundEvents, keySpan, absoluteOffset) {
         const events = [];
         this.bindingParser.parseEvent(`${name}Change`, expression, 
         /* isAssignmentEvent */ true, sourceSpan, valueSpan || sourceSpan, targetMatchableAttrs, events, keySpan);
@@ -29371,7 +29845,7 @@ class NonBindableVisitor {
         /* inputs */ [], 
         /* outputs */ [], 
         /* directives */ [], children, 
-        /* references */ [], ast.isSelfClosing, ast.sourceSpan, ast.startSourceSpan, ast.endSourceSpan);
+        /* references */ [], ast.isSelfClosing, ast.sourceSpan, ast.startSourceSpan, ast.endSourceSpan, ast.isVoid);
     }
     visitComment(comment) {
         return null;
@@ -29412,7 +29886,7 @@ class NonBindableVisitor {
         /* inputs */ [], 
         /* outputs */ [], 
         /* directives */ [], children, 
-        /* references */ [], ast.isSelfClosing, ast.sourceSpan, ast.startSourceSpan, ast.endSourceSpan);
+        /* references */ [], ast.isSelfClosing, ast.sourceSpan, ast.startSourceSpan, ast.endSourceSpan, false);
     }
     visitDirective(directive, context) {
         return null;
@@ -29556,9 +30030,184 @@ function makeBindingParser(interpolationConfig = DEFAULT_INTERPOLATION_CONFIG, s
     return new BindingParser(new Parser(new Lexer(), selectorlessEnabled), interpolationConfig, elementRegistry, []);
 }
 
+/*!
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+/**
+ * Visitor that traverses all template and expression AST nodes in a template.
+ * Useful for cases where every single node needs to be visited.
+ */
+class CombinedRecursiveAstVisitor extends RecursiveAstVisitor {
+    visit(node) {
+        if (node instanceof ASTWithSource) {
+            this.visit(node.ast);
+        }
+        else {
+            node.visit(this);
+        }
+    }
+    visitElement(element) {
+        this.visitAllTemplateNodes(element.attributes);
+        this.visitAllTemplateNodes(element.inputs);
+        this.visitAllTemplateNodes(element.outputs);
+        this.visitAllTemplateNodes(element.directives);
+        this.visitAllTemplateNodes(element.references);
+        this.visitAllTemplateNodes(element.children);
+    }
+    visitTemplate(template) {
+        this.visitAllTemplateNodes(template.attributes);
+        this.visitAllTemplateNodes(template.inputs);
+        this.visitAllTemplateNodes(template.outputs);
+        this.visitAllTemplateNodes(template.directives);
+        this.visitAllTemplateNodes(template.templateAttrs);
+        this.visitAllTemplateNodes(template.variables);
+        this.visitAllTemplateNodes(template.references);
+        this.visitAllTemplateNodes(template.children);
+    }
+    visitContent(content) {
+        this.visitAllTemplateNodes(content.children);
+    }
+    visitBoundAttribute(attribute) {
+        this.visit(attribute.value);
+    }
+    visitBoundEvent(attribute) {
+        this.visit(attribute.handler);
+    }
+    visitBoundText(text) {
+        this.visit(text.value);
+    }
+    visitIcu(icu) {
+        Object.keys(icu.vars).forEach((key) => this.visit(icu.vars[key]));
+        Object.keys(icu.placeholders).forEach((key) => this.visit(icu.placeholders[key]));
+    }
+    visitDeferredBlock(deferred) {
+        deferred.visitAll(this);
+    }
+    visitDeferredTrigger(trigger) {
+        if (trigger instanceof BoundDeferredTrigger) {
+            this.visit(trigger.value);
+        }
+    }
+    visitDeferredBlockPlaceholder(block) {
+        this.visitAllTemplateNodes(block.children);
+    }
+    visitDeferredBlockError(block) {
+        this.visitAllTemplateNodes(block.children);
+    }
+    visitDeferredBlockLoading(block) {
+        this.visitAllTemplateNodes(block.children);
+    }
+    visitSwitchBlock(block) {
+        this.visit(block.expression);
+        this.visitAllTemplateNodes(block.cases);
+    }
+    visitSwitchBlockCase(block) {
+        block.expression && this.visit(block.expression);
+        this.visitAllTemplateNodes(block.children);
+    }
+    visitForLoopBlock(block) {
+        block.item.visit(this);
+        this.visitAllTemplateNodes(block.contextVariables);
+        this.visit(block.expression);
+        this.visitAllTemplateNodes(block.children);
+        block.empty?.visit(this);
+    }
+    visitForLoopBlockEmpty(block) {
+        this.visitAllTemplateNodes(block.children);
+    }
+    visitIfBlock(block) {
+        this.visitAllTemplateNodes(block.branches);
+    }
+    visitIfBlockBranch(block) {
+        block.expression && this.visit(block.expression);
+        block.expressionAlias?.visit(this);
+        this.visitAllTemplateNodes(block.children);
+    }
+    visitLetDeclaration(decl) {
+        this.visit(decl.value);
+    }
+    visitComponent(component) {
+        this.visitAllTemplateNodes(component.attributes);
+        this.visitAllTemplateNodes(component.inputs);
+        this.visitAllTemplateNodes(component.outputs);
+        this.visitAllTemplateNodes(component.directives);
+        this.visitAllTemplateNodes(component.references);
+        this.visitAllTemplateNodes(component.children);
+    }
+    visitDirective(directive) {
+        this.visitAllTemplateNodes(directive.attributes);
+        this.visitAllTemplateNodes(directive.inputs);
+        this.visitAllTemplateNodes(directive.outputs);
+        this.visitAllTemplateNodes(directive.references);
+    }
+    visitVariable(variable) { }
+    visitReference(reference) { }
+    visitTextAttribute(attribute) { }
+    visitText(text) { }
+    visitUnknownBlock(block) { }
+    visitAllTemplateNodes(nodes) {
+        for (const node of nodes) {
+            this.visit(node);
+        }
+    }
+}
+
+/*!
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+const ANIMATE_LEAVE$1 = `animate.leave`;
+/**
+ * Analyzes a component's template to determine if it's using animate.enter
+ * or animate.leave syntax.
+ */
+function analyzeTemplateForAnimations(template) {
+    const analyzer = new AnimationsAnalyzer();
+    visitAll$1(analyzer, template);
+    // The template is considered selectorless only if there
+    // are direct references to directives or pipes.
+    return analyzer.hasAnimations;
+}
+/**
+ * Visitor that traverses all the template nodes and
+ * expressions to look for selectorless references.
+ */
+class AnimationsAnalyzer extends CombinedRecursiveAstVisitor {
+    hasAnimations = false;
+    visitElement(element) {
+        // check for regular strings
+        for (const attr of element.attributes) {
+            if (attr.name === ANIMATE_LEAVE$1) {
+                this.hasAnimations = true;
+            }
+        }
+        // check for attribute bindings
+        for (const input of element.inputs) {
+            if (input.name === ANIMATE_LEAVE$1) {
+                this.hasAnimations = true;
+            }
+        }
+        // check for event bindings
+        for (const output of element.outputs) {
+            if (output.name === ANIMATE_LEAVE$1) {
+                this.hasAnimations = true;
+            }
+        }
+        super.visitElement(element);
+    }
+}
+
 const COMPONENT_VARIABLE = '%COMP%';
 const HOST_ATTR = `_nghost-${COMPONENT_VARIABLE}`;
 const CONTENT_ATTR = `_ngcontent-${COMPONENT_VARIABLE}`;
+const ANIMATE_LEAVE = `animate.leave`;
 function baseDirectiveFields(meta, constantPool, bindingParser) {
     const definitionMap = new DefinitionMap();
     const selectors = parseSelectorToR3Selector(meta.selector);
@@ -29592,6 +30241,11 @@ function baseDirectiveFields(meta, constantPool, bindingParser) {
     }
     return definitionMap;
 }
+function hasAnimationHostBinding(meta) {
+    return (meta.host.attributes[ANIMATE_LEAVE] !== undefined ||
+        meta.host.properties[ANIMATE_LEAVE] !== undefined ||
+        meta.host.listeners[ANIMATE_LEAVE] !== undefined);
+}
 /**
  * Add features to the definition map.
  */
@@ -29626,6 +30280,12 @@ function addFeatures(definitionMap, meta) {
         const externalStyleNodes = meta.externalStyles.map((externalStyle) => literal(externalStyle));
         features.push(importExpr(Identifiers.ExternalStylesFeature).callFn([literalArr(externalStyleNodes)]));
     }
+    const template = meta.template;
+    if (hasAnimationHostBinding(meta) || (template && template.nodes.length > 0)) {
+        if (hasAnimationHostBinding(meta) || analyzeTemplateForAnimations(template.nodes)) {
+            features.push(importExpr(Identifiers.AnimationsFeature).callFn([]));
+        }
+    }
     if (features.length) {
         definitionMap.set('features', literalArr(features));
     }
@@ -30066,132 +30726,6 @@ function compileDeferResolverFunction(meta) {
     return arrowFn([], literalArr(depExpressions));
 }
 
-/*!
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.dev/license
- */
-/**
- * Visitor that traverses all template and expression AST nodes in a template.
- * Useful for cases where every single node needs to be visited.
- */
-class CombinedRecursiveAstVisitor extends RecursiveAstVisitor {
-    visit(node) {
-        if (node instanceof ASTWithSource) {
-            this.visit(node.ast);
-        }
-        else {
-            node.visit(this);
-        }
-    }
-    visitElement(element) {
-        this.visitAllTemplateNodes(element.attributes);
-        this.visitAllTemplateNodes(element.inputs);
-        this.visitAllTemplateNodes(element.outputs);
-        this.visitAllTemplateNodes(element.directives);
-        this.visitAllTemplateNodes(element.references);
-        this.visitAllTemplateNodes(element.children);
-    }
-    visitTemplate(template) {
-        this.visitAllTemplateNodes(template.attributes);
-        this.visitAllTemplateNodes(template.inputs);
-        this.visitAllTemplateNodes(template.outputs);
-        this.visitAllTemplateNodes(template.directives);
-        this.visitAllTemplateNodes(template.templateAttrs);
-        this.visitAllTemplateNodes(template.variables);
-        this.visitAllTemplateNodes(template.references);
-        this.visitAllTemplateNodes(template.children);
-    }
-    visitContent(content) {
-        this.visitAllTemplateNodes(content.children);
-    }
-    visitBoundAttribute(attribute) {
-        this.visit(attribute.value);
-    }
-    visitBoundEvent(attribute) {
-        this.visit(attribute.handler);
-    }
-    visitBoundText(text) {
-        this.visit(text.value);
-    }
-    visitIcu(icu) {
-        Object.keys(icu.vars).forEach((key) => this.visit(icu.vars[key]));
-        Object.keys(icu.placeholders).forEach((key) => this.visit(icu.placeholders[key]));
-    }
-    visitDeferredBlock(deferred) {
-        deferred.visitAll(this);
-    }
-    visitDeferredTrigger(trigger) {
-        if (trigger instanceof BoundDeferredTrigger) {
-            this.visit(trigger.value);
-        }
-    }
-    visitDeferredBlockPlaceholder(block) {
-        this.visitAllTemplateNodes(block.children);
-    }
-    visitDeferredBlockError(block) {
-        this.visitAllTemplateNodes(block.children);
-    }
-    visitDeferredBlockLoading(block) {
-        this.visitAllTemplateNodes(block.children);
-    }
-    visitSwitchBlock(block) {
-        this.visit(block.expression);
-        this.visitAllTemplateNodes(block.cases);
-    }
-    visitSwitchBlockCase(block) {
-        block.expression && this.visit(block.expression);
-        this.visitAllTemplateNodes(block.children);
-    }
-    visitForLoopBlock(block) {
-        block.item.visit(this);
-        this.visitAllTemplateNodes(block.contextVariables);
-        this.visit(block.expression);
-        this.visitAllTemplateNodes(block.children);
-        block.empty?.visit(this);
-    }
-    visitForLoopBlockEmpty(block) {
-        this.visitAllTemplateNodes(block.children);
-    }
-    visitIfBlock(block) {
-        this.visitAllTemplateNodes(block.branches);
-    }
-    visitIfBlockBranch(block) {
-        block.expression && this.visit(block.expression);
-        block.expressionAlias?.visit(this);
-        this.visitAllTemplateNodes(block.children);
-    }
-    visitLetDeclaration(decl) {
-        this.visit(decl.value);
-    }
-    visitComponent(component) {
-        this.visitAllTemplateNodes(component.attributes);
-        this.visitAllTemplateNodes(component.inputs);
-        this.visitAllTemplateNodes(component.outputs);
-        this.visitAllTemplateNodes(component.directives);
-        this.visitAllTemplateNodes(component.references);
-        this.visitAllTemplateNodes(component.children);
-    }
-    visitDirective(directive) {
-        this.visitAllTemplateNodes(directive.attributes);
-        this.visitAllTemplateNodes(directive.inputs);
-        this.visitAllTemplateNodes(directive.outputs);
-        this.visitAllTemplateNodes(directive.references);
-    }
-    visitVariable(variable) { }
-    visitReference(reference) { }
-    visitTextAttribute(attribute) { }
-    visitText(text) { }
-    visitUnknownBlock(block) { }
-    visitAllTemplateNodes(nodes) {
-        for (const node of nodes) {
-            this.visit(node);
-        }
-    }
-}
-
 /**
  * Processes `Target`s with a given set of directives and performs a binding operation, which
  * returns an object similar to TypeScript's `ts.TypeChecker` that contains knowledge about the
@@ -31451,7 +31985,7 @@ function convertDeclareComponentFacadeToMetadata(decl, typeSourceSpan, sourceMap
             declarations.push(...decl.directives.map((dir) => convertDirectiveDeclarationToMetadata(dir)));
         decl.pipes && declarations.push(...convertPipeMapToMetadata(decl.pipes));
     }
-    const hasDirectiveDependencies = declarations.every(({ kind }) => kind === exports.R3TemplateDependencyKind.Directive || kind === exports.R3TemplateDependencyKind.NgModule);
+    const hasDirectiveDependencies = declarations.some(({ kind }) => kind === exports.R3TemplateDependencyKind.Directive || kind === exports.R3TemplateDependencyKind.NgModule);
     return {
         ...convertDeclareDirectiveFacadeToMetadata(decl, typeSourceSpan),
         template,
@@ -31819,7 +32353,7 @@ class _Visitor {
         this._init(_VisitorMode.Merge, interpolationConfig);
         this._translations = translations;
         // Construct a single fake root element
-        const wrapper = new Element('wrapper', [], [], nodes, false, undefined, undefined, undefined);
+        const wrapper = new Element('wrapper', [], [], nodes, false, undefined, undefined, undefined, false);
         const translatedNode = wrapper.visit(this, null);
         if (this._inI18nBlock) {
             this._reportError(nodes[nodes.length - 1], 'Unclosed block');
@@ -31997,7 +32531,7 @@ class _Visitor {
         this._inImplicitNode = wasInImplicitNode;
         if (this._mode === _VisitorMode.Merge) {
             if (node instanceof Element) {
-                return new Element(node.name, this._translateAttributes(node), this._translateDirectives(node), childNodes, node.isSelfClosing, node.sourceSpan, node.startSourceSpan, node.endSourceSpan);
+                return new Element(node.name, this._translateAttributes(node), this._translateDirectives(node), childNodes, node.isSelfClosing, node.sourceSpan, node.startSourceSpan, node.endSourceSpan, node.isVoid);
             }
             else {
                 return new Component(node.componentName, node.tagName, node.fullName, this._translateAttributes(node), this._translateDirectives(node), childNodes, node.isSelfClosing, node.sourceSpan, node.startSourceSpan, node.endSourceSpan);
@@ -32228,7 +32762,7 @@ function isAttrNode(ast) {
  * @description
  * Entry point for all public APIs of the compiler package.
  */
-new Version('20.2.0-next.0');
+new Version('20.2.0-next.2');
 
 //////////////////////////////////////
 // THIS FILE HAS GLOBAL SIDE EFFECT //
@@ -32761,6 +33295,20 @@ exports.ErrorCode = void 0;
      * A structural directive is used in a template, but the directive is not imported.
      */
     ErrorCode[ErrorCode["MISSING_STRUCTURAL_DIRECTIVE"] = 8116] = "MISSING_STRUCTURAL_DIRECTIVE";
+    /**
+     * A function in a text interpolation is not invoked.
+     *
+     * For example:
+     * ```html
+     * <p> {{ firstName }} </p>
+     * ```
+     *
+     * The `firstName` function is not invoked. Instead, it should be:
+     * ```html
+     * <p> {{ firstName() }} </p>
+     * ```
+     */
+    ErrorCode[ErrorCode["UNINVOKED_FUNCTION_IN_TEXT_INTERPOLATION"] = 8117] = "UNINVOKED_FUNCTION_IN_TEXT_INTERPOLATION";
     /**
      * The template type-checking engine would need to generate an inline type check block for a
      * component, but the current type-checking environment doesn't support it.
@@ -32922,6 +33470,7 @@ exports.ExtendedTemplateDiagnosticName = void 0;
     ExtendedTemplateDiagnosticName["UNINVOKED_TRACK_FUNCTION"] = "uninvokedTrackFunction";
     ExtendedTemplateDiagnosticName["UNUSED_STANDALONE_IMPORTS"] = "unusedStandaloneImports";
     ExtendedTemplateDiagnosticName["UNPARENTHESIZED_NULLISH_COALESCING"] = "unparenthesizedNullishCoalescing";
+    ExtendedTemplateDiagnosticName["UNINVOKED_FUNCTION_IN_TEXT_INTERPOLATION"] = "uninvokedFunctionInTextInterpolation";
 })(exports.ExtendedTemplateDiagnosticName || (exports.ExtendedTemplateDiagnosticName = {}));
 
 /**
@@ -33248,7 +33797,7 @@ class NodeJSPathManipulation {
 // G3-ESM-MARKER: G3 uses CommonJS, but externally everything in ESM.
 // CommonJS/ESM interop for determining the current file name and containing dir.
 const isCommonJS = typeof __filename !== 'undefined';
-const currentFileUrl = isCommonJS ? null : (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('checker-DLInMAS3.cjs', document.baseURI).href));
+const currentFileUrl = isCommonJS ? null : (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('checker-Cfq29XaS.cjs', document.baseURI).href));
 // Note, when this code loads in the browser, `url` may be an empty `{}` due to the Closure shims.
 const currentFileName = isCommonJS
     ? __filename
@@ -36668,75 +37217,83 @@ exports.PerfPhase = void 0;
      * Time spent computing template type-checking diagnostics.
      */
     PerfPhase[PerfPhase["TtcDiagnostics"] = 14] = "TtcDiagnostics";
+    /**
+     * Time spent computing template type-checking suggestion diagnostics.
+     */
+    PerfPhase[PerfPhase["TtcSuggestionDiagnostics"] = 15] = "TtcSuggestionDiagnostics";
     /**
      * Time spent getting a `Symbol` from the `TemplateTypeChecker`.
      */
-    PerfPhase[PerfPhase["TtcSymbol"] = 15] = "TtcSymbol";
+    PerfPhase[PerfPhase["TtcSymbol"] = 16] = "TtcSymbol";
     /**
      * Time spent by the Angular Language Service calculating a "get references" or a renaming
      * operation.
      */
-    PerfPhase[PerfPhase["LsReferencesAndRenames"] = 16] = "LsReferencesAndRenames";
+    PerfPhase[PerfPhase["LsReferencesAndRenames"] = 17] = "LsReferencesAndRenames";
     /**
      * Time spent by the Angular Language Service calculating a "quick info" operation.
      */
-    PerfPhase[PerfPhase["LsQuickInfo"] = 17] = "LsQuickInfo";
+    PerfPhase[PerfPhase["LsQuickInfo"] = 18] = "LsQuickInfo";
     /**
      * Time spent by the Angular Language Service calculating a "get type definition" or "get
      * definition" operation.
      */
-    PerfPhase[PerfPhase["LsDefinition"] = 18] = "LsDefinition";
+    PerfPhase[PerfPhase["LsDefinition"] = 19] = "LsDefinition";
     /**
      * Time spent by the Angular Language Service calculating a "get completions" (AKA autocomplete)
      * operation.
      */
-    PerfPhase[PerfPhase["LsCompletions"] = 19] = "LsCompletions";
+    PerfPhase[PerfPhase["LsCompletions"] = 20] = "LsCompletions";
     /**
      * Time spent by the Angular Language Service calculating a "view template typecheck block"
      * operation.
      */
-    PerfPhase[PerfPhase["LsTcb"] = 20] = "LsTcb";
+    PerfPhase[PerfPhase["LsTcb"] = 21] = "LsTcb";
     /**
      * Time spent by the Angular Language Service calculating diagnostics.
      */
-    PerfPhase[PerfPhase["LsDiagnostics"] = 21] = "LsDiagnostics";
+    PerfPhase[PerfPhase["LsDiagnostics"] = 22] = "LsDiagnostics";
+    /**
+     * Time spent by the Angular Language Service calculating suggestion diagnostics.
+     */
+    PerfPhase[PerfPhase["LsSuggestionDiagnostics"] = 23] = "LsSuggestionDiagnostics";
     /**
      * Time spent by the Angular Language Service calculating a "get component locations for template"
      * operation.
      */
-    PerfPhase[PerfPhase["LsComponentLocations"] = 22] = "LsComponentLocations";
+    PerfPhase[PerfPhase["LsComponentLocations"] = 24] = "LsComponentLocations";
     /**
      * Time spent by the Angular Language Service calculating signature help.
      */
-    PerfPhase[PerfPhase["LsSignatureHelp"] = 23] = "LsSignatureHelp";
+    PerfPhase[PerfPhase["LsSignatureHelp"] = 25] = "LsSignatureHelp";
     /**
      * Time spent by the Angular Language Service calculating outlining spans.
      */
-    PerfPhase[PerfPhase["OutliningSpans"] = 24] = "OutliningSpans";
+    PerfPhase[PerfPhase["OutliningSpans"] = 26] = "OutliningSpans";
     /**
      * Time spent by the Angular Language Service calculating code fixes.
      */
-    PerfPhase[PerfPhase["LsCodeFixes"] = 25] = "LsCodeFixes";
+    PerfPhase[PerfPhase["LsCodeFixes"] = 27] = "LsCodeFixes";
     /**
      * Time spent by the Angular Language Service to fix all detected same type errors.
      */
-    PerfPhase[PerfPhase["LsCodeFixesAll"] = 26] = "LsCodeFixesAll";
+    PerfPhase[PerfPhase["LsCodeFixesAll"] = 28] = "LsCodeFixesAll";
     /**
      * Time spent computing possible Angular refactorings.
      */
-    PerfPhase[PerfPhase["LSComputeApplicableRefactorings"] = 27] = "LSComputeApplicableRefactorings";
+    PerfPhase[PerfPhase["LSComputeApplicableRefactorings"] = 29] = "LSComputeApplicableRefactorings";
     /**
      * Time spent computing changes for applying a given refactoring.
      */
-    PerfPhase[PerfPhase["LSApplyRefactoring"] = 28] = "LSApplyRefactoring";
+    PerfPhase[PerfPhase["LSApplyRefactoring"] = 30] = "LSApplyRefactoring";
     /**
      * Time spent by the Angular Language Service calculating semantic classifications.
      */
-    PerfPhase[PerfPhase["LSSemanticClassification"] = 29] = "LSSemanticClassification";
+    PerfPhase[PerfPhase["LSSemanticClassification"] = 31] = "LSSemanticClassification";
     /**
      * Tracks the number of `PerfPhase`s, and must appear at the end of the list.
      */
-    PerfPhase[PerfPhase["LAST"] = 30] = "LAST";
+    PerfPhase[PerfPhase["LAST"] = 32] = "LAST";
 })(exports.PerfPhase || (exports.PerfPhase = {}));
 /**
  * Represents some occurrence during compilation, and is tracked with a counter.
@@ -40275,6 +40832,314 @@ function extractHostBindingResources(nodes) {
     return result;
 }
 
+const parseSpanComment = /^(\d+),(\d+)$/;
+/**
+ * Reads the trailing comments and finds the first match which is a span comment (i.e. 4,10) on a
+ * node and returns it as an `AbsoluteSourceSpan`.
+ *
+ * Will return `null` if no trailing comments on the node match the expected form of a source span.
+ */
+function readSpanComment(node, sourceFile = node.getSourceFile()) {
+    return (ts.forEachTrailingCommentRange(sourceFile.text, node.getEnd(), (pos, end, kind) => {
+        if (kind !== ts.SyntaxKind.MultiLineCommentTrivia) {
+            return null;
+        }
+        const commentText = sourceFile.text.substring(pos + 2, end - 2);
+        const match = commentText.match(parseSpanComment);
+        if (match === null) {
+            return null;
+        }
+        return new AbsoluteSourceSpan(+match[1], +match[2]);
+    }) || null);
+}
+/** Used to identify what type the comment is. */
+var CommentTriviaType;
+(function (CommentTriviaType) {
+    CommentTriviaType["DIAGNOSTIC"] = "D";
+    CommentTriviaType["EXPRESSION_TYPE_IDENTIFIER"] = "T";
+})(CommentTriviaType || (CommentTriviaType = {}));
+/** Identifies what the TCB expression is for (for example, a directive declaration). */
+var ExpressionIdentifier;
+(function (ExpressionIdentifier) {
+    ExpressionIdentifier["DIRECTIVE"] = "DIR";
+    ExpressionIdentifier["COMPONENT_COMPLETION"] = "COMPCOMP";
+    ExpressionIdentifier["EVENT_PARAMETER"] = "EP";
+    ExpressionIdentifier["VARIABLE_AS_EXPRESSION"] = "VAE";
+})(ExpressionIdentifier || (ExpressionIdentifier = {}));
+/** Tags the node with the given expression identifier. */
+function addExpressionIdentifier(node, identifier) {
+    ts.addSyntheticTrailingComment(node, ts.SyntaxKind.MultiLineCommentTrivia, `${CommentTriviaType.EXPRESSION_TYPE_IDENTIFIER}:${identifier}`, 
+    /* hasTrailingNewLine */ false);
+}
+const IGNORE_FOR_DIAGNOSTICS_MARKER = `${CommentTriviaType.DIAGNOSTIC}:ignore`;
+/**
+ * Tag the `ts.Node` with an indication that any errors arising from the evaluation of the node
+ * should be ignored.
+ */
+function markIgnoreDiagnostics(node) {
+    ts.addSyntheticTrailingComment(node, ts.SyntaxKind.MultiLineCommentTrivia, IGNORE_FOR_DIAGNOSTICS_MARKER, 
+    /* hasTrailingNewLine */ false);
+}
+/** Returns true if the node has a marker that indicates diagnostics errors should be ignored.  */
+function hasIgnoreForDiagnosticsMarker(node, sourceFile) {
+    return (ts.forEachTrailingCommentRange(sourceFile.text, node.getEnd(), (pos, end, kind) => {
+        if (kind !== ts.SyntaxKind.MultiLineCommentTrivia) {
+            return null;
+        }
+        const commentText = sourceFile.text.substring(pos + 2, end - 2);
+        return commentText === IGNORE_FOR_DIAGNOSTICS_MARKER;
+    }) === true);
+}
+function makeRecursiveVisitor(visitor) {
+    function recursiveVisitor(node) {
+        const res = visitor(node);
+        return res !== null ? res : node.forEachChild(recursiveVisitor);
+    }
+    return recursiveVisitor;
+}
+function getSpanFromOptions(opts) {
+    let withSpan = null;
+    if (opts.withSpan !== undefined) {
+        if (opts.withSpan instanceof AbsoluteSourceSpan) {
+            withSpan = opts.withSpan;
+        }
+        else {
+            withSpan = { start: opts.withSpan.start.offset, end: opts.withSpan.end.offset };
+        }
+    }
+    return withSpan;
+}
+/**
+ * Given a `ts.Node` with finds the first node whose matching the criteria specified
+ * by the `FindOptions`.
+ *
+ * Returns `null` when no `ts.Node` matches the given conditions.
+ */
+function findFirstMatchingNode(tcb, opts) {
+    const withSpan = getSpanFromOptions(opts);
+    const withExpressionIdentifier = opts.withExpressionIdentifier;
+    const sf = tcb.getSourceFile();
+    const visitor = makeRecursiveVisitor((node) => {
+        if (!opts.filter(node)) {
+            return null;
+        }
+        if (withSpan !== null) {
+            const comment = readSpanComment(node, sf);
+            if (comment === null || withSpan.start !== comment.start || withSpan.end !== comment.end) {
+                return null;
+            }
+        }
+        if (withExpressionIdentifier !== undefined &&
+            !hasExpressionIdentifier(sf, node, withExpressionIdentifier)) {
+            return null;
+        }
+        return node;
+    });
+    return tcb.forEachChild(visitor) ?? null;
+}
+/**
+ * Given a `ts.Node` with source span comments, finds the first node whose source span comment
+ * matches the given `sourceSpan`. Additionally, the `filter` function allows matching only
+ * `ts.Nodes` of a given type, which provides the ability to select only matches of a given type
+ * when there may be more than one.
+ *
+ * Returns `null` when no `ts.Node` matches the given conditions.
+ */
+function findAllMatchingNodes(tcb, opts) {
+    const withSpan = getSpanFromOptions(opts);
+    const withExpressionIdentifier = opts.withExpressionIdentifier;
+    const results = [];
+    const stack = [tcb];
+    const sf = tcb.getSourceFile();
+    while (stack.length > 0) {
+        const node = stack.pop();
+        if (!opts.filter(node)) {
+            stack.push(...node.getChildren());
+            continue;
+        }
+        if (withSpan !== null) {
+            const comment = readSpanComment(node, sf);
+            if (comment === null || withSpan.start !== comment.start || withSpan.end !== comment.end) {
+                stack.push(...node.getChildren());
+                continue;
+            }
+        }
+        if (withExpressionIdentifier !== undefined &&
+            !hasExpressionIdentifier(sf, node, withExpressionIdentifier)) {
+            continue;
+        }
+        results.push(node);
+    }
+    return results;
+}
+function hasExpressionIdentifier(sourceFile, node, identifier) {
+    return (ts.forEachTrailingCommentRange(sourceFile.text, node.getEnd(), (pos, end, kind) => {
+        if (kind !== ts.SyntaxKind.MultiLineCommentTrivia) {
+            return false;
+        }
+        const commentText = sourceFile.text.substring(pos + 2, end - 2);
+        return commentText === `${CommentTriviaType.EXPRESSION_TYPE_IDENTIFIER}:${identifier}`;
+    }) || false);
+}
+
+/**
+ * A `Set` of `ts.SyntaxKind`s of `ts.Expression` which are safe to wrap in a `ts.AsExpression`
+ * without needing to be wrapped in parentheses.
+ *
+ * For example, `foo.bar()` is a `ts.CallExpression`, and can be safely cast to `any` with
+ * `foo.bar() as any`. however, `foo !== bar` is a `ts.BinaryExpression`, and attempting to cast
+ * without the parentheses yields the expression `foo !== bar as any`. This is semantically
+ * equivalent to `foo !== (bar as any)`, which is not what was intended. Thus,
+ * `ts.BinaryExpression`s need to be wrapped in parentheses before casting.
+ */
+//
+let SAFE_TO_CAST_WITHOUT_PARENS = null;
+function tsCastToAny(expr) {
+    if (SAFE_TO_CAST_WITHOUT_PARENS === null) {
+        SAFE_TO_CAST_WITHOUT_PARENS = new Set([
+            // Expressions which are already parenthesized can be cast without further wrapping.
+            ts.SyntaxKind.ParenthesizedExpression,
+            // Expressions which form a single lexical unit leave no room for precedence issues with the cast.
+            ts.SyntaxKind.Identifier,
+            ts.SyntaxKind.CallExpression,
+            ts.SyntaxKind.NonNullExpression,
+            ts.SyntaxKind.ElementAccessExpression,
+            ts.SyntaxKind.PropertyAccessExpression,
+            ts.SyntaxKind.ArrayLiteralExpression,
+            ts.SyntaxKind.ObjectLiteralExpression,
+            // The same goes for various literals.
+            ts.SyntaxKind.StringLiteral,
+            ts.SyntaxKind.NumericLiteral,
+            ts.SyntaxKind.TrueKeyword,
+            ts.SyntaxKind.FalseKeyword,
+            ts.SyntaxKind.NullKeyword,
+            ts.SyntaxKind.UndefinedKeyword,
+        ]);
+    }
+    // Wrap `expr` in parentheses if needed (see `SAFE_TO_CAST_WITHOUT_PARENS` above).
+    if (!SAFE_TO_CAST_WITHOUT_PARENS.has(expr.kind)) {
+        expr = ts.factory.createParenthesizedExpression(expr);
+    }
+    // The outer expression is always wrapped in parentheses.
+    return ts.factory.createParenthesizedExpression(ts.factory.createAsExpression(expr, ts.factory.createKeywordTypeNode(ts.SyntaxKind.AnyKeyword)));
+}
+/**
+ * Create an expression which instantiates an element by its HTML tagName.
+ *
+ * Thanks to narrowing of `document.createElement()`, this expression will have its type inferred
+ * based on the tag name, including for custom elements that have appropriate .d.ts definitions.
+ */
+function tsCreateElement(...tagNames) {
+    const createElement = ts.factory.createPropertyAccessExpression(
+    /* expression */ ts.factory.createIdentifier('document'), 'createElement');
+    let arg;
+    if (tagNames.length === 1) {
+        // If there's only one tag name, we can pass it in directly.
+        arg = ts.factory.createStringLiteral(tagNames[0]);
+    }
+    else {
+        // If there's more than one name, we have to generate a union of all the tag names. To do so,
+        // create an expression in the form of `null! as 'tag-1' | 'tag-2' | 'tag-3'`. This allows
+        // TypeScript to infer the type as a union of the differnet tags.
+        const assertedNullExpression = ts.factory.createNonNullExpression(ts.factory.createNull());
+        const type = ts.factory.createUnionTypeNode(tagNames.map((tag) => ts.factory.createLiteralTypeNode(ts.factory.createStringLiteral(tag))));
+        arg = ts.factory.createAsExpression(assertedNullExpression, type);
+    }
+    return ts.factory.createCallExpression(
+    /* expression */ createElement, 
+    /* typeArguments */ undefined, 
+    /* argumentsArray */ [arg]);
+}
+/**
+ * Create a `ts.VariableStatement` which declares a variable without explicit initialization.
+ *
+ * The initializer `null!` is used to bypass strict variable initialization checks.
+ *
+ * Unlike with `tsCreateVariable`, the type of the variable is explicitly specified.
+ */
+function tsDeclareVariable(id, type) {
+    // When we create a variable like `var _t1: boolean = null!`, TypeScript actually infers `_t1`
+    // to be `never`, instead of a `boolean`. To work around it, we cast the value
+    // in the initializer, e.g. `var _t1 = null! as boolean;`.
+    addExpressionIdentifier(type, ExpressionIdentifier.VARIABLE_AS_EXPRESSION);
+    const initializer = ts.factory.createAsExpression(ts.factory.createNonNullExpression(ts.factory.createNull()), type);
+    const decl = ts.factory.createVariableDeclaration(
+    /* name */ id, 
+    /* exclamationToken */ undefined, 
+    /* type */ undefined, 
+    /* initializer */ initializer);
+    return ts.factory.createVariableStatement(
+    /* modifiers */ undefined, 
+    /* declarationList */ [decl]);
+}
+/**
+ * Creates a `ts.TypeQueryNode` for a coerced input.
+ *
+ * For example: `typeof MatInput.ngAcceptInputType_value`, where MatInput is `typeName` and `value`
+ * is the `coercedInputName`.
+ *
+ * @param typeName The `EntityName` of the Directive where the static coerced input is defined.
+ * @param coercedInputName The field name of the coerced input.
+ */
+function tsCreateTypeQueryForCoercedInput(typeName, coercedInputName) {
+    return ts.factory.createTypeQueryNode(ts.factory.createQualifiedName(typeName, `ngAcceptInputType_${coercedInputName}`));
+}
+/**
+ * Create a `ts.VariableStatement` that initializes a variable with a given expression.
+ *
+ * Unlike with `tsDeclareVariable`, the type of the variable is inferred from the initializer
+ * expression.
+ */
+function tsCreateVariable(id, initializer, flags = null) {
+    const decl = ts.factory.createVariableDeclaration(
+    /* name */ id, 
+    /* exclamationToken */ undefined, 
+    /* type */ undefined, 
+    /* initializer */ initializer);
+    return ts.factory.createVariableStatement(
+    /* modifiers */ undefined, 
+    /* declarationList */ flags === null
+        ? [decl]
+        : ts.factory.createVariableDeclarationList([decl], flags));
+}
+/**
+ * Construct a `ts.CallExpression` that calls a method on a receiver.
+ */
+function tsCallMethod(receiver, methodName, args = []) {
+    const methodAccess = ts.factory.createPropertyAccessExpression(receiver, methodName);
+    return ts.factory.createCallExpression(
+    /* expression */ methodAccess, 
+    /* typeArguments */ undefined, 
+    /* argumentsArray */ args);
+}
+function isAccessExpression(node) {
+    return ts.isPropertyAccessExpression(node) || ts.isElementAccessExpression(node);
+}
+/**
+ * Creates a TypeScript node representing a numeric value.
+ */
+function tsNumericExpression(value) {
+    // As of TypeScript 5.3 negative numbers are represented as `prefixUnaryOperator` and passing a
+    // negative number (even as a string) into `createNumericLiteral` will result in an error.
+    if (value < 0) {
+        const operand = ts.factory.createNumericLiteral(Math.abs(value));
+        return ts.factory.createPrefixUnaryExpression(ts.SyntaxKind.MinusToken, operand);
+    }
+    return ts.factory.createNumericLiteral(value);
+}
+/**
+ * Check if a node represents a directive declaration in a TypeCheck Block.
+ * Directive declarations can be either:
+ * - var _t1: TestDir /*T:D*\/ = null! as TestDir;
+ * - var _t1 /*T:D*\/ = _ctor1({});
+ */
+function isDirectiveDeclaration(node) {
+    const sourceFile = node.getSourceFile();
+    return ((ts.isTypeNode(node) || ts.isIdentifier(node)) &&
+        ts.isVariableDeclaration(node.parent) &&
+        hasExpressionIdentifier(sourceFile, node, ExpressionIdentifier.DIRECTIVE));
+}
+
 const NgOriginalFile = Symbol('NgOriginalFile');
 exports.UpdateMode = void 0;
 (function (UpdateMode) {
@@ -40463,12 +41328,13 @@ exports.SymbolKind = void 0;
 
 /**
  * Constructs a `ts.Diagnostic` for a given `ParseSourceSpan` within a template.
+ *
+ * @param deprecatedDiagInfo Optional information about deprecation and related messages.
  */
-function makeTemplateDiagnostic(id, mapping, span, category, code, messageText, relatedMessages) {
+function makeTemplateDiagnostic(id, mapping, span, category, code, messageText, relatedMessages, deprecatedDiagInfo) {
     if (mapping.type === 'direct') {
-        let relatedInformation = undefined;
+        let relatedInformation = [];
         if (relatedMessages !== undefined) {
-            relatedInformation = [];
             for (const relatedMessage of relatedMessages) {
                 relatedInformation.push({
                     category: ts.DiagnosticCategory.Message,
@@ -40480,6 +41346,9 @@ function makeTemplateDiagnostic(id, mapping, span, category, code, messageText,
                 });
             }
         }
+        if (deprecatedDiagInfo !== undefined) {
+            relatedInformation.push(...(deprecatedDiagInfo.relatedMessages ?? []));
+        }
         // For direct mappings, the error is shown inline as ngtsc was able to pinpoint a string
         // constant within the `@Component` decorator for the template. This allows us to map the error
         // directly into the bytes of the source file.
@@ -40494,6 +41363,7 @@ function makeTemplateDiagnostic(id, mapping, span, category, code, messageText,
             start: span.start.offset,
             length: span.end.offset - span.start.offset,
             relatedInformation,
+            reportsDeprecated: deprecatedDiagInfo?.reportsDeprecated,
         };
     }
     else if (mapping.type === 'indirect' || mapping.type === 'external') {
@@ -40538,6 +41408,7 @@ function makeTemplateDiagnostic(id, mapping, span, category, code, messageText,
                 start: mapping.node.getStart(),
                 length: mapping.node.getEnd() - mapping.node.getStart(),
                 relatedInformation,
+                reportsDeprecated: deprecatedDiagInfo?.reportsDeprecated,
             };
         }
         let typeForMessage;
@@ -40553,6 +41424,9 @@ function makeTemplateDiagnostic(id, mapping, span, category, code, messageText,
         else {
             typeForMessage = 'Error';
         }
+        if (deprecatedDiagInfo !== undefined) {
+            relatedInformation.push(...(deprecatedDiagInfo.relatedMessages ?? []));
+        }
         relatedInformation.push({
             category: ts.DiagnosticCategory.Message,
             code: 0,
@@ -40575,6 +41449,7 @@ function makeTemplateDiagnostic(id, mapping, span, category, code, messageText,
             length: span.end.offset - span.start.offset,
             // Show a secondary message indicating the component whose template contains the error.
             relatedInformation,
+            reportsDeprecated: deprecatedDiagInfo?.reportsDeprecated,
         };
     }
     else {
@@ -40607,156 +41482,6 @@ function getTypeCheckId$1(clazz) {
     return sf[TYPE_CHECK_ID_MAP].get(clazz);
 }
 
-const parseSpanComment = /^(\d+),(\d+)$/;
-/**
- * Reads the trailing comments and finds the first match which is a span comment (i.e. 4,10) on a
- * node and returns it as an `AbsoluteSourceSpan`.
- *
- * Will return `null` if no trailing comments on the node match the expected form of a source span.
- */
-function readSpanComment(node, sourceFile = node.getSourceFile()) {
-    return (ts.forEachTrailingCommentRange(sourceFile.text, node.getEnd(), (pos, end, kind) => {
-        if (kind !== ts.SyntaxKind.MultiLineCommentTrivia) {
-            return null;
-        }
-        const commentText = sourceFile.text.substring(pos + 2, end - 2);
-        const match = commentText.match(parseSpanComment);
-        if (match === null) {
-            return null;
-        }
-        return new AbsoluteSourceSpan(+match[1], +match[2]);
-    }) || null);
-}
-/** Used to identify what type the comment is. */
-var CommentTriviaType;
-(function (CommentTriviaType) {
-    CommentTriviaType["DIAGNOSTIC"] = "D";
-    CommentTriviaType["EXPRESSION_TYPE_IDENTIFIER"] = "T";
-})(CommentTriviaType || (CommentTriviaType = {}));
-/** Identifies what the TCB expression is for (for example, a directive declaration). */
-var ExpressionIdentifier;
-(function (ExpressionIdentifier) {
-    ExpressionIdentifier["DIRECTIVE"] = "DIR";
-    ExpressionIdentifier["COMPONENT_COMPLETION"] = "COMPCOMP";
-    ExpressionIdentifier["EVENT_PARAMETER"] = "EP";
-    ExpressionIdentifier["VARIABLE_AS_EXPRESSION"] = "VAE";
-})(ExpressionIdentifier || (ExpressionIdentifier = {}));
-/** Tags the node with the given expression identifier. */
-function addExpressionIdentifier(node, identifier) {
-    ts.addSyntheticTrailingComment(node, ts.SyntaxKind.MultiLineCommentTrivia, `${CommentTriviaType.EXPRESSION_TYPE_IDENTIFIER}:${identifier}`, 
-    /* hasTrailingNewLine */ false);
-}
-const IGNORE_FOR_DIAGNOSTICS_MARKER = `${CommentTriviaType.DIAGNOSTIC}:ignore`;
-/**
- * Tag the `ts.Node` with an indication that any errors arising from the evaluation of the node
- * should be ignored.
- */
-function markIgnoreDiagnostics(node) {
-    ts.addSyntheticTrailingComment(node, ts.SyntaxKind.MultiLineCommentTrivia, IGNORE_FOR_DIAGNOSTICS_MARKER, 
-    /* hasTrailingNewLine */ false);
-}
-/** Returns true if the node has a marker that indicates diagnostics errors should be ignored.  */
-function hasIgnoreForDiagnosticsMarker(node, sourceFile) {
-    return (ts.forEachTrailingCommentRange(sourceFile.text, node.getEnd(), (pos, end, kind) => {
-        if (kind !== ts.SyntaxKind.MultiLineCommentTrivia) {
-            return null;
-        }
-        const commentText = sourceFile.text.substring(pos + 2, end - 2);
-        return commentText === IGNORE_FOR_DIAGNOSTICS_MARKER;
-    }) === true);
-}
-function makeRecursiveVisitor(visitor) {
-    function recursiveVisitor(node) {
-        const res = visitor(node);
-        return res !== null ? res : node.forEachChild(recursiveVisitor);
-    }
-    return recursiveVisitor;
-}
-function getSpanFromOptions(opts) {
-    let withSpan = null;
-    if (opts.withSpan !== undefined) {
-        if (opts.withSpan instanceof AbsoluteSourceSpan) {
-            withSpan = opts.withSpan;
-        }
-        else {
-            withSpan = { start: opts.withSpan.start.offset, end: opts.withSpan.end.offset };
-        }
-    }
-    return withSpan;
-}
-/**
- * Given a `ts.Node` with finds the first node whose matching the criteria specified
- * by the `FindOptions`.
- *
- * Returns `null` when no `ts.Node` matches the given conditions.
- */
-function findFirstMatchingNode(tcb, opts) {
-    const withSpan = getSpanFromOptions(opts);
-    const withExpressionIdentifier = opts.withExpressionIdentifier;
-    const sf = tcb.getSourceFile();
-    const visitor = makeRecursiveVisitor((node) => {
-        if (!opts.filter(node)) {
-            return null;
-        }
-        if (withSpan !== null) {
-            const comment = readSpanComment(node, sf);
-            if (comment === null || withSpan.start !== comment.start || withSpan.end !== comment.end) {
-                return null;
-            }
-        }
-        if (withExpressionIdentifier !== undefined &&
-            !hasExpressionIdentifier(sf, node, withExpressionIdentifier)) {
-            return null;
-        }
-        return node;
-    });
-    return tcb.forEachChild(visitor) ?? null;
-}
-/**
- * Given a `ts.Node` with source span comments, finds the first node whose source span comment
- * matches the given `sourceSpan`. Additionally, the `filter` function allows matching only
- * `ts.Nodes` of a given type, which provides the ability to select only matches of a given type
- * when there may be more than one.
- *
- * Returns `null` when no `ts.Node` matches the given conditions.
- */
-function findAllMatchingNodes(tcb, opts) {
-    const withSpan = getSpanFromOptions(opts);
-    const withExpressionIdentifier = opts.withExpressionIdentifier;
-    const results = [];
-    const stack = [tcb];
-    const sf = tcb.getSourceFile();
-    while (stack.length > 0) {
-        const node = stack.pop();
-        if (!opts.filter(node)) {
-            stack.push(...node.getChildren());
-            continue;
-        }
-        if (withSpan !== null) {
-            const comment = readSpanComment(node, sf);
-            if (comment === null || withSpan.start !== comment.start || withSpan.end !== comment.end) {
-                stack.push(...node.getChildren());
-                continue;
-            }
-        }
-        if (withExpressionIdentifier !== undefined &&
-            !hasExpressionIdentifier(sf, node, withExpressionIdentifier)) {
-            continue;
-        }
-        results.push(node);
-    }
-    return results;
-}
-function hasExpressionIdentifier(sourceFile, node, identifier) {
-    return (ts.forEachTrailingCommentRange(sourceFile.text, node.getEnd(), (pos, end, kind) => {
-        if (kind !== ts.SyntaxKind.MultiLineCommentTrivia) {
-            return false;
-        }
-        const commentText = sourceFile.text.substring(pos + 2, end - 2);
-        return commentText === `${CommentTriviaType.EXPRESSION_TYPE_IDENTIFIER}:${identifier}`;
-    }) || false);
-}
-
 /**
  * Powers autocompletion for a specific component.
  *
@@ -42473,152 +43198,6 @@ class ReferenceEmitEnvironment {
     }
 }
 
-/**
- * A `Set` of `ts.SyntaxKind`s of `ts.Expression` which are safe to wrap in a `ts.AsExpression`
- * without needing to be wrapped in parentheses.
- *
- * For example, `foo.bar()` is a `ts.CallExpression`, and can be safely cast to `any` with
- * `foo.bar() as any`. however, `foo !== bar` is a `ts.BinaryExpression`, and attempting to cast
- * without the parentheses yields the expression `foo !== bar as any`. This is semantically
- * equivalent to `foo !== (bar as any)`, which is not what was intended. Thus,
- * `ts.BinaryExpression`s need to be wrapped in parentheses before casting.
- */
-//
-let SAFE_TO_CAST_WITHOUT_PARENS = null;
-function tsCastToAny(expr) {
-    if (SAFE_TO_CAST_WITHOUT_PARENS === null) {
-        SAFE_TO_CAST_WITHOUT_PARENS = new Set([
-            // Expressions which are already parenthesized can be cast without further wrapping.
-            ts.SyntaxKind.ParenthesizedExpression,
-            // Expressions which form a single lexical unit leave no room for precedence issues with the cast.
-            ts.SyntaxKind.Identifier,
-            ts.SyntaxKind.CallExpression,
-            ts.SyntaxKind.NonNullExpression,
-            ts.SyntaxKind.ElementAccessExpression,
-            ts.SyntaxKind.PropertyAccessExpression,
-            ts.SyntaxKind.ArrayLiteralExpression,
-            ts.SyntaxKind.ObjectLiteralExpression,
-            // The same goes for various literals.
-            ts.SyntaxKind.StringLiteral,
-            ts.SyntaxKind.NumericLiteral,
-            ts.SyntaxKind.TrueKeyword,
-            ts.SyntaxKind.FalseKeyword,
-            ts.SyntaxKind.NullKeyword,
-            ts.SyntaxKind.UndefinedKeyword,
-        ]);
-    }
-    // Wrap `expr` in parentheses if needed (see `SAFE_TO_CAST_WITHOUT_PARENS` above).
-    if (!SAFE_TO_CAST_WITHOUT_PARENS.has(expr.kind)) {
-        expr = ts.factory.createParenthesizedExpression(expr);
-    }
-    // The outer expression is always wrapped in parentheses.
-    return ts.factory.createParenthesizedExpression(ts.factory.createAsExpression(expr, ts.factory.createKeywordTypeNode(ts.SyntaxKind.AnyKeyword)));
-}
-/**
- * Create an expression which instantiates an element by its HTML tagName.
- *
- * Thanks to narrowing of `document.createElement()`, this expression will have its type inferred
- * based on the tag name, including for custom elements that have appropriate .d.ts definitions.
- */
-function tsCreateElement(...tagNames) {
-    const createElement = ts.factory.createPropertyAccessExpression(
-    /* expression */ ts.factory.createIdentifier('document'), 'createElement');
-    let arg;
-    if (tagNames.length === 1) {
-        // If there's only one tag name, we can pass it in directly.
-        arg = ts.factory.createStringLiteral(tagNames[0]);
-    }
-    else {
-        // If there's more than one name, we have to generate a union of all the tag names. To do so,
-        // create an expression in the form of `null! as 'tag-1' | 'tag-2' | 'tag-3'`. This allows
-        // TypeScript to infer the type as a union of the differnet tags.
-        const assertedNullExpression = ts.factory.createNonNullExpression(ts.factory.createNull());
-        const type = ts.factory.createUnionTypeNode(tagNames.map((tag) => ts.factory.createLiteralTypeNode(ts.factory.createStringLiteral(tag))));
-        arg = ts.factory.createAsExpression(assertedNullExpression, type);
-    }
-    return ts.factory.createCallExpression(
-    /* expression */ createElement, 
-    /* typeArguments */ undefined, 
-    /* argumentsArray */ [arg]);
-}
-/**
- * Create a `ts.VariableStatement` which declares a variable without explicit initialization.
- *
- * The initializer `null!` is used to bypass strict variable initialization checks.
- *
- * Unlike with `tsCreateVariable`, the type of the variable is explicitly specified.
- */
-function tsDeclareVariable(id, type) {
-    // When we create a variable like `var _t1: boolean = null!`, TypeScript actually infers `_t1`
-    // to be `never`, instead of a `boolean`. To work around it, we cast the value
-    // in the initializer, e.g. `var _t1 = null! as boolean;`.
-    addExpressionIdentifier(type, ExpressionIdentifier.VARIABLE_AS_EXPRESSION);
-    const initializer = ts.factory.createAsExpression(ts.factory.createNonNullExpression(ts.factory.createNull()), type);
-    const decl = ts.factory.createVariableDeclaration(
-    /* name */ id, 
-    /* exclamationToken */ undefined, 
-    /* type */ undefined, 
-    /* initializer */ initializer);
-    return ts.factory.createVariableStatement(
-    /* modifiers */ undefined, 
-    /* declarationList */ [decl]);
-}
-/**
- * Creates a `ts.TypeQueryNode` for a coerced input.
- *
- * For example: `typeof MatInput.ngAcceptInputType_value`, where MatInput is `typeName` and `value`
- * is the `coercedInputName`.
- *
- * @param typeName The `EntityName` of the Directive where the static coerced input is defined.
- * @param coercedInputName The field name of the coerced input.
- */
-function tsCreateTypeQueryForCoercedInput(typeName, coercedInputName) {
-    return ts.factory.createTypeQueryNode(ts.factory.createQualifiedName(typeName, `ngAcceptInputType_${coercedInputName}`));
-}
-/**
- * Create a `ts.VariableStatement` that initializes a variable with a given expression.
- *
- * Unlike with `tsDeclareVariable`, the type of the variable is inferred from the initializer
- * expression.
- */
-function tsCreateVariable(id, initializer, flags = null) {
-    const decl = ts.factory.createVariableDeclaration(
-    /* name */ id, 
-    /* exclamationToken */ undefined, 
-    /* type */ undefined, 
-    /* initializer */ initializer);
-    return ts.factory.createVariableStatement(
-    /* modifiers */ undefined, 
-    /* declarationList */ flags === null
-        ? [decl]
-        : ts.factory.createVariableDeclarationList([decl], flags));
-}
-/**
- * Construct a `ts.CallExpression` that calls a method on a receiver.
- */
-function tsCallMethod(receiver, methodName, args = []) {
-    const methodAccess = ts.factory.createPropertyAccessExpression(receiver, methodName);
-    return ts.factory.createCallExpression(
-    /* expression */ methodAccess, 
-    /* typeArguments */ undefined, 
-    /* argumentsArray */ args);
-}
-function isAccessExpression(node) {
-    return ts.isPropertyAccessExpression(node) || ts.isElementAccessExpression(node);
-}
-/**
- * Creates a TypeScript node representing a numeric value.
- */
-function tsNumericExpression(value) {
-    // As of TypeScript 5.3 negative numbers are represented as `prefixUnaryOperator` and passing a
-    // negative number (even as a string) into `createNumericLiteral` will result in an error.
-    if (value < 0) {
-        const operand = ts.factory.createNumericLiteral(Math.abs(value));
-        return ts.factory.createPrefixUnaryExpression(ts.SyntaxKind.MinusToken, operand);
-    }
-    return ts.factory.createNumericLiteral(value);
-}
-
 /**
  * See `TypeEmitter` for more information on the emitting process.
  */
@@ -42971,7 +43550,8 @@ function inferBoundAttribute(name) {
     const attrPrefix = 'attr.';
     const classPrefix = 'class.';
     const stylePrefix = 'style.';
-    const animationPrefix = '@';
+    const animationPrefix = 'animate.';
+    const legacyAnimationPrefix = '@';
     let attrName;
     let type;
     // Infer the binding type based on the prefix.
@@ -42988,7 +43568,11 @@ function inferBoundAttribute(name) {
         type = exports.BindingType.Style;
     }
     else if (name.startsWith(animationPrefix)) {
-        attrName = name.slice(animationPrefix.length);
+        attrName = name;
+        type = exports.BindingType.Animation;
+    }
+    else if (name.startsWith(legacyAnimationPrefix)) {
+        attrName = name.slice(legacyAnimationPrefix.length);
         type = exports.BindingType.LegacyAnimation;
     }
     else {
@@ -43993,7 +44577,12 @@ function translateDiagnostic(diagnostic, resolver) {
         return null;
     }
     const { sourceLocation, sourceMapping: templateSourceMapping, span } = fullMapping;
-    return makeTemplateDiagnostic(sourceLocation.id, templateSourceMapping, span, diagnostic.category, diagnostic.code, diagnostic.messageText);
+    return makeTemplateDiagnostic(sourceLocation.id, templateSourceMapping, span, diagnostic.category, diagnostic.code, diagnostic.messageText, undefined, diagnostic.reportsDeprecated !== undefined
+        ? {
+            reportsDeprecated: diagnostic.reportsDeprecated,
+            relatedMessages: diagnostic.relatedInformation,
+        }
+        : undefined);
 }
 
 /**
@@ -45351,7 +45940,7 @@ class TcbDomSchemaCheckerOp extends TcbOp {
             }
             if (isPropertyBinding && binding.name !== 'style' && binding.name !== 'class') {
                 // A direct binding to a property.
-                const propertyName = ATTR_TO_PROP.get(binding.name) ?? binding.name;
+                const propertyName = REGISTRY$1.getMappedPropName(binding.name);
                 if (isTemplateElement) {
                     this.tcb.domSchemaChecker.checkTemplateElementProperty(this.tcb.id, this.getTagName(element), propertyName, binding.sourceSpan, this.tcb.schemas, this.tcb.hostIsStandalone);
                 }
@@ -45523,18 +46112,6 @@ class TcbComponentNodeOp extends TcbOp {
         return id;
     }
 }
-/**
- * Mapping between attributes names that don't correspond to their element property names.
- * Note: this mapping has to be kept in sync with the equally named mapping in the runtime.
- */
-const ATTR_TO_PROP = new Map(Object.entries({
-    'class': 'className',
-    'for': 'htmlFor',
-    'formaction': 'formAction',
-    'innerHtml': 'innerHTML',
-    'readonly': 'readOnly',
-    'tabindex': 'tabIndex',
-}));
 /**
  * A `TcbOp` which generates code to check "unclaimed inputs" - bindings on an element which were
  * not attributed to any directive or component, and are instead processed against the HTML element
@@ -45580,7 +46157,7 @@ class TcbUnclaimedInputsOp extends TcbOp {
                         elId = this.scope.resolve(this.target);
                     }
                     // A direct binding to a property.
-                    const propertyName = ATTR_TO_PROP.get(binding.name) ?? binding.name;
+                    const propertyName = REGISTRY$1.getMappedPropName(binding.name);
                     const prop = ts.factory.createElementAccessExpression(elId, ts.factory.createStringLiteral(propertyName));
                     const stmt = ts.factory.createBinaryExpression(prop, ts.SyntaxKind.EqualsToken, wrapForDiagnostics(expr));
                     addParseSpanInfo(stmt, binding.sourceSpan);
@@ -45718,14 +46295,19 @@ class TcbUnclaimedOutputsOp extends TcbOp {
                 const handler = tcbCreateEventHandler(output, this.tcb, this.scope, eventType);
                 this.scope.addStatement(ts.factory.createExpressionStatement(handler));
             }
+            else if (output.type === exports.ParsedEventType.Animation) {
+                const eventType = this.tcb.env.referenceExternalType('@angular/core', 'AnimationCallbackEvent');
+                const handler = tcbCreateEventHandler(output, this.tcb, this.scope, eventType);
+                this.scope.addStatement(ts.factory.createExpressionStatement(handler));
+            }
             else if (this.tcb.env.config.checkTypeOfDomEvents) {
                 // If strict checking of DOM events is enabled, generate a call to `addEventListener` on
                 // the element instance so that TypeScript's type inference for
                 // `HTMLElement.addEventListener` using `HTMLElementEventMap` to infer an accurate type for
                 // `$event` depending on the event name. For unknown event names, TypeScript resorts to the
                 // base `Event` type.
-                const handler = tcbCreateEventHandler(output, this.tcb, this.scope, 0 /* EventParamType.Infer */);
                 let target;
+                let domEventAssertion;
                 // Only check for `window` and `document` since in theory any target can be passed.
                 if (output.target === 'window' || output.target === 'document') {
                     target = ts.factory.createIdentifier(output.target);
@@ -45736,8 +46318,32 @@ class TcbUnclaimedOutputsOp extends TcbOp {
                 else {
                     target = elId;
                 }
+                // By default the target of an event is `EventTarget | null`, because of bubbling
+                // and custom events. This can be inconvenient in some common cases like `input` elements
+                // since we don't have the ability to type cast in templates. We can improve the type
+                // checking for some of these cases by inferring the target based on the element it was
+                // bound to. We can only do this safely if the element is a void element (e.g. `input` or
+                // `img`), because we know that it couldn't have bubbled from a child. The event handler
+                // with the assertion would look as follows:
+                //
+                // ```
+                // const _t1 = document.createElement('input');
+                //
+                // _t1.addEventListener('input', ($event) => {
+                //   ɵassertType<typeof _t1>($event.target);
+                //   handler($event.target);
+                // });
+                // ```
+                if (this.target instanceof Element$1 &&
+                    this.target.isVoid &&
+                    ts.isIdentifier(target)) {
+                    domEventAssertion = ts.factory.createCallExpression(this.tcb.env.referenceExternalSymbol('@angular/core', 'ɵassertType'), [ts.factory.createTypeQueryNode(target)], [
+                        ts.factory.createPropertyAccessExpression(ts.factory.createIdentifier(EVENT_PARAMETER), 'target'),
+                    ]);
+                }
                 const propertyAccess = ts.factory.createPropertyAccessExpression(target, 'addEventListener');
                 addParseSpanInfo(propertyAccess, output.keySpan);
+                const handler = tcbCreateEventHandler(output, this.tcb, this.scope, 0 /* EventParamType.Infer */, domEventAssertion);
                 const call = ts.factory.createCallExpression(
                 /* expression */ propertyAccess, 
                 /* typeArguments */ undefined, 
@@ -47168,9 +47774,12 @@ const EVENT_PARAMETER = '$event';
  * parameter will have an explicit `any` type, effectively disabling strict type checking of event
  * bindings. Alternatively, an explicit type can be passed for the `$event` parameter.
  */
-function tcbCreateEventHandler(event, tcb, scope, eventType) {
+function tcbCreateEventHandler(event, tcb, scope, eventType, assertionExpression) {
     const handler = tcbEventHandlerExpression(event.handler, tcb, scope);
     const statements = [];
+    if (assertionExpression !== undefined) {
+        statements.push(ts.factory.createExpressionStatement(assertionExpression));
+    }
     // TODO(crisbeto): remove the `checkTwoWayBoundEvents` check in v20.
     if (event.type === exports.ParsedEventType.TwoWay && tcb.env.config.checkTwoWayBoundEvents) {
         // If we're dealing with a two-way event, we create a variable initialized to the unwrapped
@@ -48016,13 +48625,6 @@ class SymbolBuilder {
     }
     getDirectivesOfNode(templateNode) {
         const elementSourceSpan = templateNode.startSourceSpan ?? templateNode.sourceSpan;
-        const tcbSourceFile = this.typeCheckBlock.getSourceFile();
-        // directives could be either:
-        // - var _t1: TestDir /*T:D*/ = null! as TestDir;
-        // - var _t1 /*T:D*/ = _ctor1({});
-        const isDirectiveDeclaration = (node) => (ts.isTypeNode(node) || ts.isIdentifier(node)) &&
-            ts.isVariableDeclaration(node.parent) &&
-            hasExpressionIdentifier(tcbSourceFile, node, ExpressionIdentifier.DIRECTIVE);
         const nodes = findAllMatchingNodes(this.typeCheckBlock, {
             withSpan: elementSourceSpan,
             filter: isDirectiveDeclaration,
@@ -48886,6 +49488,29 @@ class TemplateTypeCheckerImpl {
             return diagnostics.filter((diag) => diag !== null);
         });
     }
+    getSuggestionDiagnosticsForFile(sf, tsLs, optimizeFor) {
+        switch (optimizeFor) {
+            case exports.OptimizeFor.WholeProgram:
+                this.ensureAllShimsForAllFiles();
+                break;
+            case exports.OptimizeFor.SingleFile:
+                this.ensureAllShimsForOneFile(sf);
+                break;
+        }
+        return this.perf.inPhase(exports.PerfPhase.TtcSuggestionDiagnostics, () => {
+            const sfPath = absoluteFromSourceFile(sf);
+            const fileRecord = this.state.get(sfPath);
+            const diagnostics = [];
+            const program = this.programDriver.getProgram();
+            if (fileRecord.hasInlines) {
+                diagnostics.push(...getDeprecatedSuggestionDiagnostics(tsLs, program, sfPath, fileRecord, this));
+            }
+            for (const [shimPath] of fileRecord.shimData) {
+                diagnostics.push(...getDeprecatedSuggestionDiagnostics(tsLs, program, shimPath, fileRecord, this));
+            }
+            return diagnostics.filter((diag) => diag !== null);
+        });
+    }
     getDiagnosticsForComponent(component) {
         this.ensureShimForComponent(component);
         return this.perf.inPhase(exports.PerfPhase.TtcDiagnostics, () => {
@@ -48917,6 +49542,27 @@ class TemplateTypeCheckerImpl {
             return diagnostics.filter((diag) => diag !== null && diag.typeCheckId === id);
         });
     }
+    getSuggestionDiagnosticsForComponent(component, tsLs) {
+        this.ensureShimForComponent(component);
+        return this.perf.inPhase(exports.PerfPhase.TtcSuggestionDiagnostics, () => {
+            const sf = component.getSourceFile();
+            const sfPath = absoluteFromSourceFile(sf);
+            const shimPath = TypeCheckShimGenerator.shimFor(sfPath);
+            const fileRecord = this.getFileData(sfPath);
+            if (!fileRecord.shimData.has(shimPath)) {
+                return [];
+            }
+            const templateId = fileRecord.sourceManager.getTypeCheckId(component);
+            const shimRecord = fileRecord.shimData.get(shimPath);
+            const diagnostics = [];
+            const program = this.programDriver.getProgram();
+            if (shimRecord.hasInlines) {
+                diagnostics.push(...getDeprecatedSuggestionDiagnostics(tsLs, program, sfPath, fileRecord, this));
+            }
+            diagnostics.push(...getDeprecatedSuggestionDiagnostics(tsLs, program, shimPath, fileRecord, this));
+            return diagnostics.filter((diag) => diag !== null && diag.typeCheckId === templateId);
+        });
+    }
     getTypeCheckBlock(component) {
         return this.getLatestComponentState(component).tcb;
     }
@@ -49740,6 +50386,124 @@ function getClassDeclFromSymbol(symbol, checker) {
     }
     return null;
 }
+/**
+ * Returns the diagnostics that report deprecated symbols in the given TypeScript language service.
+ *
+ * There are two logins here:
+ *
+ * 1. For input properties, function calls, and so on, the diagnostics reported in the TypeScript
+ *    Language Service can be directly transformed into template diagnostics.
+ * 2. For the element tag deprecation, we need to manually connect the TCB node to the template node
+ *    and generate the template diagnostics.
+ */
+function getDeprecatedSuggestionDiagnostics(tsLs, program, path, fileRecord, templateTypeChecker) {
+    const sourceFile = program.getSourceFile(path);
+    if (sourceFile === undefined) {
+        return [];
+    }
+    const tsDiags = tsLs.getSuggestionDiagnostics(path).filter(isDeprecatedDiagnostics);
+    const commonTemplateDiags = tsDiags.map((diag) => {
+        return convertDiagnostic(diag, fileRecord.sourceManager);
+    });
+    const elementTagDiags = getTheElementTagDeprecatedSuggestionDiagnostics(path, program, fileRecord, tsDiags, templateTypeChecker);
+    return [...commonTemplateDiags, ...elementTagDiags];
+}
+/**
+ * Connect the TCB node to the template node and generate the template diagnostics.
+ *
+ * How to generate the template diagnostics:
+ *
+ * 1. For each diagnostic, find the TCB node that is reported.
+ * 2. Build a map called `nodeToDiag` that the key is the type node and value is the diagnostic.
+ *    For example:
+ *    ```
+ *    var _t1 = null! as TestDir;
+ *                       ^^^^^^^------ This is diagnostic node that is reported by the ts.
+ *    ```
+ *    The key is the class component of TestDir.
+ * 3. Find the all directive nodes in the TCB.
+ *    For example:
+ *    In the above example, the directive node is `_t1`, get the type of `_t1` which is the
+ *    class component of `TestDir`. Check if there is a diagnostic in the `nodeToDiag` map
+ *    that matches the class component of `TestDir`.
+ *    If there is a match, it means that the diagnostic is reported for the directive node
+ * 4. Generate the template diagnostic and return the template diagnostics.
+ */
+function getTheElementTagDeprecatedSuggestionDiagnostics(shimPath, program, fileRecord, diags, templateTypeChecker) {
+    const sourceFile = program.getSourceFile(shimPath);
+    if (sourceFile === undefined) {
+        return [];
+    }
+    const typeChecker = program.getTypeChecker();
+    const nodeToDiag = new Map();
+    for (const tsDiag of diags) {
+        const diagNode = getTokenAtPosition(sourceFile, tsDiag.start);
+        const nodeType = typeChecker.getTypeAtLocation(diagNode);
+        const nodeSymbolDeclarations = nodeType.symbol.declarations;
+        const decl = nodeSymbolDeclarations !== undefined && nodeSymbolDeclarations.length > 0
+            ? nodeSymbolDeclarations[0]
+            : undefined;
+        if (decl === undefined || !ts.isClassDeclaration(decl)) {
+            continue;
+        }
+        const directiveForDiagnostic = templateTypeChecker.getDirectiveMetadata(decl);
+        // For now, we only report deprecations for components. This is because
+        // directive spans apply to the entire element, so it would cause the deprecation to
+        // appear as a deprecation for the element rather than whatever the selector (likely an attribute)
+        // is for the directive. Technically components have this issue as well but nearly
+        // all component selectors are element selectors.
+        if (directiveForDiagnostic === null || !directiveForDiagnostic.isComponent) {
+            continue;
+        }
+        nodeToDiag.set(decl, tsDiag);
+    }
+    const directiveNodesInTcb = findAllMatchingNodes(sourceFile, {
+        filter: isDirectiveDeclaration,
+    });
+    const templateDiagnostics = [];
+    for (const directive of directiveNodesInTcb) {
+        const directiveType = typeChecker.getTypeAtLocation(directive);
+        const directiveSymbolDeclarations = directiveType.symbol.declarations;
+        const decl = directiveSymbolDeclarations !== undefined && directiveSymbolDeclarations.length > 0
+            ? directiveSymbolDeclarations[0]
+            : undefined;
+        if (decl === undefined) {
+            continue;
+        }
+        if (!ts.isClassDeclaration(decl)) {
+            continue;
+        }
+        const diagnostic = nodeToDiag.get(decl);
+        if (diagnostic === undefined) {
+            continue;
+        }
+        const fullMapping = getSourceMapping(diagnostic.file, directive.getStart(), fileRecord.sourceManager, 
+        /**
+         * Don't set to true, the deprecated diagnostics will be ignored if this is a diagnostics request.
+         * Only the deprecated diagnostics will be reported here.
+         */
+        // For example:
+        // var _t2 /*T:DIR*/ /*87,104*/ = _ctor1({ "name": ("") /*96,103*/ }) /*D:ignore*/;
+        // At the end of the statement, there is a comment `/*D:ignore*/` which means that this diagnostic
+        // should be ignored in diagnostics request.
+        /*isDiagnosticsRequest*/ false);
+        if (fullMapping === null) {
+            continue;
+        }
+        const { sourceLocation, sourceMapping: templateSourceMapping, span } = fullMapping;
+        const templateDiagnostic = makeTemplateDiagnostic(sourceLocation.id, templateSourceMapping, span, diagnostic.category, diagnostic.code, diagnostic.messageText, undefined, diagnostic.reportsDeprecated !== undefined
+            ? {
+                reportsDeprecated: diagnostic.reportsDeprecated,
+                relatedMessages: diagnostic.relatedInformation,
+            }
+            : undefined);
+        templateDiagnostics.push(templateDiagnostic);
+    }
+    return templateDiagnostics;
+}
+function isDeprecatedDiagnostics(diag) {
+    return diag.reportsDeprecated !== undefined;
+}
 
 exports.AST = AST;
 exports.ASTWithSource = ASTWithSource;