Skip to content

Commit 24f8bb5

Browse files
committed
fix(cdk/menu): enable inline popover
1 parent 957d068 commit 24f8bb5

File tree

2 files changed

+13
-1
lines changed

2 files changed

+13
-1
lines changed

src/cdk/menu/context-menu-trigger.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -137,6 +137,7 @@ export class CdkContextMenuTrigger extends CdkMenuTriggerBase implements OnDestr
137137
positionStrategy: this._getOverlayPositionStrategy(coordinates),
138138
scrollStrategy: this.menuScrollStrategy(),
139139
direction: this._directionality || undefined,
140+
usePopover: true,
140141
});
141142
}
142143

@@ -150,6 +151,7 @@ export class CdkContextMenuTrigger extends CdkMenuTriggerBase implements OnDestr
150151
return createFlexibleConnectedPositionStrategy(this._injector, coordinates)
151152
.withLockedPosition()
152153
.withGrowAfterOpen()
154+
.withPopoverLocation('inline')
153155
.withPositions(this.menuPosition ?? CONTEXT_MENU_POSITIONS);
154156
}
155157

src/cdk/menu/menu-bar.ts

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
* found in the LICENSE file at https://angular.dev/license
77
*/
88

9-
import {AfterContentInit, Directive} from '@angular/core';
9+
import {inject, AfterContentInit, Directive, ElementRef} from '@angular/core';
1010
import {
1111
DOWN_ARROW,
1212
ESCAPE,
@@ -16,6 +16,7 @@ import {
1616
TAB,
1717
UP_ARROW,
1818
} from '../keycodes';
19+
import {_getEventTarget} from '../platform';
1920
import {takeUntil} from 'rxjs/operators';
2021
import {CdkMenuGroup} from './menu-group';
2122
import {CDK_MENU} from './menu-interface';
@@ -43,6 +44,8 @@ import {CdkMenuBase} from './menu-base';
4344
],
4445
})
4546
export class CdkMenuBar extends CdkMenuBase implements AfterContentInit {
47+
private readonly _elementRef: ElementRef<HTMLElement> = inject(ElementRef);
48+
4649
/** The direction items in the menu flow. */
4750
override readonly orientation = 'horizontal';
4851

@@ -60,6 +63,13 @@ export class CdkMenuBar extends CdkMenuBase implements AfterContentInit {
6063
*/
6164
_handleKeyEvent(event: KeyboardEvent) {
6265
const keyManager = this.keyManager;
66+
67+
const element = this._elementRef.nativeElement;
68+
const target = _getEventTarget(event) as HTMLElement;
69+
if (target !== element && target.parentElement !== element) {
70+
return;
71+
}
72+
6373
switch (event.keyCode) {
6474
case UP_ARROW:
6575
case DOWN_ARROW:

0 commit comments

Comments
 (0)