@angular/compiler 17.0.0-next.8 → 17.0.0-rc.0

package/fesm2022/compiler.mjs

@@ -1,5 +1,5 @@
 /**
- * @license Angular v17.0.0-next.8
+ * @license Angular v17.0.0-rc.0
  * (c) 2010-2022 Google LLC. https://angular.io/
  * License: MIT
  */
@@ -8317,7 +8317,7 @@ class ShadowCss {
             // (ie: ".\fc ber" for ".über") is not a separator between 2 selectors
             // also keep in mind that backslashes are replaced by a placeholder by SafeSelector
             // These escaped selectors happen for example when esbuild runs with optimization.minify.
-            if (part.match(_placeholderRe) && selector[res.index + 1]?.match(/[a-fA-F\d]/)) {
+            if (part.match(/__esc-ph-(\d+)__/) && selector[res.index + 1]?.match(/[a-fA-F\d]/)) {
                 continue;
             }
             shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1;
@@ -8348,7 +8348,13 @@ class SafeSelector {
         // pseudo-class, but writing `.foo\:blue` will match, because the colon was escaped.
         // Replace all escape sequences (`\` followed by a character) with a placeholder so
         // that our handling of pseudo-selectors doesn't mess with them.
-        selector = this._escapeRegexMatches(selector, /(\\.)/g);
+        // Escaped characters have a specific placeholder so they can be detected separately.
+        selector = selector.replace(/(\\.)/g, (_, keep) => {
+            const replaceBy = `__esc-ph-${this.index}__`;
+            this.placeholders.push(keep);
+            this.index++;
+            return replaceBy;
+        });
         // Replaces the expression in `:nth-child(2n + 1)` with a placeholder.
         // WS and "+" would otherwise be interpreted as selector separators.
         this._content = selector.replace(/(:nth-[-\w]+)(\([^)]+\))/g, (_, pseudo, exp) => {
@@ -8359,7 +8365,7 @@ class SafeSelector {
         });
     }
     restore(content) {
-        return content.replace(_placeholderRe, (_ph, index) => this.placeholders[+index]);
+        return content.replace(/__(?:ph|esc-ph)-(\d+)__/g, (_ph, index) => this.placeholders[+index]);
     }
     content() {
         return this._content;
@@ -8411,7 +8417,6 @@ const _commentRe = /\/\*[\s\S]*?\*\//g;
 const _commentWithHashRe = /\/\*\s*#\s*source(Mapping)?URL=/g;
 const COMMENT_PLACEHOLDER = '%COMMENT%';
 const _commentWithHashPlaceHolderRe = new RegExp(COMMENT_PLACEHOLDER, 'g');
-const _placeholderRe = /__ph-(\d+)__/g;
 const BLOCK_PLACEHOLDER = '%BLOCK%';
 const _ruleRe = new RegExp(`(\\s*(?:${COMMENT_PLACEHOLDER}\\s*)*)([^;\\{\\}]+?)(\\s*)((?:{%BLOCK%}?\\s*;?)|(?:\\s*;))`, 'g');
 const CONTENT_PAIRS = new Map([['{', '}']]);
@@ -8841,6 +8846,14 @@ var OpKind;
      * An instruction that applies a set of i18n expressions.
      */
     OpKind[OpKind["I18nApply"] = 38] = "I18nApply";
+    /**
+     * An instruction to create an ICU expression.
+     */
+    OpKind[OpKind["Icu"] = 39] = "Icu";
+    /**
+     * An instruction to update an ICU expression.
+     */
+    OpKind[OpKind["IcuUpdate"] = 40] = "IcuUpdate";
 })(OpKind || (OpKind = {}));
 /**
  * Distinguishes different kinds of IR expressions.
@@ -9019,6 +9032,22 @@ var BindingKind;
      */
     BindingKind[BindingKind["Animation"] = 6] = "Animation";
 })(BindingKind || (BindingKind = {}));
+/**
+ * Enumeration of possible times i18n params can be resolved.
+ */
+var I18nParamResolutionTime;
+(function (I18nParamResolutionTime) {
+    /**
+     * Param is resolved at message creation time. Most params should be resolved at message creation
+     * time. However, ICU params need to be handled in post-processing.
+     */
+    I18nParamResolutionTime[I18nParamResolutionTime["Creation"] = 0] = "Creation";
+    /**
+     * Param is resolved during post-processing. This should be used for params who's value comes from
+     * an ICU.
+     */
+    I18nParamResolutionTime[I18nParamResolutionTime["Postproccessing"] = 1] = "Postproccessing";
+})(I18nParamResolutionTime || (I18nParamResolutionTime = {}));
 
 /**
  * Marker symbol for `ConsumesSlotOpTrait`.
@@ -9317,13 +9346,14 @@ function createConditionalOp(target, test, conditions, sourceSpan) {
 /**
  * Create an i18n expression op.
  */
