fix(material/select): global option not disabling popover

Fixes that disabling popovers globally wasn't doing so for `mat-select`.

Relates to #32592 (comment).

Author: crisbeto

goldens/material/paginator/index.api.md

@@ -21,6 +21,7 @@ import { Directionality } from '@angular/cdk/bidi';
 import { DoCheck } from '@angular/core';
 import { ElementRef } from '@angular/core';
 import { EventEmitter } from '@angular/core';
+import { FlexibleOverlayPopoverLocation } from '@angular/cdk/overlay';
 import { FocusableOption } from '@angular/cdk/a11y';
 import { FocusOrigin } from '@angular/cdk/a11y';
 import { FormGroupDirective } from '@angular/forms';

goldens/material/select/index.api.md

@@ -20,6 +20,7 @@ import { ControlValueAccessor } from '@angular/forms';
 import { DoCheck } from '@angular/core';
 import { ElementRef } from '@angular/core';
 import { EventEmitter } from '@angular/core';
+import { FlexibleOverlayPopoverLocation } from '@angular/cdk/overlay';
 import { FocusableOption } from '@angular/cdk/a11y';
 import { FocusOrigin } from '@angular/cdk/a11y';
 import { FormGroupDirective } from '@angular/forms';
@@ -340,6 +341,8 @@ export class MatSelect implements AfterContentInit, OnChanges, OnDestroy, OnInit
     protected _parentFormField: MatFormField | null;
     get placeholder(): string;
     set placeholder(value: string);
+    // (undocumented)
+    protected _popoverLocation: FlexibleOverlayPopoverLocation | null;
     _positions: ConnectedPosition[];
     _preferredOverlayOrigin: CdkOverlayOrigin | ElementRef | undefined;
     registerOnChange(fn: (value: any) => void): void;

src/material/select/select.html

@@ -40,7 +40,7 @@
   [cdkConnectedOverlayPositions]="_positions"
   [cdkConnectedOverlayWidth]="_overlayWidth"
   [cdkConnectedOverlayFlexibleDimensions]="true"
-  cdkConnectedOverlayUsePopover="inline"
+  [cdkConnectedOverlayUsePopover]="_popoverLocation"
   (detach)="close()"
   (backdropClick)="close()"
   (overlayKeydown)="_handleOverlayKeydown($event)">

src/material/select/select.ts

@@ -31,6 +31,8 @@ import {
   CdkOverlayOrigin,
   ConnectedPosition,
   createRepositionScrollStrategy,
+  FlexibleOverlayPopoverLocation,
+  OVERLAY_DEFAULT_CONFIG,
   ScrollStrategy,
 } from '@angular/cdk/overlay';
 import {ViewportRuler} from '@angular/cdk/scrolling';
@@ -210,6 +212,7 @@ export class MatSelect
   private _liveAnnouncer = inject(LiveAnnouncer);
   protected _defaultOptions = inject(MAT_SELECT_CONFIG, {optional: true});
   protected _animationsDisabled = _animationsDisabled();
+  protected _popoverLocation: FlexibleOverlayPopoverLocation | null;
   private _initialized = new Subject();
   private _cleanupDetach: (() => void) | undefined;
 
@@ -602,6 +605,7 @@ export class MatSelect
     const parentForm = inject(NgForm, {optional: true});
     const parentFormGroup = inject(FormGroupDirective, {optional: true});
     const tabIndex = inject(new HostAttributeToken('tabindex'), {optional: true});
+    const defaultPopoverConfig = inject(OVERLAY_DEFAULT_CONFIG, {optional: true});
 
     if (this.ngControl) {
       // Note: we provide the value accessor through here, instead of
@@ -622,8 +626,10 @@ export class MatSelect
       parentForm,
       this.stateChanges,
     );
+
     this._scrollStrategy = this._scrollStrategyFactory();
     this.tabIndex = tabIndex == null ? 0 : parseInt(tabIndex) || 0;
+    this._popoverLocation = defaultPopoverConfig?.usePopover === false ? null : 'inline';
 
     // Force setter to be called in case id was not specified.
     this.id = this.id;