@angular/core 16.0.0 → 16.1.0-next.0

package/fesm2022/core.mjs

@@ -1,5 +1,5 @@
 /**
- * @license Angular v16.0.0
+ * @license Angular v16.1.0-next.0
  * (c) 2010-2022 Google LLC. https://angular.io/
  * License: MIT
  */
@@ -302,10 +302,7 @@ function throwError(msg, actual, expected, comparison) {
         (comparison == null ? '' : ` [Expected=> ${expected} ${comparison} ${actual} <=Actual]`));
 }
 function assertDomNode(node) {
-    // If we're in a worker, `Node` will not be defined.
-    if (!(typeof Node !== 'undefined' && node instanceof Node) &&
-        !(typeof node === 'object' && node != null &&
-            node.constructor.name === 'WebWorkerRenderNode')) {
+    if (!(node instanceof Node)) {
         throwError(`The provided value must be an instance of a DOM Node but got ${stringify(node)}`);
     }
 }
@@ -1610,6 +1607,7 @@ function ɵɵdefineComponent(componentDefinition) {
             pipeDefs: null,
             dependencies: baseDef.standalone && componentDefinition.dependencies || null,
             getStandaloneInjector: null,
+            signals: componentDefinition.signals ?? false,
             data: componentDefinition.data || {},
             encapsulation: componentDefinition.encapsulation || ViewEncapsulation$1.Emulated,
             styles: componentDefinition.styles || EMPTY_ARRAY,
@@ -1852,6 +1850,7 @@ function getNgDirectiveDef(directiveDefinition) {
         declaredInputs,
         exportAs: directiveDefinition.exportAs || null,
         standalone: directiveDefinition.standalone === true,
+        signals: directiveDefinition.signals === true,
         selectors: directiveDefinition.selectors || EMPTY_ARRAY,
         viewQuery: directiveDefinition.viewQuery || null,
         features: directiveDefinition.features || null,
@@ -1893,7 +1892,7 @@ function getComponentId(componentDef) {
     // Example:
     // https://github.com/angular/components/blob/d9f82c8f95309e77a6d82fd574c65871e91354c2/src/material/core/option/option.ts#L248
     // https://github.com/angular/components/blob/285f46dc2b4c5b127d356cb7c4714b221f03ce50/src/material/legacy-core/option/option.ts#L32
-    const hashSelectors = [
+    const hashSelectors = JSON.stringify([
         componentDef.selectors,
         componentDef.ngContentSelectors,
         componentDef.hostVars,
@@ -1903,12 +1902,16 @@ function getComponentId(componentDef) {
         componentDef.decls,
         componentDef.encapsulation,
         componentDef.standalone,
+        componentDef.signals,
+        componentDef.exportAs,
+        componentDef.inputs,
+        componentDef.outputs,
         // We cannot use 'componentDef.type.name' as the name of the symbol will change and will not
         // match in the server and browser bundles.
         Object.getOwnPropertyNames(componentDef.type.prototype),
         !!componentDef.contentQueries,
         !!componentDef.viewQuery,
-    ].join('|');
+    ]);
     for (const char of hashSelectors) {
         hash = Math.imul(31, hash) + char.charCodeAt(0) << 0;
     }
@@ -3741,7 +3744,7 @@ function incrementInitPhaseFlags(lView, initPhase) {
         assertNotEqual(initPhase, 3 /* InitPhaseState.InitPhaseCompleted */, 'Init hooks phase should not be incremented after all init hooks have been run.');
     let flags = lView[FLAGS];
     if ((flags & 3 /* LViewFlags.InitPhaseStateMask */) === initPhase) {
-        flags &= 4095 /* LViewFlags.IndexWithinInitPhaseReset */;
+        flags &= 8191 /* LViewFlags.IndexWithinInitPhaseReset */;
         flags += 1 /* LViewFlags.InitPhaseStateIncrementer */;
         lView[FLAGS] = flags;
     }
@@ -3822,12 +3825,12 @@ function callHook(currentView, initPhase, arr, i) {
     const directiveIndex = isInitHook ? -arr[i] : arr[i];
     const directive = currentView[directiveIndex];
     if (isInitHook) {
-        const indexWithintInitPhase = currentView[FLAGS] >> 12 /* LViewFlags.IndexWithinInitPhaseShift */;
+        const indexWithintInitPhase = currentView[FLAGS] >> 13 /* LViewFlags.IndexWithinInitPhaseShift */;
         // The init phase state must be always checked here as it may have been recursively updated.
         if (indexWithintInitPhase <
             (currentView[PREORDER_HOOK_FLAGS] >> 16 /* PreOrderHookFlags.NumberOfInitHooksCalledShift */) &&
             (currentView[FLAGS] & 3 /* LViewFlags.InitPhaseStateMask */) === initPhase) {
-            currentView[FLAGS] += 4096 /* LViewFlags.IndexWithinInitPhaseIncrementer */;
+            currentView[FLAGS] += 8192 /* LViewFlags.IndexWithinInitPhaseIncrementer */;
             callHookInternal(directive, hook);
         }
     }
@@ -4728,7 +4731,7 @@ function ɵɵgetInheritedFactory(type) {
         // (no Angular decorator on the superclass) or there is no constructor at all
         // in the inheritance chain. Since the two cases cannot be distinguished, the
         // latter has to be assumed.
-        return t => new t();
+        return (t) => new t();
     });
 }
 function getFactoryOf(type) {
@@ -4938,6 +4941,7 @@ function makePropDecorator(name, props, parentClass, additionalProcessing) {
 /**
  * Attribute decorator and metadata.
  *
+ * @Annotation
  * @publicApi
  */
 const Attribute = makeParamDecorator('Attribute', (attributeName) => ({ attributeName, __NG_ELEMENT_ID__: () => ɵɵinjectAttribute(attributeName) }));
@@ -4961,6 +4965,7 @@ class Query {
  * ContentChildren decorator and metadata.
  *
  *
+ * @Annotation
  * @publicApi
  */
 const ContentChildren = makePropDecorator('ContentChildren', (selector, data = {}) => ({
@@ -4975,7 +4980,7 @@ const ContentChildren = makePropDecorator('ContentChildren', (selector, data = {
  * ContentChild decorator and metadata.
  *
  *
-
+ * @Annotation
  *
  * @publicApi
  */
@@ -4983,7 +4988,7 @@ const ContentChild = makePropDecorator('ContentChild', (selector, data = {}) =>
 /**
  * ViewChildren decorator and metadata.
  *
-
+ * @Annotation
  * @publicApi
  */
 const ViewChildren = makePropDecorator('ViewChildren', (selector, data = {}) => ({
@@ -4997,7 +5002,7 @@ const ViewChildren = makePropDecorator('ViewChildren', (selector, data = {}) =>
 /**
  * ViewChild decorator and metadata.
  *
-
+ * @Annotation
  * @publicApi
  */
 const ViewChild = makePropDecorator('ViewChild', (selector, data) => ({ selector, first: true, isViewQuery: true, descendants: true, ...data }), Query);
@@ -5584,6 +5589,7 @@ function getParentCtor(ctor) {
 /**
  * Inject decorator and metadata.
  *
+ * @Annotation
  * @publicApi
  */
 const Inject = attachInjectFlag(
@@ -5593,7 +5599,7 @@ makeParamDecorator('Inject', (token) => ({ token })), -1 /* DecoratorFlags.Injec
 /**
  * Optional decorator and metadata.
  *
-
+ * @Annotation
  * @publicApi
  */
 const Optional = 
@@ -5603,7 +5609,7 @@ attachInjectFlag(makeParamDecorator('Optional'), 8 /* InternalInjectFlags.Option
 /**
  * Self decorator and metadata.
  *
-
+ * @Annotation
  * @publicApi
  */
 const Self = 
@@ -5613,7 +5619,7 @@ attachInjectFlag(makeParamDecorator('Self'), 2 /* InternalInjectFlags.Self */);
 /**
  * `SkipSelf` decorator and metadata.
  *
-
+ * @Annotation
  * @publicApi
  */
 const SkipSelf = 
@@ -5623,7 +5629,7 @@ attachInjectFlag(makeParamDecorator('SkipSelf'), 4 /* InternalInjectFlags.SkipSe
 /**
  * Host decorator and metadata.
  *
-
+ * @Annotation
  * @publicApi
  */
 const Host = 
@@ -5986,7 +5992,7 @@ function isPropertyValid(element, propName, tagName, schemas) {
     if (schemas === null)
         return true;
     // The property is considered valid if the element matches the schema, it exists on the element,
-    // or it is synthetic, and we are in a browser context (web worker nodes should be skipped).
+    // or it is synthetic.
     if (matchingSchemas(schemas, tagName) || propName in element || isAnimationProp(propName)) {
         return true;
     }
@@ -6128,6 +6134,59 @@ function matchingSchemas(schemas, tagName) {
     return false;
 }
 
+/**
+ * The name of an attribute that can be added to the hydration boundary node
+ * (component host node) to disable hydration for the content within that boundary.
+ */
+const SKIP_HYDRATION_ATTR_NAME = 'ngSkipHydration';
+/**
+ * Helper function to check if a given node has the 'ngSkipHydration' attribute
+ */
+function hasNgSkipHydrationAttr(tNode) {
+    const SKIP_HYDRATION_ATTR_NAME_LOWER_CASE = SKIP_HYDRATION_ATTR_NAME.toLowerCase();
+    const attrs = tNode.mergedAttrs;
+    if (attrs === null)
+        return false;
+    // only ever look at the attribute name and skip the values
+    for (let i = 0; i < attrs.length; i += 2) {
+        const value = attrs[i];
+        // This is a marker, which means that the static attributes section is over,
+        // so we can exit early.
+        if (typeof value === 'number')
+            return false;
+        if (typeof value === 'string' && value.toLowerCase() === SKIP_HYDRATION_ATTR_NAME_LOWER_CASE) {
+            return true;
+        }
+    }
+    return false;
+}
+/**
+ * Checks whether a TNode has a flag to indicate that it's a part of
+ * a skip hydration block.
+ */
+function hasInSkipHydrationBlockFlag(tNode) {
+    return (tNode.flags & 128 /* TNodeFlags.inSkipHydrationBlock */) === 128 /* TNodeFlags.inSkipHydrationBlock */;
+}
+/**
+ * Helper function that determines if a given node is within a skip hydration block
+ * by navigating up the TNode tree to see if any parent nodes have skip hydration
+ * attribute.
+ *
+ * TODO(akushnir): this function should contain the logic of `hasInSkipHydrationBlockFlag`,
+ * there is no need to traverse parent nodes when we have a TNode flag (which would also
+ * make this lookup O(1)).
+ */
+function isInSkipHydrationBlock(tNode) {
+    let currentTNode = tNode.parent;
+    while (currentTNode) {
+        if (hasNgSkipHydrationAttr(currentTNode)) {
+            return true;
+        }
+        currentTNode = currentTNode.parent;
+    }
+    return false;
+}
+
 /**
  * Flags for renderer-specific style modifiers.
  * @publicApi
@@ -7427,6 +7486,11 @@ function applyProjectionRecursive(renderer, action, lView, tProjectionNode, pare
     else {
         let nodeToProject = nodeToProjectOrRNodes;
         const projectedComponentLView = componentLView[PARENT];
+        // If a parent <ng-content> is located within a skip hydration block,
+        // annotate an actual node that is being projected with the same flag too.
+        if (hasInSkipHydrationBlockFlag(tProjectionNode)) {
+            nodeToProject.flags |= 128 /* TNodeFlags.inSkipHydrationBlock */;
+        }
         applyNodes(renderer, action, nodeToProject, projectedComponentLView, parentRElement, beforeNode, true);
     }
 }
@@ -7727,7 +7791,7 @@ function ɵɵvalidateIframeAttribute(attrValue, tagName, attrName) {
  * When running ivy outside of a browser environment, it is necessary to call `setDocument()` to
  * tell ivy what the global `document` is.
  *
- * Angular does this for us in each of the standard platforms (`Browser`, `Server`, and `WebWorker`)
+ * Angular does this for us in each of the standard platforms (`Browser` and `Server`)
  * by calling `setDocument()` when providing the `DOCUMENT` token.
  */
 let DOCUMENT = undefined;
@@ -7754,12 +7818,13 @@ function getDocument() {
     else if (typeof document !== 'undefined') {
         return document;
     }
+    throw new RuntimeError(210 /* RuntimeErrorCode.MISSING_DOCUMENT */, (typeof ngDevMode === 'undefined' || ngDevMode) &&
+        `The document object is not available in this context. Make sure the DOCUMENT injection token is provided.`);
     // No "document" can be found. This should only happen if we are running ivy outside Angular and
     // the current platform is not a browser. Since this is not a supported scenario at the moment
     // this should not happen in Angular apps.
     // Once we support running ivy outside of Angular we will need to publish `setDocument()` as a
-    // public API. Meanwhile we just return `undefined` and let the application fail.
-    return undefined;
+    // public API.
 }
 
 /**
@@ -9465,7 +9530,9 @@ function makeStateKey(key) {
 }
 function initTransferState() {
     const transferState = new TransferState();
-    transferState.store = retrieveTransferredState(getDocument(), inject(APP_ID));
+    if (inject(PLATFORM_ID) === 'browser') {
+        transferState.store = retrieveTransferredState(getDocument(), inject(APP_ID));
+    }
     return transferState;
 }
 /**
@@ -9554,17 +9621,16 @@ function retrieveTransferredState(doc, appId) {
     // Locate the script tag with the JSON data transferred from the server.
     // The id of the script tag is set to the Angular appId + 'state'.
     const script = doc.getElementById(appId + '-state');
-    let initialState = {};
-    if (script && script.textContent) {
+    if (script?.textContent) {
         try {
             // Avoid using any here as it triggers lint errors in google3 (any is not allowed).
-            initialState = JSON.parse(unescapeTransferStateContent(script.textContent));
+            return JSON.parse(unescapeTransferStateContent(script.textContent));
         }
         catch (e) {
             console.warn('Exception while restoring TransferState for app ' + appId, e);
         }
     }
-    return initialState;
+    return {};
 }
 
 /** Encodes that the node lookup should start from the host node of this component. */
@@ -9683,6 +9749,12 @@ function getComponentLViewForHydration(viewRef) {
     if (isRootView(lView)) {
         lView = lView[HEADER_OFFSET];
     }
+    // If a `ViewContainerRef` was injected in a component class, this resulted
+    // in an LContainer creation at that location. In this case, the component
+    // LView is in the LContainer's `HOST` slot.
+    if (isLContainer(lView)) {
+        lView = lView[HOST];
+    }
     return lView;
 }
 function getTextNodeContent(node) {
@@ -9978,7 +10050,7 @@ class Version {
 /**
  * @publicApi
  */
-const VERSION = new Version('16.0.0');
+const VERSION = new Version('16.1.0-next.0');
 
 // This default value is when checking the hierarchy for a token.
 //
@@ -10084,48 +10156,6 @@ class ErrorHandler {
     }
 }
 
-/**
- * The name of an attribute that can be added to the hydration boundary node
- * (component host node) to disable hydration for the content within that boundary.
- */
-const SKIP_HYDRATION_ATTR_NAME = 'ngSkipHydration';
-/**
- * Helper function to check if a given node has the 'ngSkipHydration' attribute
- */
-function hasNgSkipHydrationAttr(tNode) {
-    const SKIP_HYDRATION_ATTR_NAME_LOWER_CASE = SKIP_HYDRATION_ATTR_NAME.toLowerCase();
-    const attrs = tNode.mergedAttrs;
-    if (attrs === null)
-        return false;
-    // only ever look at the attribute name and skip the values
-    for (let i = 0; i < attrs.length; i += 2) {
-        const value = attrs[i];
-        // This is a marker, which means that the static attributes section is over,
-        // so we can exit early.
-        if (typeof value === 'number')
-            return false;
-        if (typeof value === 'string' && value.toLowerCase() === SKIP_HYDRATION_ATTR_NAME_LOWER_CASE) {
-            return true;
-        }
-    }
-    return false;
-}
-/**
- * Helper function that determines if a given node is within a skip hydration block
- * by navigating up the TNode tree to see if any parent nodes have skip hydration
- * attribute.
- */
-function isInSkipHydrationBlock(tNode) {
-    let currentTNode = tNode.parent;
-    while (currentTNode) {
-        if (hasNgSkipHydrationAttr(currentTNode)) {
-            return true;
-        }
-        currentTNode = currentTNode.parent;
-    }
-    return false;
-}
-
 /**
  * Internal token that specifies whether DOM reuse logic
  * during hydration is enabled.
@@ -10563,6 +10593,7 @@ function getInjectableMetadata(type, srcMeta) {
 /**
  * Injectable decorator and metadata.
  *
+ * @Annotation
  * @publicApi
  */
 const Injectable = makeDecorator('Injectable', undefined, undefined, undefined, (type, meta) => compileInjectable(type, meta));
@@ -11119,6 +11150,10 @@ function createTNode(tView, tParent, type, index, value, attrs) {
     ngDevMode && ngDevMode.tNode++;
     ngDevMode && tParent && assertTNodeForTView(tParent, tView);
     let injectorIndex = tParent ? tParent.injectorIndex : -1;
+    let flags = 0;
+    if (isInSkipHydrationBlock$1()) {
+        flags |= 128 /* TNodeFlags.inSkipHydrationBlock */;
+    }
     const tNode = {
         type,
         index,
@@ -11129,7 +11164,7 @@ function createTNode(tView, tParent, type, index, value, attrs) {
         directiveStylingLast: -1,
         componentOffset: -1,
         propertyBindings: null,
-        flags: 0,
+        flags,
         providerIndexes: 0,
         value: value,
         attrs: attrs,
@@ -11681,7 +11716,14 @@ function addComponentLogic(lView, hostTNode, def) {
     // Only component views should be added to the view tree directly. Embedded views are
     // accessed through their containers because they may be removed / re-added later.
     const rendererFactory = lView[ENVIRONMENT].rendererFactory;
-    const componentView = addToViewTree(lView, createLView(lView, tView, null, def.onPush ? 64 /* LViewFlags.Dirty */ : 16 /* LViewFlags.CheckAlways */, native, hostTNode, null, rendererFactory.createRenderer(native, def), null, null, null));
+    let lViewFlags = 16 /* LViewFlags.CheckAlways */;
+    if (def.signals) {
+        lViewFlags = 4096 /* LViewFlags.SignalView */;
+    }
+    else if (def.onPush) {
+        lViewFlags = 64 /* LViewFlags.Dirty */;
+    }
+    const componentView = addToViewTree(lView, createLView(lView, tView, null, lViewFlags, native, hostTNode, null, rendererFactory.createRenderer(native, def), null, null, null));
     // Component view will always be created before any injected LContainers,
     // so this is a regular element, wrap it with the component view
     lView[hostTNode.index] = componentView;
@@ -12391,7 +12433,7 @@ function refreshView(tView, lView, templateFn, context) {
         // insertion points. This is needed to avoid the situation where the template is defined in this
         // `LView` but its declaration appears after the insertion component.
         markTransplantedViewsForRefresh(lView);
-        refreshEmbeddedViews(lView);
+        detectChangesInEmbeddedViews(lView, 2 /* ChangeDetectionMode.BugToForceRefreshAndIgnoreViewFlags */);
         // Content query results must be refreshed before content hooks are called.
         if (tView.contentQueries !== null) {
             refreshContentQueries(tView, lView);
@@ -12417,7 +12459,7 @@ function refreshView(tView, lView, templateFn, context) {
         // Refresh child component views.
         const components = tView.components;
         if (components !== null) {
-            refreshChildComponents(lView, components);
+            detectChangesInChildComponents(lView, components, 0 /* ChangeDetectionMode.Global */);
         }
         // View queries must execute after refreshing child components because a template in this view
         // could be inserted in a child component. If the view query executes before child component
@@ -12471,15 +12513,11 @@ function refreshView(tView, lView, templateFn, context) {
  * Goes over embedded views (ones created through ViewContainerRef APIs) and refreshes
  * them by executing an associated template function.
  */
-function refreshEmbeddedViews(lView) {
+function detectChangesInEmbeddedViews(lView, mode) {
     for (let lContainer = getFirstLContainer(lView); lContainer !== null; lContainer = getNextLContainer(lContainer)) {
         for (let i = CONTAINER_HEADER_OFFSET; i < lContainer.length; i++) {
             const embeddedLView = lContainer[i];
-            const embeddedTView = embeddedLView[TVIEW];
-            ngDevMode && assertDefined(embeddedTView, 'TView must be allocated');
-            if (viewAttachedToChangeDetector(embeddedLView)) {
-                refreshView(embeddedTView, embeddedLView, embeddedTView.template, embeddedLView[CONTEXT]);
-            }
+            detectChangesInView(embeddedLView, mode);
         }
     }
 }
@@ -12503,65 +12541,53 @@ function markTransplantedViewsForRefresh(lView) {
     }
 }
 /**
- * Refreshes components by entering the component view and processing its bindings, queries, etc.
+ * Detects changes in a component by entering the component view and processing its bindings,
+ * queries, etc. if it is CheckAlways, OnPush and Dirty, etc.
  *
  * @param componentHostIdx  Element index in LView[] (adjusted for HEADER_OFFSET)
  */
-function refreshComponent(hostLView, componentHostIdx) {
+function detectChangesInComponent(hostLView, componentHostIdx, mode) {
     ngDevMode && assertEqual(isCreationMode(hostLView), false, 'Should be run in update mode');
     const componentView = getComponentLViewByIndex(componentHostIdx, hostLView);
-    // Only attached components that are CheckAlways or OnPush and dirty should be refreshed
-    if (viewAttachedToChangeDetector(componentView)) {
-        const tView = componentView[TVIEW];
-        if (componentView[FLAGS] & (16 /* LViewFlags.CheckAlways */ | 64 /* LViewFlags.Dirty */)) {
-            refreshView(tView, componentView, tView.template, componentView[CONTEXT]);
-        }
-        else if (componentView[DESCENDANT_VIEWS_TO_REFRESH] > 0) {
-            // Only attached components that are CheckAlways or OnPush and dirty should be refreshed
-            refreshContainsDirtyView(componentView);
-        }
-    }
+    detectChangesInView(componentView, mode);
 }
 /**
- * Refreshes all transplanted views marked with `LViewFlags.RefreshTransplantedView` that are
- * children or descendants of the given lView.
+ * Visits a view as part of change detection traversal.
+ *
+ * - If the view is detached, no additional traversal happens.
+ *
+ * The view is refreshed if:
+ * - If the view is CheckAlways or Dirty and ChangeDetectionMode is `Global`
+ * - If the view has the `RefreshTransplantedView` flag
+ *
+ * The view is not refreshed, but descendants are traversed in `ChangeDetectionMode.Targeted` if the
+ * view has a non-zero TRANSPLANTED_VIEWS_TO_REFRESH counter.
  *
- * @param lView The lView which contains descendant transplanted views that need to be refreshed.
  */
-function refreshContainsDirtyView(lView) {
-    for (let lContainer = getFirstLContainer(lView); lContainer !== null; lContainer = getNextLContainer(lContainer)) {
-        for (let i = CONTAINER_HEADER_OFFSET; i < lContainer.length; i++) {
-            const embeddedLView = lContainer[i];
-            if (viewAttachedToChangeDetector(embeddedLView)) {
-                if (embeddedLView[FLAGS] & 1024 /* LViewFlags.RefreshView */) {
-                    const embeddedTView = embeddedLView[TVIEW];
-                    ngDevMode && assertDefined(embeddedTView, 'TView must be allocated');
-                    refreshView(embeddedTView, embeddedLView, embeddedTView.template, embeddedLView[CONTEXT]);
-                }
-                else if (embeddedLView[DESCENDANT_VIEWS_TO_REFRESH] > 0) {
-                    refreshContainsDirtyView(embeddedLView);
-                }
-            }
-        }
+function detectChangesInView(lView, mode) {
+    if (!viewAttachedToChangeDetector(lView)) {
+        return;
     }
     const tView = lView[TVIEW];
-    // Refresh child component views.
-    const components = tView.components;
-    if (components !== null) {
-        for (let i = 0; i < components.length; i++) {
-            const componentView = getComponentLViewByIndex(components[i], lView);
-            // Only attached components that are CheckAlways or OnPush and dirty should be refreshed
-            if (viewAttachedToChangeDetector(componentView) &&
-                componentView[DESCENDANT_VIEWS_TO_REFRESH] > 0) {
-                refreshContainsDirtyView(componentView);
-            }
+    if ((lView[FLAGS] & (16 /* LViewFlags.CheckAlways */ | 64 /* LViewFlags.Dirty */) &&
+        mode === 0 /* ChangeDetectionMode.Global */) ||
+        lView[FLAGS] & 1024 /* LViewFlags.RefreshView */ ||
+        mode === 2 /* ChangeDetectionMode.BugToForceRefreshAndIgnoreViewFlags */) {
+        refreshView(tView, lView, tView.template, lView[CONTEXT]);
+    }
+    else if (lView[DESCENDANT_VIEWS_TO_REFRESH] > 0) {
+        detectChangesInEmbeddedViews(lView, 1 /* ChangeDetectionMode.Targeted */);
+        const tView = lView[TVIEW];
+        const components = tView.components;
+        if (components !== null) {
+            detectChangesInChildComponents(lView, components, 1 /* ChangeDetectionMode.Targeted */);
         }
     }
 }
 /** Refreshes child components in the current view (update mode). */
-function refreshChildComponents(hostLView, components) {
+function detectChangesInChildComponents(hostLView, components, mode) {
     for (let i = 0; i < components.length; i++) {
-        refreshComponent(hostLView, components[i]);
+        detectChangesInComponent(hostLView, components[i], mode);
     }
 }
 
@@ -12961,8 +12987,12 @@ class ComponentFactory extends ComponentFactory$1 {
         const hostRNode = rootSelectorOrNode ?
             locateHostElement(hostRenderer, rootSelectorOrNode, this.componentDef.encapsulation, rootViewInjector) :
             createElementNode(hostRenderer, elementName, getNamespace(elementName));
-        const rootFlags = this.componentDef.onPush ? 64 /* LViewFlags.Dirty */ | 512 /* LViewFlags.IsRoot */ :
+        // Signal components use the granular "RefreshView"  for change detection
+        const signalFlags = (4096 /* LViewFlags.SignalView */ | 512 /* LViewFlags.IsRoot */);
+        // Non-signal components use the traditional "CheckAlways or OnPush/Dirty" change detection
+        const nonSignalFlags = this.componentDef.onPush ? 64 /* LViewFlags.Dirty */ | 512 /* LViewFlags.IsRoot */ :
             16 /* LViewFlags.CheckAlways */ | 512 /* LViewFlags.IsRoot */;
+        const rootFlags = this.componentDef.signals ? signalFlags : nonSignalFlags;
         // Create the root view. Uses empty TView and ContentTemplate.
         const rootTView = createTView(0 /* TViewType.Root */, null, null, 1, 0, null, null, null, null, null, null);
         const rootLView = createLView(null, rootTView, null, rootFlags, null, null, environment, hostRenderer, rootViewInjector, null, null);
@@ -13105,7 +13135,14 @@ function createRootComponentView(tNode, hostRNode, rootComponentDef, rootDirecti
         hydrationInfo = retrieveHydrationInfo(hostRNode, rootView[INJECTOR$1]);
     }
     const viewRenderer = environment.rendererFactory.createRenderer(hostRNode, rootComponentDef);
-    const componentView = createLView(rootView, getOrCreateComponentTView(rootComponentDef), null, rootComponentDef.onPush ? 64 /* LViewFlags.Dirty */ : 16 /* LViewFlags.CheckAlways */, rootView[tNode.index], tNode, environment, viewRenderer, null, null, hydrationInfo);
+    let lViewFlags = 16 /* LViewFlags.CheckAlways */;
+    if (rootComponentDef.signals) {
+        lViewFlags = 4096 /* LViewFlags.SignalView */;
+    }
+    else if (rootComponentDef.onPush) {
+        lViewFlags = 64 /* LViewFlags.Dirty */;
+    }
+    const componentView = createLView(rootView, getOrCreateComponentTView(rootComponentDef), null, lViewFlags, rootView[tNode.index], tNode, environment, viewRenderer, null, null, hydrationInfo);
     if (tView.firstCreatePass) {
         markAsComponentHost(tView, tNode, rootDirectives.length - 1);
     }
@@ -22842,8 +22879,11 @@ const R3TemplateRef = class TemplateRef extends ViewEngineTemplateRef {
      * @internal
      */
     createEmbeddedViewImpl(context, injector, hydrationInfo) {
+        // Embedded views follow the change detection strategy of the view they're declared in.
+        const isSignalView = this._declarationLView[FLAGS] & 4096 /* LViewFlags.SignalView */;
+        const viewFlags = isSignalView ? 4096 /* LViewFlags.SignalView */ : 16 /* LViewFlags.CheckAlways */;
         const embeddedTView = this._declarationTContainer.tView;
-        const embeddedLView = createLView(this._declarationLView, embeddedTView, context, 16 /* LViewFlags.CheckAlways */, null, embeddedTView.declTNode, null, null, null, injector || null, hydrationInfo || null);
+        const embeddedLView = createLView(this._declarationLView, embeddedTView, context, viewFlags, null, embeddedTView.declTNode, null, null, null, injector || null, hydrationInfo || null);
         const declarationLContainer = this._declarationLView[this._declarationTContainer.index];
         ngDevMode && assertLContainer(declarationLContainer);
         embeddedLView[DECLARATION_LCONTAINER] = declarationLContainer;
@@ -23117,7 +23157,11 @@ const R3ViewContainerRef = class ViewContainerRef extends VE_ViewContainerRef {
         }
         const hydrationInfo = findMatchingDehydratedView(this._lContainer, templateRef.ssrId);
         const viewRef = templateRef.createEmbeddedViewImpl(context || {}, injector, hydrationInfo);
-        this.insertImpl(viewRef, index, !!hydrationInfo);
+        // If there is a matching dehydrated view, but the host TNode is located in the skip
+        // hydration block, this means that the content was detached (as a part of the skip
+        // hydration logic) and it needs to be appended into the DOM.
+        const skipDomInsertion = !!hydrationInfo && !hasInSkipHydrationBlockFlag(this._hostTNode);
+        this.insertImpl(viewRef, index, skipDomInsertion);
         return viewRef;
     }
     createComponent(componentFactoryOrType, indexOrOptions, injector, projectableNodes, environmentInjector) {
@@ -23191,7 +23235,11 @@ const R3ViewContainerRef = class ViewContainerRef extends VE_ViewContainerRef {
         const dehydratedView = findMatchingDehydratedView(this._lContainer, componentDef?.id ?? null);
         const rNode = dehydratedView?.firstChild ?? null;
         const componentRef = componentFactory.create(contextInjector, projectableNodes, rNode, environmentInjector);
-        this.insertImpl(componentRef.hostView, index, !!dehydratedView);
+        // If there is a matching dehydrated view, but the host TNode is located in the skip
+        // hydration block, this means that the content was detached (as a part of the skip
+        // hydration logic) and it needs to be appended into the DOM.
+        const skipDomInsertion = !!dehydratedView && !hasInSkipHydrationBlockFlag(this._hostTNode);
+        this.insertImpl(componentRef.hostView, index, skipDomInsertion);
         return componentRef;
     }
     insert(viewRef, index) {
@@ -23365,8 +23413,10 @@ function locateOrCreateAnchorNode(lContainer, hostLView, hostTNode, slotValue) {
         return;
     const hydrationInfo = hostLView[HYDRATION];
     const noOffsetIndex = hostTNode.index - HEADER_OFFSET;
-    const isNodeCreationMode = !hydrationInfo || isInSkipHydrationBlock(hostTNode) ||
-        isDisconnectedNode$1(hydrationInfo, noOffsetIndex);
+    // TODO(akushnir): this should really be a single condition, refactor the code
+    // to use `hasInSkipHydrationBlockFlag` logic inside `isInSkipHydrationBlock`.
+    const skipHydration = isInSkipHydrationBlock(hostTNode) || hasInSkipHydrationBlockFlag(hostTNode);
+    const isNodeCreationMode = !hydrationInfo || skipHydration || isDisconnectedNode$1(hydrationInfo, noOffsetIndex);
     // Regular creation mode.
     if (isNodeCreationMode) {
         return createAnchorNode(lContainer, hostLView, hostTNode, slotValue);
@@ -24910,6 +24960,7 @@ function directiveMetadata(type, metadata) {
         providers: metadata.providers || null,
         viewQueries: extractQueriesMetadata(type, propMetadata, isViewQuery),
         isStandalone: !!metadata.standalone,
+        isSignal: !!metadata.signals,
         hostDirectives: metadata.hostDirectives?.map(directive => typeof directive === 'function' ? { directive } : directive) ||
             null
     };
@@ -25062,17 +25113,17 @@ const Directive = makeDecorator('Directive', (dir = {}) => dir, undefined, undef
 /**
  * Component decorator and metadata.
  *
-
+ * @Annotation
  * @publicApi
  */
 const Component = makeDecorator('Component', (c = {}) => ({ changeDetection: ChangeDetectionStrategy.Default, ...c }), Directive, undefined, (type, meta) => compileComponent(type, meta));
 /**
-
+ * @Annotation
  * @publicApi
  */
 const Pipe = makeDecorator('Pipe', (p) => ({ pure: true, ...p }), undefined, undefined, (type, meta) => compilePipe(type, meta));
 /**
-
+ * @Annotation
  * @publicApi
  */
 const Input = makePropDecorator('Input', (arg) => {
@@ -25082,12 +25133,12 @@ const Input = makePropDecorator('Input', (arg) => {
     return typeof arg === 'string' ? { alias: arg } : arg;
 });
 /**
-
+ * @Annotation
  * @publicApi
  */
 const Output = makePropDecorator('Output', (alias) => ({ alias }));
 /**
-
+ * @Annotation
  * @publicApi
  */
 const HostBinding = makePropDecorator('HostBinding', (hostPropertyName) => ({ hostPropertyName }));
@@ -25153,12 +25204,13 @@ const HostBinding = makePropDecorator('HostBinding', (hostPropertyName) => ({ ho
  * The global target names that can be used to prefix an event name are
  * `document:`, `window:` and `body:`.
  *
-
+ * @Annotation
  * @publicApi
  */
 const HostListener = makePropDecorator('HostListener', (eventName, args) => ({ eventName, args }));
 
 /**
+ * @Annotation
  */
 const NgModule = makeDecorator('NgModule', (ngModule) => ngModule, undefined, undefined, 
 /**
@@ -26645,64 +26697,69 @@ function runPlatformInitializers(injector) {
  * @returns A promise that returns an `ApplicationRef` instance once resolved.
  */
 function internalCreateApplication(config) {
-    const { rootComponent, appProviders, platformProviders } = config;
-    if ((typeof ngDevMode === 'undefined' || ngDevMode) && rootComponent !== undefined) {
-        assertStandaloneComponentType(rootComponent);
-    }
-    const platformInjector = createOrReusePlatformInjector(platformProviders);
-    // Create root application injector based on a set of providers configured at the platform
-    // bootstrap level as well as providers passed to the bootstrap call by a user.
-    const allAppProviders = [
-        provideZoneChangeDetection(),
-        ...(appProviders || []),
-    ];
-    const adapter = new EnvironmentNgModuleRefAdapter({
-        providers: allAppProviders,
-        parent: platformInjector,
-        debugName: (typeof ngDevMode === 'undefined' || ngDevMode) ? 'Environment Injector' : '',
-        // We skip environment initializers because we need to run them inside the NgZone, which happens
-        // after we get the NgZone instance from the Injector.
-        runEnvironmentInitializers: false,
-    });
-    const envInjector = adapter.injector;
-    const ngZone = envInjector.get(NgZone);
-    return ngZone.run(() => {
-        envInjector.resolveInjectorInitializers();
-        const exceptionHandler = envInjector.get(ErrorHandler, null);
-        if ((typeof ngDevMode === 'undefined' || ngDevMode) && !exceptionHandler) {
-            throw new RuntimeError(402 /* RuntimeErrorCode.MISSING_REQUIRED_INJECTABLE_IN_BOOTSTRAP */, 'No `ErrorHandler` found in the Dependency Injection tree.');
-        }
-        let onErrorSubscription;
-        ngZone.runOutsideAngular(() => {
-            onErrorSubscription = ngZone.onError.subscribe({
-                next: (error) => {
-                    exceptionHandler.handleError(error);
-                }
-            });
-        });
-        // If the whole platform is destroyed, invoke the `destroy` method
-        // for all bootstrapped applications as well.
-        const destroyListener = () => envInjector.destroy();
-        const onPlatformDestroyListeners = platformInjector.get(PLATFORM_DESTROY_LISTENERS);
-        onPlatformDestroyListeners.add(destroyListener);
-        envInjector.onDestroy(() => {
-            onErrorSubscription.unsubscribe();
-            onPlatformDestroyListeners.delete(destroyListener);
+    try {
+        const { rootComponent, appProviders, platformProviders } = config;
+        if ((typeof ngDevMode === 'undefined' || ngDevMode) && rootComponent !== undefined) {
+            assertStandaloneComponentType(rootComponent);
+        }
+        const platformInjector = createOrReusePlatformInjector(platformProviders);
+        // Create root application injector based on a set of providers configured at the platform
+        // bootstrap level as well as providers passed to the bootstrap call by a user.
+        const allAppProviders = [
+            provideZoneChangeDetection(),
+            ...(appProviders || []),
+        ];
+        const adapter = new EnvironmentNgModuleRefAdapter({
+            providers: allAppProviders,
+            parent: platformInjector,
+            debugName: (typeof ngDevMode === 'undefined' || ngDevMode) ? 'Environment Injector' : '',
+            // We skip environment initializers because we need to run them inside the NgZone, which
+            // happens after we get the NgZone instance from the Injector.
+            runEnvironmentInitializers: false,
         });
-        return _callAndReportToErrorHandler(exceptionHandler, ngZone, () => {
-            const initStatus = envInjector.get(ApplicationInitStatus);
-            initStatus.runInitializers();
-            return initStatus.donePromise.then(() => {
-                const localeId = envInjector.get(LOCALE_ID, DEFAULT_LOCALE_ID);
-                setLocaleId(localeId || DEFAULT_LOCALE_ID);
-                const appRef = envInjector.get(ApplicationRef);
-                if (rootComponent !== undefined) {
-                    appRef.bootstrap(rootComponent);
-                }
-                return appRef;
+        const envInjector = adapter.injector;
+        const ngZone = envInjector.get(NgZone);
+        return ngZone.run(() => {
+            envInjector.resolveInjectorInitializers();
+            const exceptionHandler = envInjector.get(ErrorHandler, null);
+            if ((typeof ngDevMode === 'undefined' || ngDevMode) && !exceptionHandler) {
+                throw new RuntimeError(402 /* RuntimeErrorCode.MISSING_REQUIRED_INJECTABLE_IN_BOOTSTRAP */, 'No `ErrorHandler` found in the Dependency Injection tree.');
+            }
+            let onErrorSubscription;
+            ngZone.runOutsideAngular(() => {
+                onErrorSubscription = ngZone.onError.subscribe({
+                    next: (error) => {
+                        exceptionHandler.handleError(error);
+                    }
+                });
+            });
+            // If the whole platform is destroyed, invoke the `destroy` method
+            // for all bootstrapped applications as well.
+            const destroyListener = () => envInjector.destroy();
+            const onPlatformDestroyListeners = platformInjector.get(PLATFORM_DESTROY_LISTENERS);
+            onPlatformDestroyListeners.add(destroyListener);
+            envInjector.onDestroy(() => {
+                onErrorSubscription.unsubscribe();
+                onPlatformDestroyListeners.delete(destroyListener);
+            });
+            return _callAndReportToErrorHandler(exceptionHandler, ngZone, () => {
+                const initStatus = envInjector.get(ApplicationInitStatus);
+                initStatus.runInitializers();
+                return initStatus.donePromise.then(() => {
+                    const localeId = envInjector.get(LOCALE_ID, DEFAULT_LOCALE_ID);
+                    setLocaleId(localeId || DEFAULT_LOCALE_ID);
+                    const appRef = envInjector.get(ApplicationRef);
+                    if (rootComponent !== undefined) {
+                        appRef.bootstrap(rootComponent);
+                    }
+                    return appRef;
+                });
             });
         });
-    });
+    }
+    catch (e) {
+        return Promise.reject(e);
+    }
 }
 /**
  * Creates a factory for a platform. Can be used to provide or override `Providers` specific to
@@ -29813,7 +29870,7 @@ function printHydrationStats(injector) {
         `and ${ngDevMode.hydratedNodes} node(s), ` +
         `${ngDevMode.componentsSkippedHydration} component(s) were skipped. ` +
         `Note: this feature is in Developer Preview mode. ` +
-        `Learn more at https://next.angular.io/guide/hydration.`;
+        `Learn more at https://angular.io/guide/hydration.`;
     // tslint:disable-next-line:no-console
     console.log(message);
 }
@@ -30146,6 +30203,9 @@ function reflectComponentType(component) {
         get isStandalone() {
             return componentDef.standalone;
         },
+        get isSignal() {
+            return componentDef.signals;
+        },
     };
 }