-function createI18nExpressionOp(owner, expression, i18nPlaceholder, sourceSpan) {
+function createI18nExpressionOp(owner, expression, i18nPlaceholder, resolutionTime, sourceSpan) {
     return {
         kind: OpKind.I18nExpression,
         owner,
         target: owner,
         expression,
         i18nPlaceholder,
+        resolutionTime,
         sourceSpan,
         ...NEW_OP,
         ...TRAIT_CONSUMES_VARS,
@@ -9342,6 +9372,17 @@ function createI18nApplyOp(target, sourceSpan) {
         ...TRAIT_USES_SLOT_INDEX,
     };
 }
+/**
+ * Creates an op to update an ICU expression.
+ */
+function createIcuUpdateOp(xref, sourceSpan) {
+    return {
+        kind: OpKind.IcuUpdate,
+        xref,
+        sourceSpan,
+        ...NEW_OP,
+    };
+}
 
 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
 /**
@@ -10064,6 +10105,8 @@ function transformExpressionsInOp(op, transform, flags) {
         case OpKind.Advance:
         case OpKind.Namespace:
         case OpKind.I18nApply:
+        case OpKind.Icu:
+        case OpKind.IcuUpdate:
             // These operations contain no expressions.
             break;
         default:
@@ -10662,8 +10705,10 @@ function createI18nStartOp(xref, message, root) {
         root: root ?? xref,
         message,
         params: new Map(),
+        postprocessingParams: new Map(),
         messageIndex: null,
         subTemplateIndex: null,
+        needsPostprocessing: false,
         ...NEW_OP,
         ...TRAIT_CONSUMES_SLOT,
     };
@@ -10678,6 +10723,18 @@ function createI18nEndOp(xref) {
         ...NEW_OP,
     };
 }
+/**
+ * Creates an op to create an ICU expression.
+ */
+function createIcuOp(xref, message, sourceSpan) {
+    return {
+        kind: OpKind.Icu,
+        xref,
+        message,
+        sourceSpan,
+        ...NEW_OP,
+    };
+}
 function literalOrArrayLiteral$1(value) {
     if (Array.isArray(value)) {
         return literalArr(value.map(literalOrArrayLiteral$1));
@@ -11986,7 +12043,6 @@ function getScopeForView(view, parent) {
     }
     for (const op of view.create) {
         switch (op.kind) {
-            case OpKind.Element:
             case OpKind.ElementStart:
             case OpKind.Template:
                 if (!Array.isArray(op.localRefs)) {
@@ -12154,7 +12210,7 @@ function phaseI18nConstCollection(job) {
     // Assign const index to i18n ops that messages were extracted from.
     for (const unit of job.units) {
         for (const op of unit.create) {
-            if (op.kind === OpKind.I18nStart || op.kind === OpKind.I18n) {
+            if (op.kind === OpKind.I18nStart) {
                 op.messageIndex = messageConstIndices[op.root];
             }
         }
@@ -14451,7 +14507,7 @@ let TAG_DEFINITIONS;
 function getHtmlTagDefinition(tagName) {
     if (!TAG_DEFINITIONS) {
         DEFAULT_TAG_DEFINITION = new HtmlTagDefinition({ canSelfClose: true });
-        TAG_DEFINITIONS = {
+        TAG_DEFINITIONS = Object.assign(Object.create(null), {
             'base': new HtmlTagDefinition({ isVoid: true }),
             'meta': new HtmlTagDefinition({ isVoid: true }),
             'area': new HtmlTagDefinition({ isVoid: true }),
@@ -14513,9 +14569,9 @@ function getHtmlTagDefinition(tagName) {
                 contentType: { default: TagContentType.ESCAPABLE_RAW_TEXT, svg: TagContentType.PARSABLE_DATA }
             }),
             'textarea': new HtmlTagDefinition({ contentType: TagContentType.ESCAPABLE_RAW_TEXT, ignoreFirstLf: true }),
-        };
+        });
         new DomElementSchemaRegistry().allKnownElementNames().forEach(knownTagName => {
-            if (!TAG_DEFINITIONS.hasOwnProperty(knownTagName) && getNsPrefix(knownTagName) === null) {
+            if (!TAG_DEFINITIONS[knownTagName] && getNsPrefix(knownTagName) === null) {
                 TAG_DEFINITIONS[knownTagName] = new HtmlTagDefinition({ canSelfClose: false });
             }
         });
@@ -19053,7 +19109,7 @@ function phaseI18nMessageExtraction(job) {
     const fileBasedI18nSuffix = job.relativeContextFilePath.replace(/[^A-Za-z0-9]/g, '_').toUpperCase() + '_';
     for (const unit of job.units) {
         for (const op of unit.create) {
-            if ((op.kind === OpKind.I18nStart || op.kind === OpKind.I18n)) {
+            if (op.kind === OpKind.I18nStart) {
                 // Only extract messages from root i18n ops, not sub-template ones.
                 if (op.xref === op.root) {
                     // Sort the params map to match the ordering in TemplateDefinitionBuilder.
@@ -19063,8 +19119,17 @@ function phaseI18nMessageExtraction(job) {
                     // const to start with `MSG_`. We define a variable starting with `MSG_` just for the
                     // `goog.getMsg` call
                     const closureVar = i18nGenerateClosureVar(job.pool, op.message.id, fileBasedI18nSuffix, job.i18nUseExternalIds);
-                    // TODO: figure out transformFn.
-                    const statements = getTranslationDeclStmts$1(op.message, mainVar, closureVar, params, undefined /*transformFn*/);
+                    let transformFn = undefined;
+                    // If nescessary, add a post-processing step and resolve any placeholder params that are
+                    // set in post-processing.
+                    if (op.needsPostprocessing) {
+                        const extraTransformFnParams = [];
+                        if (op.postprocessingParams.size > 0) {
+                            extraTransformFnParams.push(literalMap([...op.postprocessingParams.entries()].map(([key, value]) => ({ key, value, quoted: true }))));
+                        }
+                        transformFn = (expr) => importExpr(Identifiers.i18nPostprocess).callFn([expr, ...extraTransformFnParams]);
+                    }
+                    const statements = getTranslationDeclStmts$1(op.message, mainVar, closureVar, params, transformFn);
                     unit.create.push(createExtractedMessageOp(op.xref, mainVar, statements));
                 }
             }
@@ -19177,7 +19242,7 @@ function phaseI18nTextExtraction(job) {
                     for (let i = 0; i < op.interpolation.expressions.length; i++) {
                         const expr = op.interpolation.expressions[i];
                         const placeholder = op.i18nPlaceholders[i];
-                        ops.push(createI18nExpressionOp(i18nBlockId, expr, placeholder, expr.sourceSpan ?? op.sourceSpan));
+                        ops.push(createI18nExpressionOp(i18nBlockId, expr, placeholder.name, I18nParamResolutionTime.Creation, expr.sourceSpan ?? op.sourceSpan));
                     }
                     if (ops.length > 0) {
                         // ops.push(ir.createI18nApplyOp(i18nBlockId, op.i18nPlaceholders, op.sourceSpan));
@@ -19189,6 +19254,50 @@ function phaseI18nTextExtraction(job) {
     }
 }
 
+/**
+ * Extracts ICUs into i18n expressions.
+ */
+function phaseIcuExtraction(job) {
+    for (const unit of job.units) {
+        // Build a map of ICU to the i18n block they belong to, then remove the `Icu` ops.
+        const icus = new Map();
+        let currentI18nId = null;
+        for (const op of unit.create) {
+            switch (op.kind) {
+                case OpKind.I18nStart:
+                    currentI18nId = op.xref;
+                    break;
+                case OpKind.I18nEnd:
+                    currentI18nId = null;
+                    break;
+                case OpKind.Icu:
+                    if (currentI18nId === null) {
+                        throw Error('Unexpected ICU outside of an i18n block.');
+                    }
+                    icus.set(op.xref, { message: op.message, i18nBlockId: currentI18nId });
+                    OpList.remove(op);
+                    break;
+            }
+        }
+        // Replace the `IcuUpdate` ops with `i18nExpr` ops.
+        for (const op of unit.update) {
+            switch (op.kind) {
+                case OpKind.IcuUpdate:
+                    const { message, i18nBlockId } = icus.get(op.xref);
+                    const icuNode = message.nodes.find((n) => n instanceof Icu);
+                    if (icuNode === undefined) {
+                        throw Error('Could not find ICU in i18n AST');
+                    }
+                    if (icuNode.expressionPlaceholder === undefined) {
+                        throw Error('ICU is missing an i18n placeholder');
+                    }
+                    OpList.replace(op, createI18nExpressionOp(i18nBlockId, new LexicalReadExpr(icuNode.expression), icuNode.expressionPlaceholder, I18nParamResolutionTime.Postproccessing, null));
+                    break;
+            }
+        }
+    }
+}
+
 /**
  * Lifts local reference declarations on element-like structures within each view into an entry in
  * the `consts` array for the whole component.
@@ -19198,7 +19307,6 @@ function phaseLocalRefs(job) {
         for (const op of unit.create) {
             switch (op.kind) {
                 case OpKind.ElementStart:
-                case OpKind.Element:
                 case OpKind.Template:
                     if (!Array.isArray(op.localRefs)) {
                         throw new Error(`AssertionError: expected localRefs to be an array still`);
@@ -19231,7 +19339,7 @@ function phaseNamespace(job) {
     for (const unit of job.units) {
         let activeNamespace = Namespace.HTML;
         for (const op of unit.create) {
-            if (op.kind !== OpKind.Element && op.kind !== OpKind.ElementStart) {
+            if (op.kind !== OpKind.ElementStart) {
                 continue;
             }
             if (op.namespace !== activeNamespace) {
@@ -19376,7 +19484,8 @@ function addNamesToView(unit, baseName, state, compatibility) {
                 if (op.slot === null) {
                     throw new Error(`Expected slot to be assigned`);
                 }
-                addNamesToView(childView, `${baseName}_${prefixWithNamespace(op.tag, op.namespace)}_${op.slot}`, state, compatibility);
+                const tagToken = op.tag === null ? '' : '_' + prefixWithNamespace(op.tag, op.namespace);
+                addNamesToView(childView, `${baseName}${tagToken}_${op.slot}`, state, compatibility);
                 break;
             case OpKind.StyleProp:
                 op.name = normalizeStylePropName(op.name);
@@ -19510,11 +19619,6 @@ function phaseNgContainer(job) {
     for (const unit of job.units) {
         const updatedElementXrefs = new Set();
         for (const op of unit.create) {
-            if (op.kind === OpKind.Element && op.tag === CONTAINER_TAG) {
-                // Transmute the `Element` instruction to `Container`.
-                op.kind = OpKind.Container;
-                updatedElementXrefs.add(op.xref);
-            }
             if (op.kind === OpKind.ElementStart && op.tag === CONTAINER_TAG) {
                 // Transmute the `ElementStart` instruction to `ContainerStart`.
                 op.kind = OpKind.ContainerStart;
@@ -19847,37 +19951,6 @@ function wrapTemplateWithI18n(unit, parentI18n) {
     }
 }
 
-function phasePropagateI18nPlaceholders(job) {
-    // Get all of the i18n ops.
-    const i18nOps = new Map();
-    for (const unit of job.units) {
-        for (const op of unit.create) {
-            if (op.kind === OpKind.I18nStart) {
-                i18nOps.set(op.xref, op);
-            }
-        }
-    }
-    // Propagate i18n params from sub-templates up to the root i18n op.
-    for (const op of i18nOps.values()) {
-        if (op.xref !== op.root) {
-            const rootOp = i18nOps.get(op.root);
-            for (const [placeholder, value] of op.params) {
-                rootOp.params.set(placeholder, value);
-            }
-        }
-    }
-    // Validate the root i18n ops have all placeholders filled in.
-    for (const op of i18nOps.values()) {
-        if (op.xref === op.root) {
-            for (const placeholder in op.message.placeholders) {
-                if (!op.params.has(placeholder)) {
-                    throw Error(`Failed to resolve i18n placeholder: ${placeholder}`);
-                }
-            }
-        }
-    }
-}
-
 function phasePureFunctionExtraction(job) {
     for (const view of job.units) {
         for (const op of view.ops()) {
@@ -20008,7 +20081,7 @@ function elementContainerEnd() {
 }
 function template(slot, templateFnRef, decls, vars, tag, constIndex, sourceSpan) {
     const args = [literal(slot), templateFnRef, literal(decls), literal(vars)];
-    if (tag !== null) {
+    if (tag !== null || constIndex !== null) {
         args.push(literal(tag));
         if (constIndex !== null) {
             args.push(literal(constIndex));
@@ -20881,6 +20954,10 @@ const LIST_END_MARKER = ']';
  * Delimiter used to separate multiple values in a list.
  */
 const LIST_DELIMITER = '|';
+/**
+ * Flags that describe what an i18n param value. These determine how the value is serialized into
+ * the final map.
+ */
 var I18nParamValueFlags;
 (function (I18nParamValueFlags) {
     I18nParamValueFlags[I18nParamValueFlags["None"] = 0] = "None";
@@ -20893,10 +20970,13 @@ var I18nParamValueFlags;
      */
     I18nParamValueFlags[I18nParamValueFlags["TemplateTag"] = 2] = "TemplateTag";
     /**
-     * This value represents the closing of a tag. (Can only be used together with ElementTag or
-     * TemplateTag)
+     * This value represents the opening of a tag.
      */
-    I18nParamValueFlags[I18nParamValueFlags["CloseTag"] = 4] = "CloseTag";
+    I18nParamValueFlags[I18nParamValueFlags["OpenTag"] = 4] = "OpenTag";
+    /**
+     * This value represents the closing of a tag.
+     */
+    I18nParamValueFlags[I18nParamValueFlags["CloseTag"] = 8] = "CloseTag";
 })(I18nParamValueFlags || (I18nParamValueFlags = {}));
 /**
  * Represents the complete i18n params map for an i18n op.
@@ -20908,9 +20988,9 @@ class I18nPlaceholderParams {
     /**
      * Adds a new value to the params map.
      */
-    addValue(placeholder, value, subTemplateIndex, flags) {
+    addValue(placeholder, value, subTemplateIndex, resolutionTime, flags) {
         const placeholderValues = this.values.get(placeholder) ?? [];
-        placeholderValues.push({ value, subTemplateIndex, flags });
+        placeholderValues.push({ value, subTemplateIndex, resolutionTime, flags });
         this.values.set(placeholder, placeholderValues);
     }
     /**
@@ -20918,13 +20998,49 @@ class I18nPlaceholderParams {
      */
     saveToOp(op) {
         for (const [placeholder, placeholderValues] of this.values) {
-            op.params.set(placeholder, literal(this.serializeValues(placeholderValues)));
+            // We need to run post-processing for any 1i8n ops that contain parameters with more than
+            // one value, even if there are no parameters resolved at post-processing time.
+            const creationValues = placeholderValues.filter(({ resolutionTime }) => resolutionTime === I18nParamResolutionTime.Creation);
+            if (creationValues.length > 1) {
+                op.needsPostprocessing = true;
+            }
+            // Save creation time params to op.
+            const serializedCreationValues = this.serializeValues(creationValues);
+            if (serializedCreationValues !== null) {
+                op.params.set(placeholder, literal(serializedCreationValues));
+            }
+            // Save post-processing time params to op.
+            const serializedPostprocessingValues = this.serializeValues(placeholderValues.filter(({ resolutionTime }) => resolutionTime === I18nParamResolutionTime.Postproccessing));
+            if (serializedPostprocessingValues !== null) {
+                op.needsPostprocessing = true;
+                op.postprocessingParams.set(placeholder, literal(serializedPostprocessingValues));
+            }
+        }
+    }
+    /**
+     * Merges another param map into this one.
+     */
+    merge(other) {
+        for (const [placeholder, otherValues] of other.values) {
+            const currentValues = this.values.get(placeholder) || [];
+            // Child element close tag params should be prepended to maintain the same order as
+            // TemplateDefinitionBuilder.
+            const flags = otherValues[0].flags;
+            if ((flags & I18nParamValueFlags.CloseTag) && !(flags & I18nParamValueFlags.OpenTag)) {
+                this.values.set(placeholder, [...otherValues, ...currentValues]);
+            }
+            else {
+                this.values.set(placeholder, [...currentValues, ...otherValues]);
+            }
         }
     }
     /**
      * Serializes a list of i18n placeholder values.
      */
     serializeValues(values) {
+        if (values.length === 0) {
+            return null;
+        }
         const serializedValues = values.map(value => this.serializeValue(value));
         return serializedValues.length === 1 ?
             serializedValues[0] :
@@ -20946,6 +21062,11 @@ class I18nPlaceholderParams {
             closeMarker = value.flags & I18nParamValueFlags.CloseTag ? TAG_CLOSE_MARKER : '';
         }
         const context = value.subTemplateIndex === null ? '' : `${CONTEXT_MARKER}${value.subTemplateIndex}`;
+        // Self-closing tags use a special form that concatenates the start and close tag values.
+        if ((value.flags & I18nParamValueFlags.OpenTag) &&
+            (value.flags & I18nParamValueFlags.CloseTag)) {
+            return `${ESCAPE}${tagMarker}${value.value}${context}${ESCAPE}${ESCAPE}${closeMarker}${tagMarker}${value.value}${context}${ESCAPE}`;
+        }
         return `${ESCAPE}${closeMarker}${tagMarker}${value.value}${context}${ESCAPE}`;
     }
 }
@@ -20953,36 +21074,81 @@ class I18nPlaceholderParams {
  * Resolve the placeholders in i18n messages.
  */
 function phaseResolveI18nPlaceholders(job) {
+    const params = new Map();
+    const i18nOps = new Map();
+    resolvePlaceholders(job, params, i18nOps);
+    propagatePlaceholders(params, i18nOps);
+    // After colleccting all params, save them to the i18n ops.
+    for (const [xref, i18nOpParams] of params) {
+        i18nOpParams.saveToOp(i18nOps.get(xref));
+    }
+    // Validate the root i18n ops have all placeholders filled in.
+    for (const op of i18nOps.values()) {
+        if (op.xref === op.root) {
+            for (const placeholder in op.message.placeholders) {
+                if (!op.params.has(placeholder) && !op.postprocessingParams.has(placeholder)) {
+                    throw Error(`Failed to resolve i18n placeholder: ${placeholder}`);
+                }
+            }
+        }
+    }
+}
+/**
+ * Resolve placeholders for each i18n op.
+ */
+function resolvePlaceholders(job, params, i18nOps) {
     for (const unit of job.units) {
-        const i18nOps = new Map();
-        const params = new Map();
+        const elements = new Map();
         let currentI18nOp = null;
         // Record slots for tag name placeholders.
         for (const op of unit.create) {
             switch (op.kind) {
                 case OpKind.I18nStart:
-                case OpKind.I18n:
                     i18nOps.set(op.xref, op);
                     currentI18nOp = op.kind === OpKind.I18nStart ? op : null;
                     break;
                 case OpKind.I18nEnd:
                     currentI18nOp = null;
                     break;
-                case OpKind.Element:
                 case OpKind.ElementStart:
-                case OpKind.Template:
-                    // For elements with i18n placeholders, record its slot value in the params map under both
-                    // the start and close placeholders.
+                    // For elements with i18n placeholders, record its slot value in the params map under the
+                    // corresponding tag start placeholder.
                     if (op.i18nPlaceholder !== undefined) {
                         if (currentI18nOp === null) {
                             throw Error('i18n tag placeholder should only occur inside an i18n block');
                         }
+                        elements.set(op.xref, op);
                         const { startName, closeName } = op.i18nPlaceholder;
-                        const subTemplateIndex = getSubTemplateIndexForTag(job, currentI18nOp, op);
-                        const flags = op.kind === OpKind.Template ? I18nParamValueFlags.TemplateTag :
-                            I18nParamValueFlags.ElementTag;
-                        addParam(params, currentI18nOp, startName, op.slot, subTemplateIndex, flags);
-                        addParam(params, currentI18nOp, closeName, op.slot, subTemplateIndex, flags | I18nParamValueFlags.CloseTag);
+                        let flags = I18nParamValueFlags.ElementTag | I18nParamValueFlags.OpenTag;
+                        // For self-closing tags, there is no close tag placeholder. Instead, the start tag
+                        // placeholder accounts for the start and close of the element.
+                        if (closeName === '') {
+                            flags |= I18nParamValueFlags.CloseTag;
+                        }
+                        addParam(params, currentI18nOp, startName, op.slot, currentI18nOp.subTemplateIndex, I18nParamResolutionTime.Creation, flags);
+                    }
+                    break;
+                case OpKind.ElementEnd:
+                    const startOp = elements.get(op.xref);
+                    if (startOp && startOp.i18nPlaceholder !== undefined) {
+                        if (currentI18nOp === null) {
+                            throw Error('i18n tag placeholder should only occur inside an i18n block');
+                        }
+                        const { closeName } = startOp.i18nPlaceholder;
+                        // Self-closing tags don't have a closing tag placeholder.
+                        if (closeName !== '') {
+                            addParam(params, currentI18nOp, closeName, startOp.slot, currentI18nOp.subTemplateIndex, I18nParamResolutionTime.Creation, I18nParamValueFlags.ElementTag | I18nParamValueFlags.CloseTag);
+                        }
+                    }
+                    break;
+                case OpKind.Template:
+                    if (op.i18nPlaceholder !== undefined) {
+                        if (currentI18nOp === null) {
+                            throw Error('i18n tag placeholder should only occur inside an i18n block');
+                        }
+                        const subTemplateIndex = getSubTemplateIndexForTemplateTag(job, currentI18nOp, op);
+                        addParam(params, currentI18nOp, op.i18nPlaceholder.startName, op.slot, subTemplateIndex, I18nParamResolutionTime.Creation, I18nParamValueFlags.TemplateTag);
+                        addParam(params, currentI18nOp, op.i18nPlaceholder.closeName, op.slot, subTemplateIndex, I18nParamResolutionTime.Creation, I18nParamValueFlags.TemplateTag | I18nParamValueFlags.CloseTag);
                     }
                     break;
             }
@@ -20996,39 +21162,44 @@ function phaseResolveI18nPlaceholders(job) {
                 if (!i18nOp) {
                     throw Error('Cannot find corresponding i18nStart for i18nExpr');
                 }
-                addParam(params, i18nOp, op.i18nPlaceholder.name, index++, i18nOp.subTemplateIndex);
+                addParam(params, i18nOp, op.i18nPlaceholder, index++, i18nOp.subTemplateIndex, op.resolutionTime);
                 i18nBlockPlaceholderIndices.set(op.owner, index);
             }
         }
-        // After colleccting all params, save them to the i18n ops.
-        for (const [xref, i18nOpParams] of params) {
-            i18nOpParams.saveToOp(i18nOps.get(xref));
-        }
     }
 }
 /**
  * Add a param to the params map for the given i18n op.
  */
-function addParam(params, i18nOp, placeholder, value, subTemplateIndex, flags = I18nParamValueFlags.None) {
-    const i18nOpParams = params.get(i18nOp.xref) ?? new I18nPlaceholderParams();
-    i18nOpParams.addValue(placeholder, value, subTemplateIndex, flags);
+function addParam(params, i18nOp, placeholder, value, subTemplateIndex, resolutionTime, flags = I18nParamValueFlags.None) {
+    const i18nOpParams = params.get(i18nOp.xref) || new I18nPlaceholderParams();
+    i18nOpParams.addValue(placeholder, value, subTemplateIndex, resolutionTime, flags);
     params.set(i18nOp.xref, i18nOpParams);
 }
 /**
- * Get the subTemplateIndex for the given op. For template ops, use the subTemplateIndex of the
- * child i18n block inside the template. For all other ops, use the subTemplateIndex of the i18n
- * block the op belongs to.
+ * Get the subTemplateIndex for the given template op. For template ops, use the subTemplateIndex of
+ * the child i18n block inside the template.
  */
-function getSubTemplateIndexForTag(job, i18nOp, op) {
-    if (op.kind === OpKind.Template) {
-        for (const childOp of job.views.get(op.xref).create) {
-            if (childOp.kind === OpKind.I18nStart) {
-                return childOp.subTemplateIndex;
-            }
+function getSubTemplateIndexForTemplateTag(job, i18nOp, op) {
+    for (const childOp of job.views.get(op.xref).create) {
+        if (childOp.kind === OpKind.I18nStart) {
+            return childOp.subTemplateIndex;
         }
     }
     return i18nOp.subTemplateIndex;
 }
+/**
+ * Propagate placeholders up to their root i18n op.
+ */
+function propagatePlaceholders(params, i18nOps) {
+    for (const [xref, opParams] of params) {
+        const op = i18nOps.get(xref);
+        if (op.xref !== op.root) {
+            const rootParams = params.get(op.root) || new I18nPlaceholderParams();
+            rootParams.merge(opParams);
+        }
+    }
+}
 
 /**
  * Resolves lexical references in views (`ir.LexicalReadExpr`) to either a target variable or to
@@ -21170,8 +21341,7 @@ function phaseResolveSanitizers(job) {
  * Checks whether the given op represents an iframe element.
  */
 function isIframeElement$1(op) {
-    return (op.kind === OpKind.Element || op.kind === OpKind.ElementStart) &&
-        op.tag.toLowerCase() === 'iframe';
+    return op.kind === OpKind.ElementStart && op.tag?.toLowerCase() === 'iframe';
 }
 
 function phaseSaveRestoreView(job) {
@@ -21785,6 +21955,32 @@ function allowConservativeInlining(decl, target) {
     }
 }
 
+/**
+ * Wraps ICUs that do not already belong to an i18n block in a new i18n block.
+ */
+function phaseWrapIcus(job) {
+    for (const unit of job.units) {
+        let currentI18nOp = null;
+        for (const op of unit.create) {
+            switch (op.kind) {
+                case OpKind.I18nStart:
+                    currentI18nOp = op;
+                    break;
+                case OpKind.I18nEnd:
+                    currentI18nOp = null;
+                    break;
+                case OpKind.Icu:
+                    if (currentI18nOp === null) {
+                        const id = job.allocateXrefId();
+                        OpList.insertBefore(createI18nStartOp(id, op.message), op);
+                        OpList.insertAfter(createI18nEndOp(id), op);
+                    }
+                    break;
+            }
+        }
+    }
+}
+
 const phases = [
     { kind: CompilationJobKind.Tmpl, fn: phaseRemoveContentSelectors },
     { kind: CompilationJobKind.Host, fn: phaseHostStylePropertyParsing },
@@ -21792,12 +21988,14 @@ const phases = [
     { kind: CompilationJobKind.Both, fn: phaseStyleBindingSpecialization },
     { kind: CompilationJobKind.Both, fn: phaseBindingSpecialization },
     { kind: CompilationJobKind.Tmpl, fn: phasePropagateI18nBlocks },
+    { kind: CompilationJobKind.Tmpl, fn: phaseWrapIcus },
     { kind: CompilationJobKind.Both, fn: phaseAttributeExtraction },
     { kind: CompilationJobKind.Both, fn: phaseParseExtractedStyles },
     { kind: CompilationJobKind.Tmpl, fn: phaseRemoveEmptyBindings },
     { kind: CompilationJobKind.Tmpl, fn: phaseConditionals },
     { kind: CompilationJobKind.Tmpl, fn: phasePipeCreation },
     { kind: CompilationJobKind.Tmpl, fn: phaseI18nTextExtraction },
+    { kind: CompilationJobKind.Tmpl, fn: phaseIcuExtraction },
     { kind: CompilationJobKind.Tmpl, fn: phaseApplyI18nExpressions },
     { kind: CompilationJobKind.Tmpl, fn: phasePipeVariadic },
     { kind: CompilationJobKind.Both, fn: phasePureLiteralStructures },
@@ -21815,7 +22013,6 @@ const phases = [
     { kind: CompilationJobKind.Both, fn: phaseTemporaryVariables },
     { kind: CompilationJobKind.Tmpl, fn: phaseSlotAllocation },
     { kind: CompilationJobKind.Tmpl, fn: phaseResolveI18nPlaceholders },
-    { kind: CompilationJobKind.Tmpl, fn: phasePropagateI18nPlaceholders },
     { kind: CompilationJobKind.Tmpl, fn: phaseI18nMessageExtraction },
     { kind: CompilationJobKind.Tmpl, fn: phaseI18nConstCollection },
     { kind: CompilationJobKind.Tmpl, fn: phaseConstTraitCollection },
@@ -22033,6 +22230,9 @@ function ingestNodes(unit, template) {
         else if (node instanceof DeferredBlock) {
             ingestDeferBlock(unit, node);
         }
+        else if (node instanceof Icu$1) {
+            ingestIcu(unit, node);
+        }
         else {
             throw new Error(`Unsupported template node: ${node.constructor.name}`);
         }
@@ -22081,8 +22281,7 @@ function ingestTemplate(unit, tmpl) {
         [namespacePrefix, tagNameWithoutNamespace] = splitNsName(tmpl.tagName);
     }
     const i18nPlaceholder = tmpl.i18n instanceof TagPlaceholder ? tmpl.i18n : undefined;
-    // TODO: validate the fallback tag name here.
-    const tplOp = createTemplateOp(childView.xref, tagNameWithoutNamespace ?? 'ng-template', namespaceForKey(namespacePrefix), false, i18nPlaceholder, tmpl.startSourceSpan);
+    const tplOp = createTemplateOp(childView.xref, tagNameWithoutNamespace, namespaceForKey(namespacePrefix), false, i18nPlaceholder, tmpl.startSourceSpan);
     unit.create.push(tplOp);
     ingestBindings(unit, tplOp, tmpl);
     ingestReferences(tplOp, tmpl);
@@ -22090,8 +22289,10 @@ function ingestTemplate(unit, tmpl) {
     for (const { name, value } of tmpl.variables) {
         childView.contextVariables.set(name, value);
     }
-    // If there is an i18n message associated with this template, insert i18n start and end ops.
-    if (tmpl.i18n instanceof Message) {
+    // If this is a plain template and there is an i18n message associated with it, insert i18n start
+    // and end ops. For structural directive templates, the i18n ops will be added when ingesting the
+    // element/template the directive is placed on.
+    if (isPlainTemplate(tmpl) && tmpl.i18n instanceof Message) {
         const id = unit.job.allocateXrefId();
         OpList.insertAfter(createI18nStartOp(id, tmpl.i18n), childView.create.head);
         OpList.insertBefore(createI18nEndOp(id), childView.create.tail);
@@ -22227,6 +22428,16 @@ function ingestDeferBlock(unit, deferBlock) {
     // Add all ops to the view.
     unit.create.push(deferOnOp);
 }
+function ingestIcu(unit, icu) {
+    if (icu.i18n instanceof Message) {
+        const xref = unit.job.allocateXrefId();
+        unit.create.push(createIcuOp(xref, icu.i18n, null));
+        unit.update.push(createIcuUpdateOp(xref, null));
+    }
+    else {
+        throw Error(`Unhandled i18n metadata type for ICU: ${icu.i18n?.constructor.name}`);
+    }
+}
 /**
  * Convert a template AST expression into an output AST expression.
  */
@@ -22320,16 +22531,35 @@ function convertAst(ast, job, baseSourceSpan) {
         throw new Error(`Unhandled expression type: ${ast.constructor.name}`);
     }
 }
+/**
+ * Checks whether the given template is a plain ng-template (as opposed to another kind of template
+ * such as a structural directive template or control flow template). This is checked based on the
+ * tagName. We can expect that only plain ng-templates will come through with a tagName of
+ * 'ng-template'.
+ *
+ * Here are some of the cases we expect:
+ *
+ * | Angular HTML                       | Template tagName   |
+ * | ---------------------------------- | ------------------ |
+ * | `<ng-template>`                    | 'ng-template'      |
+ * | `<div *ngIf="true">`               | 'div'              |
+ * | `<svg><ng-template>`               | 'svg:ng-template'  |
+ * | `@if (true) {`                     | 'Conditional'      |
+ * | `<ng-template *ngIf>` (plain)      | 'ng-template'      |
+ * | `<ng-template *ngIf>` (structural) | null               |
+ */
+function isPlainTemplate(tmpl) {
+    return splitNsName(tmpl.tagName ?? '')[1] === 'ng-template';
+}
 /**
  * Process all of the bindings on an element-like structure in the template AST and convert them
  * to their IR representation.
  */
 function ingestBindings(unit, op, element) {
     let flags = BindingFlags.None;
-    const isPlainTemplate = element instanceof Template && splitNsName(element.tagName ?? '')[1] === 'ng-template';
     if (element instanceof Template) {
         flags |= BindingFlags.OnNgTemplateElement;
-        if (isPlainTemplate) {
+        if (element instanceof Template && isPlainTemplate(element)) {
             flags |= BindingFlags.BindingTargetsTemplate;
         }
         const templateAttrFlags = flags | BindingFlags.BindingTargetsTemplate | BindingFlags.IsStructuralTemplateAttribute;
@@ -22358,7 +22588,7 @@ function ingestBindings(unit, op, element) {
                 throw Error('Animation listener should have a phase');
             }
         }
-        if (element instanceof Template && !isPlainTemplate) {
+        if (element instanceof Template && !isPlainTemplate(element)) {
             unit.create.push(createExtractedAttributeOp(op.xref, BindingKind.Property, output.name, null));
             continue;
         }
@@ -29526,7 +29756,7 @@ function publishFacade(global) {
  * @description
  * Entry point for all public APIs of the compiler package.
  */
-const VERSION = new Version('17.0.0-next.8');
+const VERSION = new Version('17.0.0-rc.0');
 
 class CompilerConfig {
     constructor({ defaultEncapsulation = ViewEncapsulation.Emulated, preserveWhitespaces, strictInjectionParameters } = {}) {
@@ -31056,7 +31286,7 @@ const MINIMUM_PARTIAL_LINKER_VERSION$6 = '12.0.0';
 function compileDeclareClassMetadata(metadata) {
     const definitionMap = new DefinitionMap();
     definitionMap.set('minVersion', literal(MINIMUM_PARTIAL_LINKER_VERSION$6));
-    definitionMap.set('version', literal('17.0.0-next.8'));
+    definitionMap.set('version', literal('17.0.0-rc.0'));
     definitionMap.set('ngImport', importExpr(Identifiers.core));
     definitionMap.set('type', metadata.type);
     definitionMap.set('decorators', metadata.decorators);
@@ -31164,7 +31394,7 @@ function createDirectiveDefinitionMap(meta) {
     // in 16.1 is actually used.
     const minVersion = hasTransformFunctions ? MINIMUM_PARTIAL_LINKER_VERSION$5 : '14.0.0';
     definitionMap.set('minVersion', literal(minVersion));
-    definitionMap.set('version', literal('17.0.0-next.8'));
+    definitionMap.set('version', literal('17.0.0-rc.0'));
     // e.g. `type: MyDirective`
     definitionMap.set('type', meta.type.value);
     if (meta.isStandalone) {
@@ -31441,7 +31671,7 @@ const MINIMUM_PARTIAL_LINKER_VERSION$4 = '12.0.0';
 function compileDeclareFactoryFunction(meta) {
     const definitionMap = new DefinitionMap();
     definitionMap.set('minVersion', literal(MINIMUM_PARTIAL_LINKER_VERSION$4));
-    definitionMap.set('version', literal('17.0.0-next.8'));
+    definitionMap.set('version', literal('17.0.0-rc.0'));
     definitionMap.set('ngImport', importExpr(Identifiers.core));
     definitionMap.set('type', meta.type.value);
     definitionMap.set('deps', compileDependencies(meta.deps));
@@ -31476,7 +31706,7 @@ function compileDeclareInjectableFromMetadata(meta) {
 function createInjectableDefinitionMap(meta) {
     const definitionMap = new DefinitionMap();
     definitionMap.set('minVersion', literal(MINIMUM_PARTIAL_LINKER_VERSION$3));
-    definitionMap.set('version', literal('17.0.0-next.8'));
+    definitionMap.set('version', literal('17.0.0-rc.0'));
     definitionMap.set('ngImport', importExpr(Identifiers.core));
     definitionMap.set('type', meta.type.value);
     // Only generate providedIn property if it has a non-null value
@@ -31527,7 +31757,7 @@ function compileDeclareInjectorFromMetadata(meta) {
 function createInjectorDefinitionMap(meta) {
     const definitionMap = new DefinitionMap();
     definitionMap.set('minVersion', literal(MINIMUM_PARTIAL_LINKER_VERSION$2));
-    definitionMap.set('version', literal('17.0.0-next.8'));
+    definitionMap.set('version', literal('17.0.0-rc.0'));
     definitionMap.set('ngImport', importExpr(Identifiers.core));
     definitionMap.set('type', meta.type.value);
     definitionMap.set('providers', meta.providers);
@@ -31560,7 +31790,7 @@ function createNgModuleDefinitionMap(meta) {
         throw new Error('Invalid path! Local compilation mode should not get into the partial compilation path');
     }
     definitionMap.set('minVersion', literal(MINIMUM_PARTIAL_LINKER_VERSION$1));
-    definitionMap.set('version', literal('17.0.0-next.8'));
+    definitionMap.set('version', literal('17.0.0-rc.0'));
     definitionMap.set('ngImport', importExpr(Identifiers.core));
     definitionMap.set('type', meta.type.value);
     // We only generate the keys in the metadata if the arrays contain values.
@@ -31611,7 +31841,7 @@ function compileDeclarePipeFromMetadata(meta) {
 function createPipeDefinitionMap(meta) {
     const definitionMap = new DefinitionMap();
     definitionMap.set('minVersion', literal(MINIMUM_PARTIAL_LINKER_VERSION));
-    definitionMap.set('version', literal('17.0.0-next.8'));
+    definitionMap.set('version', literal('17.0.0-rc.0'));
     definitionMap.set('ngImport', importExpr(Identifiers.core));
     // e.g. `type: MyPipe`
     definitionMap.set('type', meta.type.value);