@angular/language-service 7.0.0-rc.1 → 7.0.0

package/bundles/language-service.umd.js

@@ -1,5 +1,5 @@
 /**
- * @license Angular v7.0.0-rc.1
+ * @license Angular v7.0.0
  * (c) 2010-2018 Google, Inc. https://angular.io/
  * License: MIT
  */
@@ -1164,7 +1164,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
-    var VERSION = new Version('7.0.0-rc.1');
+    var VERSION = new Version('7.0.0');
 
     /**
      * @license
@@ -14439,6 +14439,11 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         Identifiers.pipeBind3 = { name: 'ɵpipeBind3', moduleName: CORE$1 };
         Identifiers.pipeBind4 = { name: 'ɵpipeBind4', moduleName: CORE$1 };
         Identifiers.pipeBindV = { name: 'ɵpipeBindV', moduleName: CORE$1 };
+        Identifiers.i18nAttribute = { name: 'ɵi18nAttribute', moduleName: CORE$1 };
+        Identifiers.i18nExp = { name: 'ɵi18nExp', moduleName: CORE$1 };
+        Identifiers.i18nStart = { name: 'ɵi18nStart', moduleName: CORE$1 };
+        Identifiers.i18nEnd = { name: 'ɵi18nEnd', moduleName: CORE$1 };
+        Identifiers.i18nApply = { name: 'ɵi18nApply', moduleName: CORE$1 };
         Identifiers.load = { name: 'ɵload', moduleName: CORE$1 };
         Identifiers.loadQueryList = { name: 'ɵloadQueryList', moduleName: CORE$1 };
         Identifiers.pipe = { name: 'ɵpipe', moduleName: CORE$1 };
@@ -14447,7 +14452,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         Identifiers.reference = { name: 'ɵreference', moduleName: CORE$1 };
         Identifiers.inject = { name: 'inject', moduleName: CORE$1 };
         Identifiers.injectAttribute = { name: 'ɵinjectAttribute', moduleName: CORE$1 };
-        Identifiers.injectRenderer2 = { name: 'ɵinjectRenderer2', moduleName: CORE$1 };
         Identifiers.directiveInject = { name: 'ɵdirectiveInject', moduleName: CORE$1 };
         Identifiers.templateRefExtractor = { name: 'ɵtemplateRefExtractor', moduleName: CORE$1 };
         Identifiers.defineBase = { name: 'ɵdefineBase', moduleName: CORE$1 };
@@ -14557,10 +14561,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
          * The dependency is for the `Injector` type itself.
          */
         R3ResolvedDependencyType[R3ResolvedDependencyType["Injector"] = 2] = "Injector";
-        /**
-         * The dependency is for `Renderer2`.
-         */
-        R3ResolvedDependencyType[R3ResolvedDependencyType["Renderer2"] = 3] = "Renderer2";
     })(R3ResolvedDependencyType || (R3ResolvedDependencyType = {}));
 
     /**
@@ -24476,6 +24476,18 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         throw new Error("ASSERTION ERROR: " + msg);
     }
 
+    /**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    /**
+     * This property will be monkey-patched on elements, components and directives
+     */
+    var MONKEY_PATCH_KEY_NAME = '__ngContext__';
+
     /**
      * @license
      * Copyright Google Inc. All Rights Reserved.
@@ -24484,24 +24496,25 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * found in the LICENSE file at https://angular.io/license
      */
     /** Size of LViewData's header. Necessary to adjust for it when setting slots.  */
-    var HEADER_OFFSET = 16;
+    var HEADER_OFFSET = 17;
     // Below are constants for LViewData indices to help us look up LViewData members
     // without having to remember the specific indices.
     // Uglify will inline these when minifying so there shouldn't be a cost.
     var TVIEW = 0;
-    var PARENT = 1;
-    var NEXT = 2;
-    var QUERIES = 3;
-    var FLAGS = 4;
-    var HOST_NODE = 5;
-    var BINDING_INDEX = 6;
-    var CLEANUP = 7;
-    var CONTEXT = 8;
-    var INJECTOR$1 = 9;
-    var RENDERER = 10;
-    var SANITIZER = 11;
-    var CONTAINER_INDEX = 13;
-    var DECLARATION_VIEW = 15;
+    var FLAGS = 1;
+    var PARENT = 2;
+    var NEXT = 3;
+    var QUERIES = 4;
+    var HOST = 5;
+    var HOST_NODE = 6;
+    var BINDING_INDEX = 7;
+    var CLEANUP = 8;
+    var CONTEXT = 9;
+    var INJECTOR$1 = 10;
+    var RENDERER = 11;
+    var SANITIZER = 12;
+    var CONTAINER_INDEX = 14;
+    var DECLARATION_VIEW = 16;
 
     /**
      * @license
@@ -24510,45 +24523,371 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
+    function devModeEqual(a, b) {
+        var isListLikeIterableA = isListLikeIterable(a);
+        var isListLikeIterableB = isListLikeIterable(b);
+        if (isListLikeIterableA && isListLikeIterableB) {
+            return areIterablesEqual(a, b, devModeEqual);
+        }
+        else {
+            var isAObject = a && (typeof a === 'object' || typeof a === 'function');
+            var isBObject = b && (typeof b === 'object' || typeof b === 'function');
+            if (!isListLikeIterableA && isAObject && !isListLikeIterableB && isBObject) {
+                return true;
+            }
+            else {
+                return looseIdentical(a, b);
+            }
+        }
+    }
     /**
-     * This property will be monkey-patched on elements, components and directives
+     * Indicates that the result of a {@link Pipe} transformation has changed even though the
+     * reference has not changed.
+     *
+     * Wrapped values are unwrapped automatically during the change detection, and the unwrapped value
+     * is stored.
+     *
+     * Example:
+     *
+     * ```
+     * if (this._latestValue === this._latestReturnedValue) {
+     *    return this._latestReturnedValue;
+     *  } else {
+     *    this._latestReturnedValue = this._latestValue;
+     *    return WrappedValue.wrap(this._latestValue); // this will force update
+     *  }
+     * ```
+     *
      */
