@angular/core 9.0.0-rc.9 → 9.0.0

package/core.d.ts

@@ -1,5 +1,5 @@
 /**
- * @license Angular v9.0.0-rc.9
+ * @license Angular v9.0.0
  * (c) 2010-2020 Google LLC. https://angular.io/
  * License: MIT
  */
@@ -2604,7 +2604,7 @@ export declare interface HostBindingDecorator {
     new (hostPropertyName?: string): any;
 }
 
-declare type HostBindingsFunction<T> = <U extends T>(rf: ɵRenderFlags, ctx: U, elementIndex: number) => void;
+declare type HostBindingsFunction<T> = <U extends T>(rf: ɵRenderFlags, ctx: U) => void;
 
 /**
  * Type of the Host decorator / constructor function.
@@ -3381,12 +3381,6 @@ declare interface InstructionState {
      * Necessary to support ChangeDetectorRef.checkNoChanges().
      */
     checkNoChangesMode: boolean;
-    /**
-     * Function to be called when the element is exited.
-     *
-     * NOTE: The function is here for tree shakable purposes since it is only needed by styling.
-     */
-    elementExitFn: (() => void) | null;
 }
 
 declare interface InternalNgModuleRef<T> extends NgModuleRef<T> {
@@ -3543,6 +3537,22 @@ export declare class IterableDiffers {
     find(iterable: any): IterableDifferFactory;
 }
 
+/**
+ * `KeyValueArray` is an array where even positions contain keys and odd positions contain values.
+ *
+ * `KeyValueArray` provides a very efficient way of iterating over its contents. For small
+ * sets (~10) the cost of binary searching an `KeyValueArray` has about the same performance
+ * characteristics that of a `Map` with significantly better memory footprint.
+ *
+ * If used as a `Map` the keys are stored in alphabetical order so that they can be binary searched
+ * for retrieval.
+ *
+ * See: `keyValueArraySet`, `keyValueArrayGet`, `keyValueArrayIndexOf`, `keyValueArrayDelete`.
+ */
+declare interface KeyValueArray<VALUE> extends Array<VALUE | string> {
+    __brand__: 'array-map';
+}
+
 /**
  * Record representing the item change information.
  *
@@ -3689,7 +3699,7 @@ declare interface LContainer extends Array<any> {
      * The host could be an LView if this container is on a component node.
      * In that case, the component LView is its HOST.
      */
-    readonly [HOST]: RElement | RComment | ɵangular_packages_core_core_bn;
+    readonly [HOST]: RElement | RComment | ɵangular_packages_core_core_bo;
     /**
      * This is a type field which allows us to differentiate `LContainer` from `StylingContext` in an
      * efficient way. The value is always set to `true`
@@ -3714,18 +3724,18 @@ declare interface LContainer extends Array<any> {
      * Access to the parent view is necessary so we can propagate back
      * up from inside a container to parent[NEXT].
      */
-    [PARENT]: ɵangular_packages_core_core_bn;
+    [PARENT]: ɵangular_packages_core_core_bo;
     /**
      * This allows us to jump from a container to a sibling container or component
      * view with the same parent, so we can remove listeners efficiently.
      */
-    [NEXT]: ɵangular_packages_core_core_bn | LContainer | null;
+    [NEXT]: ɵangular_packages_core_core_bo | LContainer | null;
     /**
      * A collection of views created based on the underlying `<ng-template>` element but inserted into
      * a different `LContainer`. We need to track views created from a given declaration point since
      * queries collect matches from the embedded view declaration point and _not_ the insertion point.
      */
-    [MOVED_VIEWS]: ɵangular_packages_core_core_bn[] | null;
+    [MOVED_VIEWS]: ɵangular_packages_core_core_bo[] | null;
     /**
      * Pointer to the `TNode` which represents the host of the container.
      */
@@ -3762,11 +3772,18 @@ declare interface LFrame {
      * An array of nodes (text, element, container, etc), pipes, their bindings, and
      * any local variables that need to be stored between invocations.
      */
-    lView: ɵangular_packages_core_core_bn;
+    lView: ɵangular_packages_core_core_bo;
+    /**
+     * Current `TView` associated with the `LFrame.lView`.
+     *
+     * One can get `TView` from `lFrame[TVIEW]` however because it is so common it makes sense to
+     * store it in `LFrame` for perf reasons.
+     */
+    tView: TView;
     /**
      * Used to set the parent property when nodes are created and track query results.
      *
-     * This is used in conjection with `isParent`.
+     * This is used in conjunction with `isParent`.
      */
     previousOrParentTNode: TNode;
     /**
@@ -3791,7 +3808,7 @@ declare interface LFrame {
      *
      * e.g. const inner = x().$implicit; const outer = x().$implicit;
      */
-    contextLView: ɵangular_packages_core_core_bn;
+    contextLView: ɵangular_packages_core_core_bo;
     /**
      * Store the element depth count. This is used to identify the root elements of the template
      * so that we can then attach patch data `LView` to only those elements. We know that those
@@ -3807,18 +3824,6 @@ declare interface LFrame {
      * Current sanitizer
      */
     currentSanitizer: StyleSanitizeFn | null;
-    /**
-     * Used when processing host bindings.
-     */
-    currentDirectiveDef: ɵDirectiveDef<any> | ɵComponentDef<any> | null;
-    /**
-     * Used as the starting directive id value.
-     *
-     * All subsequent directives are incremented from this value onwards.
-     * The reason why this value is `1` instead of `0` is because the `0`
-     * value is reserved for the template.
-     */
-    activeDirectiveId: number;
     /**
      * The root index from which pure function instructions should calculate their binding
      * indices. In component views, this is TView.bindingStartIndex. In a host binding
@@ -3830,6 +3835,12 @@ declare interface LFrame {
      * We iterate over the list of Queries and increment current query index at every step.
      */
     currentQueryIndex: number;
+    /**
+     * When host binding is executing this points to the directive index.
+     * `TView.data[currentDirectiveIndex]` is `DirectiveDef`
+     * `LView[currentDirectiveIndex]` is directive instance.
+     */
+    currentDirectiveIndex: number;
 }
 
 /**
@@ -3862,7 +3873,7 @@ export declare const LOCALE_ID: InjectionToken<string>;
  * - `<div #nativeDivEl>` - `nativeDivEl` should point to the native `<div>` element;
  * - `<ng-template #tplRef>` - `tplRef` should point to the `TemplateRef` instance;
  */
-declare type LocalRefExtractor = (tNode: TNodeWithLocalRefs, currentView: ɵangular_packages_core_core_bn) => any;
+declare type LocalRefExtractor = (tNode: TNodeWithLocalRefs, currentView: ɵangular_packages_core_core_bo) => any;
 
 /**
  * lQueries represent a collection of individual LQuery objects tracked in a given view.
@@ -6366,39 +6377,6 @@ declare const enum StyleSanitizeMode {
     ValidateAndSanitize = 3
 }
 
-/**
- * Array-based representation of a key/value array.
- *
- * The format of the array is "property", "value", "property2",
- * "value2", etc...
- *
- * The first value in the array is reserved to store the instance
- * of the key/value array that was used to populate the property/
- * value entries that take place in the remainder of the array.
- */
-declare interface StylingMapArray extends Array<{} | string | number | null | undefined> {
-    /**
-     * The last raw value used to generate the entries in the map.
-     */
-    [StylingMapArrayIndex.RawValuePosition]: {} | string | number | null | undefined;
-}
-
-/**
- * An index of position and offset points for any data stored within a `StylingMapArray` instance.
- */
-declare const enum StylingMapArrayIndex {
-    /** Where the values start in the array */
-    ValuesStartPosition = 1,
-    /** The location of the raw key/value map instance used last to populate the array entries */
-    RawValuePosition = 0,
-    /** The size of each property/value entry */
-    TupleSize = 2,
-    /** The offset for the property entry in the tuple */
-    PropOffset = 0,
-    /** The offset for the value entry in the tuple */
-    ValueOffset = 1
-}
-
 /**
  * NgModuleFactoryLoader that uses SystemJS to load NgModuleFactory
  * @publicApi
@@ -6466,7 +6444,7 @@ declare interface TContainerNode extends TNode {
      * - They are the first node of a component or embedded view
      * - They are dynamically created
      */
-    parent: ɵangular_packages_core_core_bd | TElementContainerNode | null;
+    parent: ɵangular_packages_core_core_be | TElementContainerNode | null;
     tViews: TView | TView[] | null;
     projection: null;
 }
