refactor(material/stepper): remove deprecated APIs for v12

Removes the APIs that have been marked for removal in v12.

BREAKING CHANGES:
* `MAT_STEPPER_GLOBAL_OPTIONS` has been renamed to `STEPPER_GLOBAL_OPTIONS`.
* The type of `CdkStepper._stepHeader` has been changed to `QueryList<CdkStepHeader>` from
`QueryList<FocusableOption>` to better reflect the actual value.
* The value of `CdkStepper.selected` can now be `undefined`.
* The `_elementRef` and `_document` parameters of the `CdkStepper` constructor are now required.
* The `_elementRef` and `_document` parameters of the `MatVerticalStepper` constructor are now
required.
* The `_viewContainerRef` parameter of the `MatStep` constructor is now required.

Author: crisbeto

src/cdk/schematics/ng-update/data/constructor-checks.ts

@@ -21,6 +21,10 @@ export const constructorChecks: VersionChanges<ConstructorChecksUpgradeData> = {
     {
       pr: 'https://github.com/angular/components/pull/21876',
       changes: ['CdkTable', 'StickyStyler']
+    },
+    {
+      pr: 'https://github.com/angular/components/issues/21900',
+      changes: ['CdkStepper']
     }
   ],
   [TargetVersion.V11]: [

src/cdk/stepper/stepper.ts

@@ -87,13 +87,6 @@ export const STEP_STATE = {
 /** InjectionToken that can be used to specify the global stepper options. */
 export const STEPPER_GLOBAL_OPTIONS = new InjectionToken<StepperOptions>('STEPPER_GLOBAL_OPTIONS');
 
-/**
- * InjectionToken that can be used to specify the global stepper options.
- * @deprecated Use `STEPPER_GLOBAL_OPTIONS` instead.
- * @breaking-change 8.0.0.
- */
-export const MAT_STEPPER_GLOBAL_OPTIONS = STEPPER_GLOBAL_OPTIONS;
-
 /** Configurable options for stepper. */
 export interface StepperOptions {
   /**
@@ -200,7 +193,6 @@ export class CdkStep implements OnChanges {
     return this.stepControl && this.stepControl.invalid && this.interacted;
   }
 
-  /** @breaking-change 8.0.0 remove the `?` after `stepperOptions` */
   constructor(
       @Inject(forwardRef(() => CdkStepper)) public _stepper: CdkStepper,
       @Optional() @Inject(STEPPER_GLOBAL_OPTIONS) stepperOptions?: StepperOptions) {
@@ -254,24 +246,16 @@ export class CdkStepper implements AfterContentInit, AfterViewInit, OnDestroy {
   /** Used for managing keyboard focus. */
   private _keyManager: FocusKeyManager<FocusableOption>;
 
-  /**
-   * @breaking-change 8.0.0 Remove `| undefined` once the `_document`
-   * constructor param is required.
-   */
-  private _document: Document|undefined;
+  private _document: Document;
 
   /** Full list of steps inside the stepper, including inside nested steppers. */
   @ContentChildren(CdkStep, {descendants: true}) _steps: QueryList<CdkStep>;
 
   /** Steps that belong to the current stepper, excluding ones from nested steppers. */
   readonly steps: QueryList<CdkStep> = new QueryList<CdkStep>();
 
-  /**
-   * The list of step headers of the steps in the stepper.
-   * @deprecated Type to be changed to `QueryList<CdkStepHeader>`.
-   * @breaking-change 8.0.0
-   */
-  @ContentChildren(CdkStepHeader, {descendants: true}) _stepHeader: QueryList<FocusableOption>;
+  /** The list of step headers of the steps in the stepper. */
+  @ContentChildren(CdkStepHeader, {descendants: true}) _stepHeader: QueryList<CdkStepHeader>;
 
   /** Whether the validity of previous steps should be checked or not. */
   @Input()
@@ -317,12 +301,11 @@ export class CdkStepper implements AfterContentInit, AfterViewInit, OnDestroy {
 
   /** The step that is selected. */
   @Input()
-  get selected(): CdkStep {
-    // @breaking-change 8.0.0 Change return type to `CdkStep | undefined`.
-    return this.steps ? this.steps.toArray()[this.selectedIndex] : undefined!;
+  get selected(): CdkStep | undefined {
+    return this.steps ? this.steps.toArray()[this.selectedIndex] : undefined;
   }
-  set selected(step: CdkStep) {
-    this.selectedIndex = this.steps ? this.steps.toArray().indexOf(step) : -1;
+  set selected(step: CdkStep | undefined) {
+    this.selectedIndex = (step && this.steps) ? this.steps.toArray().indexOf(step) : -1;
   }
 
   /** Event emitted when the selected step has changed. */
@@ -336,8 +319,7 @@ export class CdkStepper implements AfterContentInit, AfterViewInit, OnDestroy {
 
   constructor(
       @Optional() private _dir: Directionality, private _changeDetectorRef: ChangeDetectorRef,
-      // @breaking-change 8.0.0 `_elementRef` and `_document` parameters to become required.
-      private _elementRef?: ElementRef<HTMLElement>, @Inject(DOCUMENT) _document?: any) {
+      private _elementRef: ElementRef<HTMLElement>, @Inject(DOCUMENT) _document: any) {
     this._groupId = nextId++;
     this._document = _document;
   }
@@ -526,10 +508,6 @@ export class CdkStepper implements AfterContentInit, AfterViewInit, OnDestroy {
 
   /** Checks whether the stepper contains the focused element. */
   private _containsFocus(): boolean {
-    if (!this._document || !this._elementRef) {
-      return false;
-    }
-
     const stepperElement = this._elementRef.nativeElement;
     const focusedElement = this._document.activeElement;
     return stepperElement === focusedElement || stepperElement.contains(focusedElement);

src/material/schematics/ng-update/data/constructor-checks.ts

@@ -18,6 +18,10 @@ export const constructorChecks: VersionChanges<ConstructorChecksUpgradeData> = {
     {
       pr: 'https://github.com/angular/components/pull/21897',
       changes: ['MatTooltip']
+    },
+    {
+      pr: 'https://github.com/angular/components/issues/21900',
+      changes: ['MatVerticalStepper', 'MatStep']
     }
   ],
   [TargetVersion.V11]: [

src/material/stepper/stepper.ts

@@ -78,29 +78,24 @@ export class MatStep extends CdkStep implements ErrorStateMatcher, AfterContentI
   /** Currently-attached portal containing the lazy content. */
   _portal: TemplatePortal;
 
-  /** @breaking-change 8.0.0 remove the `?` after `stepperOptions` */
-  /** @breaking-change 9.0.0 _viewContainerRef parameter to become required. */
   constructor(@Inject(forwardRef(() => MatStepper)) stepper: MatStepper,
               @SkipSelf() private _errorStateMatcher: ErrorStateMatcher,
-              @Optional() @Inject(STEPPER_GLOBAL_OPTIONS) stepperOptions?: StepperOptions,
-              private _viewContainerRef?: ViewContainerRef) {
+              private _viewContainerRef: ViewContainerRef,
+              @Optional() @Inject(STEPPER_GLOBAL_OPTIONS) stepperOptions?: StepperOptions) {
     super(stepper, stepperOptions);
   }
 
   ngAfterContentInit() {
-    /** @breaking-change 9.0.0 Null check for _viewContainerRef to be removed. */
-    if (this._viewContainerRef) {
-      this._isSelected = this._stepper.steps.changes.pipe(switchMap(() => {
-        return this._stepper.selectionChange.pipe(
-          map(event => event.selectedStep === this),
-          startWith(this._stepper.selected === this)
-        );
-      })).subscribe(isSelected => {
-        if (isSelected && this._lazyContent && !this._portal) {
-          this._portal = new TemplatePortal(this._lazyContent._template, this._viewContainerRef!);
-        }
-      });
-    }
+    this._isSelected = this._stepper.steps.changes.pipe(switchMap(() => {
+      return this._stepper.selectionChange.pipe(
+        map(event => event.selectedStep === this),
+        startWith(this._stepper.selected === this)
+      );
+    })).subscribe(isSelected => {
+      if (isSelected && this._lazyContent && !this._portal) {
+        this._portal = new TemplatePortal(this._lazyContent._template, this._viewContainerRef!);
+      }
+    });
   }
 
   ngOnDestroy() {
@@ -233,9 +228,8 @@ export class MatVerticalStepper extends MatStepper {
   constructor(
     @Optional() dir: Directionality,
     changeDetectorRef: ChangeDetectorRef,
-    // @breaking-change 8.0.0 `elementRef` and `_document` parameters to become required.
-    elementRef?: ElementRef<HTMLElement>,
-    @Inject(DOCUMENT) _document?: any) {
+    elementRef: ElementRef<HTMLElement>,
+    @Inject(DOCUMENT) _document: any) {
     super(dir, changeDetectorRef, elementRef, _document);
     this._orientation = 'vertical';
   }

tools/public_api_guard/cdk/stepper.d.ts

@@ -51,17 +51,17 @@ export declare class CdkStepper implements AfterContentInit, AfterViewInit, OnDe
     protected _destroyed: Subject<void>;
     _groupId: number;
     protected _orientation: StepperOrientation;
-    _stepHeader: QueryList<FocusableOption>;
+    _stepHeader: QueryList<CdkStepHeader>;
     _steps: QueryList<CdkStep>;
     get linear(): boolean;
     set linear(value: boolean);
-    get selected(): CdkStep;
-    set selected(step: CdkStep);
+    get selected(): CdkStep | undefined;
+    set selected(step: CdkStep | undefined);
     get selectedIndex(): number;
     set selectedIndex(index: number);
     selectionChange: EventEmitter<StepperSelectionEvent>;
     readonly steps: QueryList<CdkStep>;
-    constructor(_dir: Directionality, _changeDetectorRef: ChangeDetectorRef, _elementRef?: ElementRef<HTMLElement> | undefined, _document?: any);
+    constructor(_dir: Directionality, _changeDetectorRef: ChangeDetectorRef, _elementRef: ElementRef<HTMLElement>, _document: any);
     _getAnimationDirection(index: number): StepContentPositionState;
     _getFocusIndex(): number | null;
     _getIndicatorType(index: number, state?: StepState): StepState;
@@ -108,8 +108,6 @@ export declare class CdkStepperPrevious {
     static ɵfac: i0.ɵɵFactoryDef<CdkStepperPrevious, never>;
 }
 
-export declare const MAT_STEPPER_GLOBAL_OPTIONS: InjectionToken<StepperOptions>;
-
 export declare const STEP_STATE: {
     NUMBER: string;
     EDIT: string;

tools/public_api_guard/material/stepper.d.ts

@@ -21,12 +21,12 @@ export declare class MatStep extends CdkStep implements ErrorStateMatcher, After
     _portal: TemplatePortal;
     color: ThemePalette;
     stepLabel: MatStepLabel;
-    constructor(stepper: MatStepper, _errorStateMatcher: ErrorStateMatcher, stepperOptions?: StepperOptions, _viewContainerRef?: ViewContainerRef | undefined);
+    constructor(stepper: MatStepper, _errorStateMatcher: ErrorStateMatcher, _viewContainerRef: ViewContainerRef, stepperOptions?: StepperOptions);
     isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean;
     ngAfterContentInit(): void;
     ngOnDestroy(): void;
     static ɵcmp: i0.ɵɵComponentDefWithMeta<MatStep, "mat-step", ["matStep"], { "color": "color"; }, {}, ["stepLabel", "_lazyContent"], ["*"]>;
-    static ɵfac: i0.ɵɵFactoryDef<MatStep, [null, { skipSelf: true; }, { optional: true; }, null]>;
+    static ɵfac: i0.ɵɵFactoryDef<MatStep, [null, { skipSelf: true; }, null, { optional: true; }]>;
 }
 
 export declare class MatStepContent {
@@ -130,7 +130,7 @@ export declare class MatStepperPrevious extends CdkStepperPrevious {
 }
 
 export declare class MatVerticalStepper extends MatStepper {
-    constructor(dir: Directionality, changeDetectorRef: ChangeDetectorRef, elementRef?: ElementRef<HTMLElement>, _document?: any);
+    constructor(dir: Directionality, changeDetectorRef: ChangeDetectorRef, elementRef: ElementRef<HTMLElement>, _document: any);
     static ngAcceptInputType_completed: BooleanInput;
     static ngAcceptInputType_editable: BooleanInput;
     static ngAcceptInputType_hasError: BooleanInput;