-    var MONKEY_PATCH_KEY_NAME = '__ngContext__';
+    var WrappedValue = /** @class */ (function () {
+        function WrappedValue(value) {
+            this.wrapped = value;
+        }
+        /** Creates a wrapped value. */
+        WrappedValue.wrap = function (value) { return new WrappedValue(value); };
+        /**
+         * Returns the underlying value of a wrapped value.
+         * Returns the given `value` when it is not wrapped.
+         **/
+        WrappedValue.unwrap = function (value) { return WrappedValue.isWrapped(value) ? value.wrapped : value; };
+        /** Returns true if `value` is a wrapped value. */
+        WrappedValue.isWrapped = function (value) { return value instanceof WrappedValue; };
+        return WrappedValue;
+    }());
+    /**
+     * Represents a basic change from a previous to a new value.
+     *
+     */
+    var SimpleChange = /** @class */ (function () {
+        function SimpleChange(previousValue, currentValue, firstChange) {
+            this.previousValue = previousValue;
+            this.currentValue = currentValue;
+            this.firstChange = firstChange;
+        }
+        /**
+         * Check whether the new value is the first value assigned.
+         */
+        SimpleChange.prototype.isFirstChange = function () { return this.firstChange; };
+        return SimpleChange;
+    }());
+    function isListLikeIterable(obj) {
+        if (!isJsObject(obj))
+            return false;
+        return Array.isArray(obj) ||
+            (!(obj instanceof Map) && // JS Map are iterables but return entries as [k, v]
+                getSymbolIterator() in obj); // JS Iterable have a Symbol.iterator prop
+    }
+    function areIterablesEqual(a, b, comparator) {
+        var iterator1 = a[getSymbolIterator()]();
+        var iterator2 = b[getSymbolIterator()]();
+        while (true) {
+            var item1 = iterator1.next();
+            var item2 = iterator2.next();
+            if (item1.done && item2.done)
+                return true;
+            if (item1.done || item2.done)
+                return false;
+            if (!comparator(item1.value, item2.value))
+                return false;
+        }
+    }
+    function iterateListLike(obj, fn) {
+        if (Array.isArray(obj)) {
+            for (var i = 0; i < obj.length; i++) {
+                fn(obj[i]);
+            }
+        }
+        else {
+            var iterator = obj[getSymbolIterator()]();
+            var item = void 0;
+            while (!((item = iterator.next()).done)) {
+                fn(item.value);
+            }
+        }
+    }
+    function isJsObject(o) {
+        return o !== null && (typeof o === 'function' || typeof o === 'object');
+    }
+
+    /**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    /**
+     * Below are constants for LContainer indices to help us look up LContainer members
+     * without having to remember the specific indices.
+     * Uglify will inline these when minifying so there shouldn't be a cost.
+     */
+    var ACTIVE_INDEX = 0;
+    var VIEWS = 1;
+    // PARENT, NEXT, QUERIES, and HOST are indices 2, 3, 4, and 5.
+    // As we already have these constants in LViewData, we don't need to re-create them.
+    var NATIVE = 6;
+    var RENDER_PARENT = 7;
+
+    /**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    function stringify$2(value) {
+        if (typeof value == 'function')
+            return value.name || value;
+        if (typeof value == 'string')
+            return value;
+        if (value == null)
+            return '';
+        return '' + value;
+    }
+    /**
+     * Flattens an array in non-recursive way. Input arrays are not modified.
+     */
+    function flatten$2(list) {
+        var result = [];
+        var i = 0;
+        while (i < list.length) {
+            var item = list[i];
+            if (Array.isArray(item)) {
+                if (item.length > 0) {
+                    list = item.concat(list.slice(i + 1));
+                    i = 0;
+                }
+                else {
+                    i++;
+                }
+            }
+            else {
+                result.push(item);
+                i++;
+            }
+        }
+        return result;
+    }
+    function assertDataInRangeInternal(index, arr) {
+        assertLessThan(index, arr ? arr.length : 0, 'index expected to be a valid data index');
+    }
+    /**
+     * Takes the value of a slot in `LViewData` and returns the element node.
+     *
+     * Normally, element nodes are stored flat, but if the node has styles/classes on it,
+     * it might be wrapped in a styling context. Or if that node has a directive that injects
+     * ViewContainerRef, it may be wrapped in an LContainer. Or if that node is a component,
+     * it will be wrapped in LViewData. It could even have all three, so we keep looping
+     * until we find something that isn't an array.
+     *
+     * @param value The initial value in `LViewData`
+     */
+    function readElementValue(value) {
+        while (Array.isArray(value)) {
+            value = value[HOST];
+        }
+        return value;
+    }
+    function getNativeByTNode(tNode, hostView) {
+        return readElementValue(hostView[tNode.index]);
+    }
+    function getTNode(index, view) {
+        return view[TVIEW].data[index + HEADER_OFFSET];
+    }
+    function getComponentViewByIndex(nodeIndex, hostView) {
+        // Could be an LViewData or an LContainer. If LContainer, unwrap to find LViewData.
+        var slotValue = hostView[nodeIndex];
+        return slotValue.length >= HEADER_OFFSET ? slotValue : slotValue[HOST];
+    }
+    function isContentQueryHost(tNode) {
+        return (tNode.flags & 16384 /* hasContentQuery */) !== 0;
+    }
+    function isLContainer(value) {
+        // Styling contexts are also arrays, but their first index contains an element node
+        return Array.isArray(value) && typeof value[ACTIVE_INDEX] === 'number';
+    }
+    /**
+     * Returns the monkey-patch value data present on the target (which could be
+     * a component, directive or a DOM node).
+     */
+    function readPatchedData(target) {
+        return target[MONKEY_PATCH_KEY_NAME];
+    }
+    function readPatchedLViewData(target) {
+        var value = readPatchedData(target);
+        if (value) {
+            return Array.isArray(value) ? value : value.lViewData;
+        }
+        return null;
+    }
+
+    /**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    /** Returns the matching `LContext` data for a given DOM node, directive or component instance.
+     *
+     * This function will examine the provided DOM element, component, or directive instance\'s
+     * monkey-patched property to derive the `LContext` data. Once called then the monkey-patched
+     * value will be that of the newly created `LContext`.
+     *
+     * If the monkey-patched value is the `LViewData` instance then the context value for that
+     * target will be created and the monkey-patch reference will be updated. Therefore when this
+     * function is called it may mutate the provided element\'s, component\'s or any of the associated
+     * directive\'s monkey-patch values.
+     *
+     * If the monkey-patch value is not detected then the code will walk up the DOM until an element
+     * is found which contains a monkey-patch reference. When that occurs then the provided element
+     * will be updated with a new context (which is then returned). If the monkey-patch value is not
+     * detected for a component/directive instance then it will throw an error (all components and
+     * directives should be automatically monkey-patched by ivy).
+     */
+    function getContext(target) {
+        var mpValue = readPatchedData(target);
+        if (mpValue) {
+            // only when it's an array is it considered an LViewData instance
+            // ... otherwise it's an already constructed LContext instance
+            if (Array.isArray(mpValue)) {
+                var lViewData = mpValue;
+                var nodeIndex = void 0;
+                var component = undefined;
+                var directives = undefined;
+                if (isComponentInstance(target)) {
+                    nodeIndex = findViaComponent(lViewData, target);
+                    if (nodeIndex == -1) {
+                        throw new Error('The provided component was not found in the application');
+                    }
+                    component = target;
+                }
+                else if (isDirectiveInstance(target)) {
+                    nodeIndex = findViaDirective(lViewData, target);
+                    if (nodeIndex == -1) {
+                        throw new Error('The provided directive was not found in the application');
+                    }
+                    directives = discoverDirectives(nodeIndex, lViewData, false);
+                }
+                else {
+                    nodeIndex = findViaNativeElement(lViewData, target);
+                    if (nodeIndex == -1) {
+                        return null;
+                    }
+                }
+                // the goal is not to fill the entire context full of data because the lookups
+                // are expensive. Instead, only the target data (the element, compontent or
+                // directive details) are filled into the context. If called multiple times
+                // with different target values then the missing target data will be filled in.
+                var native = readElementValue(lViewData[nodeIndex]);
+                var existingCtx = readPatchedData(native);
+                var context = (existingCtx && !Array.isArray(existingCtx)) ?
+                    existingCtx :
+                    createLContext(lViewData, nodeIndex, native);
+                // only when the component has been discovered then update the monkey-patch
+                if (component && context.component === undefined) {
+                    context.component = component;
+                    attachPatchData(context.component, context);
+                }
+                // only when the directives have been discovered then update the monkey-patch
+                if (directives && context.directives === undefined) {
+                    context.directives = directives;
+                    for (var i = 0; i < directives.length; i++) {
+                        attachPatchData(directives[i], context);
+                    }
+                }
+                attachPatchData(context.native, context);
+                mpValue = context;
+            }
+        }
+        else {
+            var rElement = target;
+            ngDevMode && assertDomElement(rElement);
+            // if the context is not found then we need to traverse upwards up the DOM
+            // to find the nearest element that has already been monkey patched with data
+            var parent_1 = rElement;
+            while (parent_1 = parent_1.parentNode) {
+                var parentContext = readPatchedData(parent_1);
+                if (parentContext) {
+                    var lViewData = void 0;
+                    if (Array.isArray(parentContext)) {
+                        lViewData = parentContext;
+                    }
+                    else {
+                        lViewData = parentContext.lViewData;
+                    }
+                    // the edge of the app was also reached here through another means
+                    // (maybe because the DOM was changed manually).
+                    if (!lViewData) {
+                        return null;
+                    }
+                    var index = findViaNativeElement(lViewData, rElement);
+                    if (index >= 0) {
+                        var native = readElementValue(lViewData[index]);
+                        var context = createLContext(lViewData, index, native);
+                        attachPatchData(native, context);
+                        mpValue = context;
+                        break;
+                    }
+                }
+            }
+        }
+        return mpValue || null;
+    }
     /**
      * Creates an empty instance of a `LContext` context
      */
