fix(tabs): some bugs with docs and coercion (#20356)

* fix(tabs): add missing coercion for active input

* fix(tabs): add missing docs

(cherry picked from commit 0ee25a2)

Author: rafaelss95

src/material/tabs/tab-content.ts

@@ -21,5 +21,6 @@ export const MAT_TAB_CONTENT = new InjectionToken<MatTabContent>('MatTabContent'
   providers: [{provide: MAT_TAB_CONTENT, useExisting: MatTabContent}],
 })
 export class MatTabContent {
-  constructor(public template: TemplateRef<any>) { }
+  constructor(
+    /** Content for the tab. */ public template: TemplateRef<any>) {}
 }

src/material/tabs/tab-nav-bar/tab-nav-bar.ts

@@ -5,12 +5,15 @@
  * 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
  */
+import {FocusableOption, FocusMonitor} from '@angular/cdk/a11y';
 import {Directionality} from '@angular/cdk/bidi';
+import {BooleanInput, coerceBooleanProperty, NumberInput} from '@angular/cdk/coercion';
 import {Platform} from '@angular/cdk/platform';
 import {ViewportRuler} from '@angular/cdk/scrolling';
 import {
   AfterContentChecked,
   AfterContentInit,
+  AfterViewInit,
   Attribute,
   ChangeDetectionStrategy,
   ChangeDetectorRef,
@@ -27,7 +30,6 @@ import {
   QueryList,
   ViewChild,
   ViewEncapsulation,
-  AfterViewInit,
 } from '@angular/core';
 import {
   CanDisable, CanDisableCtor,
@@ -42,12 +44,10 @@ import {
   RippleTarget,
   ThemePalette,
 } from '@angular/material/core';
-import {BooleanInput, coerceBooleanProperty, NumberInput} from '@angular/cdk/coercion';
-import {FocusMonitor, FocusableOption} from '@angular/cdk/a11y';
 import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations';
+import {startWith, takeUntil} from 'rxjs/operators';
 import {MatInkBar} from '../ink-bar';
 import {MatPaginatedTabHeader, MatPaginatedTabHeaderItem} from '../paginated-tab-header';
-import {startWith, takeUntil} from 'rxjs/operators';
 
 /**
  * Base class with all of the `MatTabNav` functionality.
@@ -201,7 +201,9 @@ export class _MatTabLinkBase extends _MatTabLinkMixinBase implements AfterViewIn
   @Input()
   get active(): boolean { return this._isActive; }
   set active(value: boolean) {
-    if (value !== this._isActive) {
+    const newValue = coerceBooleanProperty(value);
+
+    if (newValue !== this._isActive) {
       this._isActive = value;
       this._tabNavBar.updateActiveLink(this.elementRef);
     }
@@ -225,7 +227,8 @@ export class _MatTabLinkBase extends _MatTabLinkMixinBase implements AfterViewIn
   }
 
   constructor(
-      private _tabNavBar: _MatTabNavBase, public elementRef: ElementRef,
+      private _tabNavBar: _MatTabNavBase,
+      /** @docs-private */ public elementRef: ElementRef,
       @Optional() @Inject(MAT_RIPPLE_GLOBAL_OPTIONS) globalRippleOptions: RippleGlobalOptions|null,
       @Attribute('tabindex') tabIndex: string, private _focusMonitor: FocusMonitor,
       @Optional() @Inject(ANIMATION_MODULE_TYPE) animationMode?: string) {
@@ -239,6 +242,7 @@ export class _MatTabLinkBase extends _MatTabLinkMixinBase implements AfterViewIn
     }
   }
 
+  /** Focuses the tab link. */
   focus() {
     this.elementRef.nativeElement.focus();
   }
@@ -251,6 +255,7 @@ export class _MatTabLinkBase extends _MatTabLinkMixinBase implements AfterViewIn
     this._focusMonitor.stopMonitoring(this.elementRef);
   }
 
+  static ngAcceptInputType_active: BooleanInput;
   static ngAcceptInputType_disabled: BooleanInput;
   static ngAcceptInputType_disableRipple: BooleanInput;
   static ngAcceptInputType_tabIndex: NumberInput;

tools/public_api_guard/material/tabs.d.ts

@@ -82,14 +82,14 @@ export declare abstract class _MatTabHeaderBase extends MatPaginatedTabHeader im
 export declare class _MatTabLinkBase extends _MatTabLinkMixinBase implements AfterViewInit, OnDestroy, CanDisable, CanDisableRipple, HasTabIndex, RippleTarget, FocusableOption {
     protected _isActive: boolean;
     get active(): boolean;
-    set active(value: boolean);
-    elementRef: ElementRef;
+    set active(value: boolean); elementRef: ElementRef;
     rippleConfig: RippleConfig & RippleGlobalOptions;
     get rippleDisabled(): boolean;
     constructor(_tabNavBar: _MatTabNavBase, elementRef: ElementRef, globalRippleOptions: RippleGlobalOptions | null, tabIndex: string, _focusMonitor: FocusMonitor, animationMode?: string);
     focus(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
+    static ngAcceptInputType_active: BooleanInput;
     static ngAcceptInputType_disableRipple: BooleanInput;
     static ngAcceptInputType_disabled: BooleanInput;
     static ngAcceptInputType_tabIndex: NumberInput;
@@ -180,9 +180,8 @@ export declare class MatTabChangeEvent {
     tab: MatTab;
 }
 
-export declare class MatTabContent {
-    template: TemplateRef<any>;
-    constructor(template: TemplateRef<any>);
+export declare class MatTabContent { template: TemplateRef<any>;
+    constructor( template: TemplateRef<any>);
     static ɵdir: i0.ɵɵDirectiveDefWithMeta<MatTabContent, "[matTabContent]", never, {}, {}, never>;
     static ɵfac: i0.ɵɵFactoryDef<MatTabContent, never>;
 }