Linked Time: Replace view encapsulation hack with ::ng-deep (tensor…

…flow#6103)

## Motivation for features / changes
tensorflow#6092 was pretty hacky and also didn't work internally

## Technical description of changes
Apparently the pseudo selector ::ng-deep temporarily removes
encapsulation and generally works better anyway.

## Screenshots of UI changes
It works in OSS

![image](https://user-images.githubusercontent.com/78179109/207216000-4993095f-a419-4c10-9463-c57b7420e5dd.png)

It works internally

![image](https://user-images.githubusercontent.com/78179109/207215848-fab8de51-38a6-45b5-a550-2f021306ef77.png)

## Detailed steps to verify changes work correctly (as executed by you)
See tensorflow#6092

tensorboard/webapp/widgets/line_chart_v2/line_chart_component.ng.html

@@ -23,7 +23,6 @@
   #overlayTarget="cdkOverlayOrigin"
   cdkOverlayOrigin
 >
-  <line-chart-unencapsulated></line-chart-unencapsulated>
   <div class="series-view" #seriesView>
     <line-chart-grid-view
       *ngIf="!lineOnly"

tensorboard/webapp/widgets/line_chart_v2/line_chart_component.scss

@@ -18,6 +18,14 @@ limitations under the License.
   contain: strict;
   display: inline-block;
 
+  ::ng-deep .line-chart:has(.horizontal-prospective-area:hover) {
+    .x-axis {
+      .extent-edit-button {
+        visibility: visible;
+      }
+    }
+  }
+
   .custom-vis {
     // custom-vis shows on top of interactive-view but we still need to give
     // mouse interactions to the interactive-view. Currently, the contract is

tensorboard/webapp/widgets/line_chart_v2/sub_view/BUILD

@@ -22,7 +22,6 @@ tf_ng_module(
         "line_chart_grid_view.ts",
         "line_chart_interactive_utils.ts",
         "line_chart_interactive_view.ts",
-        "line_chart_unencapsulated.ts",
         "sub_view_module.ts",
     ],
     assets = [

tensorboard/webapp/widgets/line_chart_v2/sub_view/sub_view_module.ts

@@ -22,7 +22,6 @@ import {MatMenuModule} from '@angular/material/menu';
 import {LineChartAxisComponent} from './line_chart_axis_view';
 import {LineChartGridView} from './line_chart_grid_view';
 import {LineChartInteractiveViewComponent} from './line_chart_interactive_view';
-import {LineChartUnencapsulated} from './line_chart_unencapsulated';
 
 /**
  * SubViewModule provides UI elements for a traditional line chart; axes, grid, and
@@ -34,13 +33,11 @@ import {LineChartUnencapsulated} from './line_chart_unencapsulated';
     LineChartAxisComponent,
     LineChartInteractiveViewComponent,
     LineChartGridView,
-    LineChartUnencapsulated,
   ],
   exports: [
     LineChartAxisComponent,
     LineChartInteractiveViewComponent,
     LineChartGridView,
-    LineChartUnencapsulated,
   ],
   imports: [
     CommonModule,