refactor: allow options to be passed to focus methods

Updates the `focus` methods on the different components to allow for the `FocusOptions` to be passed in.

Fixes #14182.

Author: crisbeto

src/lib/button-toggle/button-toggle.ts

@@ -491,8 +491,8 @@ export class MatButtonToggle extends _MatButtonToggleMixinBase implements OnInit
   }
 
   /** Focuses the button. */
-  focus(): void {
-    this._buttonElement.nativeElement.focus();
+  focus(options?: FocusOptions): void {
+    this._buttonElement.nativeElement.focus(options);
   }
 
   /** Checks the button toggle due to an interaction with the underlying native button. */

src/lib/button/button.ts

@@ -123,8 +123,8 @@ export class MatButton extends _MatButtonMixinBase
   }
 
   /** Focuses the button. */
-  focus(): void {
-    this._getHostElement().focus();
+  focus(options?: FocusOptions): void {
+    this._getHostElement().focus(options);
   }
 
   _getHostElement() {

src/lib/checkbox/checkbox.ts

@@ -404,8 +404,8 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc
   }
 
   /** Focuses the checkbox. */
-  focus(): void {
-    this._focusMonitor.focusVia(this._inputElement, 'keyboard');
+  focus(options?: FocusOptions): void {
+    this._focusMonitor.focusVia(this._inputElement, 'keyboard', options);
   }
 
   _onInteractionEvent(event: Event) {

src/lib/chips/chip-input.ts

@@ -149,8 +149,8 @@ export class MatChipInput implements MatChipTextControl, OnChanges {
   }
 
   /** Focuses the input. */
-  focus(): void {
-    this._inputElement.focus();
+  focus(options?: FocusOptions): void {
+    this._inputElement.focus(options);
   }
 
   /** Checks whether a keycode is one of the configured separators. */

src/lib/chips/chip-list.ts

@@ -453,7 +453,7 @@ export class MatChipList extends _MatChipListMixinBase implements MatFormFieldCo
    * Focuses the the first non-disabled chip in this chip list, or the associated input when there
    * are no eligible chips.
    */
-  focus(): void {
+  focus(options?: FocusOptions): void {
     if (this.disabled) {
       return;
     }
@@ -466,15 +466,15 @@ export class MatChipList extends _MatChipListMixinBase implements MatFormFieldCo
       this._keyManager.setFirstItemActive();
       this.stateChanges.next();
     } else {
-      this._focusInput();
+      this._focusInput(options);
       this.stateChanges.next();
     }
   }
 
   /** Attempt to focus an input if we have one. */
-  _focusInput() {
+  _focusInput(options?: FocusOptions) {
     if (this._chipInput) {
-      this._chipInput.focus();
+      this._chipInput.focus(options);
     }
   }
 

src/lib/chips/chip-text-control.ts

@@ -22,5 +22,5 @@ export interface MatChipTextControl {
   empty: boolean;
 
   /** Focuses the text control. */
-  focus(): void;
+  focus(options?: FocusOptions): void;
 }

src/lib/core/option/option.ts

@@ -24,6 +24,7 @@ import {
   QueryList,
   ViewEncapsulation,
 } from '@angular/core';
+import {FocusOptions} from '@angular/cdk/a11y';
 import {Subject} from 'rxjs';
 import {MatOptgroup} from './optgroup';
 
@@ -161,11 +162,11 @@ export class MatOption implements AfterViewChecked, OnDestroy {
   }
 
   /** Sets focus onto this option. */
-  focus(): void {
+  focus(options?: FocusOptions): void {
     const element = this._getHostElement();
 
     if (typeof element.focus === 'function') {
-      element.focus();
+      element.focus(options);
     }
   }
 

src/lib/expansion/expansion-panel-header.ts

@@ -160,8 +160,8 @@ export class MatExpansionPanelHeader implements OnDestroy, FocusableOption {
    * @param origin Origin of the action that triggered the focus.
    * @docs-private
    */
-  focus(origin: FocusOrigin = 'program') {
-    this._focusMonitor.focusVia(this._element, origin);
+  focus(origin: FocusOrigin = 'program', options?: FocusOptions) {
+    this._focusMonitor.focusVia(this._element, origin, options);
   }
 
   ngOnDestroy() {

src/lib/input/input.ts

@@ -310,7 +310,7 @@ export class MatInput extends _MatInputMixinBase implements MatFormFieldControl<
   }
 
   /** Focuses the input. */
-  focus(): void { this._elementRef.nativeElement.focus(); }
+  focus(options?: FocusOptions): void { this._elementRef.nativeElement.focus(options); }
 
   /** Callback for the cases where the focused state of the input changes. */
   _focusChanged(isFocused: boolean) {

src/lib/list/selection-list.ts

@@ -280,8 +280,8 @@ export class MatListOption extends _MatListOptionMixinBase
   providers: [MAT_SELECTION_LIST_VALUE_ACCESSOR],
   changeDetection: ChangeDetectionStrategy.OnPush
 })
-export class MatSelectionList extends _MatSelectionListMixinBase implements FocusableOption,
-    CanDisableRipple, AfterContentInit, ControlValueAccessor, OnDestroy {
+export class MatSelectionList extends _MatSelectionListMixinBase implements CanDisableRipple,
+  AfterContentInit, ControlValueAccessor, OnDestroy {
 
   /** The FocusKeyManager which handles focus. */
   _keyManager: FocusKeyManager<MatListOption>;
@@ -374,8 +374,8 @@ export class MatSelectionList extends _MatSelectionListMixinBase implements Focu
   }
 
   /** Focuses the last active list option. */
-  focus() {
-    this._element.nativeElement.focus();
+  focus(options?: FocusOptions) {
+    this._element.nativeElement.focus(options);
   }
 
   /** Selects all of the options. */

src/lib/menu/menu-item.ts

@@ -94,11 +94,11 @@ export class MatMenuItem extends _MatMenuItemMixinBase
   }
 
   /** Focuses the menu item. */
-  focus(origin: FocusOrigin = 'program'): void {
+  focus(origin: FocusOrigin = 'program', options?: FocusOptions): void {
     if (this._focusMonitor) {
-      this._focusMonitor.focusVia(this._getHostElement(), origin);
+      this._focusMonitor.focusVia(this._getHostElement(), origin, options);
     } else {
-      this._getHostElement().focus();
+      this._getHostElement().focus(options);
     }
   }
 

src/lib/menu/menu-trigger.ts

@@ -250,11 +250,11 @@ export class MatMenuTrigger implements AfterContentInit, OnDestroy {
    * Focuses the menu trigger.
    * @param origin Source of the menu trigger's focus.
    */
-  focus(origin: FocusOrigin = 'program') {
+  focus(origin: FocusOrigin = 'program', options?: FocusOptions) {
     if (this._focusMonitor) {
-      this._focusMonitor.focusVia(this._element, origin);
+      this._focusMonitor.focusVia(this._element, origin, options);
     } else {
-      this._element.nativeElement.focus();
+      this._element.nativeElement.focus(options);
     }
   }
 

src/lib/radio/radio.ts

@@ -491,8 +491,8 @@ export class MatRadioButton extends _MatRadioButtonMixinBase
   }
 
   /** Focuses the radio button. */
-  focus(): void {
-    this._focusMonitor.focusVia(this._inputElement, 'keyboard');
+  focus(options?: FocusOptions): void {
+    this._focusMonitor.focusVia(this._inputElement, 'keyboard', options);
   }
 
   /**

src/lib/select/select.ts

@@ -1009,8 +1009,8 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit,
   }
 
   /** Focuses the select element. */
-  focus(): void {
-    this._elementRef.nativeElement.focus();
+  focus(options?: FocusOptions): void {
+    this._elementRef.nativeElement.focus(options);
   }
 
   /** Gets the index of the provided option in the option list. */

src/lib/slide-toggle/slide-toggle.ts

@@ -280,8 +280,8 @@ export class MatSlideToggle extends _MatSlideToggleMixinBase implements OnDestro
   }
 
   /** Focuses the slide-toggle. */
-  focus(): void {
-    this._focusMonitor.focusVia(this._inputElement, 'keyboard');
+  focus(options?: FocusOptions): void {
+    this._focusMonitor.focusVia(this._inputElement, 'keyboard', options);
   }
 
   /** Toggles the checked state of the slide-toggle. */

src/lib/slider/slider.ts

@@ -294,8 +294,8 @@ export class MatSlider extends _MatSliderMixinBase
   }
 
   /** set focus to the host element */
-  focus() {
-    this._focusHostElement();
+  focus(options?: FocusOptions) {
+    this._focusHostElement(options);
   }
 
   /** blur the host element */
@@ -747,8 +747,8 @@ export class MatSlider extends _MatSliderMixinBase
    * Focuses the native element.
    * Currently only used to allow a blur event to fire but will be used with keyboard input later.
    */
-  private _focusHostElement() {
-    this._elementRef.nativeElement.focus();
+  private _focusHostElement(options?: FocusOptions) {
+    this._elementRef.nativeElement.focus(options);
   }
 
   /** Blurs the native element. */