@@ -6498,14 +6476,14 @@ declare interface TContainerNode extends TNode {
  *
  * Injector bloom filters are also stored here.
  */
-declare type TData = (TNode | ɵPipeDef<any> | ɵDirectiveDef<any> | ɵComponentDef<any> | number | Type<any> | InjectionToken<any> | TI18n | I18nUpdateOpCodes | null | string)[];
+declare type TData = (TNode | ɵPipeDef<any> | ɵDirectiveDef<any> | ɵComponentDef<any> | number | TStylingRange | TStylingKey | Type<any> | InjectionToken<any> | TI18n | I18nUpdateOpCodes | null | string)[];
 
 /** Static data for an <ng-container> */
 declare interface TElementContainerNode extends TNode {
     /** Index in the LView[] array. */
     index: number;
-    child: ɵangular_packages_core_core_bd | TTextNode | TContainerNode | TElementContainerNode | TProjectionNode | null;
-    parent: ɵangular_packages_core_core_bd | TElementContainerNode | null;
+    child: ɵangular_packages_core_core_be | TTextNode | TContainerNode | TElementContainerNode | TProjectionNode | null;
+    parent: ɵangular_packages_core_core_be | TElementContainerNode | null;
     tViews: null;
     projection: null;
 }
@@ -6799,6 +6777,23 @@ declare interface TNode {
      * Stores final exclusive index of the directives.
      */
     directiveEnd: number;
+    /**
+     * Stores the last directive which had a styling instruction.
+     *
+     * Initial value of this is `-1` which means that no `hostBindings` styling instruction has
+     * executed. As `hostBindings` instructions execute they set the value to the index of the
+     * `DirectiveDef` which contained the last `hostBindings` styling instruction.
+     *
+     * Valid values are:
+     * - `-1` No `hostBindings` instruction has executed.
+     * - `directiveStart <= directiveStylingLast < directiveEnd`: Points to the `DirectiveDef` of the
+     *   last styling instruction which executed in the `hostBindings`.
+     *
+     * This data is needed so that styling instructions know which static styling data needs to be
+     * collected from the `DirectiveDef.hostAttrs`. A styling instruction needs to collect all data
+     * since last styling instruction.
+     */
+    directiveStylingLast: number;
     /**
      * Stores indexes of property bindings. This field is only set in the ngDevMode and holds indexes
      * of property bindings so TestBed can get bound property metadata for a given node.
@@ -6832,6 +6827,18 @@ declare interface TNode {
      * namespaces, attributes extracted from bindings and outputs).
      */
     attrs: TAttributes | null;
+    /**
+     * Same as `TNode.attrs` but contains merged data across all directive host bindings.
+     *
+     * We need to keep `attrs` as unmerged so that it can be used for attribute selectors.
+     * We merge attrs here so that it can be used in a performant way for initial rendering.
+     *
+     * The `attrs` are merged in first pass in following order:
+     * - Component's `hostAttrs`
+     * - Directives' `hostAttrs`
+     * - Template `TNode.attrs` associated with the current `TNode`.
+     */
+    mergedAttrs: TAttributes | null;
     /**
      * A set of local names under which a given element is exported in a template and
      * visible to queries. An entry in this array can be created for different reasons:
@@ -6916,7 +6923,7 @@ declare interface TNode {
      *
      * If this is an inline view node (V), the parent will be its container.
      */
-    parent: ɵangular_packages_core_core_bd | TContainerNode | null;
+    parent: ɵangular_packages_core_core_be | TContainerNode | null;
     /**
      * List of projected TNodes for a given component host element OR index into the said nodes.
      *
@@ -6958,43 +6965,87 @@ declare interface TNode {
      */
     projection: (TNode | RNode[])[] | number | null;
     /**
-     * A collection of all style bindings and/or static style values for an element.
+     * A collection of all style static values for an element.
      *
      * This field will be populated if and when:
      *
      * - There are one or more initial styles on an element (e.g. `<div style="width:200px">`)
-     * - There are one or more style bindings on an element (e.g. `<div [style.width]="w">`)
+     */
+    styles: string | null;
+    /**
+     * A `KeyValueArray` version of residual `styles`.
+     *
+     * When there are styling instructions than each instruction stores the static styling
+     * which is of lower priority than itself. This means that there may be a higher priority styling
+     * than the instruction.
+     *
+     * Imagine:
+     * ```
+     * <div style="color: highest;" my-dir>
+     *
+     * @Directive({
+     *   host: {
+     *     style: 'color: lowest; ',
+     *     '[styles.color]': 'exp' // ɵɵstyleProp('color', ctx.exp);
+     *   }
+     * })
+     * ```
      *
-     * If and when there are only initial styles (no bindings) then an instance of `StylingMapArray`
-     * will be used here. Otherwise an instance of `TStylingContext` will be created when there
-     * are one or more style bindings on an element.
+     * In the above case:
+     * - `color: lowest` is stored with `ɵɵstyleProp('color', ctx.exp);` instruction
+     * -  `color: highest` is the residual and is stored here.
      *
-     * During element creation this value is likely to be populated with an instance of
-     * `StylingMapArray` and only when the bindings are evaluated (which happens during
-     * update mode) then it will be converted to a `TStylingContext` if any style bindings
-     * are encountered. If and when this happens then the existing `StylingMapArray` value
-     * will be placed into the initial styling slot in the newly created `TStylingContext`.
+     * - `undefined': not initialized.
+     * - `null`: initialized but `styles` is `null`
+     * - `KeyValueArray`: parsed version of `styles`.
      */
-    styles: StylingMapArray | TStylingContext | null;
+    residualStyles: KeyValueArray<any> | undefined | null;
     /**
-     * A collection of all class bindings and/or static class values for an element.
+     * A collection of all class static values for an element.
      *
      * This field will be populated if and when:
      *
      * - There are one or more initial classes on an element (e.g. `<div class="one two three">`)
-     * - There are one or more class bindings on an element (e.g. `<div [class.foo]="f">`)
+     */
+    classes: string | null;
+    /**
+     * A `KeyValueArray` version of residual `classes`.
+     *
+     * Same as `TNode.residualStyles` but for classes.
+     *
+     * - `undefined': not initialized.
+     * - `null`: initialized but `classes` is `null`
+     * - `KeyValueArray`: parsed version of `classes`.
+     */
+    residualClasses: KeyValueArray<any> | undefined | null;
+    /**
+     * Stores the head/tail index of the class bindings.
+     *
+     * - If no bindings, the head and tail will both be 0.
+     * - If there are template bindings, stores the head/tail of the class bindings in the template.
+     * - If no template bindings but there are host bindings, the head value will point to the last
+     *   host binding for "class" (not the head of the linked list), tail will be 0.
+     *
+     * See: `style_binding_list.ts` for details.
+     *
+     * This is used by `insertTStylingBinding` to know where the next styling binding should be
+     * inserted so that they can be sorted in priority order.
+     */
+    classBindings: TStylingRange;
+    /**
+     * Stores the head/tail index of the class bindings.
      *
-     * If and when there are only initial classes (no bindings) then an instance of `StylingMapArray`
-     * will be used here. Otherwise an instance of `TStylingContext` will be created when there
-     * are one or more class bindings on an element.
+     * - If no bindings, the head and tail will both be 0.
+     * - If there are template bindings, stores the head/tail of the style bindings in the template.
+     * - If no template bindings but there are host bindings, the head value will point to the last
+     *   host binding for "style" (not the head of the linked list), tail will be 0.
      *
-     * During element creation this value is likely to be populated with an instance of
-     * `StylingMapArray` and only when the bindings are evaluated (which happens during
-     * update mode) then it will be converted to a `TStylingContext` if any class bindings
-     * are encountered. If and when this happens then the existing `StylingMapArray` value
-     * will be placed into the initial styling slot in the newly created `TStylingContext`.
+     * See: `style_binding_list.ts` for details.
+     *
+     * This is used by `insertTStylingBinding` to know where the next styling binding should be
+     * inserted so that they can be sorted in priority order.
      */
-    classes: StylingMapArray | TStylingContext | null;
+    styleBindings: TStylingRange;
 }
 
 /**
@@ -7025,99 +7076,7 @@ declare const enum TNodeFlags {
      * This flags allows us to guard host-binding logic and invoke it only on nodes
      * that actually have directives with host bindings.
      */
-    hasHostBindings = 128,
-    /** Bit #9 - This bit is set if the node has initial styling */
-    hasInitialStyling = 256,
-    /**
-     * Bit #10 - Whether or not there are class-based map bindings present.
-     *
-     * Examples include:
-     * 1. `<div [class]="x">`
-     * 2. `@HostBinding('class') x`
-     */
-    hasClassMapBindings = 512,
-    /**
-     * Bit #11 - Whether or not there are any class-based prop bindings present.
-     *
-     * Examples include:
-     * 1. `<div [class.name]="x">`
-     * 2. `@HostBinding('class.name') x`
-     */
-    hasClassPropBindings = 1024,
-    /**
-     * Bit #12 - whether or not there are any active [class] and [class.name] bindings
-     */
-    hasClassPropAndMapBindings = 1536,
-    /**
-     * Bit #13 - Whether or not the context contains one or more class-based template bindings.
-     *
-     * Examples include:
-     * 1. `<div [class]="x">`
-     * 2. `<div [class.name]="x">`
-     */
-    hasTemplateClassBindings = 2048,
-    /**
-     * Bit #14 - Whether or not the context contains one or more class-based host bindings.
-     *
-     * Examples include:
-     * 1. `@HostBinding('class') x`
-     * 2. `@HostBinding('class.name') x`
-     */
-    hasHostClassBindings = 4096,
-    /**
-     * Bit #15 - Whether or not there are two or more sources for a class property in the context.
-     *
-     * Examples include:
-     * 1. prop + prop: `<div [class.active]="x" dir-that-sets-active-class>`
-     * 2. map + prop: `<div [class]="x" [class.foo]>`
-     * 3. map + map: `<div [class]="x" dir-that-sets-class>`
-     */
-    hasDuplicateClassBindings = 8192,
-    /**
-     * Bit #16 - Whether or not there are style-based map bindings present.
-     *
-     * Examples include:
-     * 1. `<div [style]="x">`
-     * 2. `@HostBinding('style') x`
-     */
-    hasStyleMapBindings = 16384,
-    /**
-     * Bit #17 - Whether or not there are any style-based prop bindings present.
-     *
-     * Examples include:
-     * 1. `<div [style.prop]="x">`
-     * 2. `@HostBinding('style.prop') x`
-     */
-    hasStylePropBindings = 32768,
-    /**
-     * Bit #18 - whether or not there are any active [style] and [style.prop] bindings
-     */
-    hasStylePropAndMapBindings = 49152,
-    /**
-     * Bit #19 - Whether or not the context contains one or more style-based template bindings.
-     *
-     * Examples include:
-     * 1. `<div [style]="x">`
-     * 2. `<div [style.prop]="x">`
-     */
-    hasTemplateStyleBindings = 65536,
-    /**
-     * Bit #20 - Whether or not the context contains one or more style-based host bindings.
-     *
-     * Examples include:
-     * 1. `@HostBinding('style') x`
-     * 2. `@HostBinding('style.prop') x`
-     */
-    hasHostStyleBindings = 131072,
-    /**
-     * Bit #21 - Whether or not there are two or more sources for a style property in the context.
-     *
-     * Examples include:
-     * 1. prop + prop: `<div [style.width]="x" dir-that-sets-width>`
-     * 2. map + prop: `<div [style]="x" [style.prop]>`
-     * 3. map + map: `<div [style]="x" dir-that-sets-style>`
-     */
-    hasDuplicateStyleBindings = 262144
+    hasHostBindings = 128
 }
 
 /**
@@ -7165,7 +7124,7 @@ declare const enum TNodeType {
 /**
  * Type representing a set of TNodes that can have local refs (`#foo`) placed on them.
  */