-    function createLContext(lViewData, lNodeIndex, native) {
+    function createLContext(lViewData, nodeIndex, native) {
         return {
             lViewData: lViewData,
-            nodeIndex: lNodeIndex, native: native,
+            nodeIndex: nodeIndex, native: native,
             component: undefined,
             directives: undefined,
             localRefs: undefined,
         };
     }
     /**
-     * A simplified lookup function for finding the LElementNode from a component instance.
+     * Takes a component instance and returns the view for that component.
      *
-     * This function exists for tree-shaking purposes to avoid having to pull in everything
-     * that `getContext` has in the event that an Angular application doesn't need to have
-     * any programmatic access to an element's context (only change detection uses this function).
+     * @param componentInstance
+     * @returns The component's view
      */
-    function getLElementFromComponent(componentInstance) {
+    function getComponentViewByInstance(componentInstance) {
         var lViewData = readPatchedData(componentInstance);
-        var lNode;
+        var view;
         if (Array.isArray(lViewData)) {
-            var lNodeIndex = findViaComponent(lViewData, componentInstance);
-            lNode = readElementValue(lViewData[lNodeIndex]);
-            var context = createLContext(lViewData, lNodeIndex, lNode.native);
+            var nodeIndex = findViaComponent(lViewData, componentInstance);
+            view = getComponentViewByIndex(nodeIndex, lViewData);
+            var context = createLContext(lViewData, nodeIndex, view[HOST]);
             context.component = componentInstance;
             attachPatchData(componentInstance, context);
             attachPatchData(context.native, context);
         }
         else {
             var context = lViewData;
-            lNode = readElementValue(context.lViewData[context.nodeIndex]);
+            view = getComponentViewByIndex(context.nodeIndex, context.lViewData);
         }
-        return lNode;
+        return view;
     }
     /**
      * Assigns the given data to the given target (which could be a component,
@@ -24557,17 +24896,38 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
     function attachPatchData(target, data) {
         target[MONKEY_PATCH_KEY_NAME] = data;
     }
+    function isComponentInstance(instance) {
+        return instance && instance.constructor && instance.constructor.ngComponentDef;
+    }
+    function isDirectiveInstance(instance) {
+        return instance && instance.constructor && instance.constructor.ngDirectiveDef;
+    }
     /**
-     * Returns the monkey-patch value data present on the target (which could be
-     * a component, directive or a DOM node).
+     * Locates the element within the given LViewData and returns the matching index
      */
-    function readPatchedData(target) {
-        return target[MONKEY_PATCH_KEY_NAME];
+    function findViaNativeElement(lViewData, target) {
+        var tNode = lViewData[TVIEW].firstChild;
+        while (tNode) {
+            var native = getNativeByTNode(tNode, lViewData);
+            if (native === target) {
+                return tNode.index;
+            }
+            tNode = traverseNextElement(tNode);
+        }
+        return -1;
     }
-    function readPatchedLViewData(target) {
-        var value = readPatchedData(target);
-        if (value) {
-            return Array.isArray(value) ? value : value.lViewData;
+    /**
+     * Locates the next tNode (child, sibling or parent).
+     */
+    function traverseNextElement(tNode) {
+        if (tNode.child) {
+            return tNode.child;
+        }
+        else if (tNode.next) {
+            return tNode.next;
+        }
+        else if (tNode.parent) {
+            return tNode.parent.next || null;
         }
         return null;
     }
@@ -24579,15 +24939,15 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         if (componentIndices) {
             for (var i = 0; i < componentIndices.length; i++) {
                 var elementComponentIndex = componentIndices[i];
-                var lNodeData = readElementValue(lViewData[elementComponentIndex]).data;
-                if (lNodeData[CONTEXT] === componentInstance) {
+                var componentView = getComponentViewByIndex(elementComponentIndex, lViewData);
+                if (componentView[CONTEXT] === componentInstance) {
                     return elementComponentIndex;
                 }
             }
         }
         else {
-            var rootNode = lViewData[HEADER_OFFSET];
-            var rootComponent = rootNode.data[CONTEXT];
+            var rootComponentView = getComponentViewByIndex(HEADER_OFFSET, lViewData);
+            var rootComponent = rootComponentView[CONTEXT];
             if (rootComponent === componentInstance) {
                 // we are dealing with the root element here therefore we know that the
                 // element is the very first element after the HEADER data in the lView
@@ -24596,8 +24956,77 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         }
         return -1;
     }
-    function readElementValue(value) {
-        return (Array.isArray(value) ? value[0] : value);
+    /**
+     * Locates the directive within the given LViewData and returns the matching index
+     */
+    function findViaDirective(lViewData, directiveInstance) {
+        // if a directive is monkey patched then it will (by default)
+        // have a reference to the LViewData of the current view. The
+        // element bound to the directive being search lives somewhere
+        // in the view data. We loop through the nodes and check their
+        // list of directives for the instance.
+        var tNode = lViewData[TVIEW].firstChild;
+        while (tNode) {
+            var directiveIndexStart = getDirectiveStartIndex(tNode);
+            var directiveIndexEnd = getDirectiveEndIndex(tNode, directiveIndexStart);
+            for (var i = directiveIndexStart; i < directiveIndexEnd; i++) {
+                if (lViewData[i] === directiveInstance) {
+                    return tNode.index;
+                }
+            }
+            tNode = traverseNextElement(tNode);
+        }
+        return -1;
+    }
+    function assertDomElement(element) {
+        assertEqual(element.nodeType, 1, 'The provided value must be an instance of an HTMLElement');
+    }
+    /**
+     * Returns a list of directives extracted from the given view based on the
+     * provided list of directive index values.
+     *
+     * @param nodeIndex The node index
+     * @param lViewData The target view data
+     * @param includeComponents Whether or not to include components in returned directives
+     */
+    function discoverDirectives(nodeIndex, lViewData, includeComponents) {
+        var tNode = lViewData[TVIEW].data[nodeIndex];
+        var directiveStartIndex = getDirectiveStartIndex(tNode);
+        var directiveEndIndex = getDirectiveEndIndex(tNode, directiveStartIndex);
+        if (!includeComponents && tNode.flags & 4096 /* isComponent */)
+            directiveStartIndex++;
+        return lViewData.slice(directiveStartIndex, directiveEndIndex);
+    }
+    /**
+     * Returns a map of local references (local reference name => element or directive instance) that
+     * exist on a given element.
+     */
+    function discoverLocalRefs(lViewData, nodeIndex) {
+        var tNode = lViewData[TVIEW].data[nodeIndex];
+        if (tNode && tNode.localNames) {
+            var result = {};
+            for (var i = 0; i < tNode.localNames.length; i += 2) {
+                var localRefName = tNode.localNames[i];
+                var directiveIndex = tNode.localNames[i + 1];
+                result[localRefName] =
+                    directiveIndex === -1 ? getNativeByTNode(tNode, lViewData) : lViewData[directiveIndex];
+            }
+            return result;
+        }
+        return null;
+    }
+    function getDirectiveStartIndex(tNode) {
+        // the tNode instances store a flag value which then has a
+        // pointer which tells the starting index of where all the
+        // active directives are in the master directive array
+        return tNode.flags >> 15 /* DirectiveStartingIndexShift */;
+    }
+    function getDirectiveEndIndex(tNode, startIndex) {
+        // The end value is also a part of the same flag
+        // (see `TNodeFlags` to see how the flag bit shifting
+        // values are used).
+        var count = tNode.flags & 4095 /* DirectiveCountMask */;
+        return count ? (startIndex + count) : -1;
     }
 
     /**
@@ -24716,24 +25145,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         throw new Error("Cannot instantiate cyclic dependency! " + token);
     }
 
-    /**
-     * @license
-     * Copyright Google Inc. All Rights Reserved.
-     *
-     * Use of this source code is governed by an MIT-style license that can be
-     * found in the LICENSE file at https://angular.io/license
-     */
-    /**
-     * Below are constants for LContainer indices to help us look up LContainer members
-     * without having to remember the specific indices.
-     * Uglify will inline these when minifying so there shouldn't be a cost.
-     */
-    var ACTIVE_INDEX = 0;
-    // PARENT, NEXT, and QUERIES are indices 1, 2, and 3.
-    // As we already have these constants in LViewData, we don't need to re-create them.
-    var VIEWS = 4;
-    var RENDER_PARENT = 5;
-
     /**
      * @license
      * Copyright Google Inc. All Rights Reserved.
@@ -24815,196 +25226,16 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
-    function devModeEqual(a, b) {
-        var isListLikeIterableA = isListLikeIterable(a);
-        var isListLikeIterableB = isListLikeIterable(b);
-        if (isListLikeIterableA && isListLikeIterableB) {
-            return areIterablesEqual(a, b, devModeEqual);
-        }
-        else {
-            var isAObject = a && (typeof a === 'object' || typeof a === 'function');
-            var isBObject = b && (typeof b === 'object' || typeof b === 'function');
-            if (!isListLikeIterableA && isAObject && !isListLikeIterableB && isBObject) {
-                return true;
-            }
-            else {
-                return looseIdentical(a, b);
-            }
-        }
-    }
-    /**
-     * Indicates that the result of a {@link Pipe} transformation has changed even though the
-     * reference has not changed.
-     *
-     * Wrapped values are unwrapped automatically during the change detection, and the unwrapped value
-     * is stored.
-     *
-     * Example:
-     *
-     * ```
-     * if (this._latestValue === this._latestReturnedValue) {
-     *    return this._latestReturnedValue;
-     *  } else {
-     *    this._latestReturnedValue = this._latestValue;
-     *    return WrappedValue.wrap(this._latestValue); // this will force update
-     *  }
-     * ```
-     *
-     */
-    var WrappedValue = /** @class */ (function () {
-        function WrappedValue(value) {
-            this.wrapped = value;
-        }
-        /** Creates a wrapped value. */
-        WrappedValue.wrap = function (value) { return new WrappedValue(value); };
-        /**
-         * Returns the underlying value of a wrapped value.
-         * Returns the given `value` when it is not wrapped.
-         **/
-        WrappedValue.unwrap = function (value) { return WrappedValue.isWrapped(value) ? value.wrapped : value; };
-        /** Returns true if `value` is a wrapped value. */
-        WrappedValue.isWrapped = function (value) { return value instanceof WrappedValue; };
-        return WrappedValue;
-    }());
-    /**
-     * Represents a basic change from a previous to a new value.
-     *
-     */
-    var SimpleChange = /** @class */ (function () {
-        function SimpleChange(previousValue, currentValue, firstChange) {
-            this.previousValue = previousValue;
-            this.currentValue = currentValue;
-            this.firstChange = firstChange;
-        }
-        /**
-         * Check whether the new value is the first value assigned.
-         */
-        SimpleChange.prototype.isFirstChange = function () { return this.firstChange; };
-        return SimpleChange;
-    }());
-    function isListLikeIterable(obj) {
-        if (!isJsObject(obj))
-            return false;
-        return Array.isArray(obj) ||
-            (!(obj instanceof Map) && // JS Map are iterables but return entries as [k, v]
-                getSymbolIterator() in obj); // JS Iterable have a Symbol.iterator prop
-    }
-    function areIterablesEqual(a, b, comparator) {
-        var iterator1 = a[getSymbolIterator()]();
-        var iterator2 = b[getSymbolIterator()]();
-        while (true) {
-            var item1 = iterator1.next();
-            var item2 = iterator2.next();
-            if (item1.done && item2.done)
-                return true;
-            if (item1.done || item2.done)
-                return false;
-            if (!comparator(item1.value, item2.value))
-                return false;
-        }
-    }
-    function iterateListLike(obj, fn) {
-        if (Array.isArray(obj)) {
-            for (var i = 0; i < obj.length; i++) {
-                fn(obj[i]);
-            }
-        }
-        else {
-            var iterator = obj[getSymbolIterator()]();
-            var item = void 0;
-            while (!((item = iterator.next()).done)) {
-                fn(item.value);
-            }
-        }
-    }
-    function isJsObject(o) {
-        return o !== null && (typeof o === 'function' || typeof o === 'object');
-    }
-
-    /**
-     * @license
-     * Copyright Google Inc. All Rights Reserved.
-     *
-     * Use of this source code is governed by an MIT-style license that can be
-     * found in the LICENSE file at https://angular.io/license
-     */
-    function stringify$2(value) {
-        if (typeof value == 'function')
-            return value.name || value;
-        if (typeof value == 'string')
-            return value;
-        if (value == null)
-            return '';
-        return '' + value;
-    }
-    /**
-     * Flattens an array in non-recursive way. Input arrays are not modified.
-     */
-    function flatten$2(list) {
-        var result = [];
-        var i = 0;
-        while (i < list.length) {
-            var item = list[i];
-            if (Array.isArray(item)) {
-                if (item.length > 0) {
-                    list = item.concat(list.slice(i + 1));
-                    i = 0;
-                }
-                else {
-                    i++;
-                }
-            }
-            else {
-                result.push(item);
-                i++;
-            }
-        }
-        return result;
-    }
-    function assertDataInRangeInternal(index, arr) {
-        assertLessThan(index, arr ? arr.length : 0, 'index expected to be a valid data index');
-    }
-    function getLNode(tNode, hostView) {
-        return readElementValue(hostView[tNode.index]);
-    }
-    function isContentQueryHost(tNode) {
-        return (tNode.flags & 16384 /* hasContentQuery */) !== 0;
-    }
-
-    /**
-     * @license
-     * Copyright Google Inc. All Rights Reserved.
-     *
-     * Use of this source code is governed by an MIT-style license that can be
-     * found in the LICENSE file at https://angular.io/license
-     */
-    /** Retrieves the parent LNode of a given node. */
-    function getParentLNode(tNode, currentView) {
-        return tNode.parent == null ? getHostElementNode(currentView) :
-            getLNode(tNode.parent, currentView);
-    }
-    /**
-     * Gets the host LElementNode given a view. Will return null if the host element is an
-     * LViewNode, since they are being phased out.
-     */
-    function getHostElementNode(currentView) {
-        var hostTNode = currentView[HOST_NODE];
-        return hostTNode && hostTNode.type !== 2 /* View */ ?
-            getLNode(hostTNode, currentView[PARENT]) :
-            null;
-    }
-    function getContainerNode(tNode, embeddedView) {
+    function getLContainer(tNode, embeddedView) {
         if (tNode.index === -1) {
             // This is a dynamically created view inside a dynamic container.
             // If the host index is -1, the view has not yet been inserted, so it has no parent.
             var containerHostIndex = embeddedView[CONTAINER_INDEX];
-            return containerHostIndex > -1 ?
-                embeddedView[PARENT][containerHostIndex].dynamicLContainerNode :
-                null;
+            return containerHostIndex > -1 ? embeddedView[PARENT][containerHostIndex] : null;
         }
         else {
             // This is a inline view node (e.g. embeddedViewStart)
-            return getParentLNode(tNode, embeddedView[PARENT]);
+            return embeddedView[PARENT][tNode.parent.index];
         }
     }
     /**
@@ -25020,45 +25251,39 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * one found, or on all of them.
      *
      * @param viewToWalk the view to walk
-     * @param action identifies the action to be performed on the LElement nodes.
+     * @param action identifies the action to be performed on the elements
      * @param renderer the current renderer.
-     * @param renderParentNode Optional the render parent node to be set in all LContainerNodes found,
+     * @param renderParent Optional the render parent node to be set in all LContainers found,
      * required for action modes Insert and Destroy.
      * @param beforeNode Optional the node before which elements should be added, required for action
      * Insert.
      */
-    function walkTNodeTree(viewToWalk, action, renderer, renderParentNode, beforeNode) {
+    function walkTNodeTree(viewToWalk, action, renderer, renderParent, beforeNode) {
         var rootTNode = viewToWalk[TVIEW].node;
         var projectionNodeIndex = -1;
         var currentView = viewToWalk;
         var tNode = rootTNode.child;
         while (tNode) {
             var nextTNode = null;
-            var parent_1 = renderParentNode ? renderParentNode.native : null;
             if (tNode.type === 3 /* Element */) {
-                var elementNode = getLNode(tNode, currentView);
-                executeNodeAction(action, renderer, parent_1, elementNode.native, beforeNode);
-                if (elementNode.dynamicLContainerNode) {
-                    executeNodeAction(action, renderer, parent_1, elementNode.dynamicLContainerNode.native, beforeNode);
+                executeNodeAction(action, renderer, renderParent, getNativeByTNode(tNode, currentView), beforeNode);
+                var nodeOrContainer = currentView[tNode.index];
+                if (isLContainer(nodeOrContainer)) {
+                    // This element has an LContainer, and its comment needs to be handled
+                    executeNodeAction(action, renderer, renderParent, nodeOrContainer[NATIVE], beforeNode);
                 }
             }
             else if (tNode.type === 0 /* Container */) {
-                var lContainerNode = currentView[tNode.index];
-                executeNodeAction(action, renderer, parent_1, lContainerNode.native, beforeNode);
-                var childContainerData = lContainerNode.dynamicLContainerNode ?
-                    lContainerNode.dynamicLContainerNode.data :
-                    lContainerNode.data;
-                if (renderParentNode) {
-                    childContainerData[RENDER_PARENT] = renderParentNode;
-                }
-                if (childContainerData[VIEWS].length) {
-                    currentView = childContainerData[VIEWS][0];
+                var lContainer = currentView[tNode.index];
+                executeNodeAction(action, renderer, renderParent, lContainer[NATIVE], beforeNode);
+                if (renderParent)
+                    lContainer[RENDER_PARENT] = renderParent;
+                if (lContainer[VIEWS].length) {
+                    currentView = lContainer[VIEWS][0];
                     nextTNode = currentView[TVIEW].node;
                     // When the walker enters a container, then the beforeNode has to become the local native
                     // comment node.
-                    beforeNode = lContainerNode.dynamicLContainerNode ?
-                        lContainerNode.dynamicLContainerNode.native :
-                        lContainerNode.native;
+                    beforeNode = lContainer[NATIVE];
                 }
             }
             else if (tNode.type === 1 /* Projection */) {
@@ -25086,7 +25311,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
                 }
                 nextTNode = tNode.next;
                 /**
-                 * Find the next node in the LNode tree, taking into account the place where a node is
+                 * Find the next node in the TNode tree, taking into account the place where a node is
                  * projected (in the shadow DOM) rather than where it comes from (in the light DOM).
                  *
                  * If there is no sibling node, then it goes to the next sibling of the parent node...
@@ -25100,7 +25325,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
                     // When exiting a container, the beforeNode must be restored to the previous value
                     if (tNode.type === 0 /* Container */) {
                         currentView = currentView[PARENT];
-                        beforeNode = currentView[tNode.index].native;
+                        beforeNode = currentView[tNode.index][NATIVE];
                     }
                     if (tNode.type === 2 /* View */ && currentView[NEXT]) {
                         currentView = currentView[NEXT];
@@ -25238,10 +25463,8 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
     }
     /** Gets the child of the given LViewData */
     function getLViewChild(viewData) {
-        if (viewData[TVIEW].childIndex === -1)
-            return null;
-        var hostNode = viewData[viewData[TVIEW].childIndex];
-        return hostNode.data ? hostNode.data : hostNode.dynamicLContainerNode.data;
+        var childIndex = viewData[TVIEW].childIndex;
+        return childIndex === -1 ? null : viewData[childIndex];
     }
     /**
      * A standalone function which destroys an LView,
@@ -25252,7 +25475,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
     function destroyLView(view) {
         var renderer = view[RENDERER];
         if (isProceduralRenderer(renderer) && renderer.destroyNode) {
-            walkTNodeTree(view, 2 /* Destroy */, renderer);
+            walkTNodeTree(view, 2 /* Destroy */, renderer, null);
         }
         destroyViewTree(view);
         // Sets the destroyed flag
@@ -25276,7 +25499,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             tNode.type === 2 /* View */) {
             // if it's an embedded view, the state needs to go up to the container, in case the
             // container has a next
-            return getContainerNode(tNode, state).data;
+            return getLContainer(tNode, state);
         }
         else {
             // otherwise, use parent view for containers or component views
@@ -25289,7 +25512,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * @param view The LViewData to clean up
      */
     function cleanUpView(viewOrContainer) {
-        if (viewOrContainer[TVIEW]) {
+        if (viewOrContainer.length >= HEADER_OFFSET) {
             var view = viewOrContainer;
             removeListeners(view);
             executeOnDestroys(view);
@@ -25308,7 +25531,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             for (var i = 0; i < cleanup.length - 1; i += 2) {
                 if (typeof cleanup[i] === 'string') {
                     // This is a listener with the native renderer
-                    var native = readElementValue(viewData[cleanup[i + 1]]).native;
+                    var native = readElementValue(viewData[cleanup[i + 1]]);
                     var listener = viewData[CLEANUP][cleanup[i + 2]];
                     native.removeEventListener(cleanup[i], listener, cleanup[i + 3]);
                     i += 2;
@@ -25359,6 +25582,14 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * found in the LICENSE file at https://angular.io/license
      */
 
+    /**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+
     /**
      * @license
      * Copyright Google Inc. All Rights Reserved.
@@ -25470,8 +25701,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * context, this is the TView.expandoStartIndex + any dirs/hostVars before the given dir.
      */
     var bindingRootIndex = -1;
-    // Root component will always have an element index of 0 and an injector size of 1
-    var ROOT_EXPANDO_INSTRUCTIONS = [0, 1];
     /**
      * Swap the current state with a new state.
      *
@@ -25604,81 +25833,52 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
     }
     function createLViewData(renderer, tView, context, flags, sanitizer) {
         var instance = tView.blueprint.slice();
-        instance[PARENT] = instance[DECLARATION_VIEW] = viewData;
         instance[FLAGS] = flags | 1 /* CreationMode */ | 8 /* Attached */ | 16 /* RunInit */;
+        instance[PARENT] = instance[DECLARATION_VIEW] = viewData;
         instance[CONTEXT] = context;
         instance[INJECTOR$1] = viewData ? viewData[INJECTOR$1] : null;
         instance[RENDERER] = renderer;
         instance[SANITIZER] = sanitizer || null;
         return instance;
     }
-    /**
-     * Creation of LNode object is extracted to a separate function so we always create LNode object
-     * with the same shape
-     * (same properties assigned in the same order).
-     */
-    function createLNodeObject(type, native, state) {
-        return { native: native, data: state, dynamicLContainerNode: null };
-    }
-    function createNodeAtIndex(index, type, native, name, attrs, state) {
-        var parent = isParent ? previousOrParentTNode : previousOrParentTNode && previousOrParentTNode.parent;
-        // Parents cannot cross component boundaries because components will be used in multiple places,
-        // so it's only set if the view is the same.
-        var parentInSameView = parent && viewData && parent !== viewData[HOST_NODE];
-        var tParent = parentInSameView ? parent : null;
-        var isState = state != null;
-        var node = createLNodeObject(type, native, isState ? state : null);
-        var tNode;
-        if (index === -1 || type === 2 /* View */) {
-            // View nodes are not stored in data because they can be added / removed at runtime (which
-            // would cause indices to change). Their TNodes are instead stored in tView.node.
-            tNode = (state ? state[TVIEW].node : null) ||
-                createTNode(type, index, null, null, tParent, null);
-        }
-        else {
-            var adjustedIndex = index + HEADER_OFFSET;
-            // This is an element or container or projection node
-            var tData = tView.data;
-            ngDevMode && assertLessThan(adjustedIndex, viewData.length, "Slot should have been initialized with null");
-            viewData[adjustedIndex] = node;
-            if (tData[adjustedIndex] == null) {
-                var tNode_1 = tData[adjustedIndex] =
-                    createTNode(type, adjustedIndex, name, attrs, tParent, null);
-                if (!isParent && previousOrParentTNode) {
-                    previousOrParentTNode.next = tNode_1;
-                    if (previousOrParentTNode.dynamicContainerNode)
-                        previousOrParentTNode.dynamicContainerNode.next = tNode_1;
-                }
-            }
-            tNode = tData[adjustedIndex];
-            if (!tView.firstChild && type === 3 /* Element */) {
-                tView.firstChild = tNode;
-            }
+    function createNodeAtIndex(index, type, native, name, attrs) {
+        var adjustedIndex = index + HEADER_OFFSET;
+        ngDevMode &&
+            assertLessThan(adjustedIndex, viewData.length, "Slot should have been initialized with null");
+        viewData[adjustedIndex] = native;
+        var tNode = tView.data[adjustedIndex];
+        if (tNode == null) {
+            tNode = tView.data[adjustedIndex] = createTNode(type, adjustedIndex, name, attrs, null);
             // Now link ourselves into the tree.
-            if (isParent && previousOrParentTNode) {
-                if (previousOrParentTNode.child == null && parentInSameView ||
-                    previousOrParentTNode.type === 2 /* View */) {
-                    // We are in the same view, which means we are adding content node to the parent View.
+            if (previousOrParentTNode) {
+                if (isParent && previousOrParentTNode.child == null &&
+                    (tNode.parent !== null || previousOrParentTNode.type === 2 /* View */)) {
+                    // We are in the same view, which means we are adding content node to the parent view.
                     previousOrParentTNode.child = tNode;
                 }
+                else if (!isParent) {
+                    previousOrParentTNode.next = tNode;
+                }
             }
         }
-        // View nodes and host elements need to set their host node (components do not save host TNodes)
-        if ((type & 2 /* ViewOrElement */) === 2 /* ViewOrElement */ && isState) {
-            var lViewData = state;
-            ngDevMode &&
-                assertEqual(lViewData[HOST_NODE], null, 'lViewData[HOST_NODE] should not have been initialized');
-            lViewData[HOST_NODE] = tNode;
-            if (lViewData[TVIEW].firstTemplatePass) {
-                lViewData[TVIEW].node = tNode;
-            }
+        if (tView.firstChild == null && type === 3 /* Element */) {
+            tView.firstChild = tNode;
         }
         previousOrParentTNode = tNode;
         isParent = true;
         return tNode;
     }
+    function createViewNode(index, view) {
+        // View nodes are not stored in data because they can be added / removed at runtime (which
+        // would cause indices to change). Their TNodes are instead stored in tView.node.
+        if (view[TVIEW].node == null) {
+            view[TVIEW].node = createTNode(2 /* View */, index, null, null, null);
+        }
+        isParent = true;
+        return previousOrParentTNode = view[HOST_NODE] = view[TVIEW].node;
+    }
     /**
-     * When LNodes are created dynamically after a view blueprint is created (e.g. through
+     * When elements are created dynamically after a view blueprint is created (e.g. through
      * i18nApply() or ComponentFactory.create), we need to adjust the blueprint for future
      * template passes.
      */
@@ -25715,7 +25915,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         if (queries) {
             lView[QUERIES] = queries.createView();
         }
-        createNodeAtIndex(-1, 2 /* View */, null, null, null, lView);
+        createViewNode(-1, lView);
         if (tView.firstTemplatePass) {
             tView.node.injectorIndex = injectorIndex;
         }
@@ -25917,7 +26117,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             childIndex: -1,
             bindingStartIndex: bindingStartIndex,
             expandoStartIndex: initialViewLength,
-            directives: null,
             expandoInstructions: null,
             firstTemplatePass: true,
             initHooks: null,
@@ -26007,26 +26206,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         }
         return rNode;
     }
-    /**
-     * Creates the host LNode.
-     *
-     * @param rNode Render host element.
-     * @param def ComponentDef
-     *
-     * @returns LElementNode created
-     */
-    function hostElement(tag, rNode, def, sanitizer) {
-        resetComponentState();
-        var tNode = createNodeAtIndex(0, 3 /* Element */, rNode, null, null, createLViewData(renderer, getOrCreateTView(def.template, def.consts, def.vars, def.directiveDefs, def.pipeDefs, def.viewQuery), null, def.onPush ? 4 /* Dirty */ : 2 /* CheckAlways */, sanitizer));
-        if (firstTemplatePass) {
-            tView.expandoInstructions = ROOT_EXPANDO_INSTRUCTIONS.slice();
-            if (def.diPublic)
-                def.diPublic(def);
-            tNode.flags =
-                viewData.length << 15 /* DirectiveStartingIndexShift */ | 4096 /* isComponent */;
-        }
-        return viewData[HEADER_OFFSET];
-    }
     /**
      * Saves the cleanup function itself in LView.cleanupInstances.
      *
@@ -26048,16 +26227,20 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * @param adjustedIndex The index of the TNode in TView.data, adjusted for HEADER_OFFSET
      * @param tagName The tag name of the node
      * @param attrs The attributes defined on this node
-     * @param parent The parent of this node
      * @param tViews Any TViews attached to this node
      * @returns the TNode object
      */
-    function createTNode(type, adjustedIndex, tagName, attrs, parent, tViews) {
+    function createTNode(type, adjustedIndex, tagName, attrs, tViews) {
         ngDevMode && ngDevMode.tNode++;
+        var parent = isParent ? previousOrParentTNode : previousOrParentTNode && previousOrParentTNode.parent;
+        // Parents cannot cross component boundaries because components will be used in multiple places,
+        // so it's only set if the view is the same.
+        var parentInSameView = parent && viewData && parent !== viewData[HOST_NODE];
+        var tParent = parentInSameView ? parent : null;
         return {
             type: type,
             index: adjustedIndex,
-            injectorIndex: parent ? parent.injectorIndex : -1,
+            injectorIndex: tParent ? tParent.injectorIndex : -1,
             flags: 0,
             tagName: tagName,
             attrs: attrs,
@@ -26068,8 +26251,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             tViews: tViews,
             next: null,
             child: null,
-            parent: parent,
-            dynamicContainerNode: null,
+            parent: tParent,
             detached: null,
             stylingTemplate: null,
             projection: null
@@ -26088,10 +26270,11 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * @param directiveDef DirectiveDef object which contains information about the template.
      */
     function directiveCreate(directiveDefIdx, directive, directiveDef) {
-        var hostNode = getLNode(previousOrParentTNode, viewData);
-        var instance = baseDirectiveCreate(directiveDefIdx, directive, directiveDef, hostNode);
+        var native = getNativeByTNode(previousOrParentTNode, viewData);
+        var instance = baseDirectiveCreate(directiveDefIdx, directive, directiveDef, native);
         if (directiveDef.template) {
-            hostNode.data[CONTEXT] = directive;
+            var componentView = getComponentViewByIndex(previousOrParentTNode.index, viewData);
+            componentView[CONTEXT] = directive;
         }
         if (firstTemplatePass) {
             // Init hooks are queued now so ngOnInit is called in host components before
@@ -26113,12 +26296,12 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * This version does not contain features that we don't already support at root in
      * current Angular. Example: local refs and inputs on root component.
      */
-    function baseDirectiveCreate(index, directive, directiveDef, hostNode) {
+    function baseDirectiveCreate(index, directive, directiveDef, native) {
         ngDevMode && assertEqual(viewData[BINDING_INDEX], tView.bindingStartIndex, 'directives should be created before any bindings');
         ngDevMode && assertPreviousIsParent();
         attachPatchData(directive, viewData);
-        if (hostNode) {
-            attachPatchData(hostNode.native, viewData);
+        if (native) {
+            attachPatchData(native, viewData);
         }
         viewData[index] = directive;
         if (firstTemplatePass) {
@@ -26146,7 +26329,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
                 diPublic(directiveDef);
         }
         if (directiveDef.attributes != null && previousOrParentTNode.type == 3 /* Element */) {
-            setUpAttributes(hostNode.native, directiveDef.attributes);
+            setUpAttributes(native, directiveDef.attributes);
         }
         return directive;
     }
@@ -26218,7 +26401,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             // Note: current can be an LViewData or an LContainer instance, but here we are only interested
             // in LContainer. We can tell it's an LContainer because its length is less than the LViewData
             // header.
-            if (current.length < HEADER_OFFSET && current[ACTIVE_INDEX] === null) {
+            if (current.length < HEADER_OFFSET && current[ACTIVE_INDEX] === -1) {
                 var container_1 = current;
                 for (var i = 0; i < container_1[VIEWS].length; i++) {
                     var dynamicViewData = container_1[VIEWS][i];
@@ -26237,11 +26420,8 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      */
     function componentRefresh(adjustedElementIndex, parentFirstTemplatePass) {
         ngDevMode && assertDataInRange(adjustedElementIndex);
-        var element = readElementValue(viewData[adjustedElementIndex]);
+        var hostView = getComponentViewByIndex(adjustedElementIndex, viewData);
         ngDevMode && assertNodeType(tView.data[adjustedElementIndex], 3 /* Element */);
-        ngDevMode &&
-            assertDefined(element.data, "Component's host node should have an LViewData attached.");
-        var hostView = element.data;
         // Only attached CheckAlways components or attached, dirty OnPush components should be checked
         if (viewAttached(hostView) && hostView[FLAGS] & (2 /* CheckAlways */ | 4 /* Dirty */)) {
             parentFirstTemplatePass && syncViewWithBlueprint(hostView);
@@ -26352,10 +26532,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * @param component The component which the change detection should be performed on.
      */
     function detectChanges(component) {
-        var hostNode = getLElementFromComponent(component);
-        ngDevMode &&
-            assertDefined(hostNode, 'Component host node should be attached to an LViewData instance.');
-        detectChangesInternal(hostNode.data, component);
+        detectChangesInternal(getComponentViewByInstance(component), component);
     }
     /**
      * Synchronously perform change detection on a root view and its components.
@@ -26427,9 +26604,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
     }
     /** A special value which designates that a value has not changed. */
     var NO_CHANGE = {};
-    function getTNode(index) {
-        return tView.data[index + HEADER_OFFSET];
-    }
     function assertPreviousIsParent() {
         assertEqual(isParent, true, 'previousOrParentTNode should be a parent');
     }
@@ -26447,15 +26621,45 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
+    // Root component will always have an element index of 0 and an injector size of 1
+    var ROOT_EXPANDO_INSTRUCTIONS = [0, 1];
+    /**
+     * Creates the root component view and the root component node.
+     *
+     * @param rNode Render host element.
+     * @param def ComponentDef
+     * @param rootView The parent view where the host node is stored
+     * @param renderer The current renderer
+     * @param sanitizer The sanitizer, if provided
+     *
+     * @returns Component view created
+     */
+    function createRootComponentView(rNode, def, rootView, renderer, sanitizer) {
+        resetComponentState();
+        var tView = rootView[TVIEW];
+        var componentView = createLViewData(renderer, getOrCreateTView(def.template, def.consts, def.vars, def.directiveDefs, def.pipeDefs, def.viewQuery), null, def.onPush ? 4 /* Dirty */ : 2 /* CheckAlways */, sanitizer);
+        var tNode = createNodeAtIndex(0, 3 /* Element */, rNode, null, null);
+        if (tView.firstTemplatePass) {
+            tView.expandoInstructions = ROOT_EXPANDO_INSTRUCTIONS.slice();
+            if (def.diPublic)
+                def.diPublic(def);
+            tNode.flags =
+                rootView.length << 15 /* DirectiveStartingIndexShift */ | 4096 /* isComponent */;
+        }
+        // Store component view at node index, with node as the HOST
+        componentView[HOST] = rootView[HEADER_OFFSET];
+        componentView[HOST_NODE] = tNode;
+        return rootView[HEADER_OFFSET] = componentView;
+    }
     /**
      * Creates a root component and sets it up with features and host bindings. Shared by
      * renderComponent() and ViewContainerRef.createComponent().
      */
-    function createRootComponent(elementNode, componentDef, rootView, rootContext, hostFeatures) {
+    function createRootComponent(hostRNode, componentView, componentDef, rootView, rootContext, hostFeatures) {
         // Create directive instance with factory() and store at next index in viewData
-        var component = baseDirectiveCreate(rootView.length, componentDef.factory(), componentDef, elementNode);
+        var component = baseDirectiveCreate(rootView.length, componentDef.factory(), componentDef, hostRNode);
         rootContext.components.push(component);
-        elementNode.data[CONTEXT] = component;
+        componentView[CONTEXT] = component;
         hostFeatures && hostFeatures.forEach(function (feature) { return feature(component, componentDef); });
         if (rootView[TVIEW].firstTemplatePass)
             prefillHostVars(componentDef.hostVars);
@@ -26499,76 +26703,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * found in the LICENSE file at https://angular.io/license
      */
 
-    /**
-     * @license
-     * Copyright Google Inc. All Rights Reserved.
-     *
-     * Use of this source code is governed by an MIT-style license that can be
-     * found in the LICENSE file at https://angular.io/license
-     */
-
-    /**
-     * @license
-     * Copyright Google Inc. All Rights Reserved.
-     *
-     * Use of this source code is governed by an MIT-style license that can be
-     * found in the LICENSE file at https://angular.io/license
-     */
-    /**
-     * @deprecated Use the `Renderer2` instead.
-     */
-    var Renderer = /** @class */ (function () {
-        function Renderer() {
-        }
-        return Renderer;
-    }());
-    var Renderer2Interceptor = new InjectionToken('Renderer2Interceptor');
-    /**
-     * Creates and initializes a custom renderer that implements the `Renderer2` base class.
-     *
-     * @experimental
-     */
-    var RendererFactory2 = /** @class */ (function () {
-        function RendererFactory2() {
-        }
-        return RendererFactory2;
-    }());
-    /**
-     * Flags for renderer-specific style modifiers.
-     * @experimental
-     */
-    var RendererStyleFlags2;
-    (function (RendererStyleFlags2) {
-        /**
-         * Marks a style as important.
-         */
-        RendererStyleFlags2[RendererStyleFlags2["Important"] = 1] = "Important";
-        /**
-         * Marks a style as using dash case naming (this-is-dash-case).
-         */
-        RendererStyleFlags2[RendererStyleFlags2["DashCase"] = 2] = "DashCase";
-    })(RendererStyleFlags2 || (RendererStyleFlags2 = {}));
-    /**
-     * Extend this base class to implement custom rendering. By default, Angular
-     * renders a template into DOM. You can use custom rendering to intercept
-     * rendering calls, or to render to something other than DOM.
-     *
-     * Create your custom renderer using `RendererFactory2`.
-     *
-     * Use a custom renderer to bypass Angular's templating and
-     * make custom UI changes that can't be expressed declaratively.
-     * For example if you need to set a property or an attribute whose name is
-     * not statically known, use the `setProperty()` or
-     * `setAttribute()` method.
-     *
-     * @experimental
-     */
-    var Renderer2 = /** @class */ (function () {
-        function Renderer2() {
-        }
-        return Renderer2;
-    }());
-
     /**
      * @license
      * Copyright Google Inc. All Rights Reserved.
@@ -26689,15 +26823,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         }
         return parentView;
     }
-    function getOrCreateRenderer2(view) {
-        var renderer = view[RENDERER];
-        if (isProceduralRenderer(renderer)) {
-            return renderer;
-        }
-        else {
-            throw new Error('Cannot inject Renderer2 when the application uses Renderer3!');
-        }
-    }
     /**
      * Returns the value associated to the given token from the injectors.
      *
@@ -26875,9 +27000,6 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             this._injectorIndex = getOrCreateNodeInjectorForNode(_tNode, _hostView);
         }
         NodeInjector.prototype.get = function (token) {
-            if (token === Renderer2) {
-                return getOrCreateRenderer2(this._hostView);
-            }
             setEnvironment(this._tNode, this._hostView);
             return getOrCreateInjectable(this._tNode, this._hostView, token);
         };
@@ -27262,7 +27384,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
                 return ElementRef_;
             }(ElementRefToken));
         }
-        return new R3ElementRef(getLNode(tNode, view).native);
+        return new R3ElementRef(getNativeByTNode(tNode, view));
     }
     var R3TemplateRef;
     /**
@@ -27289,10 +27411,10 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
                     _this._injectorIndex = _injectorIndex;
                     return _this;
                 }
-                TemplateRef_.prototype.createEmbeddedView = function (context, container$$1, tContainerNode, hostView, index) {
+                TemplateRef_.prototype.createEmbeddedView = function (context, container$$1, hostTNode, hostView, index) {
                     var lView = createEmbeddedViewAndNode(this._tView, context, this._declarationParentView, this._renderer, this._queries, this._injectorIndex);
                     if (container$$1) {
-                        insertView(lView, container$$1, hostView, index, tContainerNode.parent.index);
+                        insertView(lView, container$$1, hostView, index, hostTNode.index);
                     }
                     renderEmbeddedTemplate(lView, this._tView, context, 1 /* Create */);
                     var viewRef = new ViewRef(lView, context, -1);
@@ -27302,10 +27424,10 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
                 return TemplateRef_;
             }(TemplateRefToken));
         }
-        var hostNode = getLNode(hostTNode, hostView);
+        var hostContainer = hostView[hostTNode.index];
         ngDevMode && assertNodeType(hostTNode, 0 /* Container */);
         ngDevMode && assertDefined(hostTNode.tViews, 'TView must be allocated');
-        return new R3TemplateRef(hostView, createElementRef(ElementRefToken, hostTNode, hostView), hostTNode.tViews, getRenderer(), hostNode.data[QUERIES], hostTNode.injectorIndex);
+        return new R3TemplateRef(hostView, createElementRef(ElementRefToken, hostTNode, hostView), hostTNode.tViews, getRenderer(), hostContainer[QUERIES], hostTNode.injectorIndex);
     }
 
     /**
@@ -27333,10 +27455,12 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
     var R3_TEMPLATE_REF_FACTORY__PRE_NGCC__ = noopFactory;
     var R3_CHANGE_DETECTOR_REF_FACTORY__PRE_NGCC__ = noopFactory;
     var R3_VIEW_CONTAINER_REF_FACTORY__PRE_NGCC__ = noopFactory;
+    var R3_RENDERER2_FACTORY__PRE_NGCC__ = noopFactory;
     var R3_ELEMENT_REF_FACTORY$1 = R3_ELEMENT_REF_FACTORY__PRE_NGCC__;
     var R3_TEMPLATE_REF_FACTORY$1 = R3_TEMPLATE_REF_FACTORY__PRE_NGCC__;
     var R3_CHANGE_DETECTOR_REF_FACTORY$1 = R3_CHANGE_DETECTOR_REF_FACTORY__PRE_NGCC__;
     var R3_VIEW_CONTAINER_REF_FACTORY$1 = R3_VIEW_CONTAINER_REF_FACTORY__PRE_NGCC__;
+    var R3_RENDERER2_FACTORY$1 = R3_RENDERER2_FACTORY__PRE_NGCC__;
 
     /**
      * @license
@@ -27369,6 +27493,70 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         return ElementRef;
     }());
 
+    /**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+    /**
+     * @deprecated Use the `Renderer2` instead.
+     */
+    var Renderer = /** @class */ (function () {
+        function Renderer() {
+        }
+        return Renderer;
+    }());
+    var Renderer2Interceptor = new InjectionToken('Renderer2Interceptor');
+    /**
+     * Creates and initializes a custom renderer that implements the `Renderer2` base class.
+     *
+     * @experimental
+     */
+    var RendererFactory2 = /** @class */ (function () {
+        function RendererFactory2() {
+        }
+        return RendererFactory2;
+    }());
+    /**
+     * Flags for renderer-specific style modifiers.
+     * @experimental
+     */
+    var RendererStyleFlags2;
+    (function (RendererStyleFlags2) {
+        /**
+         * Marks a style as important.
+         */
+        RendererStyleFlags2[RendererStyleFlags2["Important"] = 1] = "Important";
+        /**
+         * Marks a style as using dash case naming (this-is-dash-case).
+         */
+        RendererStyleFlags2[RendererStyleFlags2["DashCase"] = 2] = "DashCase";
+    })(RendererStyleFlags2 || (RendererStyleFlags2 = {}));
+    /**
+     * Extend this base class to implement custom rendering. By default, Angular
+     * renders a template into DOM. You can use custom rendering to intercept
+     * rendering calls, or to render to something other than DOM.
+     *
+     * Create your custom renderer using `RendererFactory2`.
+     *
+     * Use a custom renderer to bypass Angular's templating and
+     * make custom UI changes that can't be expressed declaratively.
+     * For example if you need to set a property or an attribute whose name is
+     * not statically known, use the `setProperty()` or
+     * `setAttribute()` method.
+     *
+     * @experimental
+     */
+    var Renderer2 = /** @class */ (function () {
+        function Renderer2() {
+        }
+        /** @internal */
+        Renderer2.__NG_ELEMENT_ID__ = function () { return R3_RENDERER2_FACTORY$1(); };
+        return Renderer2;
+    }());
+
     /**
      * @license
      * Copyright Google Inc. All Rights Reserved.
@@ -27455,7 +27643,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             else {
                 rendererFactory = domRendererFactory3;
             }
-            var hostNode = isInternalRootView ?
+            var hostRNode = isInternalRootView ?
                 elementCreate(this.selector, rendererFactory.createRenderer(null, this.componentDef)) :
                 locateHostElement(rendererFactory, rootSelectorOrNode);
             // The first index of the first selector is the tag name.
@@ -27465,21 +27653,20 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             var rootContext = ngModule && !isInternalRootView ?
                 ngModule.injector.get(ROOT_CONTEXT) :
                 createRootContext(requestAnimationFrame.bind(window));
+            var renderer = rendererFactory.createRenderer(hostRNode, this.componentDef);
             // Create the root view. Uses empty TView and ContentTemplate.
-            var rootView = createLViewData(rendererFactory.createRenderer(hostNode, this.componentDef), createTView(-1, null, 1, 0, null, null, null), rootContext, rootFlags);
+            var rootView = createLViewData(renderer, createTView(-1, null, 1, 0, null, null, null), rootContext, rootFlags);
             rootView[INJECTOR$1] = ngModule && ngModule.injector || null;
             // rootView is the parent when bootstrapping
             var oldView = enterView(rootView, null);
             var component;
-            var elementNode;
             var tElementNode;
             try {
                 if (rendererFactory.begin)
                     rendererFactory.begin();
-                // Create element node at index 0 in data array
-                elementNode = hostElement(componentTag, hostNode, this.componentDef);
-                tElementNode = getTNode(0);
-                // Transform the arrays of native nodes into a LNode structure that can be consumed by the
+                var componentView = createRootComponentView(hostRNode, this.componentDef, rootView, renderer);
+                tElementNode = getTNode(0, rootView);
+                // Transform the arrays of native nodes into a structure that can be consumed by the
                 // projection instruction. This is needed to support the reprojection of these nodes.
                 if (projectableNodes) {
                     var index = 0;
@@ -27500,9 +27687,8 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
                 // TODO: should LifecycleHooksFeature and other host features be generated by the compiler and
                 // executed here?
                 // Angular 5 reference: https://stackblitz.com/edit/lifecycle-hooks-vcref
-                component = createRootComponent(elementNode, this.componentDef, rootView, rootContext, [LifecycleHooksFeature]);
+                component = createRootComponent(hostRNode, componentView, this.componentDef, rootView, rootContext, [LifecycleHooksFeature]);
                 // Execute the template in creation mode only, and then turn off the CreationMode flag
-                var componentView = elementNode.data;
                 renderEmbeddedTemplate(componentView, componentView[TVIEW], component, 1 /* Create */);
                 componentView[FLAGS] &= ~1 /* CreationMode */;
             }
@@ -27537,7 +27723,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             _this.destroyCbs = [];
             _this.instance = instance;
             _this.hostView = _this.changeDetectorRef = new RootViewRef(rootView);
-            _this.hostView._tViewNode = createNodeAtIndex(-1, 2 /* View */, null, null, null, rootView);
+            _this.hostView._tViewNode = createViewNode(-1, rootView);
             _this.injector = injector;
             _this.componentType = componentType;
             return _this;
@@ -32277,7 +32463,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         }
         return Version;
     }());
-    var VERSION$2 = new Version$1('7.0.0-rc.1');
+    var VERSION$2 = new Version$1('7.0.0');
 
     /**
      * @license
@@ -38218,6 +38404,14 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * found in the LICENSE file at https://angular.io/license
      */
 
+    /**
+     * @license
+     * Copyright Google Inc. All Rights Reserved.
+     *
+     * Use of this source code is governed by an MIT-style license that can be
+     * found in the LICENSE file at https://angular.io/license
+     */
+
     /**
      * @license
      * Copyright Google Inc. All Rights Reserved.
@@ -43298,11 +43492,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
             this.debugContextFactory = getCurrentDebugContext;
             this.data = this.delegate.data;
         }
-        Object.defineProperty(DebugRenderer2.prototype, "debugContext", {
-            get: function () { return this.debugContextFactory(); },
-            enumerable: true,
-            configurable: true
-        });
+        DebugRenderer2.prototype.createDebugContext = function (nativeElement) { return this.debugContextFactory(nativeElement); };
         DebugRenderer2.prototype.destroyNode = function (node) {
             removeDebugNodeFromIndex(getDebugNode(node));
             if (this.delegate.destroyNode) {
@@ -43312,7 +43502,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         DebugRenderer2.prototype.destroy = function () { this.delegate.destroy(); };
         DebugRenderer2.prototype.createElement = function (name, namespace) {
             var el = this.delegate.createElement(name, namespace);
-            var debugCtx = this.debugContext;
+            var debugCtx = this.createDebugContext(el);
             if (debugCtx) {
                 var debugEl = new DebugElement(el, null, debugCtx);
                 debugEl.name = name;
@@ -43322,7 +43512,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         };
         DebugRenderer2.prototype.createComment = function (value) {
             var comment = this.delegate.createComment(value);
-            var debugCtx = this.debugContext;
+            var debugCtx = this.createDebugContext(comment);
             if (debugCtx) {
                 indexDebugNode(new DebugNode(comment, null, debugCtx));
             }
@@ -43330,7 +43520,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         };
         DebugRenderer2.prototype.createText = function (value) {
             var text = this.delegate.createText(value);
-            var debugCtx = this.debugContext;
+            var debugCtx = this.createDebugContext(text);
             if (debugCtx) {
                 indexDebugNode(new DebugNode(text, null, debugCtx));
             }
@@ -43363,7 +43553,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         };
         DebugRenderer2.prototype.selectRootElement = function (selectorOrNode, preserveContent) {
             var el = this.delegate.selectRootElement(selectorOrNode, preserveContent);
-            var debugCtx = getCurrentDebugContext();
+            var debugCtx = getCurrentDebugContext() || (null);
             if (debugCtx) {
                 indexDebugNode(new DebugElement(el, null, debugCtx));
             }
@@ -43493,6 +43683,53 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * found in the LICENSE file at https://angular.io/license
      */
 
+    /**
+     * Returns the host component instance associated with the target.
+     *
+     * This will only return a component instance of the DOM node
+     * contains an instance of a component on it.
+     */
+    function getHostComponent(target) {
+        var context = loadContext(target);
+        var tNode = context.lViewData[TVIEW].data[context.nodeIndex];
+        if (tNode.flags & 4096 /* isComponent */) {
+            var componentView = getComponentViewByIndex(context.nodeIndex, context.lViewData);
+            return componentView[CONTEXT];
+        }
+        return null;
+    }
+    /**
+     * Returns the injector instance that is associated with
+     * the element, component or directive.
+     */
+    function getInjector(target) {
+        var context = loadContext(target);
+        var tNode = context.lViewData[TVIEW].data[context.nodeIndex];
+        return new NodeInjector(tNode, context.lViewData);
+    }
+    /**
+     * Returns LContext associated with a target passed as an argument.
+     * Throws if a given target doesn't have associated LContext.
+     */
+    function loadContext(target) {
+        var context = getContext(target);
+        if (!context) {
+            throw new Error(ngDevMode ? 'Unable to find the given context data for the given target' :
+                'Invalid ng target');
+        }
+        return context;
+    }
+    /**
+     *  Retrieve map of local references (local reference name => element or directive instance).
+     */
+    function getLocalRefs(target) {
+        var context = loadContext(target);
+        if (context.localRefs === undefined) {
+            context.localRefs = discoverLocalRefs(context.lViewData, context.nodeIndex);
+        }
+        return context.localRefs || {};
+    }
+
     /**
      * @license
      * Copyright Google Inc. All Rights Reserved.
@@ -43510,9 +43747,9 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
         function Render3DebugRendererFactory2() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
-        Render3DebugRendererFactory2.prototype.createRenderer = function (element$$1, renderData) {
-            var renderer = _super.prototype.createRenderer.call(this, element$$1, renderData);
-            renderer.debugContextFactory = function () { return new Render3DebugContext(_getViewData()); };
+        Render3DebugRendererFactory2.prototype.createRenderer = function (element, renderData) {
+            var renderer = _super.prototype.createRenderer.call(this, element, renderData);
+            renderer.debugContextFactory = function (nativeElement) { return new Render3DebugContext(nativeElement); };
             return renderer;
         };
         return Render3DebugRendererFactory2;
@@ -43523,88 +43760,71 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * Used in tests to retrieve information those nodes.
      */
     var Render3DebugContext = /** @class */ (function () {
-        function Render3DebugContext(viewData) {
-            this.viewData = viewData;
-            // The LNode will be created next and appended to viewData
-            this.nodeIndex = viewData ? viewData.length : null;
+        function Render3DebugContext(_nativeNode) {
+            this._nativeNode = _nativeNode;
         }
+        Object.defineProperty(Render3DebugContext.prototype, "nodeIndex", {
+            get: function () { return loadContext(this._nativeNode).nodeIndex; },
+            enumerable: true,
+            configurable: true
+        });
         Object.defineProperty(Render3DebugContext.prototype, "view", {
-            get: function () { return this.viewData; },
+            get: function () { return loadContext(this._nativeNode).lViewData; },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(Render3DebugContext.prototype, "injector", {
-            get: function () {
-                if (this.nodeIndex !== null) {
-                    var tNode = this.view[TVIEW].data[this.nodeIndex];
-                    return new NodeInjector(tNode, this.view);
-                }
-                return Injector.NULL;
-            },
+            get: function () { return getInjector(this._nativeNode); },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(Render3DebugContext.prototype, "component", {
-            get: function () {
-                // TODO(vicb): why/when
-                if (this.nodeIndex === null) {
-                    return null;
-                }
-                var tView = this.view[TVIEW];
-                var components = tView.components;
-                return (components && components.indexOf(this.nodeIndex) == -1) ?
-                    null :
-                    this.view[this.nodeIndex].data[CONTEXT];
-            },
+            get: function () { return getHostComponent(this._nativeNode); },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(Render3DebugContext.prototype, "providerTokens", {
-            // TODO(vicb): add view providers when supported
             get: function () {
-                // TODO(vicb): why/when
-                var directiveDefs = this.view[TVIEW].data;
-                if (this.nodeIndex === null || directiveDefs == null) {
-                    return [];
-                }
-                var currentTNode = this.view[TVIEW].data[this.nodeIndex];
-                var dirStart = currentTNode >> 15 /* DirectiveStartingIndexShift */;
-                var dirEnd = dirStart + (currentTNode & 4095 /* DirectiveCountMask */);
-                return directiveDefs.slice(dirStart, dirEnd);
+                var lDebugCtx = loadContext(this._nativeNode);
+                var lViewData = lDebugCtx.lViewData;
+                var tNode = lViewData[TVIEW].data[lDebugCtx.nodeIndex];
+                var directivesCount = tNode.flags & 4095 /* DirectiveCountMask */;
+                if (directivesCount > 0) {
+                    var directiveIdxStart = tNode.flags >> 15 /* DirectiveStartingIndexShift */;
+                    var directiveIdxEnd = directiveIdxStart + directivesCount;
+                    var viewDirectiveDefs = this.view[TVIEW].data;
+                    var directiveDefs = viewDirectiveDefs.slice(directiveIdxStart, directiveIdxEnd);
+                    return directiveDefs.map(function (directiveDef) { return directiveDef.type; });
+                }
+                return [];
             },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(Render3DebugContext.prototype, "references", {
-            get: function () {
-                // TODO(vicb): implement retrieving references
-                throw new Error('Not implemented yet in ivy');
-            },
+            get: function () { return getLocalRefs(this._nativeNode); },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(Render3DebugContext.prototype, "context", {
-            get: function () {
-                if (this.nodeIndex === null) {
-                    return null;
-                }
-                var lNode = this.view[this.nodeIndex];
-                return lNode.view[CONTEXT];
-            },
+            // TODO(pk): check previous implementation and re-implement
+            get: function () { throw new Error('Not implemented in ivy'); },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(Render3DebugContext.prototype, "componentRenderElement", {
+            // TODO(pk): check previous implementation and re-implement
             get: function () { throw new Error('Not implemented in ivy'); },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(Render3DebugContext.prototype, "renderNode", {
+            // TODO(pk): check previous implementation and re-implement
             get: function () { throw new Error('Not implemented in ivy'); },
             enumerable: true,
             configurable: true
         });
-        // TODO(vicb): check previous implementation
+        // TODO(pk): check previous implementation and re-implement
         Render3DebugContext.prototype.logError = function (console) {
             var values = [];
             for (var _i = 1; _i < arguments.length; _i++) {
@@ -44644,7 +44864,7 @@ define(['exports', 'fs', 'path', 'typescript'], function (exports, fs, path, ts)
      * Use of this source code is governed by an MIT-style license that can be
      * found in the LICENSE file at https://angular.io/license
      */
-    var VERSION$3 = new Version$1('7.0.0-rc.1');
+    var VERSION$3 = new Version$1('7.0.0');
 
     /**
      * @license