Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions goldens/cdk/overlay/index.api.md
Original file line number Diff line number Diff line change
Expand Up @@ -378,6 +378,9 @@ export class Overlay {
static ɵprov: i0.ɵɵInjectableDeclaration<Overlay>;
}

// @public
export const OVERLAY_DEFAULT_CONFIG: InjectionToken<OverlayDefaultConfig>;

// @public
export class OverlayConfig {
constructor(config?: OverlayConfig);
Expand Down Expand Up @@ -428,6 +431,12 @@ export class OverlayContainer implements OnDestroy {
static ɵprov: i0.ɵɵInjectableDeclaration<OverlayContainer>;
}

// @public
export interface OverlayDefaultConfig {
// (undocumented)
usePopover?: boolean;
}

// @public
export class OverlayKeyboardDispatcher extends BaseOverlayDispatcher {
add(overlayRef: OverlayRef): void;
Expand Down
6 changes: 4 additions & 2 deletions src/cdk/overlay/overlay-directives.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ import {
import {_getEventTarget} from '../platform';
import {Subscription} from 'rxjs';
import {takeWhile} from 'rxjs/operators';
import {createOverlayRef} from './overlay';
import {createOverlayRef, OVERLAY_DEFAULT_CONFIG} from './overlay';
import {OverlayConfig} from './overlay-config';
import {OverlayRef} from './overlay-ref';
import {ConnectedOverlayPositionChange, ViewportMargin} from './position/connected-position';
Expand Down Expand Up @@ -253,7 +253,7 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges {

/** Whether the connected overlay should be rendered inside a popover element or the overlay container. */
@Input({alias: 'cdkConnectedOverlayUsePopover'})
usePopover: FlexibleOverlayPopoverLocation | null = 'global';
usePopover: FlexibleOverlayPopoverLocation | null;

/** Whether the overlay should match the trigger's width. */
@Input({alias: 'cdkConnectedOverlayMatchWidth', transform: booleanAttribute})
Expand Down Expand Up @@ -293,7 +293,9 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges {
const templateRef = inject<TemplateRef<any>>(TemplateRef);
const viewContainerRef = inject(ViewContainerRef);
const defaultConfig = inject(CDK_CONNECTED_OVERLAY_DEFAULT_CONFIG, {optional: true});
const globalConfig = inject(OVERLAY_DEFAULT_CONFIG, {optional: true});

this.usePopover = globalConfig?.usePopover === false ? null : 'global';
this._templatePortal = new TemplatePortal(templateRef, viewContainerRef);
this.scrollStrategy = this._scrollStrategyFactory();

Expand Down
16 changes: 15 additions & 1 deletion src/cdk/overlay/overlay.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import {
RendererFactory2,
DOCUMENT,
Renderer2,
InjectionToken,
} from '@angular/core';
import {_IdGenerator} from '../a11y';
import {_CdkPrivateStyleLoader} from '../private';
Expand All @@ -31,6 +32,16 @@ import {OverlayRef} from './overlay-ref';
import {OverlayPositionBuilder} from './position/overlay-position-builder';
import {ScrollStrategyOptions} from './scroll/index';

/** Object used to configure the default options for overlays. */
export interface OverlayDefaultConfig {
usePopover?: boolean;
}

/** Injection token used to configure the default options for CDK overlays. */
export const OVERLAY_DEFAULT_CONFIG = new InjectionToken<OverlayDefaultConfig>(
'OVERLAY_DEFAULT_CONFIG',
);

/**
* Creates an overlay.
* @param injector Injector to use when resolving the overlay's dependencies.
Expand All @@ -52,12 +63,15 @@ export function createOverlayRef(injector: Injector, config?: OverlayConfig): Ov
injector.get(RendererFactory2).createRenderer(null, null);

const overlayConfig = new OverlayConfig(config);
const defaultUsePopover =
injector.get(OVERLAY_DEFAULT_CONFIG, null, {optional: true})?.usePopover ?? true;

overlayConfig.direction = overlayConfig.direction || directionality.value;

if (!('showPopover' in doc.body)) {
overlayConfig.usePopover = false;
} else {
overlayConfig.usePopover = config?.usePopover ?? true;
overlayConfig.usePopover = config?.usePopover ?? defaultUsePopover;
}

const pane = doc.createElement('div');
Expand Down
2 changes: 1 addition & 1 deletion src/cdk/overlay/public-api.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export * from './position/connected-position';
export * from './scroll/index';
export * from './overlay-module';
export * from './dispatchers/index';
export {Overlay, createOverlayRef} from './overlay';
export {Overlay, createOverlayRef, OverlayDefaultConfig, OVERLAY_DEFAULT_CONFIG} from './overlay';
export {OverlayContainer} from './overlay-container';
export {
CdkOverlayOrigin,
Expand Down
Loading