feat(tabs): Enable rendering tabs list and tab content in independent locations

[byanofsky]

trafficstars

Feature Description

Currently, MatTabGroup renders the tab content immediately below the list of tab labels:

[ Tab 1 ] [ Tab 2 ] [ Tab 3 ]
-----------------------------
Tab content

This new feature will enable consumers to specify a separate location where the tab content should be rendered.

Use Case

The goal is to render content between the tab labels and tab content.

Example:

[ Tab 1 ] [ Tab 2 ] [ Tab 3 ]             [ Button ]
---------------------------------------------------
Tab content

Usage example:

<mat-tab-group>
  <mat-tab label="Tab 1">Content 1</mat-tab>
  <mat-tab label="Tab 2">Content 2</mat-tab>
  <mat-tab label="Tab 3">Content 3</mat-tab>
</mat-tab-group>
<button>Button</button>

<mat-tab-group-body></mat-tab-group-body>

Contribution

I have an in progress PR that I will link to this issue.