-declare type TNodeWithLocalRefs = TContainerNode | ɵangular_packages_core_core_bd | TElementContainerNode;
+declare type TNodeWithLocalRefs = TContainerNode | ɵangular_packages_core_core_be | TElementContainerNode;
 
 /** Static data for an LProjectionNode  */
 declare interface TProjectionNode extends TNode {
@@ -7176,7 +7135,7 @@ declare interface TProjectionNode extends TNode {
      * or embedded view (which means their parent is in a different view and must be
      * retrieved using LView.node).
      */
-    parent: ɵangular_packages_core_core_bd | TElementContainerNode | null;
+    parent: ɵangular_packages_core_core_be | TElementContainerNode | null;
     tViews: null;
     /** Index of the projection node. (See TNode.projection for more info.) */
     projection: number;
@@ -7371,334 +7330,117 @@ export declare const TRANSLATIONS: InjectionToken<string>;
 export declare const TRANSLATIONS_FORMAT: InjectionToken<string>;
 
 /**
- * --------
- *
- * This file contains the core interfaces for styling in Angular.
+ * Value stored in the `TData` which is needed to re-concatenate the styling.
  *
- * To learn more about the algorithm see `TStylingContext`.
+ * See: `TStylingKeyPrimitive` and `TStylingStatic`
+ */
+declare type TStylingKey = TStylingKeyPrimitive | TStylingStatic;
+
+/**
+ * The primitive portion (`TStylingStatic` removed) of the value stored in the `TData` which is
+ * needed to re-concatenate the styling.
  *
- * --------
+ * - `string`: Stores the property name. Used with `ɵɵstyleProp`/`ɵɵclassProp` instruction.
+ * - `null`: Represents map, so there is no name. Used with `ɵɵstyleMap`/`ɵɵclassMap`.
+ * - `false`: Represents an ignore case. This happens when `ɵɵstyleProp`/`ɵɵclassProp` instruction
+ *   is combined with directive which shadows its input `@Input('class')`. That way the binding
+ *   should not participate in the styling resolution.
  */
+declare type TStylingKeyPrimitive = string | null | false;
+
 /**
- * A static-level representation of all style or class bindings/values
- * associated with a `TNode`.
+ * This is a branded number which contains previous and next index.
  *
- * The `TStylingContext` unites all template styling bindings (i.e.
- * `[class]` and `[style]` bindings) as well as all host-level
- * styling bindings (for components and directives) together into
- * a single manifest
+ * When we come across styling instructions we need to store the `TStylingKey` in the correct
+ * order so that we can re-concatenate the styling value in the desired priority.
  *
- * The styling context is stored on a `TNode` on and there are
- * two instances of it: one for classes and another for styles.
+ * The insertion can happen either at the:
+ * - end of template as in the case of coming across additional styling instruction in the template
+ * - in front of the template in the case of coming across additional instruction in the
+ *   `hostBindings`.
  *
- * ```typescript
- * tNode.styles = [ ... a context only for styles ... ];
- * tNode.classes = [ ... a context only for classes ... ];
- * ```
+ * We use `TStylingRange` to store the previous and next index into the `TData` where the template
+ * bindings can be found.
  *
- * The styling context is created each time there are one or more
- * styling bindings (style or class bindings) present for an element,
- * but is only created once per `TNode`.
+ * - bit 0 is used to mark that the previous index has a duplicate for current value.
+ * - bit 1 is used to mark that the next index has a duplicate for the current value.
+ * - bits 2-16 are used to encode the next/tail of the template.
+ * - bits 17-32 are used to encode the previous/head of template.
  *
- * `tNode.styles` and `tNode.classes` can be an instance of the following:
+ * NODE: *duplicate* false implies that it is statically known that this binding will not collide
+ * with other bindings and therefore there is no need to check other bindings. For example the
+ * bindings in `<div [style.color]="exp" [style.width]="exp">` will never collide and will have
+ * their bits set accordingly. Previous duplicate means that we may need to check previous if the
+ * current binding is `null`. Next duplicate means that we may need to check next bindings if the
+ * current binding is not `null`.
  *
- * ```typescript
- * tNode.styles = null; // no static styling or styling bindings active
- * tNode.styles = StylingMapArray; // only static values present (e.g. `<div style="width:200">`)
- * tNode.styles = TStylingContext; // one or more styling bindings present (e.g. `<div
- * [style.width]>`)
- * ```
- *
- * Both `tNode.styles` and `tNode.classes` are instantiated when anything
- * styling-related is active on an element. They are first created from
- * from the any of the element-level instructions (e.g. `element`,
- * `elementStart`, `elementHostAttrs`). When any static style/class
- * values are encountered they are registered on the `tNode.styles`
- * and `tNode.classes` data-structures. By default (when any static
- * values are encountered) the `tNode.styles` or `tNode.classes` values
- * are instances of a `StylingMapArray`. Only when style/class bindings
- * are detected then that styling map is converted into an instance of
- * `TStylingContext`.
- *
- * Due to the fact the the `TStylingContext` is stored on a `TNode`
- * this means that all data within the context is static. Instead of
- * storing actual styling binding values, the lView binding index values
- * are stored within the context. (static nature means it is more compact.)
- *
- * The code below shows a breakdown of two instances of `TStylingContext`
- * (one for `tNode.styles` and another for `tNode.classes`):
+ * NOTE: `0` has special significance and represents `null` as in no additional pointer.
+ */
+declare interface TStylingRange {
+    __brand__: 'TStylingRange';
+}
+
+/**
+ * Store the static values for the styling binding.
  *
- * ```typescript
- * // <div [class.active]="c"  // lView binding index = 20
- * //      [style.width]="x"   // lView binding index = 21
- * //      [style.height]="y"> // lView binding index = 22
- * //  ...
- * // </div>
- * tNode.styles = [
- *   1,         // the total amount of sources present (only `1` b/c there are only template
- * bindings)
- *   [null],    // initial values array (an instance of `StylingMapArray`)
- *
- *   0,         // config entry for the property (see `TStylingContextPropConfigFlags`)
- *   0b010,     // template guard mask for height
- *   0,         // host bindings guard mask for height
- *   'height',  // the property name
- *   22,        // the binding location for the "y" binding in the lView
- *   null,      // the default value for height
- *
- *   0,         // config entry for the property (see `TStylingContextPropConfigFlags`)
- *   0b001,     // template guard mask for width
- *   0,         // host bindings guard mask for width
- *   'width',   // the property name
- *   21,        // the binding location for the "x" binding in the lView
- *   null,      // the default value for width
- * ];
+ * The `TStylingStatic` is just `KeyValueArray` where key `""` (stored at location 0) contains the
+ * `TStylingKey` (stored at location 1). In other words this wraps the `TStylingKey` such that the
+ * `""` contains the wrapped value.
  *
- * tNode.classes = [
- *   0,         // the context config value (see `TStylingContextConfig`)
- *   1,         // the total amount of sources present (only `1` b/c there are only template
- * bindings)
- *   [null],    // initial values array (an instance of `StylingMapArray`)
- *
- *   0,         // config entry for the property (see `TStylingContextPropConfigFlags`)
- *   0b001,     // template guard mask for width
- *   0,         // host bindings guard mask for width
- *   'active',  // the property name
- *   20,        // the binding location for the "c" binding in the lView
- *   null,      // the default value for the `active` class
- * ];
- * ```
+ * When instructions are resolving styling they may need to look forward or backwards in the linked
+ * list to resolve the value. For this reason we have to make sure that he linked list also contains
+ * the static values. However the list only has space for one item per styling instruction. For this
+ * reason we store the static values here as part of the `TStylingKey`. This means that the
+ * resolution function when looking for a value needs to first look at the binding value, and than
+ * at `TStylingKey` (if it exists).
  *
- * Entry value present in an entry (called a tuple) within the
- * styling context is as follows:
+ * Imagine we have:
  *
- * ```typescript
- * context = [
- *   //...
- *   configValue,
- *   templateGuardMask,
- *   hostBindingsGuardMask,
- *   propName,
- *   ...bindingIndices...,
- *   defaultValue
- *   //...
- * ];
  * ```
+ * <div class="TEMPLATE" my-dir>
  *
- * Below is a breakdown of each value:
- *
- * - **configValue**:
- *   Property-specific configuration values. The only config setting
- *   that is implemented right now is whether or not to sanitize the
- *   value.
- *
- * - **templateGuardMask**:
- *   A numeric value where each bit represents a binding index
- *   location. Each binding index location is assigned based on
- *   a local counter value that increments each time an instruction
- *   is called:
- *
- * ```
- * <div [style.width]="x"   // binding index = 21 (counter index = 0)
- *      [style.height]="y"> // binding index = 22 (counter index = 1)
- * ```
- *
- *   In the example code above, if the `width` value where to change
- *   then the first bit in the local bit mask value would be flipped
- *   (and the second bit for when `height`).
- *
- *   If and when there are more than 32 binding sources in the context
- *   (more than 32 `[style/class]` bindings) then the bit masking will
- *   overflow and we are left with a situation where a `-1` value will
- *   represent the bit mask. Due to the way that JavaScript handles
- *   negative values, when the bit mask is `-1` then all bits within
- *   that value will be automatically flipped (this is a quick and
- *   efficient way to flip all bits on the mask when a special kind
- *   of caching scenario occurs or when there are more than 32 bindings).
- *
- * - **hostBindingsGuardMask**:
- *   Another instance of a guard mask that is specific to host bindings.
- *   This behaves exactly the same way as does the `templateGuardMask`,
- *   but will not contain any binding information processed in the template.
- *   The reason why there are two instances of guard masks (one for the
- *   template and another for host bindings) is because the template bindings
- *   are processed before host bindings and the state information is not
- *   carried over into the host bindings code. As soon as host bindings are
- *   processed for an element the counter and state-based bit mask values are
- *   set to `0`.
- *
- * ```
- * <div [style.width]="x"   // binding index = 21 (counter index = 0)
- *      [style.height]="y"  // binding index = 22 (counter index = 1)
- *      dir-that-sets-width  // binding index = 30 (counter index = 0)
- *      dir-that-sets-width> // binding index = 31 (counter index = 1)
- * ```
- *
- * - **propName**:
- *   The CSS property name or class name (e.g `width` or `active`).
- *
- * - **bindingIndices...**:
- *   A series of numeric binding values that reflect where in the
- *   lView to find the style/class values associated with the property.
- *   Each value is in order in terms of priority (templates are first,
- *   then directives and then components). When the context is flushed
- *   and the style/class values are applied to the element (this happens
- *   inside of the `stylingApply` instruction) then the flushing code
- *   will keep checking each binding index against the associated lView
- *   to find the first style/class value that is non-null.
- *
- * - **defaultValue**:
- *   This is the default that will always be applied to the element if
- *   and when all other binding sources return a result that is null.
- *   Usually this value is `null` but it can also be a static value that
- *   is intercepted when the tNode is first constructured (e.g.
- *   `<div style="width:200px">` has a default value of `200px` for
- *   the `width` property).
- *
- * Each time a new binding is encountered it is registered into the
- * context. The context then is continually updated until the first
- * styling apply call has been called (which is automatically scheduled
- * to be called once an element exits during change detection). Note that
- * each entry in the context is stored in alphabetical order.
- *
- * Once styling has been flushed for the first time for an element the
- * context will set as locked (this prevents bindings from being added
- * to the context later on).
- *
- * # How Styles/Classes are Rendered
- * Each time a styling instruction (e.g. `[class.name]`, `[style.prop]`,
- * etc...) is executed, the associated `lView` for the view is updated
- * at the current binding location. Also, when this happens, a local
- * counter value is incremented. If the binding value has changed then
- * a local `bitMask` variable is updated with the specific bit based
- * on the counter value.
- *
- * Below is a lightweight example of what happens when a single style
- * property is updated (i.e. `<div [style.prop]="val">`):
- *
- * ```typescript
- * function updateStyleProp(prop: string, value: string) {
- *   const lView = getLView();
- *   const bindingIndex = BINDING_INDEX++;
- *
- *   // update the local counter value
- *   const indexForStyle = stylingState.stylesCount++;
- *   if (lView[bindingIndex] !== value) {
- *     lView[bindingIndex] = value;
- *
- *     // tell the local state that we have updated a style value
- *     // by updating the bit mask
- *     stylingState.bitMaskForStyles |= 1 << indexForStyle;
+ * @Directive({
+ *   host: {
+ *     class: 'DIR',
+ *     '[class.dynamic]': 'exp' // ɵɵclassProp('dynamic', ctx.exp);
  *   }
- * }
+ * })
  * ```
  *
- * Once all the bindings have updated a `bitMask` value will be populated.
- * This `bitMask` value is used in the apply algorithm (which is called
- * context resolution).
- *
- * ## The Apply Algorithm (Context Resolution)
- * As explained above, each time a binding updates its value, the resulting
- * value is stored in the `lView` array. These styling values have yet to
- * be flushed to the element.
+ * In the above case the linked list will contain one item:
  *
- * Once all the styling instructions have been evaluated, then the styling
- * context(s) are flushed to the element. When this happens, the context will
- * be iterated over (property by property) and each binding source will be
- * examined and the first non-null value will be applied to the element.
- *
- * Let's say that we the following template code:
- *
- * ```html
- * <div [style.width]="w1" dir-that-set-width="w2"></div>
  * ```
+ *   // assume binding location: 10 for `ɵɵclassProp('dynamic', ctx.exp);`
+ *   tData[10] = <TStylingStatic>[
+ *     '': 'dynamic', // This is the wrapped value of `TStylingKey`
+ *     'DIR': true,   // This is the default static value of directive binding.
+ *   ];
+ *   tData[10 + 1] = 0; // We don't have prev/next.
  *
- * There are two styling bindings in the code above and they both write
- * to the `width` property. When styling is flushed on the element, the
- * algorithm will try and figure out which one of these values to write
- * to the element.
- *
- * In order to figure out which value to apply, the following
- * binding prioritization is adhered to:
- *
- *   1. First template-level styling bindings are applied (if present).
- *      This includes things like `[style.width]` and `[class.active]`.
- *
- *   2. Second are styling-level host bindings present in directives.
- *      (if there are sub/super directives present then the sub directives
- *      are applied first).
- *
- *   3. Third are styling-level host bindings present in components.
- *      (if there are sub/super components present then the sub directives
- *      are applied first).
- *
- * This means that in the code above the styling binding present in the
- * template is applied first and, only if its falsy, then the directive
- * styling binding for width will be applied.
- *
- * ### What about map-based styling bindings?
- * Map-based styling bindings are activated when there are one or more
- * `[style]` and/or `[class]` bindings present on an element. When this
- * code is activated, the apply algorithm will iterate over each map
- * entry and apply each styling value to the element with the same
- * prioritization rules as above.
- *
- * For the algorithm to apply styling values efficiently, the
- * styling map entries must be applied in sync (property by property)
- * with prop-based bindings. (The map-based algorithm is described
- * more inside of the `render3/styling/map_based_bindings.ts` file.)
- *
- * ## Sanitization
- * Sanitization is used to prevent invalid style values from being applied to
- * the element.
- *
- * It is enabled in two cases:
- *
- *   1. The `styleSanitizer(sanitizerFn)` instruction was called (just before any other
- *      styling instructions are run).
- *
- *   2. The component/directive `LView` instance has a sanitizer object attached to it
- *      (this happens when `renderComponent` is executed with a `sanitizer` value or
- *      if the ngModule contains a sanitizer provider attached to it).
- *
- * If and when sanitization is active then all property/value entries will be evaluated
- * through the active sanitizer before they are applied to the element (or the styling
- * debug handler).
- *
- * If a `Sanitizer` object is used (via the `LView[SANITIZER]` value) then that object
- * will be used for every property.
- *
- * If a `StyleSanitizerFn` function is used (via the `styleSanitizer`) then it will be
- * called in two ways:
+ *   lView[10] = undefined;     // assume `ctx.exp` is `undefined`
+ *   lView[10 + 1] = undefined; // Just normalized `lView[10]`
+ * ```
  *
- *   1. property validation mode: this will be called early to mark whether a property
- *      should be sanitized or not at during the flushing stage.
+ * So when the function is resolving styling value, it first needs to look into the linked list
+ * (there is none) and than into the static `TStylingStatic` too see if there is a default value for
+ * `dynamic` (there is not). Therefore it is safe to remove it.
  *
- *   2. value sanitization mode: this will be called during the flushing stage and will
- *      run the sanitizer function against the value before applying it to the element.
+ * If setting `true` case:
+ * ```
+ *   lView[10] = true;     // assume `ctx.exp` is `true`
+ *   lView[10 + 1] = true; // Just normalized `lView[10]`
+ * ```
+ * So when the function is resolving styling value, it first needs to look into the linked list
+ * (there is none) and than into `TNode.residualClass` (TNode.residualStyle) which contains
+ * ```
+ *   tNode.residualClass = [
+ *     'TEMPLATE': true,
+ *   ];
+ * ```
  *
- * If sanitization returns an empty value then that empty value will be applied
- * to the element.
- */
-declare interface TStylingContext extends Array<number | string | number | boolean | null | StylingMapArray | {}> {
-    /** The total amount of sources present in the context */
-    [TStylingContextIndex.TotalSourcesPosition]: number;
-    /** Initial value position for static styles */
-    [TStylingContextIndex.InitialStylingValuePosition]: StylingMapArray;
-}
-
-/**
- * An index of position and offset values used to navigate the `TStylingContext`.
+ * This means that it is safe to add class.
  */
-declare const enum TStylingContextIndex {
-    TotalSourcesPosition = 0,
-    InitialStylingValuePosition = 1,
-    ValuesStartPosition = 2,
-    ConfigOffset = 0,
-    TemplateBitGuardOffset = 1,
-    HostBindingsBitGuardOffset = 2,
-    PropOffset = 3,
-    BindingsStartOffset = 4
+declare interface TStylingStatic extends KeyValueArray<any> {
 }
 
 /** Static data for a text node */
@@ -7711,7 +7453,7 @@ declare interface TTextNode extends TNode {
      * embedded view (which means their parent is in a different view and must be
      * retrieved using LView.node).
      */
-    parent: ɵangular_packages_core_core_bd | TElementContainerNode | null;
+    parent: ɵangular_packages_core_core_be | TElementContainerNode | null;
     tViews: null;
     projection: null;
 }
@@ -7741,7 +7483,7 @@ declare interface TView {
      * This is a blueprint used to generate LView instances for this TView. Copying this
      * blueprint is faster than creating a new LView from scratch.
      */
-    blueprint: ɵangular_packages_core_core_bn;
+    blueprint: ɵangular_packages_core_core_bo;
     /**
      * The template function used to refresh the view of dynamically created views
      * and components. Will be null for inline views.
@@ -7766,10 +7508,20 @@ declare interface TView {
      * different host TNodes, depending on where the component is being used. These host
      * TNodes cannot be shared (due to different indices, etc).
      */
-    node: TViewNode | ɵangular_packages_core_core_bd | null;
+    node: TViewNode | ɵangular_packages_core_core_be | null;
     /** Whether or not this template has been processed in creation mode. */
     firstCreatePass: boolean;
-    /** Whether or not the first update for this template has been processed. */
+    /**
+     *  Whether or not this template has been processed in update mode (e.g. change detected)
+     *
+     * `firstUpdatePass` is used by styling to set up `TData` to contain metadata about the styling
+     * instructions. (Mainly to build up a linked list of styling priority order.)
+     *
+     * Typically this function gets cleared after first execution. If exception is thrown then this
+     * flag can remain turned un until there is first successful (no exception) pass. This means that
+     * individual styling instructions keep track of if they have already been added to the linked
+     * list to prevent double adding.
+     */
     firstUpdatePass: boolean;
     /** Static data equivalent of LView.data[]. Contains TNodes, PipeDefInternal or TI18n. */
     data: TData;
@@ -7952,7 +7704,7 @@ declare interface TView {
 declare interface TViewNode extends TNode {
     /** If -1, it's a dynamically created view. Otherwise, it is the view block ID. */
     index: number;
-    child: ɵangular_packages_core_core_bd | TTextNode | TElementContainerNode | TContainerNode | TProjectionNode | null;
+    child: ɵangular_packages_core_core_be | TTextNode | TElementContainerNode | TContainerNode | TProjectionNode | null;
     parent: TContainerNode | null;
     tViews: null;
     projection: null;
@@ -8479,14 +8231,14 @@ declare class ViewRef_2<T> implements EmbeddedViewRef<T>, InternalViewRef, viewE
      *
      * @internal
      */
-    _lView: ɵangular_packages_core_core_bn, 
+    _lView: ɵangular_packages_core_core_bo, 
     /**
      * This represents the `LView` associated with the point where `ChangeDetectorRef` was
      * requested.
      *
      * This may be different from `_lView` if the `_cdRefInjectingView` is an embedded view.
      */
-    _cdRefInjectingView?: ɵangular_packages_core_core_bn | undefined);
+    _cdRefInjectingView?: ɵangular_packages_core_core_bo | undefined);
     get context(): T;
     get destroyed(): boolean;
     destroy(): void;
@@ -8770,23 +8522,28 @@ export declare function ɵangular_packages_core_core_b<T>(token: Type<T> | Injec
 
 export declare function ɵangular_packages_core_core_b<T>(token: Type<T> | InjectionToken<T>, flags?: InjectFlags): T | null;
 
-export declare function ɵangular_packages_core_core_ba(): TNode;
+/**
+ * Return the current `LView`.
+ */
+export declare function ɵangular_packages_core_core_ba(): ɵangular_packages_core_core_bo;
+
+export declare function ɵangular_packages_core_core_bb(): TNode;
 
-export declare function ɵangular_packages_core_core_bb(): number;
+export declare function ɵangular_packages_core_core_bc(): number;
 
-export declare function ɵangular_packages_core_core_bc<T = any>(level: number): T;
+export declare function ɵangular_packages_core_core_bd<T = any>(level: number): T;
 
 /** Static data for an element  */
-export declare interface ɵangular_packages_core_core_bd extends TNode {
+export declare interface ɵangular_packages_core_core_be extends TNode {
     /** Index in the data[] array */
     index: number;
-    child: ɵangular_packages_core_core_bd | TTextNode | TElementContainerNode | TContainerNode | TProjectionNode | null;
+    child: ɵangular_packages_core_core_be | TTextNode | TElementContainerNode | TContainerNode | TProjectionNode | null;
     /**
      * Element nodes will have parents unless they are the first node of a component or
      * embedded view (which means their parent is in a different view and must be
      * retrieved using viewData[HOST_NODE]).
      */
-    parent: ɵangular_packages_core_core_bd | TElementContainerNode | null;
+    parent: ɵangular_packages_core_core_be | TElementContainerNode | null;
     tViews: null;
     /**
      * If this is a component TNode with projection, this will be an array of projected
@@ -8808,7 +8565,7 @@ export declare interface ɵangular_packages_core_core_bd extends TNode {
  * @param thisArg Optional calling context of pureFn
  * @returns Updated or cached value
  */
-export declare function ɵangular_packages_core_core_be(lView: ɵangular_packages_core_core_bn, bindingRoot: number, slotOffset: number, pureFn: (v: any) => any, exp: any, thisArg?: any): any;
+export declare function ɵangular_packages_core_core_bf(lView: ɵangular_packages_core_core_bo, bindingRoot: number, slotOffset: number, pureFn: (v: any) => any, exp: any, thisArg?: any): any;
 
 /**
  * If the value of any provided exp has changed, calls the pure function to return
@@ -8823,7 +8580,7 @@ export declare function ɵangular_packages_core_core_be(lView: ɵangular_package
  * @param thisArg Optional calling context of pureFn
  * @returns Updated or cached value
  */
-export declare function ɵangular_packages_core_core_bf(lView: ɵangular_packages_core_core_bn, bindingRoot: number, slotOffset: number, pureFn: (v1: any, v2: any) => any, exp1: any, exp2: any, thisArg?: any): any;
+export declare function ɵangular_packages_core_core_bg(lView: ɵangular_packages_core_core_bo, bindingRoot: number, slotOffset: number, pureFn: (v1: any, v2: any) => any, exp1: any, exp2: any, thisArg?: any): any;
 
 /**
  * If the value of any provided exp has changed, calls the pure function to return
@@ -8839,7 +8596,7 @@ export declare function ɵangular_packages_core_core_bf(lView: ɵangular_package
  * @param thisArg Optional calling context of pureFn
  * @returns Updated or cached value
  */
-export declare function ɵangular_packages_core_core_bg(lView: ɵangular_packages_core_core_bn, bindingRoot: number, slotOffset: number, pureFn: (v1: any, v2: any, v3: any) => any, exp1: any, exp2: any, exp3: any, thisArg?: any): any;
+export declare function ɵangular_packages_core_core_bh(lView: ɵangular_packages_core_core_bo, bindingRoot: number, slotOffset: number, pureFn: (v1: any, v2: any, v3: any) => any, exp1: any, exp2: any, exp3: any, thisArg?: any): any;
 
 /**
  * If the value of any provided exp has changed, calls the pure function to return
@@ -8857,7 +8614,7 @@ export declare function ɵangular_packages_core_core_bg(lView: ɵangular_package
  * @returns Updated or cached value
  *
  */
-export declare function ɵangular_packages_core_core_bh(lView: ɵangular_packages_core_core_bn, bindingRoot: number, slotOffset: number, pureFn: (v1: any, v2: any, v3: any, v4: any) => any, exp1: any, exp2: any, exp3: any, exp4: any, thisArg?: any): any;
+export declare function ɵangular_packages_core_core_bi(lView: ɵangular_packages_core_core_bo, bindingRoot: number, slotOffset: number, pureFn: (v1: any, v2: any, v3: any, v4: any) => any, exp1: any, exp2: any, exp3: any, exp4: any, thisArg?: any): any;
 
 /**
  * pureFunction instruction that can support any number of bindings.
@@ -8874,7 +8631,7 @@ export declare function ɵangular_packages_core_core_bh(lView: ɵangular_package
  * @param thisArg Optional calling context of pureFn
  * @returns Updated or cached value
  */
-export declare function ɵangular_packages_core_core_bi(lView: ɵangular_packages_core_core_bn, bindingRoot: number, slotOffset: number, pureFn: (...v: any[]) => any, exps: any[], thisArg?: any): any;
+export declare function ɵangular_packages_core_core_bj(lView: ɵangular_packages_core_core_bo, bindingRoot: number, slotOffset: number, pureFn: (...v: any[]) => any, exps: any[], thisArg?: any): any;
 
 /**
  * Detects which sanitizer to use for URL property, based on tag name and prop name.
@@ -8883,14 +8640,14 @@ export declare function ɵangular_packages_core_core_bi(lView: ɵangular_package
  * `packages/compiler/src/schema/dom_security_schema.ts`.
  * If tag and prop names don't match Resource URL schema, use URL sanitizer.
  */
-export declare function ɵangular_packages_core_core_bj(tag: string, prop: string): typeof ɵɵsanitizeResourceUrl;
+export declare function ɵangular_packages_core_core_bk(tag: string, prop: string): typeof ɵɵsanitizeResourceUrl;
 
-export declare function ɵangular_packages_core_core_bk(name: string, props?: (...args: any[]) => any, parentClass?: any): any;
+export declare function ɵangular_packages_core_core_bl(name: string, props?: (...args: any[]) => any, parentClass?: any): any;
 
-export declare function ɵangular_packages_core_core_bl(name: string, props?: (...args: any[]) => any, parentClass?: any, additionalProcessing?: (target: any, name: string, ...args: any[]) => void): any;
+export declare function ɵangular_packages_core_core_bm(name: string, props?: (...args: any[]) => any, parentClass?: any, additionalProcessing?: (target: any, name: string, ...args: any[]) => void): any;
 
 
-export declare function ɵangular_packages_core_core_bm<T>(objWithPropertyToExtract: T): string;
+export declare function ɵangular_packages_core_core_bn<T>(objWithPropertyToExtract: T): string;
 
 /**
  * `LView` stores all of the information needed to process the instructions as
@@ -8902,7 +8659,7 @@ export declare function ɵangular_packages_core_core_bm<T>(objWithPropertyToExtr
  * Keeping separate state for each view facilities view insertion / deletion, so we
  * don't have to edit the data array based on which views are present.
  */
-export declare interface ɵangular_packages_core_core_bn extends Array<any> {
+export declare interface ɵangular_packages_core_core_bo extends Array<any> {
     /**
      * The host node for this LView instance, if this is a component view.
      * If this is an embedded view, HOST will be null.
@@ -8925,7 +8682,7 @@ export declare interface ɵangular_packages_core_core_bn extends Array<any> {
      *
      * `LContainer` - The current view is part of a container, and is an embedded view.
      */
-    [PARENT]: ɵangular_packages_core_core_bn | LContainer | null;
+    [PARENT]: ɵangular_packages_core_core_bo | LContainer | null;
     /**
      *
      * The next sibling LView or LContainer.
@@ -8935,7 +8692,7 @@ export declare interface ɵangular_packages_core_core_bn extends Array<any> {
      * views in the same container. We need a way to link component views and views
      * across containers as well.
      */
-    [NEXT]: ɵangular_packages_core_core_bn | LContainer | null;
+    [NEXT]: ɵangular_packages_core_core_bo | LContainer | null;
     /** Queries active for this view - nodes from a view are reported to those queries. */
     [QUERIES]: LQueries | null;
     /**
@@ -8948,7 +8705,7 @@ export declare interface ɵangular_packages_core_core_bn extends Array<any> {
      *
      * If null, this is the root view of an application (root component is in this view).
      */
-    [T_HOST]: TViewNode | ɵangular_packages_core_core_bd | null;
+    [T_HOST]: TViewNode | ɵangular_packages_core_core_be | null;
     /**
      * When a view is destroyed, listeners need to be released and outputs need to be
      * unsubscribed. This context array stores both listener functions wrapped with
@@ -8981,14 +8738,14 @@ export declare interface ɵangular_packages_core_core_bn extends Array<any> {
      * Necessary to store this so views can traverse through their nested views
      * to remove listeners and call onDestroy callbacks.
      */
-    [CHILD_HEAD]: ɵangular_packages_core_core_bn | LContainer | null;
+    [CHILD_HEAD]: ɵangular_packages_core_core_bo | LContainer | null;
     /**
      * The last LView or LContainer beneath this LView in the hierarchy.
      *
      * The tail allows us to quickly add a new state to the end of the view list
      * without having to propagate starting from the first child.
      */
-    [CHILD_TAIL]: ɵangular_packages_core_core_bn | LContainer | null;
+    [CHILD_TAIL]: ɵangular_packages_core_core_bo | LContainer | null;
     /**
      * View where this view's template was declared.
      *
@@ -9013,7 +8770,7 @@ export declare interface ɵangular_packages_core_core_bn extends Array<any> {
      * template function during change detection, we need the declaration view to get inherited
      * context.
      */
-    [DECLARATION_VIEW]: ɵangular_packages_core_core_bn | null;
+    [DECLARATION_VIEW]: ɵangular_packages_core_core_bo | null;
     /**
      * Points to the declaration component view, used to track transplanted `LView`s.
      *
@@ -9083,7 +8840,7 @@ export declare interface ɵangular_packages_core_core_bn extends Array<any> {
      *   - `LView[DECLARATION_LCONTAINER]` similar problem for queries
      *   - `LContainer[MOVED_VIEWS]` similar problem for queries
      */
-    [DECLARATION_COMPONENT_VIEW]: ɵangular_packages_core_core_bn;
+    [DECLARATION_COMPONENT_VIEW]: ɵangular_packages_core_core_bo;
     /**
      * A declaration point of embedded views (ones instantiated based on the content of a
      * <ng-template>), null for other types of views.
@@ -9109,7 +8866,7 @@ export declare interface ɵangular_packages_core_core_bn extends Array<any> {
  * to something which is retained otherwise the call to `noSideEffects` will be removed by closure
  * compiler.
  */
-export declare function ɵangular_packages_core_core_bo(fn: () => void): string;
+export declare function ɵangular_packages_core_core_bp(fn: () => void): string;
 
 /**
  * Returns the `RootContext` instance that is associated with
@@ -9118,7 +8875,7 @@ export declare function ɵangular_packages_core_core_bo(fn: () => void): string;
  *
  * @param viewOrComponent the `LView` or component to get the root context for.
  */
-export declare function ɵangular_packages_core_core_bp(viewOrComponent: ɵangular_packages_core_core_bn | {}): RootContext;
+export declare function ɵangular_packages_core_core_bq(viewOrComponent: ɵangular_packages_core_core_bo | {}): RootContext;
 
 export declare class ɵangular_packages_core_core_c implements Injector {
     get(token: any, notFoundValue?: any): any;
@@ -9176,7 +8933,7 @@ export declare function ɵangular_packages_core_core_g(): string;
  * @param view The view to which the node belongs
  * @returns The ElementRef instance to use
  */
-export declare function ɵangular_packages_core_core_h(ElementRefToken: typeof ElementRef, tNode: TNode, view: ɵangular_packages_core_core_bn): ElementRef;
+export declare function ɵangular_packages_core_core_h(ElementRefToken: typeof ElementRef, tNode: TNode, view: ɵangular_packages_core_core_bo): ElementRef;
 
 /**
  * Creates a TemplateRef and stores it on the injector.
@@ -9187,7 +8944,7 @@ export declare function ɵangular_packages_core_core_h(ElementRefToken: typeof E
  * @param hostView The view to which the node belongs
  * @returns The TemplateRef instance or null if we can't create a TemplateRef on a given node type
  */
-export declare function ɵangular_packages_core_core_i<T>(TemplateRefToken: typeof TemplateRef, ElementRefToken: typeof ElementRef, hostTNode: TNode, hostView: ɵangular_packages_core_core_bn): TemplateRef<T> | null;
+export declare function ɵangular_packages_core_core_i<T>(TemplateRefToken: typeof TemplateRef, ElementRefToken: typeof ElementRef, hostTNode: TNode, hostView: ɵangular_packages_core_core_bo): TemplateRef<T> | null;
 
 export declare function ɵangular_packages_core_core_j(id: string): NgModuleFactory<any>;
 
@@ -9196,7 +8953,7 @@ export declare class ɵangular_packages_core_core_k {
     readonly parent: DebugElement | null;
     readonly nativeNode: any;
     private readonly _debugContext;
-    constructor(nativeNode: any, parent: DebugNode | null, _debugContext: ɵangular_packages_core_core_v);
+    constructor(nativeNode: any, parent: DebugNode | null, _debugContext: ɵangular_packages_core_core_w);
     get injector(): Injector;
     get componentInstance(): any;
     get context(): any;
@@ -9222,7 +8979,7 @@ export declare class ɵangular_packages_core_core_l extends ɵangular_packages_c
     };
     readonly childNodes: DebugNode[];
     readonly nativeElement: any;
-    constructor(nativeNode: any, parent: any, _debugContext: ɵangular_packages_core_core_v);
+    constructor(nativeNode: any, parent: any, _debugContext: ɵangular_packages_core_core_w);
     addChild(child: DebugNode): void;
     removeChild(child: DebugNode): void;
     insertChildrenAfter(child: DebugNode, newChildren: DebugNode[]): void;
@@ -9234,29 +8991,31 @@ export declare class ɵangular_packages_core_core_l extends ɵangular_packages_c
     triggerEventHandler(eventName: string, eventObj: any): void;
 }
 
-export declare class ɵangular_packages_core_core_m implements IterableDifferFactory {
+export declare function ɵangular_packages_core_core_m(nativeNode: any): DebugNode | null;
+
+export declare class ɵangular_packages_core_core_n implements IterableDifferFactory {
     constructor();
     supports(obj: Object | null | undefined): boolean;
     create<V>(trackByFn?: TrackByFunction<V>): DefaultIterableDiffer<V>;
 }
 
-export declare class ɵangular_packages_core_core_n<K, V> implements KeyValueDifferFactory {
+export declare class ɵangular_packages_core_core_o<K, V> implements KeyValueDifferFactory {
     constructor();
     supports(obj: any): boolean;
     create<K, V>(): KeyValueDiffer<K, V>;
 }
 
-export declare function ɵangular_packages_core_core_o(): IterableDiffers;
+export declare function ɵangular_packages_core_core_p(): IterableDiffers;
 
-export declare function ɵangular_packages_core_core_p(): KeyValueDiffers;
+export declare function ɵangular_packages_core_core_q(): KeyValueDiffers;
 
-export declare function ɵangular_packages_core_core_q(locale?: string): string;
+export declare function ɵangular_packages_core_core_r(locale?: string): string;
 
 /**
  * A built-in [dependency injection token](guide/glossary#di-token)
  * that is used to configure the root injector for bootstrapping.
  */
-export declare const ɵangular_packages_core_core_r: StaticProvider[];
+export declare const ɵangular_packages_core_core_s: StaticProvider[];
 
 /**
  * Schedule work at next available slot.
@@ -9267,17 +9026,17 @@ export declare const ɵangular_packages_core_core_r: StaticProvider[];
  *
  * @param ngZone NgZone to use for scheduling.
  */
-export declare function ɵangular_packages_core_core_s(ngZone: NgZone): (fn: () => void) => void;
+export declare function ɵangular_packages_core_core_t(ngZone: NgZone): (fn: () => void) => void;
 
 /**
  * USD currency code that the application uses by default for CurrencyPipe when no
  * DEFAULT_CURRENCY_CODE is provided.
  */
-export declare const ɵangular_packages_core_core_t = "USD";
+export declare const ɵangular_packages_core_core_u = "USD";
 
-export declare function ɵangular_packages_core_core_u(checkIndex: number, flags: ɵNodeFlags, matchedQueriesDsl: [string | number, ɵQueryValueType][] | null, childCount: number, token: any, value: any, deps: ([ɵDepFlags, any] | any)[], bindings?: BindingDef[], outputs?: OutputDef[]): NodeDef;
+export declare function ɵangular_packages_core_core_v(checkIndex: number, flags: ɵNodeFlags, matchedQueriesDsl: [string | number, ɵQueryValueType][] | null, childCount: number, token: any, value: any, deps: ([ɵDepFlags, any] | any)[], bindings?: BindingDef[], outputs?: OutputDef[]): NodeDef;
 
-export declare abstract class ɵangular_packages_core_core_v {
+export declare abstract class ɵangular_packages_core_core_w {
     abstract get view(): ViewData;
     abstract get nodeIndex(): number | null;
     abstract get injector(): Injector;
@@ -9296,7 +9055,7 @@ export declare abstract class ɵangular_packages_core_core_v {
  * A change detection scheduler token for {@link RootContext}. This token is the default value used
  * for the default `RootContext` found in the {@link ROOT_CONTEXT} token.
  */
-export declare const ɵangular_packages_core_core_w: InjectionToken<(fn: () => void) => void>;
+export declare const ɵangular_packages_core_core_x: InjectionToken<(fn: () => void) => void>;
 
 /**
  * Inject static attribute value into directive constructor.
@@ -9329,17 +9088,9 @@ export declare const ɵangular_packages_core_core_w: InjectionToken<(fn: () => v
  *
  * @publicApi
  */
-export declare function ɵangular_packages_core_core_x(tNode: TNode, attrNameToInject: string): string | null;
-
-export declare const ɵangular_packages_core_core_y: InstructionState;
+export declare function ɵangular_packages_core_core_y(tNode: TNode, attrNameToInject: string): string | null;
 
-/**
- * Return the current LView.
- *
- * The return value can be `null` if the method is called outside of template. This can happen if
- * directive is instantiated by module injector (rather than by node injector.)
- */
-export declare function ɵangular_packages_core_core_z(): ɵangular_packages_core_core_bn;
+export declare const ɵangular_packages_core_core_z: InstructionState;
 
 /**
  * Providers that will generate a random APP_ID_TOKEN.
@@ -9361,6 +9112,14 @@ export declare const enum ɵArgumentType {
  * items are not regular attributes and the processing should be adapted accordingly.
  */
 export declare const enum ɵAttributeMarker {
+    /**
+     * An implicit marker which indicates that the value in the array are of `attributeKey`,
+     * `attributeValue` format.
+     *
+     * NOTE: This is implicit as it is the type when no marker is present in array. We indicate that
+     * it should not be present at runtime by the negative number.
+     */
+    ImplicitAttributes = -1,
     /**
      * Marker indicates that the following 3 values in the attributes array are:
      * namespaceUri, attributeName, attributeValue
@@ -9827,17 +9586,11 @@ export declare const enum ɵDepFlags {
 /**
  * Synchronously perform change detection on a component (and possibly its sub-components).
  *
- * This function triggers change detection in a synchronous way on a component. There should
- * be very little reason to call this function directly since a preferred way to do change
- * detection is to {@link markDirty} the component and wait for the scheduler to call this method
- * at some future point in time. This is because a single user action often results in many
- * components being invalidated and calling change detection on each component synchronously
- * would be inefficient. It is better to wait until all components are marked as dirty and
- * then perform single change detection across all of the components
+ * This function triggers change detection in a synchronous way on a component.
  *
  * @param component The component which the change detection should be performed on.
  */
-export declare function ɵdetectChanges<T>(component: T): void;
+export declare function ɵdetectChanges(component: {}): void;
 
 
 export declare function ɵdevModeEqual(a: any, b: any): boolean;
@@ -9899,9 +9652,47 @@ export declare interface ɵDirectiveDef<T> {
     /**
      * Refreshes host bindings on the associated directive.
      */
-    hostBindings: HostBindingsFunction<T> | null;
+    readonly hostBindings: HostBindingsFunction<T> | null;
+    /**
+     * The number of bindings in this directive `hostBindings` (including pure fn bindings).
+     *
+     * Used to calculate the length of the component's LView array, so we
+     * can pre-fill the array and set the host binding start index.
+     */
+    readonly hostVars: number;
+    /**
+     * Assign static attribute values to a host element.
+     *
+     * This property will assign static attribute values as well as class and style
+     * values to a host element. Since attribute values can consist of different types of values, the
+     * `hostAttrs` array must include the values in the following format:
+     *
+     * attrs = [
+     *   // static attributes (like `title`, `name`, `id`...)
+     *   attr1, value1, attr2, value,
+     *
+     *   // a single namespace value (like `x:id`)
+     *   NAMESPACE_MARKER, namespaceUri1, name1, value1,
+     *
+     *   // another single namespace value (like `x:name`)
+     *   NAMESPACE_MARKER, namespaceUri2, name2, value2,
+     *
+     *   // a series of CSS classes that will be applied to the element (no spaces)
+     *   CLASSES_MARKER, class1, class2, class3,
+     *
+     *   // a series of CSS styles (property + value) that will be applied to the element
+     *   STYLES_MARKER, prop1, value1, prop2, value2
+     * ]
+     *
+     * All non-class and non-style attributes must be defined at the start of the list
+     * first before all class and style values are set. When there is a change in value
+     * type (like when classes and styles are introduced) a marker must be used to separate
+     * the entries. The marker values themselves are set via entries found in the
+     * [AttributeMarker] enum.
+     */
+    readonly hostAttrs: TAttributes | null;
     /** Token representing the directive. Used by DI. */
-    type: Type<T>;
+    readonly type: Type<T>;
     /** Function that resolves providers and publishes them into the DI system. */
     providersResolver: (<U extends T>(def: ɵDirectiveDef<U>, processProvidersFn?: ProcessProvidersFunction) => void) | null;
     /** The selectors that will be used to match nodes to this directive. */
@@ -9914,15 +9705,15 @@ export declare interface ɵDirectiveDef<T> {
      * Factory function used to create a new directive instance. Will be null initially.
      * Populated when the factory is first requested by directive instantiation logic.
      */
-    factory: FactoryFn<T> | null;
-    onChanges: (() => void) | null;
-    onInit: (() => void) | null;
-    doCheck: (() => void) | null;
-    afterContentInit: (() => void) | null;
-    afterContentChecked: (() => void) | null;
-    afterViewInit: (() => void) | null;
-    afterViewChecked: (() => void) | null;
-    onDestroy: (() => void) | null;
+    readonly factory: FactoryFn<T> | null;
+    readonly onChanges: (() => void) | null;
+    readonly onInit: (() => void) | null;
+    readonly doCheck: (() => void) | null;
+    readonly afterContentInit: (() => void) | null;
+    readonly afterContentChecked: (() => void) | null;
+    readonly afterViewInit: (() => void) | null;
+    readonly afterViewChecked: (() => void) | null;
+    readonly onDestroy: (() => void) | null;
     /**
      * The features applied to this directive
      */
@@ -9980,26 +9771,45 @@ export declare function ɵgetDebugNode__POST_R3__(nativeNode: Node): DebugNode__
 
 export declare function ɵgetDebugNode__POST_R3__(nativeNode: null): null;
 
+export declare const ɵgetDebugNodeR2: (nativeNode: any) => DebugNode | null;
+
 /**
- * Retrieves directives associated with a given DOM host element.
+ * Retrieves directive instances associated with a given DOM element. Does not include
+ * component instances.
+ *
+ * @usageNotes
+ * Given the following DOM structure:
+ * ```
+ * <my-app>
+ *   <button my-button></button>
+ *   <my-comp></my-comp>
+ * </my-app>
+ * ```
+ * Calling `getDirectives` on `<button>` will return an array with an instance of the `MyButton`
+ * directive that is associated with the DOM element.
+ *
+ * Calling `getDirectives` on `<my-comp>` will return an empty array.
  *
- * @param target A DOM element, component or directive instance.
+ * @param element DOM element for which to get the directives.
+ * @returns Array of directives associated with the element.
  *
  * @publicApi
+ * @globalApi ng
  */
-export declare function ɵgetDirectives(target: {}): Array<{}>;
+export declare function ɵgetDirectives(element: Element): {}[];
 
 /**
- * Retrieve the host element of the component.
+ * Retrieves the host element of a component or directive instance.
+ * The host element is the DOM element that matched the selector of the directive.
  *
- * Use this function to retrieve the host element of the component. The host
- * element is the element which the component is associated with.
- *
- * @param directive Component or Directive for which the host element should be retrieved.
+ * @param componentOrDirective Component or directive instance for which the host
+ *     element should be retrieved.
+ * @returns Host element of the target.
  *
  * @publicApi
+ * @globalApi ng
  */
-export declare function ɵgetHostElement<T>(directive: T): Element;
+export declare function ɵgetHostElement(componentOrDirective: {}): Element;
 
 /**
  * Read the injectable def (`ɵprov`) for `type` in a way which is immune to accidentally reading
@@ -10030,6 +9840,17 @@ export declare function ɵgetInjectableDef<T>(type: any): ɵɵInjectableDef<T> |
  */
 export declare function ɵgetLContext(target: any): ɵLContext | null;
 
+/**
+ * Retrieves the default currency code for the given locale.
+ *
+ * The default is defined as the first currency which is still in use.
+ *
+ * @param locale The code of the locale whose currency code we want.
+ * @returns The code of the default currency for the given locale.
+ *
+ */
+export declare function ɵgetLocaleCurrencyCode(locale: string): string | null;
+
 /**
  * Retrieves the plural function used by ICU expressions to determine the plural case to use
  * for a given locale.
@@ -10103,7 +9924,7 @@ export declare interface ɵLContext {
     /**
      * The component's parent view data.
      */
-    lView: ɵangular_packages_core_core_bn;
+    lView: ɵangular_packages_core_core_bo;
     /**
      * The index instance of the node.
      */
@@ -10184,22 +10005,15 @@ export declare function ɵmakeDecorator<T>(name: string, props?: (...args: any[]
 };
 
 /**
- * Mark the component as dirty (needing change detection).
- *
- * Marking a component dirty will schedule a change detection on this
- * component at some point in the future. Marking an already dirty
- * component as dirty is a noop. Only one outstanding change detection
- * can be scheduled per component tree. (Two components bootstrapped with
- * separate `renderComponent` will have separate schedulers)
+ * Marks the component as dirty (needing change detection). Marking a component dirty will
+ * schedule a change detection on it at some point in the future.
  *
- * When the root component is bootstrapped with `renderComponent`, a scheduler
- * can be provided.
+ * Marking an already dirty component as dirty won't do anything. Only one outstanding change
+ * detection can be scheduled per component tree.
  *
  * @param component Component to mark as dirty.
- *
- * @publicApi
  */
-export declare function ɵmarkDirty<T>(component: T): void;
+export declare function ɵmarkDirty(component: {}): void;
 
 export declare type ɵMethodFn = (obj: any, args: any[]) => any;
 
@@ -10298,7 +10112,7 @@ export declare interface ɵNgModuleType<T = any> extends Type<T> {
 
 
 export declare interface ɵNO_CHANGE {
-    brand: 'NO_CHANGE';
+    __brand__: 'NO_CHANGE';
 }
 
 /** A special value which designates that a value has not changed. */
@@ -10613,7 +10427,7 @@ export declare class ɵRender3ComponentRef<T> extends ComponentRef<T> {
     hostView: ViewRef_2<T>;
     changeDetectorRef: ChangeDetectorRef;
     componentType: Type<T>;
-    constructor(componentType: Type<T>, instance: T, location: ElementRef, _rootLView: ɵangular_packages_core_core_bn, _tNode: ɵangular_packages_core_core_bd | TContainerNode | TElementContainerNode);
+    constructor(componentType: Type<T>, instance: T, location: ElementRef, _rootLView: ɵangular_packages_core_core_bo, _tNode: ɵangular_packages_core_core_be | TContainerNode | TElementContainerNode);
     get injector(): Injector;
     destroy(): void;
     onDestroy(callback: () => void): void;
@@ -10785,7 +10599,7 @@ export declare function ɵsetLocaleId(localeId: string): void;
 export declare type ɵSetterFn = (obj: any, value: any) => void;
 
 /** Store a value in the `data` at a given `index`. */
-export declare function ɵstore<T>(index: number, value: T): void;
+export declare function ɵstore<T>(tView: TView, lView: ɵangular_packages_core_core_bo, index: number, value: T): void;
 
 
 export declare function ɵstringify(token: any): string;
@@ -10919,16 +10733,6 @@ export declare function ɵwhenRendered(component: any): Promise<null>;
   */
 export declare function ɵɵadvance(delta: number): void;
 
-
-/**
- * Allocates the necessary amount of slots for host vars.
- *
- * @param count Amount of vars to be allocated
- *
- * @codeGenApi
- */
-export declare function ɵɵallocHostVars(count: number): void;
-
 /**
  * Updates the value of or removes a bound attribute on an Element.
  *
@@ -11261,8 +11065,8 @@ export declare function ɵɵattributeInterpolateV(attrName: string, values: any[
  * @codeGenApi
  */
 export declare function ɵɵclassMap(classes: {
-    [className: string]: any;
-} | ɵNO_CHANGE | string | null): void;
+    [className: string]: boolean | undefined | null;
+} | Map<string, boolean | undefined | null> | Set<string> | string[] | string | undefined | null): void;
 
 
 /**
@@ -11551,7 +11355,7 @@ export declare function ɵɵclassMapInterpolateV(values: any[]): void;
  *
  * @codeGenApi
  */
-export declare function ɵɵclassProp(className: string, value: boolean | null): typeof ɵɵclassProp;
+export declare function ɵɵclassProp(className: string, value: boolean | undefined | null): typeof ɵɵclassProp;
 
 /**
  * @codeGenApi
@@ -11756,6 +11560,44 @@ export declare function ɵɵdefineComponent<T>(componentDefinition: {
      * Function executed by the parent template to allow child directive to apply host bindings.
      */
     hostBindings?: HostBindingsFunction<T>;
+    /**
+     * The number of bindings in this directive `hostBindings` (including pure fn bindings).
+     *
+     * Used to calculate the length of the component's LView array, so we
+     * can pre-fill the array and set the host binding start index.
+     */
+    hostVars?: number;
+    /**
+     * Assign static attribute values to a host element.
+     *
+     * This property will assign static attribute values as well as class and style
+     * values to a host element. Since attribute values can consist of different types of values, the
+     * `hostAttrs` array must include the values in the following format:
+     *
+     * attrs = [
+     *   // static attributes (like `title`, `name`, `id`...)
+     *   attr1, value1, attr2, value,
+     *
+     *   // a single namespace value (like `x:id`)
+     *   NAMESPACE_MARKER, namespaceUri1, name1, value1,
+     *
+     *   // another single namespace value (like `x:name`)
+     *   NAMESPACE_MARKER, namespaceUri2, name2, value2,
+     *
+     *   // a series of CSS classes that will be applied to the element (no spaces)
+     *   CLASSES_MARKER, class1, class2, class3,
+     *
+     *   // a series of CSS styles (property + value) that will be applied to the element
+     *   STYLES_MARKER, prop1, value1, prop2, value2
+     * ]
+     *
+     * All non-class and non-style attributes must be defined at the start of the list
+     * first before all class and style values are set. When there is a change in value
+     * type (like when classes and styles are introduced) a marker must be used to separate
+     * the entries. The marker values themselves are set via entries found in the
+     * [AttributeMarker] enum.
+     */
+    hostAttrs?: TAttributes;
     /**
      * Function to create instances of content queries associated with a given directive.
      */
@@ -11950,6 +11792,44 @@ export declare const ɵɵdefineDirective: <T>(directiveDefinition: {
      * Function executed by the parent template to allow child directive to apply host bindings.
      */
     hostBindings?: HostBindingsFunction<T> | undefined;
+    /**
+     * The number of bindings in this directive `hostBindings` (including pure fn bindings).
+     *
+     * Used to calculate the length of the component's LView array, so we
+     * can pre-fill the array and set the host binding start index.
+     */
+    hostVars?: number | undefined;
+    /**
+     * Assign static attribute values to a host element.
+     *
+     * This property will assign static attribute values as well as class and style
+     * values to a host element. Since attribute values can consist of different types of values, the
+     * `hostAttrs` array must include the values in the following format:
+     *
+     * attrs = [
+     *   // static attributes (like `title`, `name`, `id`...)
+     *   attr1, value1, attr2, value,
+     *
+     *   // a single namespace value (like `x:id`)
+     *   NAMESPACE_MARKER, namespaceUri1, name1, value1,
+     *
+     *   // another single namespace value (like `x:name`)
+     *   NAMESPACE_MARKER, namespaceUri2, name2, value2,
+     *
+     *   // a series of CSS classes that will be applied to the element (no spaces)
+     *   CLASSES_MARKER, class1, class2, class3,
+     *
+     *   // a series of CSS styles (property + value) that will be applied to the element
+     *   STYLES_MARKER, prop1, value1, prop2, value2
+     * ]
+     *
+     * All non-class and non-style attributes must be defined at the start of the list
+     * first before all class and style values are set. When there is a change in value
+     * type (like when classes and styles are introduced) a marker must be used to separate
+     * the entries. The marker values themselves are set via entries found in the
+     * [AttributeMarker] enum.
+     */
+    hostAttrs?: TAttributes | undefined;
     /**
      * Function to create instances of content queries associated with a given directive.
      */
@@ -12175,46 +12055,6 @@ export declare function ɵɵelementContainerStart(index: number, attrsIndex?: nu
  */
 export declare function ɵɵelementEnd(): void;
 
-/**
- * Assign static attribute values to a host element.
- *
- * This instruction will assign static attribute values as well as class and style
- * values to an element within the host bindings function. Since attribute values
- * can consist of different types of values, the `attrs` array must include the values in
- * the following format:
- *
- * attrs = [
- *   // static attributes (like `title`, `name`, `id`...)
- *   attr1, value1, attr2, value,
- *
- *   // a single namespace value (like `x:id`)
- *   NAMESPACE_MARKER, namespaceUri1, name1, value1,
- *
- *   // another single namespace value (like `x:name`)
- *   NAMESPACE_MARKER, namespaceUri2, name2, value2,
- *
- *   // a series of CSS classes that will be applied to the element (no spaces)
- *   CLASSES_MARKER, class1, class2, class3,
- *
- *   // a series of CSS styles (property + value) that will be applied to the element
- *   STYLES_MARKER, prop1, value1, prop2, value2
- * ]
- *
- * All non-class and non-style attributes must be defined at the start of the list
- * first before all class and style values are set. When there is a change in value
- * type (like when classes and styles are introduced) a marker must be used to separate
- * the entries. The marker values themselves are set via entries found in the
- * [AttributeMarker] enum.
- *
- * NOTE: This instruction is meant to used from `hostBindings` function only.
- *
- * @param directive A directive instance the styling is associated with.
- * @param attrs An array of static values (attributes, classes and styles) with the correct marker
- * values.
- *
- * @codeGenApi
- */
-export declare function ɵɵelementHostAttrs(attrs: TAttributes): void;
 
 /**
  * Create DOM element. The instruction must later be followed by `elementEnd()` call.
@@ -13630,7 +13470,7 @@ export declare function ɵɵstaticViewQuery<T>(predicate: Type<any> | string[],
  */
 export declare function ɵɵstyleMap(styles: {
     [styleName: string]: any;
-} | ɵNO_CHANGE | null): void;
+} | Map<string, string | number | null | undefined> | string | undefined | null): void;
 
 /**
  * Update a style binding on an element with the provided value.
@@ -13653,7 +13493,8 @@ export declare function ɵɵstyleMap(styles: {
  *
  * @codeGenApi
  */
-export declare function ɵɵstyleProp(prop: string, value: string | number | ɵSafeValue | null, suffix?: string | null): typeof ɵɵstyleProp;
+export declare function ɵɵstyleProp(prop: string, value: string | number | ɵSafeValue | undefined | null, suffix?: string | null): typeof ɵɵstyleProp;
+
 
 /**
  *
@@ -13969,15 +13810,6 @@ export declare function ɵɵstylePropInterpolate8(prop: string, prefix: string,
  */
 export declare function ɵɵstylePropInterpolateV(prop: string, values: any[], valueSuffix?: string | null): typeof ɵɵstylePropInterpolateV;
 
-/**
- * --------
- *
- * This file contains the core logic for how styling instructions are processed in Angular.
- *
- * To learn more about the algorithm see `TStylingContext`.
- *
- * --------
- */
 /**
  * Sets the current style sanitizer function which will then be used
  * within all follow-up prop and map-based style binding instructions
@@ -14023,7 +13855,7 @@ export declare function ɵɵtemplate(index: number, templateFn: ComponentTemplat
  *
  * @codeGenApi
  */
-export declare function ɵɵtemplateRefExtractor(tNode: TNode, currentView: ɵangular_packages_core_core_bn): TemplateRef<unknown> | null;
+export declare function ɵɵtemplateRefExtractor(tNode: TNode, currentView: ɵangular_packages_core_core_bo): TemplateRef<unknown> | null;
 
 /**
  * Create static text node